AccessPress Instagram Feed - Version 2.0.6

Version Description

  • Addition of new layout - grid rotator layout.
  • Addition of new shortcode for grid rotator layout.
  • Done the bug fixing for the show image options if not checked.
Download this release

Release Info

Developer Access Keys
Plugin Icon 128x128 AccessPress Instagram Feed
Version 2.0.6
Comparing to
See all releases

Code changes from version 2.0.5 to 2.0.6

Files changed (12) hide show
  1. accesspress-instagram-feed.php +16 -2
  2. css/gridrotator.css +132 -0
  3. images/ripple.gif +0 -0
  4. images/themes/grid-rotator.png +0 -0
  5. inc/backend/boards/display-settings.php +7 -3
  6. inc/backend/boards/how-to-use.php +8 -1
  7. inc/frontend/instagram-feed.php +28 -3
  8. inc/frontend/instagram-grid-rotator.php +70 -0
  9. js/frontend.js +30 -2
  10. js/jquery.gridrotator.js +756 -0
  11. js/modernizr.custom.26633.js +4 -0
  12. readme.txt +7 -2
accesspress-instagram-feed.php CHANGED
@@ -4,7 +4,7 @@ defined( 'ABSPATH' ) or die( "No script kiddies please!" );
4
  Plugin name: AccessPress Instagram Feed
5
  Plugin URI: https://accesspressthemes.com/wordpress-plugins/accesspress-instagram-feed/
6
  Description: A plugin to add various instagram widgets with dynamic configuration options.
7
- Version: 2.0.5
8
  Author: AccessPress Themes
9
  Author URI: http://accesspressthemes.com
10
  Text Domain:accesspress-instagram-feed
@@ -13,7 +13,7 @@ License: GPLv2 or later
13
  */
14
  //Decleration of the necessary constants for plugin
15
  if( !defined( 'APIF_VERSION' ) ) {
16
- define( 'APIF_VERSION', '2.0.5' );
17
  }
18
 
