From a6f55ac0381a81c6abf79bb2ed8617b6d50ed2aa Mon Sep 17 00:00:00 2001 From: flop25 Date: Mon, 14 Jan 2013 23:15:34 +0000 Subject: bug:2820 & bug:2684 add $conf['maxRequests'] perf enhanced : declare once {combine_script} add one loading gif, fixed at the bottom right of the page display an icon for picture loading, and an error icon if ajax failed : might need to be integrated in sprite.png ToDo picture page/clean up unused loader gif/sleep above all. git-svn-id: http://piwigo.org/svn/trunk@20161 68402e56-0260-453c-a942-63ccdbb3a9ee --- themes/default/template/thumbnails.tpl | 42 +++++++++++++++++++++++++++++++--- 1 file changed, 39 insertions(+), 3 deletions(-) (limited to 'themes/default/template/thumbnails.tpl') diff --git a/themes/default/template/thumbnails.tpl b/themes/default/template/thumbnails.tpl index 9121aed60..efb9fba65 100644 --- a/themes/default/template/thumbnails.tpl +++ b/themes/default/template/thumbnails.tpl @@ -23,15 +23,51 @@ {/html_style} {foreach from=$thumbnails item=thumbnail} {assign var=derivative value=$pwg->derivative($derivative_params, $thumbnail.src_image)} -{if !$derivative->is_cached()} +{if !$derivative->is_cached() and !$js_loaded} {combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='footer'} -{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'} +{*combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'*} +{footer_script}{literal} +var thumbnails_queue = jQuery.manageAjax.create('queued', { + queue: true, + cacheResponse: false, + maxRequests: {/literal}{$maxRequests}{literal}, + preventDoubleRequests: false +}); + +function add_thumbnail_to_queue(img, loop) { + thumbnails_queue.add({ + type: 'GET', + url: img.data('src'), + data: { ajaxload: 'true' }, + dataType: 'json', + beforeSend: function(){jQuery('.loader').show()}, + success: function(result) { + img.attr('src', result.url); + jQuery('.loader').hide(); + }, + error: function() { + if (loop < 3) + add_thumbnail_to_queue(img, ++loop); // Retry 3 times + img.attr('src', {/literal}"{$ROOT_URL}{$themeconf.icon_dir}/errors_small.png"{literal}); + jQuery('.loader').hide(); + } + }); +} + +function pwg_ajax_thumbnails_loader() { + jQuery('img[data-src]').each(function() { + add_thumbnail_to_queue(jQuery(this), 0); + }); +} +jQuery(document).ready(pwg_ajax_thumbnails_loader); +{/literal}{/footer_script} +{assign var=js_loaded value=true} {/if}
  • - is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.img_dir}/ajax-loader-small.gif" data-src="{$derivative->get_url()}"{/if} alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}"> + is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.icon_dir}/img_small.png" data-src="{$derivative->get_url()}"{/if} alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}"> {if $SHOW_THUMBNAIL_CAPTION } -- cgit v1.2.3