feature:2577

Many improvements

git-svn-id: http://piwigo.org/svn/trunk@13234 68402e56-0260-453c-a942-63ccdbb3a9ee

1 files changed, 18 insertions, 7 deletions

diff --git a/themes/smartpocket/template/thumbnails.tpl b/themes/smartpocket/template/thumbnails.tpl
index 5e33dd0ee..acd20af19 100644
--- a/themes/smartpocket/template/thumbnails.tpl
+++ b/themes/smartpocket/template/thumbnails.tpl
@@ -2,7 +2,7 @@
 {combine_script id='klass' path='themes/smartpocket/js/klass.min.js'}

 {combine_script id='photoswipe' path='themes/smartpocket/js/code.photoswipe.jquery.min.js' require='klass,jquery.mobile'}

 

-{define_derivative name='derivative_params_thumb' width=150 height=150 crop=true}

+{define_derivative name='derivative_params_thumb' width=120 height=120 crop=true}

 {define_derivative name='derivative_params_full' type='large'}

 

 {footer_script}{literal}

@@ -10,23 +10,34 @@
   $(document).ready(function(){

     var options = {

       jQueryMobile: true,

-      //allowUserZoom: false,

       imageScaleMethod: "fitNoUpscale"

     };

     $(".thumbnails a").photoSwipe(options);

-    $(".thumbnails img").load(function() { $(this).css('border', '1px solid #3c3c3c') });

+    $(document).bind('orientationchange', set_thumbnails_width);

+    set_thumbnails_width();

   });

 }(window, window.jQuery, window.Code.PhotoSwipe));

+

+function set_thumbnails_width() {

+  nb_thumbs = Math.max(3, Math.ceil($('.thumbnails').width() / 130));

+  width = Math.floor(1000000 / nb_thumbs) / 10000;

+  $('.thumbnails li').css('width', width+'%');

+}

+

 {/literal}{/footer_script}

-<div data-role="content">

 <ul class="thumbnails">

-{foreach from=$thumbnails item=thumbnail}

+{foreach from=$thumbnails item=thumbnail}{strip}

+{if isset($page_selection[$thumbnail.id])}

 	<li>

 	  <a href="{$pwg->derivative_url($derivative_params_full, $thumbnail.src_image)}" rel="external">

       <img src="{$pwg->derivative_url($derivative_params_thumb, $thumbnail.src_image)}" alt="{$thumbnail.TN_ALT}">

     </a>

   </li>

-{/foreach}

+{else}

+	<li style="display:none;">

+	  <a href="{$pwg->derivative_url($derivative_params_full, $thumbnail.src_image)}" rel="external"></a>

+  </li>

+{/if}

+{/strip}{/foreach}

 </ul>

-</div>

 {/if}