aboutsummaryrefslogtreecommitdiffstats
path: root/themes/default
diff options
context:
space:
mode:
authorpatdenice <patdenice@piwigo.org>2012-02-29 21:21:46 +0000
committerpatdenice <patdenice@piwigo.org>2012-02-29 21:21:46 +0000
commitc0bdb8a765065429193d2d78a707031451d4abab (patch)
tree2cf369b31e60127e7c1b325368d95523c74b01d4 /themes/default
parentce06fe8a489aea7ac2e2e67f36242784e919da06 (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.js29
-rw-r--r--themes/default/template/thumbnails.tpl5
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 }