19
  if( !defined( 'APIF_IMAGE_DIR' ) ) {
@@ -71,6 +71,7 @@ if( !class_exists( 'IF_Class' ) ) {
71
  add_shortcode( 'ap_instagram_widget', array($this, 'ap_instagram_widget') );
72
  add_shortcode( 'ap_instagram_slider', array($this, 'ap_instagram_slider') );
73
  add_shortcode( 'ap_instagram_mosaic_lightview', array($this, 'ap_instagram_mosaic_light') );
 
74
 
75
  add_action( 'widgets_init', array($this, 'register_apif_widget') ); //registers the widget
76
 
@@ -144,8 +145,12 @@ if( !class_exists( 'IF_Class' ) ) {
144
  wp_enqueue_style( 'owl-carousel', APIF_CSS_DIR . '/owl.carousel.css', array(), APIF_VERSION );
145
  wp_enqueue_style( 'apif-frontend-css', APIF_CSS_DIR . '/frontend.css', array(), APIF_VERSION );
146
  wp_enqueue_style( 'apsc-font-awesome', APIF_CSS_DIR . '/font-awesome.min.css', array(), APIF_VERSION );
 
 
147
  wp_enqueue_script( 'lightbox-js', APIF_JS_DIR . '/lightbox.js', array('jquery'), '2.8.1', true );
148
  wp_enqueue_script( 'apif-isotope-pkgd-min-js', APIF_JS_DIR . '/isotope.pkgd.min.js', array('jquery'), '2.2.0', true );
 
 
149
  wp_enqueue_script( 'owl-carousel-js', APIF_JS_DIR . '/owl.carousel.js', array('jquery') );
150
  wp_enqueue_script( 'apif-frontend-js', APIF_JS_DIR . '/frontend.js', array('jquery'), '1.0' );
151
  }
@@ -173,6 +178,15 @@ if( !class_exists( 'IF_Class' ) ) {
173
  ob_get_clean();
174
  return $html;
175
  }
 
 
 
 
 
 
 
 
 
176
 
177
  //slider shortcode
178
  function ap_instagram_slider() {
4
  Plugin name: AccessPress Instagram Feed
5
  Plugin URI: https://accesspressthemes.com/wordpress-plugins/accesspress-instagram-feed/
6
  Description: A plugin to add various instagram widgets with dynamic configuration options.
7
+ Version: 2.0.6
8
  Author: AccessPress Themes
9
  Author URI: http://accesspressthemes.com
10
  Text Domain:accesspress-instagram-feed
13
  */
14
  //Decleration of the necessary constants for plugin
15
  if( !defined( 'APIF_VERSION' ) ) {
16
+ define( 'APIF_VERSION', '2.0.6' );
17
  }
18
 
19
  if( !defined( 'APIF_IMAGE_DIR' ) ) {
71
  add_shortcode( 'ap_instagram_widget', array($this, 'ap_instagram_widget') );
72
  add_shortcode( 'ap_instagram_slider', array($this, 'ap_instagram_slider') );
73
  add_shortcode( 'ap_instagram_mosaic_lightview', array($this, 'ap_instagram_mosaic_light') );
74
+ add_shortcode( 'ap_instagram_grid_rotator', array($this, 'ap_instagram_grid_rotator') );
75
 
76
  add_action( 'widgets_init', array($this, 'register_apif_widget') ); //registers the widget
77
 
145
  wp_enqueue_style( 'owl-carousel', APIF_CSS_DIR . '/owl.carousel.css', array(), APIF_VERSION );
146
  wp_enqueue_style( 'apif-frontend-css', APIF_CSS_DIR . '/frontend.css', array(), APIF_VERSION );
147
  wp_enqueue_style( 'apsc-font-awesome', APIF_CSS_DIR . '/font-awesome.min.css', array(), APIF_VERSION );
148
+ wp_enqueue_style( 'apif-gridrotator', APIF_CSS_DIR . '/gridrotator.css', array(), APIF_VERSION );
149
+
150
  wp_enqueue_script( 'lightbox-js', APIF_JS_DIR . '/lightbox.js', array('jquery'), '2.8.1', true );
151
  wp_enqueue_script( 'apif-isotope-pkgd-min-js', APIF_JS_DIR . '/isotope.pkgd.min.js', array('jquery'), '2.2.0', true );
152
+ wp_enqueue_script( 'apif-modernizr-custom', APIF_JS_DIR . '/modernizr.custom.26633.js', '', '1.0' );
153
+ wp_enqueue_script( 'apif-gridrotator', APIF_JS_DIR . '/jquery.gridrotator.js', array('jquery', 'apif-modernizr-custom'), '1.0' );
154
  wp_enqueue_script( 'owl-carousel-js', APIF_JS_DIR . '/owl.carousel.js', array('jquery') );
155
  wp_enqueue_script( 'apif-frontend-js', APIF_JS_DIR . '/frontend.js', array('jquery'), '1.0' );
156
  }
178
  ob_get_clean();
179
  return $html;
180
  }
181
+
182
+ // grid rotator shortcode
183
+ function ap_instagram_grid_rotator() {
184
+ ob_start();
185
+ include( 'inc/frontend/instagram-grid-rotator.php' );
186
+ $html = ob_get_contents();
187
+ ob_get_clean();
188
+ return $html;
189
+ }
190
 
191
  //slider shortcode
192
  function ap_instagram_slider() {
css/gridrotator.css ADDED
@@ -0,0 +1,132 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ .ri-grid{
2
+ margin: 30px auto 30px;
3
+ position: relative;
4
+ height: auto;
5
+ }
6
+
7
+ .ri-grid ul {
8
+ list-style: none;
9
+ display: block;
10
+ width: 100%;
11
+ margin: 0;
12
+ padding: 0;
13
+ }
14
+
15
+ /* Clear floats by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
16
+
17
+ .ri-grid ul:before,
18
+ .ri-grid ul:after{
19
+ content: '';
20
+ display: table;
21
+ }
22
+
23
+ .ri-grid ul:after {
24
+ clear: both;
25
+ }
26
+
27
+ .ri-grid ul {
28
+ zoom: 1; /* For IE 6/7 (trigger hasLayout) */
29
+ }
30
+
31
+ .ri-grid ul li {
32
+ -webkit-perspective: 400px;
33
+ -moz-perspective: 400px;
34
+ -o-perspective: 400px;
35
+ -ms-perspective: 400px;
36
+ perspective: 400px;
37
+ margin: 0;
38
+ padding: 0;
39
+ float: left;
40
+ position: relative;
41
+ display: block;
42
+ overflow: hidden;
43
+ background: #000;
44
+ }
45
+
46
+ .ri-grid ul li a{
47
+ display: block;
48
+ outline: none;
49
+ position: absolute;
50
+ left: 0;
51
+ top: 0;
52
+ width: 100%;
53
+ height: 100%;
54
+ -webkit-backface-visibility: hidden;
55
+ -moz-backface-visibility: hidden;
56
+ -o-backface-visibility: hidden;
57
+ -ms-backface-visibility: hidden;
58
+ backface-visibility: hidden;
59
+ -webkit-transform-style: preserve-3d;
60
+ -moz-transform-style: preserve-3d;
61
+ -o-transform-style: preserve-3d;
62
+ -ms-transform-style: preserve-3d;
63
+ transform-style: preserve-3d;
64
+ -webkit-background-size: 100% 100%;
65
+ -moz-background-size: 100% 100%;
66
+ background-size: 100% 100%;
67
+ background-position: center center;
68
+ background-repeat: no-repeat;
69
+ background-color: #333;
70
+ -webkit-box-sizing: content-box;
71
+ -moz-box-sizing: content-box;
72
+ box-sizing: content-box;
73
+ }
74
+
75
+ /* Grid wrapper sizes */
76
+ .ri-grid-size-1{
77
+ width: 55%;
78
+ }
79
+ .ri-grid-size-2{
80
+ width: 100%;
81
+ }
82
+ .ri-grid-size-3{
83
+ width: 100%;
84
+ margin-top: 0px;
85
+ }
86
+
87
+ /* Shadow style */
88
+ .ri-shadow:after,
89
+ .ri-shadow:before{
90
+ content: "";
91
+ position: absolute;
92
+ z-index: -2;
93
+ bottom: 15px;
94
+ left: 10px;
95
+ width: 50%;
96
+ height: 20%;
97
+ max-width: 300px;
98
+ max-height: 100px;
99
+ box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
100
+ -webkit-transform: rotate(-3deg);
101
+ -moz-transform: rotate(-3deg);
102
+ -ms-transform: rotate(-3deg);
103
+ -o-transform: rotate(-3deg);
104
+ transform: rotate(-3deg);
105
+ }
106
+ .ri-shadow:after{
107
+ right: 10px;
108
+ left: auto;
109
+ -webkit-transform: rotate(3deg);
110
+ -moz-transform: rotate(3deg);
111
+ -ms-transform: rotate(3deg);
112
+ -o-transform: rotate(3deg);
113
+ transform: rotate(3deg);
114
+ }
115
+
116
+ .ri-grid-loading:after,
117
+ .ri-grid-loading:before{
118
+ display: none;
119
+ }
120
+
121
+ .ri-loading-image{
122
+ display: none;
123
+ }
124
+
125
+ .ri-grid-loading .ri-loading-image{
126
+ position: relative;
127
+ width: 30px;
128
+ height: 30px;
129
+ left: 50%;
130
+ margin: 100px 0 0 -15px;
131
+ display: block;
132
+ }
images/ripple.gif ADDED
Binary file
images/themes/grid-rotator.png ADDED
Binary file
inc/backend/boards/display-settings.php CHANGED
@@ -5,7 +5,7 @@
5
  <div class="apsc-option-field">
6
  <div class="apsc-option-inner-wrapper">
7
  <label style="float:left;"><?php _e('Image Like', 'accesspress-instagram-feed') ?></label>
8
- <div class="apsc-option-field"><input type="checkbox" name="instagram[active]" value="1" class="apsc-counter-activation-trigger" <?php checked( $apif_settings['active'], '1'); ?>/><?php _e('Show/Hide', 'accesspress-instagram-feed'); ?></div>
9
  </div>
10
  </div>
11
  </div>
@@ -14,7 +14,7 @@
14
  <label style="width:30%;"><?php _e('Choose Instagram Themes Layout', 'accesspress-instagram-feed'); ?></label>
15
  <div class="apsc-option-field">
16
  <label>
17
- <input type="radio" name="instagram[instagram_mosaic]" value="mosaic" <?php if($apif_settings['instagram_mosaic']=='mosaic'){?>checked="checked"<?php }?>/><?php _e('Mosaic layout', 'accesspress-instagram-feed'); ?>
18
  <div class="apsc-theme-image"><img src="<?php echo APIF_IMAGE_DIR.'/themes/massonary.png';?>"/></div>
19
  </label>
20
  <label>
@@ -24,7 +24,11 @@
24
  <label>
25
  <input type="radio" name="instagram[instagram_mosaic]" value="slider" <?php if($apif_settings['instagram_mosaic']=='slider'){?>checked="checked"<?php }?>/><?php _e('Slider Layout', 'accesspress-instagram-feed'); ?>
26
  <div class="apsc-theme-image"><img src="<?php echo APIF_IMAGE_DIR.'/themes/slider.png';?>"/></div>
27
- </label>
 
 
 
 
28
  </div>
29
  </div>
30
 
5
  <div class="apsc-option-field">
6
  <div class="apsc-option-inner-wrapper">
7
  <label style="float:left;"><?php _e('Image Like', 'accesspress-instagram-feed') ?></label>
8
+ <div class="apsc-option-field"><input type="checkbox" name="instagram[active]" value="1" class="apsc-counter-activation-trigger" <?php if(isset($apif_settings['active'])){ checked( $apif_settings['active'], '1'); } ?>/><?php _e('Show/Hide', 'accesspress-instagram-feed'); ?></div>
9
  </div>
10
  </div>
11
  </div>
14
  <label style="width:30%;"><?php _e('Choose Instagram Themes Layout', 'accesspress-instagram-feed'); ?></label>
15
  <div class="apsc-option-field">
16
  <label>
17
+ <input type="radio" name="instagram[instagram_mosaic]" value="mosaic" <?php if(isset($apif_settings['instagram_mosaic']) && $apif_settings['instagram_mosaic']=='mosaic'){?>checked="checked"<?php }?>/><?php _e('Mosaic layout', 'accesspress-instagram-feed'); ?>
18
  <div class="apsc-theme-image"><img src="<?php echo APIF_IMAGE_DIR.'/themes/massonary.png';?>"/></div>
19
  </label>
20
  <label>
24
  <label>
25
  <input type="radio" name="instagram[instagram_mosaic]" value="slider" <?php if($apif_settings['instagram_mosaic']=='slider'){?>checked="checked"<?php }?>/><?php _e('Slider Layout', 'accesspress-instagram-feed'); ?>
26
  <div class="apsc-theme-image"><img src="<?php echo APIF_IMAGE_DIR.'/themes/slider.png';?>"/></div>
27
+ </label>
28
+ <label>
29
+ <input type="radio" name="instagram[instagram_mosaic]" value="grid_rotator" <?php if($apif_settings['instagram_mosaic']=='grid_rotator'){?>checked="checked"<?php }?>/><?php _e('Grid Rotator', 'accesspress-instagram-feed'); ?>
30
+ <div class="apsc-theme-image"><img src="<?php echo APIF_IMAGE_DIR.'/themes/grid-rotator.png';?>"/></div>
31
+ </label>
32
  </div>
33
  </div>
34
 
inc/backend/boards/how-to-use.php CHANGED
@@ -1,5 +1,5 @@
1
  <div class="apsc-boards-tabs" id="apsc-board-how_to_use-settings" style="display:none">
2
- <div class="apsp-sub-title">Instagram 3 Different Layout Shortcode</div>
3
  <div class="apsc-tab-wrapper">
4
  <div class="apsp-sub-title">Mosaic View Layout</div>
5
  <p>Use the shortcode <code>[ap_instagram_feed]</code> to display the instagram feed within your content.</p>
@@ -17,4 +17,11 @@
17
  <p>Use the shortcode <code>[ap_instagram_slider]</code> to display the instagram feed within your content.</p>
18
  <p>Use the function <code><?php echo "&lt;?php do_shortcode('[ap_instagram_slider]'); ?&gt;"; ?></code> to display within template or theme files.</p>
19
  </div>
 
 
 
 
 
 
 
20
  </div>
1
  <div class="apsc-boards-tabs" id="apsc-board-how_to_use-settings" style="display:none">
2
+ <div class="apsp-sub-title">Instagram 4 Different Layout Shortcode</div>
3
  <div class="apsc-tab-wrapper">
4
  <div class="apsp-sub-title">Mosaic View Layout</div>
5
  <p>Use the shortcode <code>[ap_instagram_feed]</code> to display the instagram feed within your content.</p>
17
  <p>Use the shortcode <code>[ap_instagram_slider]</code> to display the instagram feed within your content.</p>
18
  <p>Use the function <code><?php echo "&lt;?php do_shortcode('[ap_instagram_slider]'); ?&gt;"; ?></code> to display within template or theme files.</p>
19
  </div>
20
+
21
+ <div class="apsc-tab-wrapper">
22
+ <div class="apsp-sub-title">Grid rotator Layout</div>
23
+ <p>Use the shortcode <code>[ap_instagram_grid_rotator]</code> to display the instagram feed within your content.</p>
24
+ <p>Use the function <code><?php echo "&lt;?php do_shortcode('[ap_instagram_grid_rotator]'); ?&gt;"; ?></code> to display within template or theme files.</p>
25
+ </div>
26
+
27
  </div>
inc/frontend/instagram-feed.php CHANGED
@@ -8,13 +8,13 @@ defined( 'ABSPATH' ) or die( "No script kiddies please!" );
8
  $image_like = $apif_settings['active'];
9
  $count = 7; // number of images to show
10
  require_once('instagram.php');
 
11
 
12
  if ($layout == 'mosaic' || $layout == 'mosaic_lightview') {
13
  ?>
14
  <section id="main" class="thumb-view">
15
  <div class="row masonry for-mosaic isotope ifgrid">
16
  <?php
17
- $ins_media = $insta->userMedia();
18
  $i = 1;
19
  $j = 0;
20
  if(isset($ins_media['meta']['error_message'])){
@@ -137,5 +137,30 @@ defined( 'ABSPATH' ) or die( "No script kiddies please!" );
137
  } ?>
138
  </div>
139
 
140
- <?php }
141
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  $image_like = $apif_settings['active'];
9
  $count = 7; // number of images to show
10
  require_once('instagram.php');
11
+ $ins_media = $insta->userMedia();
12
 
13
  if ($layout == 'mosaic' || $layout == 'mosaic_lightview') {
14
  ?>
15
  <section id="main" class="thumb-view">
16
  <div class="row masonry for-mosaic isotope ifgrid">
17
  <?php
 
18
  $i = 1;
19
  $j = 0;
20
  if(isset($ins_media['meta']['error_message'])){
137
  } ?>
138
  </div>
139
 
140
+ <?php }else if($layout == 'grid_rotator'){ ?>
141
+ <div class="ri-grid apif-ri-grid">
142
+ <img class="ri-loading-image" src="<?php echo APIF_IMAGE_DIR. '/ripple.gif'; ?>"/>
143
+ <?php
144
+ if(isset($ins_media['meta']['error_message'])){
145
+ ?>
146
+ <h1 class="widget-title-insta"><span><?php echo $ins_media['meta']['error_message']; ?></span></h1>
147
+ <?php
148
+ }else if (is_array($ins_media['data']) || is_object($ins_media['data'])) { ?>
149
+ <ul>
150
+ <?php
151
+ foreach ($ins_media['data'] as $vm):
152
+ $img = $vm['images']['standard_resolution']['url'];
153
+ $image_url = APIF_IMAGE_DIR . '/image-square.png';
154
+ $image = $vm['images']['standard_resolution']['url'];
155
+
156
+ $link = $vm["link"];
157
+ $flow_icon = APIF_IMAGE_DIR . '/sc-icon.png';
158
+ ?>
159
+ <li><a href="<?php echo $link ?>" target="_blank"><img src="<?php echo esc_url($image); ?>" alt='<?php echo strip_tags(substr($vm['caption']['text'], 0, 20)); ?>'></a></li>
160
+ <?php
161
+ endforeach; ?>
162
+ </ul>
163
+ <?php } ?>
164
+ </div>
165
+ <?php
166
+ }
inc/frontend/instagram-grid-rotator.php ADDED
@@ -0,0 +1,70 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ defined( 'ABSPATH' ) or die( "No script kiddies please!" );
3
+ global $apif_settings, $insta;
4
+ $apif_settings = get_option( 'apif_settings' );
5
+ $username = !empty($apif_settings['username']) ? $apif_settings['username'] : ''; // your username
6
+ $access_token = !empty($apif_settings['access_token']) ? $apif_settings['access_token'] : '';
7
+ $layout = $apif_settings['instagram_mosaic'];
8
+ $image_like = $apif_settings['active'];
9
+ $count = 7; // number of images to show
10
+ require_once('instagram.php');
11
+ $ins_media = $insta->userMedia();
12
+ $rand_no = rand();
13
+ ?>
14
+
15
+ <script type="text/javascript">
16
+ jQuery(document).ready(function($){
17
+ $( '.ri-grid-<?php echo $rand_no; ?>' ).gridrotator({
18
+ rows : '2',
19
+ columns : '5',
20
+ maxStep : 2,
21
+ interval : 2000,
22
+ preventClick : false,
23
+ w1024 : {
24
+ rows : '2',
25
+ columns : '5'
26
+ },
27
+ w768 : {
28
+ rows : '2',
29
+ columns : '5'
30
+ },
31
+ w480 : {
32
+ rows : '2',
33
+ columns : '5'
34
+ },
35
+ w320 : {
36
+ rows : '2',
37
+ columns : '5'
38
+ },
39
+ w240 : {
40
+ rows : '2',
41
+ columns : '5'
42
+ }
43
+ });
44
+
45
+ });
46
+ </script>
47
+ <div class="ri-grid ri-grid-<?php echo $rand_no; ?> apif-ri-grid">
48
+ <img class="ri-loading-image" src="<?php echo APIF_IMAGE_DIR. '/ripple.gif'; ?>"/>
49
+ <?php
50
+ if(isset($ins_media['meta']['error_message'])){
51
+ ?>
52
+ <h1 class="widget-title-insta"><span><?php echo $ins_media['meta']['error_message']; ?></span></h1>
53
+ <?php
54
+ }else if (is_array($ins_media['data']) || is_object($ins_media['data'])) { ?>
55
+ <ul>
56
+ <?php
57
+ foreach ($ins_media['data'] as $vm):
58
+ $img = $vm['images']['standard_resolution']['url'];
59
+ $image_url = APIF_IMAGE_DIR . '/image-square.png';
60
+ $image = $vm['images']['standard_resolution']['url'];
61
+
62
+ $link = $vm["link"];
63
+ $flow_icon = APIF_IMAGE_DIR . '/sc-icon.png';
64
+ ?>
65
+ <li><a href="<?php echo $link ?>" target="_blank"><img src="<?php echo esc_url($image); ?>" alt='<?php echo strip_tags(substr($vm['caption']['text'], 0, 20)); ?>'></a></li>
66
+ <?php
67
+ endforeach; ?>
68
+ </ul>
69
+ <?php } ?>
70
+ </div>
js/frontend.js CHANGED
@@ -10,13 +10,41 @@
10
  }(jQuery));
