diff options
author | patdenice <patdenice@piwigo.org> | 2012-02-29 21:21:46 +0000 |
---|---|---|
committer | patdenice <patdenice@piwigo.org> | 2012-02-29 21:21:46 +0000 |
commit | c0bdb8a765065429193d2d78a707031451d4abab (patch) | |
tree | 2cf369b31e60127e7c1b325368d95523c74b01d4 /themes/default | |
parent | ce06fe8a489aea7ac2e2e67f36242784e919da06 (diff) |
Multisize
Load thumbnails with ajax.
git-svn-id: http://piwigo.org/svn/trunk@13444 68402e56-0260-453c-a942-63ccdbb3a9ee
Diffstat (limited to 'themes/default')
-rw-r--r-- | themes/default/js/thumbnails.loader.js | 29 | ||||
-rw-r--r-- | themes/default/template/thumbnails.tpl | 5 |
2 files changed, 33 insertions, 1 deletions
diff --git a/themes/default/js/thumbnails.loader.js b/themes/default/js/thumbnails.loader.js new file mode 100644 index 000000000..e1eba51da --- /dev/null +++ b/themes/default/js/thumbnails.loader.js @@ -0,0 +1,29 @@ +var thumbnails_queue = jQuery.manageAjax.create('queued', { + queue: true, + cacheResponse: false, + maxRequests: 3, + preventDoubleRequests: false +}); + +function add_thumbnail_to_queue(img, loop) { + thumbnails_queue.add({ + type: 'GET', + url: img.data('src'), + data: { ajaxload: 'true' }, + dataType: 'json', + success: function(result) { + img.attr('src', result.url); + }, + error: function() { + if (loop < 3) + add_thumbnail_to_queue(img, ++loop); // Retry 3 times + } + }); +} + +jQuery('img').each(function() { + var img = jQuery(this); + if (typeof img.data('src') != 'undefined') { + add_thumbnail_to_queue(img, 0); + } +});
\ No newline at end of file diff --git a/themes/default/template/thumbnails.tpl b/themes/default/template/thumbnails.tpl index 0f8e57acf..6f6c09122 100644 --- a/themes/default/template/thumbnails.tpl +++ b/themes/default/template/thumbnails.tpl @@ -1,4 +1,6 @@ {if !empty($thumbnails)}{strip} +{combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='async'} +{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='async'} {*define_derivative name='derivative_params' width=160 height=90 crop=true*} {html_style} {*Set some sizes according to maximum thumbnail width and height*} @@ -22,11 +24,12 @@ {/if} {/html_style} {foreach from=$thumbnails item=thumbnail} +{assign var=derivative value=$pwg->derivative($derivative_params, $thumbnail.src_image)} <li> <span class="wrap1"> <span class="wrap2"> <a href="{$thumbnail.URL}"> - <img class="thumbnail" src="{$pwg->derivative_url($derivative_params, $thumbnail.src_image)}" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}"> + <img class="thumbnail" {if !$derivative->is_cached()}data-{/if}src="{$derivative->get_url()}" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}"> </a> </span> {if $SHOW_THUMBNAIL_CAPTION } |