diff options
Diffstat (limited to 'themes/default/template/mainpage_categories.tpl')
| -rw-r--r-- | themes/default/template/mainpage_categories.tpl | 45 |
1 files changed, 41 insertions, 4 deletions
diff --git a/themes/default/template/mainpage_categories.tpl b/themes/default/template/mainpage_categories.tpl index 81bb82d75..8657b921b 100644 --- a/themes/default/template/mainpage_categories.tpl +++ b/themes/default/template/mainpage_categories.tpl @@ -7,18 +7,55 @@ height: {$derivative_params->max_height()+5}px; } {/html_style}{/strip} +<div class="loader" style="display: none; position: fixed; right: 0;bottom: 0;"><img src="{$ROOT_URL}{$themeconf.img_dir}/ajax_loader.gif"></div> <ul class="thumbnailCategories"> {foreach from=$category_thumbnails item=cat name=cat_loop} {assign var=derivative value=$pwg->derivative($derivative_params, $cat.representative.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} - <li class="{if $smarty.foreach.cat_loop.index is odd}odd{else}even{/if}"> + <li class="{if $smarty.foreach.cat_loop.index is odd}odd{else}even{/if}"> <div class="thumbnailCategory"> <div class="illustration"> <a href="{$cat.URL}"> - <img {if $derivative->is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.img_dir}/ajax-loader-small.gif" data-src="{$derivative->get_url()}"{/if} alt="{$cat.TN_ALT}" title="{$cat.NAME|@replace:'"':' '|@strip_tags:false} - {'display this album'|@translate}"> + <img {if $derivative->is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.icon_dir}/img_small.png" data-src="{$derivative->get_url()}"{/if} alt="{$cat.TN_ALT}" title="{$cat.NAME|@replace:'"':' '|@strip_tags:false} - {'display this album'|@translate}"> </a> </div> <div class="description"> |