11
 
12
  jQuery(document).ready(function($) {
13
- $("#owl-demo").owlCarousel({
14
  autoPlay: 3000,
15
  items : 4,
16
  itemsDesktop : [1199,3],
17
  itemsDesktopSmall : [979,3]
18
  });
19
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
20
  });
21
 
22
  // Mosaic View Layout Javascript
10
  }(jQuery));
11
 
12
  jQuery(document).ready(function($) {
13
+ $(".owl-carousel").owlCarousel({
14
  autoPlay: 3000,
15
  items : 4,
16
  itemsDesktop : [1199,3],
17
  itemsDesktopSmall : [979,3]
18
  });
19
+
20
+ $( '.ri-grid' ).gridrotator({
21
+ rows : '2',
22
+ columns : '5',
23
+ maxStep : 2,
24
+ interval : 2000,
25
+ preventClick : false,
26
+ w1024 : {
27
+ rows : '2',
28
+ columns : '5'
29
+ },
30
+ w768 : {
31
+ rows : '2',
32
+ columns : '5'
33
+ },
34
+ w480 : {
35
+ rows : '2',
36
+ columns : '5'
37
+ },
38
+ w320 : {
39
+ rows : '2',
40
+ columns : '5'
41
+ },
42
+ w240 : {
43
+ rows : '2',
44
+ columns : '5'
45
+ }
46
+ });
47
+
48
  });
