Advertisement
Guest User

masonry

a guest
Aug 13th, 2018
50
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.13 KB | None | 0 0
  1. // -------------------------------------------------------------------------------------------
  2. // Masonry
  3. // -------------------------------------------------------------------------------------------
  4.  
  5. (function($)
  6. {
  7. "use strict";
  8.  
  9. $.fn.avia_masonry = function(options)
  10. {
  11. //return if we didnt find anything
  12. if(!this.length) return this;
  13.  
  14. var the_body = $('body'),
  15. the_win = $(window),
  16. isMobile = $.avia_utilities.isMobile,
  17. loading = false,
  18. methods = {
  19.  
  20.  
  21. masonry_filter: function()
  22. {
  23. var current = $(this),
  24. linktext = current.html(),
  25. selector = current.data('filter'),
  26. masonry = current.parents('.av-masonry:eq(0)'),
  27. container = masonry.find('.av-masonry-container:eq(0)'),
  28. links = masonry.find('.av-masonry-sort a'),
  29. activeCat = masonry.find('.av-current-sort-title');
  30.  
  31. links.removeClass('active_sort');
  32. current.addClass('active_sort');
  33. container.attr('id', 'masonry_id_'+selector);
  34.  
  35. if(activeCat.length) activeCat.html(linktext);
  36.  
  37. methods.applyMasonry(container, selector, function()
  38. {
  39. container.css({overflow:'visible'});
  40. });
  41.  
  42. setTimeout(function() { the_win.trigger('debouncedresize'); }, 500);
  43.  
  44. return false;
  45. },
  46.  
  47. applyMasonry: function(container, selector, callback)
  48. {
  49. var filters = selector ? {filter: '.'+selector} : {};
  50.  
  51. filters['layoutMode'] = 'packery';
  52. filters['packery'] = {gutter:0};
  53. filters['percentPosition'] = true;
  54. filters['itemSelector'] = "a.isotope-item, div.isotope-item";
  55. filters['originLeft'] = $('body').hasClass('rtl') ? false : true;
  56.  
  57. container.isotope(filters, function()
  58. {
  59. the_win.trigger('av-height-change');
  60. });
  61.  
  62. if(typeof callback === 'function')
  63. {
  64. setTimeout(callback, 0);
  65. }
  66. },
  67.  
  68. show_bricks: function(bricks, callback)
  69. {
  70. bricks.each(function(i)
  71. {
  72. var currentLink = $(this),
  73. browserPrefix = $.avia_utilities.supports('transition'),
  74. multiplier = isMobile ? 0 : 100;
  75.  
  76. setTimeout(function()
  77. {
  78. if(browserPrefix === false)
  79. {
  80. currentLink.css({visibility:"visible", opacity:0}).animate({opacity:1},1500);
  81. }
  82. else
  83. {
  84. currentLink.addClass('av-masonry-item-loaded');
  85. }
  86.  
  87. if(i == bricks.length - 1 && typeof callback == 'function')
  88. {
  89. callback.call();
  90. the_win.trigger('av-height-change');
  91. }
  92.  
  93. }, (multiplier * i));
  94. });
  95. },
  96.  
  97. loadMore: function(e)
  98. {
  99. e.preventDefault();
  100.  
  101. if(loading) return false;
  102.  
  103. loading = true;
  104.  
  105. var current = $(this),
  106. data = current.data(),
  107. masonry = current.parents('.av-masonry:eq(0)'),
  108. container = masonry.find('.av-masonry-container'),
  109. items = masonry.find('.av-masonry-entry'),
  110. loader = $.avia_utilities.loading(),
  111. finished = function(){ loading = false; loader.hide(); the_body.trigger('av_resize_finished'); };
  112.  
  113. //calculate a new offset
  114. if(!data.offset){ data.offset = 0; }
  115. data.offset += data.items;
  116. data.action = 'avia_ajax_masonry_more';
  117. data.loaded = []; //prevents duplicate entries from beeing loaded when randomized is active
  118.  
  119. items.each(function(){
  120. var item_id = $(this).data('av-masonry-item');
  121. if(item_id) data.loaded.push( item_id );
  122. });
  123.  
  124. $.ajax({
  125. url: avia_framework_globals.ajaxurl,
  126. type: "POST",
  127. data:data,
  128. beforeSend: function()
  129. {
  130. loader.show();
  131. },
  132. success: function(response)
  133. {
  134. if(response.indexOf("{av-masonry-loaded}") !== -1)
  135. {
  136. //fetch the response. if any php warnings were displayed before rendering of the items the are removed by the string split
  137. var response = response.split('{av-masonry-loaded}'),
  138. new_items = $(response.pop()).filter('.isotope-item');
  139.  
  140. //check if we got more items than we need. if not we have reached the end of items
  141. if(new_items.length > data.items)
  142. {
  143. new_items = new_items.not(':last');
  144. }
  145. else
  146. {
  147. current.addClass('av-masonry-no-more-items');
  148. }
  149.  
  150. var load_container = $('<div class="loadcontainer"></div>').append(new_items);
  151.  
  152.  
  153.  
  154. $.avia_utilities.preload({container: load_container, single_callback: function()
  155. {
  156. var links = masonry.find('.av-masonry-sort a'),
  157. filter_container = masonry.find('.av-sort-by-term'),
  158. allowed_filters = filter_container.data("av-allowed-sort");
  159.  
  160. filter_container.hide();
  161.  
  162. loader.hide();
  163. container.isotope( 'insert', new_items);
  164. $.avia_utilities.avia_ajax_call(masonry);
  165. setTimeout( function(){ methods.show_bricks( new_items , finished); },150);
  166. setTimeout(function(){ the_win.trigger('av-height-change'); }, 550);
  167. if(links)
  168. {
  169. $(links).each(function(filterlinkindex)
  170. {
  171. var filterlink = $(this),
  172. sort = filterlink.data('filter');
  173.  
  174. if(new_items)
  175. {
  176. $(new_items).each(function(itemindex){
  177. var item = $(this);
  178.  
  179. if(item.hasClass(sort) && allowed_filters.indexOf(sort) !== -1)
  180. {
  181. var term_count = filterlink.find('.avia-term-count').text();
  182. filterlink.find('.avia-term-count').text(' ' + (parseInt(term_count) + 1) + ' ');
  183.  
  184. if(filterlink.hasClass('avia_hide_sort'))
  185. {
  186. filterlink.removeClass('avia_hide_sort').addClass('avia_show_sort');
  187. masonry.find('.av-masonry-sort .'+sort+'_sep').removeClass('avia_hide_sort').addClass('avia_show_sort');
  188. masonry.find('.av-masonry-sort .av-sort-by-term').removeClass('hidden');
  189. }
  190. }
  191. });
  192. }
  193. });
  194.  
  195. }
  196.  
  197. filter_container.fadeIn();
  198. }
  199. });
  200. }
  201. else
  202. {
  203. finished();
  204. }
  205. },
  206. error: finished,
  207. complete: function()
  208. {
  209. setTimeout(function() { the_win.trigger('debouncedresize'); }, 500);
  210. }
  211. });
  212. }
  213.  
  214. };
  215.  
  216. return this.each(function()
  217. {
  218. var masonry = $(this),
  219. container = masonry.find('.av-masonry-container'),
  220. bricks = masonry.find('.isotope-item'),
  221. filter = masonry.find('.av-masonry-sort').css({visibility:"visible", opacity:0}).on('click', 'a', methods.masonry_filter),
  222. load_more = masonry.find('.av-masonry-load-more').css({visibility:"visible", opacity:0});
  223.  
  224. $.avia_utilities.preload({container: container, single_callback: function()
  225. {
  226. var start_animation = function()
  227. {
  228. filter.animate({opacity:1}, 400);
  229.  
  230. //fix for non aligned elements because of scrollbar
  231. if(container.outerHeight() + container.offset().top + $('#footer').outerHeight() > $(window).height())
  232. {
  233. $('html').css({'overflow-y':'scroll'});
  234. }
  235.  
  236. methods.applyMasonry(container, false, function()
  237. {
  238. masonry.addClass('avia_sortable_active');
  239. container.removeClass('av-js-disabled ');
  240. });
  241.  
  242. methods.show_bricks(bricks, function()
  243. {
  244. load_more.css({opacity:1}).on('click', methods.loadMore);
  245. });
  246.  
  247. //container.isotope( 'reLayout' );
  248.  
  249. };
  250.  
  251. if(isMobile)
  252. {
  253. start_animation();
  254. }
  255. else
  256. {
  257. masonry.waypoint(start_animation , { offset: '80%'} );
  258. }
  259.  
  260. // update columnWidth on window resize
  261. $(window).on( 'debouncedresize', function()
  262. {
  263. methods.applyMasonry(container, false, function()
  264. {
  265. masonry.addClass('avia_sortable_active');
  266. });
  267. });
  268. }
  269. });
  270.  
  271.  
  272. });
  273. };
  274.  
  275.  
  276. }(jQuery));
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement