From f518c608d961a0c71a137696b1925d8185811c0f Mon Sep 17 00:00:00 2001 From: Shish Date: Thu, 15 Mar 2012 19:26:16 +0000 Subject: [PATCH] lazy loading for thumbs --- core/basethemelet.class.php | 4 +++- lib/jquery.lazyload.min.js | 15 +++++++++++++++ lib/shimmie.css | 1 + lib/shimmie.js | 5 +++++ lib/static/grey.gif | Bin 0 -> 43 bytes 5 files changed, 24 insertions(+), 1 deletion(-) create mode 100644 lib/jquery.lazyload.min.js create mode 100644 lib/static/grey.gif diff --git a/core/basethemelet.class.php b/core/basethemelet.class.php index ac052ca8..aa07045a 100644 --- a/core/basethemelet.class.php +++ b/core/basethemelet.class.php @@ -34,6 +34,7 @@ class BaseThemelet { $h_view_link = make_link('post/view/'.$i_id, $query); $h_thumb_link = $image->get_thumb_link(); $h_tip = html_escape($image->get_tooltip()); + $base = get_base_href(); // If file is flash or svg then sets thumbnail to max size. if($image->ext === 'swf' || $image->ext === 'svg'){ @@ -44,7 +45,8 @@ class BaseThemelet { } return ''. - ''.$h_tip.''. + ''.$h_tip.''. + ''. "\n"; } diff --git a/lib/jquery.lazyload.min.js b/lib/jquery.lazyload.min.js new file mode 100644 index 00000000..e82a9d9d --- /dev/null +++ b/lib/jquery.lazyload.min.js @@ -0,0 +1,15 @@ +/* + * Lazy Load - jQuery plugin for lazy loading images + * + * Copyright (c) 2007-2012 Mika Tuupola + * + * Licensed under the MIT license: + * http://www.opensource.org/licenses/mit-license.php + * + * Project home: + * http://www.appelsiini.net/projects/lazyload + * + * Version: 1.7.2 + * + */ +(function(a,b){$window=a(b),a.fn.lazyload=function(c){function f(){var b=0;d.each(function(){var c=a(this);if(e.skip_invisible&&!c.is(":visible"))return;if(!a.abovethetop(this,e)&&!a.leftofbegin(this,e))if(!a.belowthefold(this,e)&&!a.rightoffold(this,e))c.trigger("appear");else if(++b>e.failure_limit)return!1})}var d=this,e={threshold:0,failure_limit:0,event:"scroll",effect:"show",container:b,data_attribute:"original",skip_invisible:!0,appear:null,load:null};return c&&(undefined!==c.failurelimit&&(c.failure_limit=c.failurelimit,delete c.failurelimit),undefined!==c.effectspeed&&(c.effect_speed=c.effectspeed,delete c.effectspeed),a.extend(e,c)),$container=e.container===undefined||e.container===b?$window:a(e.container),0===e.event.indexOf("scroll")&&$container.bind(e.event,function(a){return f()}),this.each(function(){var b=this,c=a(b);b.loaded=!1,c.one("appear",function(){if(!this.loaded){if(e.appear){var f=d.length;e.appear.call(b,f,e)}a("").bind("load",function(){c.hide().attr("src",c.data(e.data_attribute))[e.effect](e.effect_speed),b.loaded=!0;var f=a.grep(d,function(a){return!a.loaded});d=a(f);if(e.load){var g=d.length;e.load.call(b,g,e)}}).attr("src",c.data(e.data_attribute))}}),0!==e.event.indexOf("scroll")&&c.bind(e.event,function(a){b.loaded||c.trigger("appear")})}),$window.bind("resize",function(a){f()}),f(),this},a.belowthefold=function(c,d){var e;return d.container===undefined||d.container===b?e=$window.height()+$window.scrollTop():e=$container.offset().top+$container.height(),e<=a(c).offset().top-d.threshold},a.rightoffold=function(c,d){var e;return d.container===undefined||d.container===b?e=$window.width()+$window.scrollLeft():e=$container.offset().left+$container.width(),e<=a(c).offset().left-d.threshold},a.abovethetop=function(c,d){var e;return d.container===undefined||d.container===b?e=$window.scrollTop():e=$container.offset().top,e>=a(c).offset().top+d.threshold+a(c).height()},a.leftofbegin=function(c,d){var e;return d.container===undefined||d.container===b?e=$window.scrollLeft():e=$container.offset().left,e>=a(c).offset().left+d.threshold+a(c).width()},a.inviewport=function(b,c){return!a.rightofscreen(b,c)&&!a.leftofscreen(b,c)&&!a.belowthefold(b,c)&&!a.abovethetop(b,c)},a.extend(a.expr[":"],{"below-the-fold":function(c){return a.belowthefold(c,{threshold:0,container:b})},"above-the-top":function(c){return!a.belowthefold(c,{threshold:0,container:b})},"right-of-screen":function(c){return a.rightoffold(c,{threshold:0,container:b})},"left-of-screen":function(c){return!a.rightoffold(c,{threshold:0,container:b})},"in-viewport":function(c){return!a.inviewport(c,{threshold:0,container:b})},"above-the-fold":function(c){return!a.belowthefold(c,{threshold:0,container:b})},"right-of-fold":function(c){return a.rightoffold(c,{threshold:0,container:b})},"left-of-fold":function(c){return!a.rightoffold(c,{threshold:0,container:b})}})})(jQuery,window) diff --git a/lib/shimmie.css b/lib/shimmie.css index 3d9ead7c..8ddbac60 100644 --- a/lib/shimmie.css +++ b/lib/shimmie.css @@ -15,3 +15,4 @@ TABLE.form TBODY TH {text-align: right; padding-right: 4px; width: 1%;} *[onclick],H3[class~="shm-toggler"] {cursor: pointer;} IMG {border: none;} FORM {margin: 0px;} +IMG.lazy {display: none;} diff --git a/lib/shimmie.js b/lib/shimmie.js index 4243f6df..16282815 100644 --- a/lib/shimmie.js +++ b/lib/shimmie.js @@ -14,6 +14,11 @@ $(document).ready(function() { selectFirst: false }); + $("IMG.lazy").show().lazyload({ + effect: "fadeIn", + threshold: 200 + }); + $("TABLE.sortable").tablesorter(); $(".shm-clink").each(function(idx, elm) { diff --git a/lib/static/grey.gif b/lib/static/grey.gif new file mode 100644 index 0000000000000000000000000000000000000000..8d74456e3d3de45b787c5249a7e94c926d896244 GIT binary patch literal 43 scmZ?wbhEHbWMp7uXkcJCbm$NR1B2pE79h#MpaUX6G7L;iE{qJ;0JGW#K>z>% literal 0 HcmV?d00001