49
 
50
  // Mosaic View Layout Javascript
js/jquery.gridrotator.js ADDED
@@ -0,0 +1,756 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /**
2
+ * jquery.gridrotator.js v1.1.0
3
+ * http://www.codrops.com
4
+ *
5
+ * Licensed under the MIT license.
6
+ * http://www.opensource.org/licenses/mit-license.php
7
+ *
8
+ * Copyright 2012, Codrops
9
+ * http://www.codrops.com
10
+ */
11
+ ;( function( $, window, undefined ) {
12
+
13
+ 'use strict';
14
+
15
+ /*
16
+ * debouncedresize: special jQuery event that happens once after a window resize
17
+ *
18
+ * latest version and complete README available on Github:
19
+ * https://github.com/louisremi/jquery-smartresize/blob/master/jquery.debouncedresize.js
20
+ *
21
+ * Copyright 2011 @louis_remi
22
+ * Licensed under the MIT license.
23
+ */
24
+ var $event = $.event,
25
+ $special,
26
+ resizeTimeout;
27
+
28
+ $special = $event.special.debouncedresize = {
29
+ setup: function() {
30
+ $( this ).on( "resize", $special.handler );
31
+ },
32
+ teardown: function() {
33
+ $( this ).off( "resize", $special.handler );
34
+ },
35
+ handler: function( event, execAsap ) {
36
+ // Save the context
37
+ var context = this,
38
+ args = arguments,
39
+ dispatch = function() {
40
+ // set correct event type
41
+ event.type = "debouncedresize";
42
+ $event.dispatch.apply( context, args );
43
+ };
44
+
45
+ if ( resizeTimeout ) {
46
+ clearTimeout( resizeTimeout );
47
+ }
48
+
49
+ execAsap ?
50
+ dispatch() :
51
+ resizeTimeout = setTimeout( dispatch, $special.threshold );
52
+ },
53
+ threshold: 100
54
+ };
55
+
56
+ // http://www.hardcode.nl/subcategory_1/article_317-array-shuffle-function
57
+ Array.prototype.shuffle = function() {
58
+ var i=this.length,p,t;
59
+ while (i--) {
60
+ p = Math.floor(Math.random()*i);
61
+ t = this[i];
62
+ this[i]=this[p];
63
+ this[p]=t;
64
+ }
65
+ return this;
66
+ };
67
+
68
+ // HTML5 PageVisibility API
69
+ // http://www.html5rocks.com/en/tutorials/pagevisibility/intro/
70
+ // by Joe Marini (@joemarini)
71
+ function getHiddenProp(){
72
+ var prefixes = ['webkit','moz','ms','o'];
73
+
74
+ // if 'hidden' is natively supported just return it
75
+ if ('hidden' in document) return 'hidden';
76
+
77
+ // otherwise loop over all the known prefixes until we find one
78
+ for (var i = 0; i < prefixes.length; i++){
79
+ if ((prefixes[i] + 'Hidden') in document)
80
+ return prefixes[i] + 'Hidden';
81
+ }
82
+
83
+ // otherwise it's not supported
84
+ return null;
85
+ }
86
+ function isHidden() {
87
+ var prop = getHiddenProp();
88
+ if (!prop) return false;
89
+
90
+ return document[prop];
91
+ }
92
+
93
+ function isEmpty( obj ) {
94
+ return Object.keys(obj).length === 0;
95
+ }
96
+
97
+ // global
98
+ var $window = $( window ),
99
+ Modernizr = window.Modernizr;
100
+
101
+ $.GridRotator = function( options, element ) {
102
+
103
+ this.$el = $( element );
104
+ if( Modernizr.backgroundsize ) {
105
+
106
+ var self = this;
107
+ this.$el.addClass( 'ri-grid-loading' );
108
+ this._init( options );
109
+
110
+ }
111
+
112
+ };
113
+
114
+ // the options
115
+ $.GridRotator.defaults = {
116
+ // number of rows
117
+ rows : 4,
118
+ // number of columns
119
+ columns : 10,
120
+ w1024 : { rows : 3, columns : 8 },
121
+ w768 : {rows : 3,columns : 7 },
122
+ w480 : {rows : 3,columns : 5 },
123
+ w320 : {rows : 2,columns : 4 },
124
+ w240 : {rows : 2,columns : 3 },
125
+ // step: number of items that are replaced at the same time
126
+ // random || [some number]
127
+ // note: for performance issues, the number "can't" be > options.maxStep
128
+ step : 'random',
129
+ // change it as you wish..
130
+ maxStep : 3,
131
+ // prevent user to click the items
132
+ preventClick : true,
133
+ // animation type
134
+ // showHide || fadeInOut ||
135
+ // slideLeft || slideRight || slideTop || slideBottom ||
136
+ // rotateBottom || rotateLeft || rotateRight || rotateTop ||
137
+ // scale ||
138
+ // rotate3d ||
139
+ // rotateLeftScale || rotateRightScale || rotateTopScale || rotateBottomScale ||
140
+ // random
141
+ animType : 'random',
142
+ // animation speed
143
+ animSpeed : 800,
144
+ // animation easings
145
+ animEasingOut : 'linear',
146
+ animEasingIn: 'linear',
147
+ // the item(s) will be replaced every 3 seconds
148
+ // note: for performance issues, the time "can't" be < 300 ms
149
+ interval : 3000,
150
+ // if false the animations will not start
151
+ // use false if onhover is true for example
152
+ slideshow : true,
153
+ // if true the items will switch when hovered
154
+ onhover : false,
155
+ // ids of elements that shouldn't change
156
+ nochange : []
157
+ };
158
+
159
+ $.GridRotator.prototype = {
160
+
161
+ _init : function( options ) {
162
+
163
+ // options
164
+ this.options = $.extend( true, {}, $.GridRotator.defaults, options );
165
+ // cache some elements + variables
166
+ this._config();
167
+
168
+ },
169
+ _config : function() {
170
+
171
+ var self = this,
172
+ transEndEventNames = {
173
+ 'WebkitTransition' : 'webkitTransitionEnd',
174
+ 'MozTransition' : 'transitionend',
175
+ 'OTransition' : 'oTransitionEnd',
176
+ 'msTransition' : 'MSTransitionEnd',
177
+ 'transition' : 'transitionend'
178
+ };
179
+
180
+ // support CSS transitions and 3d transforms
181
+ this.supportTransitions = Modernizr.csstransitions;
182
+ this.supportTransforms3D = Modernizr.csstransforms3d;
183
+
184
+ this.transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ] + '.gridrotator';
185
+
186
+ // all animation types for the random option
187
+ this.animTypes = this.supportTransforms3D ? [
188
+ 'fadeInOut',
189
+ 'slideLeft',
190
+ 'slideRight',
191
+ 'slideTop',
192
+ 'slideBottom',
193
+ 'rotateLeft',
194
+ 'rotateRight',
195
+ 'rotateTop',
196
+ 'rotateBottom',
197
+ 'scale',
198
+ 'rotate3d',
199
+ 'rotateLeftScale',
200
+ 'rotateRightScale',
201
+ 'rotateTopScale',
202
+ 'rotateBottomScale' ] :
203
+ [ 'fadeInOut', 'slideLeft', 'slideRight', 'slideTop', 'slideBottom' ];
204
+
205
+ this.animType = this.options.animType;
206
+
207
+ if( this.animType !== 'random' && !this.supportTransforms3D && $.inArray( this.animType, this.animTypes ) === -1 && this.animType !== 'showHide' ) {
208
+
209
+ // fallback to 'fadeInOut' if user sets a type which is not supported
210
+ this.animType = 'fadeInOut';
211
+
212
+ }
213
+
214
+ this.animTypesTotal = this.animTypes.length;
215
+
216
+ // the <ul> where the items are placed
217
+ this.$list = this.$el.children( 'ul' );
218
+ // remove images and add background-image to anchors
219
+ // preload the images before
220
+ var loaded = 0,
221
+ $imgs = this.$list.find( 'img' ),
222
+ count = $imgs.length;
223
+
224
+ $imgs.each( function() {
225
+
226
+ var $img = $( this ), src = $img.attr( 'src' );
227
+
228
+ $( '<img/>' ).load( function() {
229
+
230
+ ++loaded;
231
+ $img.parent().css( 'background-image', 'url(' + src + ')' );
232
+
233
+ if( loaded === count ) {
234
+
235
+ $imgs.remove();
236
+ self.$el.removeClass( 'ri-grid-loading' );
237
+ // the items
238
+ self.$items = self.$list.children( 'li' );
239
+ // make a copy of the items
240
+ self.$itemsCache = self.$items.clone();
241
+ // total number of items
242
+ self.itemsTotal = self.$items.length;
243
+ // the items that will be out of the grid
244
+ // actually the item's child (anchor element)
245
+ self.outItems= [];
246
+ self._layout( function() {
247
+ self._initEvents();
248
+ } );
249
+ // replace [options.step] items after [options.interval] time
250
+ // the items that go out are randomly chosen, while the ones that get in
251
+ // follow a "First In First Out" logic
252
+ self._start();
253
+
254
+ }
255
+
256
+ } ).attr( 'src', src )
257
+
258
+ } );
259
+
260
+ },
261
+ _layout : function( callback ) {
262
+
263
+ var self = this;
264
+
265
+ // sets the grid dimentions based on the container's width
266
+ this._setGridDim();
267
+
268
+ // reset
269
+ this.$list.empty();
270
+ this.$items = this.$itemsCache.clone().appendTo( this.$list );
271
+
272
+ var $outItems = this.$items.filter( ':gt(' + ( this.showTotal - 1 ) + ')' ),
273
+ $outAItems = $outItems.children( 'a' );
274
+
275
+ this.outItems.length = 0;
276
+
277
+ $outAItems.each( function( i ) {
278
+ self.outItems.push( $( this ) );
279
+ } );
280
+
281
+ $outItems.remove();
282
+
283
+ // container's width
284
+ var containerWidth = ( document.defaultView ) ? parseInt( document.defaultView.getComputedStyle( this.$el.get( 0 ), null ).width ) : this.$el.width(),
285
+ // item's width
286
+ itemWidth = Math.floor( containerWidth / this.columns ),
287
+ // calculate gap
288
+ gapWidth = containerWidth - ( this.columns * Math.floor( itemWidth ) );
289
+
290
+ for( var i = 0; i < this.rows; ++i ) {
291
+
292
+ for( var j = 0; j < this.columns; ++j ) {
293
+
294
+ var idx = this.columns * i + j,
295
+ $item = this.$items.eq( idx );
296
+
297
+ $item.css( {
298
+ width : j < Math.floor( gapWidth ) ? itemWidth + 1 : itemWidth,
299
+ height : itemWidth
300
+ } );
301
+
302
+ if( $.inArray( idx, this.options.nochange ) !== -1 ) {
303
+ $item.addClass( 'ri-nochange' ).data( 'nochange', true );
304
+ }
305
+
306
+ }
307
+
308
+ }
309
+
310
+ if( this.options.preventClick ) {
311
+
312
+ this.$items.children().css( 'cursor', 'default' ).on( 'click.gridrotator', false );
313
+
314
+ }
315
+
316
+ if( callback ) {
317
+ callback.call();
318
+ }
319
+
320
+ },
321
+ // set the grid rows and columns
322
+ _setGridDim : function() {
323
+
324
+ // container's width
325
+ var c_w = this.$el.width();
326
+
327
+ // we will choose the number of rows/columns according to the container's width and the values set in the plugin options
328
+ switch( true ) {
329
+ case ( c_w < 240 ) : this.rows = this.options.w240.rows; this.columns = this.options.w240.columns; break;
330
+ case ( c_w < 320 ) : this.rows = this.options.w320.rows; this.columns = this.options.w320.columns; break;
331
+ case ( c_w < 480 ) : this.rows = this.options.w480.rows; this.columns = this.options.w480.columns; break;
332
+ case ( c_w < 768 ) : this.rows = this.options.w768.rows; this.columns = this.options.w768.columns; break;
333
+ case ( c_w < 1024 ) : this.rows = this.options.w1024.rows; this.columns = this.options.w1024.columns; break;
334
+ default : this.rows = this.options.rows; this.columns = this.options.columns; break;
335
+ }
336
+
337
+ this.showTotal = this.rows * this.columns;
338
+
339
+ },
340
+ // init window resize event
341
+ _initEvents : function() {
342
+
343
+ var self = this;
344
+
345
+ $window.on( 'debouncedresize.gridrotator', function() {
346
+ self._layout();
347
+ } );
348
+
349
+ // use the property name to generate the prefixed event name
350
+ var visProp = getHiddenProp();
351
+
352
+ // HTML5 PageVisibility API
353
+ // http://www.html5rocks.com/en/tutorials/pagevisibility/intro/
354
+ // by Joe Marini (@joemarini)
355
+ if (visProp) {
356
+
357
+ var evtname = visProp.replace(/[H|h]idden/,'') + 'visibilitychange';
358
+ document.addEventListener(evtname, function() { self._visChange(); } );
359
+
360
+ }
361
+
362
+ if( !Modernizr.touch && this.options.onhover ) {
363
+
364
+ self.$items.on( 'mouseenter.gridrotator', function() {
365
+
366
+ var $item = $( this );
367
+ if( !$item.data( 'active' ) && !$item.data( 'hovered' ) && !$item.data( 'nochange' ) ) {
368
+ $item.data( 'hovered', true );
369
+ self._replace( $item );
370
+ }
371
+
372
+ } ).on( 'mouseleave.gridrotator', function() {
373
+
374
+ $( this ).data( 'hovered', false );
375
+
376
+ } );
377
+
378
+ }
379
+
380
+ },
381
+ _visChange : function() {
382
+
383
+ isHidden() ? clearTimeout( this.playtimeout ) : this._start();
384
+
385
+ },
386
+ // start rotating elements
387
+ _start : function() {
388
+
389
+ if( this.showTotal < this.itemsTotal && this.options.slideshow ) {
390
+ this._showNext();
391
+ }
392
+
393
+ },
394
+ // get which type of animation
395
+ _getAnimType : function() {
396
+
397
+ return this.animType === 'random' ? this.animTypes[ Math.floor( Math.random() * this.animTypesTotal ) ] : this.animType;
398
+
399
+ },
400
+ // get css properties for the transition effect
401
+ _getAnimProperties : function( $out ) {
402
+
403
+ var startInProp = {}, startOutProp = {}, endInProp = {}, endOutProp = {},
404
+ animType = this._getAnimType(), speed, delay = 0;
405
+
406
+ switch( animType ) {
407
+
408
+ case 'showHide' :
409
+
410
+ speed = 0;
411
+ endOutProp.opacity = 0;
412
+ break;
413
+
414
+ case 'fadeInOut' :
415
+
416
+ endOutProp.opacity = 0;
417
+ break;
418
+
419
+ case 'slideLeft' :
420
+
421
+ startInProp.left = $out.width();
422
+ endInProp.left = 0;
423
+ endOutProp.left = -$out.width();
424
+ break;
425
+
426
+ case 'slideRight' :
427
+
428
+ startInProp.left = -$out.width();
429
+ endInProp.left = 0;
430
+ endOutProp.left = $out.width();
431
+ break;
432
+
433
+ case 'slideTop' :
434
+
435
+ startInProp.top = $out.height();
436
+ endInProp.top = 0;
437
+ endOutProp.top = -$out.height();
438
+ break;
439
+
440
+ case 'slideBottom' :
441
+
442
+ startInProp.top = -$out.height();
443
+ endInProp.top = 0;
444
+ endOutProp.top = $out.height();
445
+ break;
446
+
447
+ case 'rotateLeft' :
448
+
449
+ speed = this.options.animSpeed / 2;
450
+ startInProp.transform = 'rotateY(90deg)';
451
+ endInProp.transform = 'rotateY(0deg)';
452
+ delay = speed;
453
+ endOutProp.transform = 'rotateY(-90deg)';
454
+ break;
455
+
456
+ case 'rotateRight' :
457
+
458
+ speed = this.options.animSpeed / 2;
459
+ startInProp.transform = 'rotateY(-90deg)';
460
+ endInProp.transform = 'rotateY(0deg)';
461
+ delay = speed;
462
+ endOutProp.transform = 'rotateY(90deg)';
463
+ break;
464
+
465
+ case 'rotateTop' :
466
+
467
+ speed = this.options.animSpeed / 2;
468
+ startInProp.transform= 'rotateX(90deg)';
469
+ endInProp.transform = 'rotateX(0deg)';
470
+ delay = speed;
471
+ endOutProp.transform = 'rotateX(-90deg)';
472
+ break;
473
+
474
+ case 'rotateBottom' :
475
+
476
+ speed = this.options.animSpeed / 2;
477
+ startInProp.transform = 'rotateX(-90deg)';
478
+ endInProp.transform = 'rotateX(0deg)';
479
+ delay = speed;
480
+ endOutProp.transform = 'rotateX(90deg)';
481
+ break;
482
+
483
+ case 'scale' :
484
+
485
+ speed = this.options.animSpeed / 2;
486
+ startInProp.transform = 'scale(0)';
487
+ startOutProp.transform = 'scale(1)';
488
+ endInProp.transform = 'scale(1)';
489
+ delay = speed;
490
+ endOutProp.transform = 'scale(0)';
491
+ break;
492
+
493
+ case 'rotateLeftScale' :
494
+
495
+ startOutProp.transform = 'scale(1)';
496
+ speed = this.options.animSpeed / 2;
497
+ startInProp.transform = 'scale(0.3) rotateY(90deg)';
498
+ endInProp.transform = 'scale(1) rotateY(0deg)';
499
+ delay = speed;
500
+ endOutProp.transform = 'scale(0.3) rotateY(-90deg)';
501
+ break;
502
+
503
+ case 'rotateRightScale' :
504
+
505
+ startOutProp.transform = 'scale(1)';
506
+ speed = this.options.animSpeed / 2;
507
+ startInProp.transform = 'scale(0.3) rotateY(-90deg)';
508
+ endInProp.transform = 'scale(1) rotateY(0deg)';
509
+ delay = speed;
510
+ endOutProp.transform = 'scale(0.3) rotateY(90deg)';
511
+ break;
512
+
513
+ case 'rotateTopScale' :
514
+
515
+ startOutProp.transform = 'scale(1)';
516
+ speed = this.options.animSpeed / 2;
517
+ startInProp.transform = 'scale(0.3) rotateX(90deg)';
518
+ endInProp.transform = 'scale(1) rotateX(0deg)';
519
+ delay = speed;
520
+ endOutProp.transform = 'scale(0.3) rotateX(-90deg)';
521
+ break;
522
+
523
+ case 'rotateBottomScale' :
524
+
525
+ startOutProp.transform = 'scale(1)';
526
+ speed = this.options.animSpeed / 2;
527
+ startInProp.transform = 'scale(0.3) rotateX(-90deg)';
528
+ endInProp.transform = 'scale(1) rotateX(0deg)';
529
+ delay = speed;
530
+ endOutProp.transform = 'scale(0.3) rotateX(90deg)';
531
+ break;
532
+
533
+ case 'rotate3d' :
534
+
535
+ speed = this.options.animSpeed / 2;
536
+ startInProp.transform = 'rotate3d( 1, 1, 0, 90deg )';
537
+ endInProp.transform = 'rotate3d( 1, 1, 0, 0deg )';
538
+ delay = speed;
539
+ endOutProp.transform = 'rotate3d( 1, 1, 0, -90deg )';
540
+ break;
541
+
542
+ }
543
+
544
+ return {
545
+ startInProp : startInProp,
546
+ startOutProp : startOutProp,
547
+ endInProp : endInProp,
548
+ endOutProp : endOutProp,
549
+ delay : delay,
550
+ animSpeed : speed != undefined ? speed : this.options.animSpeed
551
+ };
552
+
553
+ },
554
+ // show next [option.step] elements
555
+ _showNext : function( time ) {
556
+
557
+ var self = this;
558
+
559
+ clearTimeout( this.playtimeout );
560
+
561
+ this.playtimeout = setTimeout( function() {
562
+
563
+ var step = self.options.step, max= self.options.maxStep, min = 1;
564
+
565
+ if( max > self.showTotal ) {
566
+ max = self.showTotal;
567
+ }
568
+
569
+ // number of items to swith at this point of time
570
+ var nmbOut = step === 'random' ? Math.floor( Math.random() * max + min ) : Math.min( Math.abs( step ) , max ) ,
571
+ // array with random indexes. These will be the indexes of the items we will replace
572
+ randArr = self._getRandom( nmbOut, self.showTotal );
573
+
574
+ for( var i = 0; i < nmbOut; ++i ) {
575
+
576
+ // element to go out
577
+ var $out = self.$items.eq( randArr[ i ] );
578
+
579
+ // if element is active, which means it is currently animating,
580
+ // then we need to get different positions..
581
+ if( $out.data( 'active' ) || $out.data( 'nochange' ) ) {
582
+
583
+ // one of the items is active, call again..
584
+ self._showNext( 1 );
585
+ return false;
586
+
587
+ }
588
+
589
+ self._replace( $out );
590
+
591
+ }
592
+
593
+ // again and again..
594
+ self._showNext();
595
+
596
+ }, time || Math.max( Math.abs( this.options.interval ) , 300 ) );
597
+
598
+ },
599
+ _replace : function( $out ) {
600
+
601
+ $out.data( 'active', true );
602
+
603
+ var self = this,
604
+ $outA = $out.children( 'a:last' ),
605
+ newElProp = {
606
+ width : $outA.width(),
607
+ height : $outA.height()
608
+ };
609
+
610
+ // element stays active
611
+ $out.data( 'active', true );
612
+
613
+ // get the element (anchor) that will go in (first one inserted in this.outItems)
614
+ var $inA = this.outItems.shift();
615
+
616
+ // save element that went out
617
+ this.outItems.push( $outA.clone().css( 'transition', 'none' ) );
618
+
619
+ // prepend in element
620
+ $inA.css( newElProp ).prependTo( $out );
621
+
622
+ var animProp = this._getAnimProperties( $outA );
623
+
624
+ $inA.css( animProp.startInProp );
625
+ $outA.css( animProp.startOutProp );
626
+
627
+ this._setTransition( $inA, 'all', animProp.animSpeed, animProp.delay, this.options.animEasingIn );
628
+ this._setTransition( $outA, 'all', animProp.animSpeed, 0, this.options.animEasingOut );
629
+
630
+ this._applyTransition( $inA, animProp.endInProp, animProp.animSpeed, function() {
631
+
632
+ var $el = $( this ),
633
+ t = animProp.animSpeed === self.options.animSpeed && isEmpty( animProp.endInProp ) ? animProp.animSpeed : 0;
634
+
635
+ setTimeout( function() {
636
+
637
+ if( self.supportTransitions ) {
638
+ $el.off( self.transEndEventName );
639
+ }
640
+
641
+ $el.next().remove();
642
+ $el.parent().data( 'active', false );
643
+
644
+ }, t );
645
+
646
+ }, animProp.animSpeed === 0 || isEmpty( animProp.endInProp ) );
647
+ this._applyTransition( $outA, animProp.endOutProp, animProp.animSpeed );
648
+
649
+ },
650
+ _getRandom : function( cnt, limit ) {
651
+
652
+ var randArray = [];
653
+
654
+ for( var i = 0; i < limit; ++i ) {
655
+ randArray.push( i )
656
+ }
657
+
658
+ return randArray.shuffle().slice( 0, cnt );
659
+
660
+ },
661
+ _setTransition : function( el, prop, speed, delay, easing ) {
662
+
663
+ setTimeout( function() {
664
+ el.css( 'transition', prop + ' ' + speed + 'ms ' + delay + 'ms ' + easing );
665
+ }, 25 );
666
+
667
+ },
668
+ _applyTransition : function( el, styleCSS, speed, fncomplete, force ) {
669
+
670
+ var self = this;
671
+ setTimeout( function() {
672
+ $.fn.applyStyle = self.supportTransitions ? $.fn.css : $.fn.animate;
673
+
674
+ if( fncomplete && self.supportTransitions ) {
675
+
676
+ el.on( self.transEndEventName, fncomplete );
677
+
678
+ if( force ) {
679
+ fncomplete.call( el );
680
+ }
681
+
682
+ }
683
+
684
+ fncomplete = fncomplete || function() { return false; };
685
+
686
+ el.stop().applyStyle( styleCSS, $.extend( true, [], { duration : speed + 'ms', complete : fncomplete } ) );
687
+ }, 25 );
688
+
689
+ }
690
+
691
+ };
692
+
693
+ var logError = function( message ) {
694
+
695
+ if ( window.console ) {
696
+
697
+ window.console.error( message );
698
+
699
+ }
700
+
701
+ };
702
+
703
+ $.fn.gridrotator = function( options ) {
704
+
705
+ var instance = $.data( this, 'gridrotator' );
706
+
707
+ if ( typeof options === 'string' ) {
708
+
709
+ var args = Array.prototype.slice.call( arguments, 1 );
710
+
711
+ this.each(function() {
712
+
713
+ if ( !instance ) {
714
+
715
+ logError( "cannot call methods on gridrotator prior to initialization; " +
716
+ "attempted to call method '" + options + "'" );
717
+ return;
718
+
719
+ }
720
+
721
+ if ( !$.isFunction( instance[options] ) || options.charAt(0) === "_" ) {
722
+
723
+ logError( "no such method '" + options + "' for gridrotator instance" );
724
+ return;
725
+
726
+ }
727
+
728
+ instance[ options ].apply( instance, args );
729
+
730
+ });
731
+
732
+ }
733
+ else {
734
+
735
+ this.each(function() {
736
+
737
+ if ( instance ) {
738
+
739
+ instance._init();
740
+
741
+ }
742
+ else {
743
+
744
+ instance = $.data( this, 'gridrotator', new $.GridRotator( options, this ) );
745
+
746
+ }
747
+
748
+ });
749
+
750
+ }
751
+
752
+ return instance;
753
+
754
+ };
755
+
756
+ } )( jQuery, window );
js/modernizr.custom.26633.js ADDED
@@ -0,0 +1,4 @@
 
 
 
 
1
+ /* Modernizr 2.6.2 (Custom Build) | MIT & BSD
2
+ * Build: http://modernizr.com/download/#-backgroundsize-csstransforms3d-csstransitions-touch-shiv-cssclasses-prefixed-teststyles-testprop-testallprops-prefixes-domprefixes-load
3
+ */
4
+ ;window.Modernizr=function(a,b,c){function z(a){j.cssText=a}function A(a,b){return z(m.join(a+";")+(b||""))}function B(a,b){return typeof a===b}function C(a,b){return!!~(""+a).indexOf(b)}function D(a,b){for(var d in a){var e=a[d];if(!C(e,"-")&&j[e]!==c)return b=="pfx"?e:!0}return!1}function E(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:B(f,"function")?f.bind(d||b):f}return!1}function F(a,b,c){var d=a.charAt(0).toUpperCase()+a.slice(1),e=(a+" "+o.join(d+" ")+d).split(" ");return B(b,"string")||B(b,"undefined")?D(e,b):(e=(a+" "+p.join(d+" ")+d).split(" "),E(e,b,c))}var d="2.6.2",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m=" -webkit- -moz- -o- -ms- ".split(" "),n="Webkit Moz O ms",o=n.split(" "),p=n.toLowerCase().split(" "),q={},r={},s={},t=[],u=t.slice,v,w=function(a,c,d,e){var f,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["&#173;",'<style id="s',h,'">',a,"</style>"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!i},x={}.hasOwnProperty,y;!B(x,"undefined")&&!B(x.call,"undefined")?y=function(a,b){return x.call(a,b)}:y=function(a,b){return b in a&&B(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=u.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(u.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(u.call(arguments)))};return e}),q.touch=function(){var c;return"ontouchstart"in a||a.DocumentTouch&&b instanceof DocumentTouch?c=!0:w(["@media (",m.join("touch-enabled),("),h,")","{#modernizr{top:9px;position:absolute}}"].join(""),function(a){c=a.offsetTop===9}),c},q.backgroundsize=function(){return F("backgroundSize")},q.csstransforms3d=function(){var a=!!F("perspective");return a&&"webkitPerspective"in g.style&&w("@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:3px;}}",function(b,c){a=b.offsetLeft===9&&b.offsetHeight===3}),a},q.csstransitions=function(){return F("transition")};for(var G in q)y(q,G)&&(v=G.toLowerCase(),e[v]=q[G](),t.push((e[v]?"":"no-")+v));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)y(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},z(""),i=k=null,function(a,b){function k(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function l(){var a=r.elements;return typeof a=="string"?a.split(" "):a}function m(a){var b=i[a[g]];return b||(b={},h++,a[g]=h,i[h]=b),b}function n(a,c,f){c||(c=b);if(j)return c.createElement(a);f||(f=m(c));var g;return f.cache[a]?g=f.cache[a].cloneNode():e.test(a)?g=(f.cache[a]=f.createElem(a)).cloneNode():g=f.createElem(a),g.canHaveChildren&&!d.test(a)?f.frag.appendChild(g):g}function o(a,c){a||(a=b);if(j)return a.createDocumentFragment();c=c||m(a);var d=c.frag.cloneNode(),e=0,f=l(),g=f.length;for(;e<g;e++)d.createElement(f[e]);return d}function p(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return r.shivMethods?n(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+l().join().replace(/\w+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(r,b.frag)}function q(a){a||(a=b);var c=m(a);return r.shivCSS&&!f&&!c.hasCSS&&(c.hasCSS=!!k(a,"article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}")),j||p(a,c),a}var c=a.html5||{},d=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,e=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,f,g="_html5shiv",h=0,i={},j;(function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",f="hidden"in a,j=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){f=!0,j=!0}})();var r={elements:c.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:c.shivCSS!==!1,supportsUnknownElements:j,shivMethods:c.shivMethods!==!1,type:"default",shivDocument:q,createElement:n,createDocumentFragment:o};a.html5=r,q(b)}(this,b),e._version=d,e._prefixes=m,e._domPrefixes=p,e._cssomPrefixes=o,e.testProp=function(a){return D([a])},e.testAllProps=F,e.testStyles=w,e.prefixed=function(a,b,c){return b?F(a,b,c):F(a,"pfx")},g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+t.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e:e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url]?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop().split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(),e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}var h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i),i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);else Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a)},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A,0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs=function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.readyState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k.onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for(j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}}(this,document),Modernizr.load=function(){yepnope.apply(window,[].slice.call(arguments,0))};
readme.txt CHANGED
@@ -3,8 +3,8 @@ Contributors: Access Keys
3
  Tags: instagram, instagram feed, instagram tag, instagram slider, instagarm mosaic view, instagarm mosaic layout, instagram lightbox, social media instagram, social network, masonry layout, masonry lightbox, instagarm masonry view
4
  Donate link: http://accesspressthemes.com/donation/
5
  Requires at least: 3.8
6
- Tested up to: 4.3
7
- Stable tag: 2.0.5
8
  License: GPLv2 or later
9
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
 
@@ -95,6 +95,11 @@ Once you install the plugin , you can check some general documentation about how
95
  5. Backend Display Settings Section
96
 
97
  == Changelog ==
 
 
 
 
 
98
  = 2.0.5 =
99
  * Done the follow me button link corrections to the masaic layout.
100
  * Done generation of pot files for translation of a plugin.
3
  Tags: instagram, instagram feed, instagram tag, instagram slider, instagarm mosaic view, instagarm mosaic layout, instagram lightbox, social media instagram, social network, masonry layout, masonry lightbox, instagarm masonry view
4
  Donate link: http://accesspressthemes.com/donation/
5
  Requires at least: 3.8
6
+ Tested up to: 4.4
7
+ Stable tag: 2.0.6
8
  License: GPLv2 or later
9
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
 
95
  5. Backend Display Settings Section
96
 
97
  == Changelog ==
98
+ = 2.0.6 =
99
+ * Addition of new layout - grid rotator layout.
100
+ * Addition of new shortcode for grid rotator layout.
101
+ * Done the bug fixing for the show image options if not checked.
102
+
103
  = 2.0.5 =
104
  * Done the follow me button link corrections to the masaic layout.
105
  * Done generation of pot files for translation of a plugin.