source: trunk/themes/smartpocket/template/thumbnails.tpl @ 13234

Last change on this file since 13234 was 13234, checked in by patdenice, 9 years ago

feature:2577
Many improvements

File size: 1.5 KB
Line 
1{if !empty($thumbnails)}
2{combine_script id='klass' path='themes/smartpocket/js/klass.min.js'}
3{combine_script id='photoswipe' path='themes/smartpocket/js/code.photoswipe.jquery.min.js' require='klass,jquery.mobile'}
4
5{define_derivative name='derivative_params_thumb' width=120 height=120 crop=true}
6{define_derivative name='derivative_params_full' type='large'}
7
8{footer_script}{literal}
9(function(window, $, PhotoSwipe){
10  $(document).ready(function(){
11    var options = {
12      jQueryMobile: true,
13      imageScaleMethod: "fitNoUpscale"
14    };
15    $(".thumbnails a").photoSwipe(options);
16    $(document).bind('orientationchange', set_thumbnails_width);
17    set_thumbnails_width();
18  });
19}(window, window.jQuery, window.Code.PhotoSwipe));
20
21function set_thumbnails_width() {
22  nb_thumbs = Math.max(3, Math.ceil($('.thumbnails').width() / 130));
23  width = Math.floor(1000000 / nb_thumbs) / 10000;
24  $('.thumbnails li').css('width', width+'%');
25}
26
27{/literal}{/footer_script}
28<ul class="thumbnails">
29{foreach from=$thumbnails item=thumbnail}{strip}
30{if isset($page_selection[$thumbnail.id])}
31        <li>
32          <a href="{$pwg->derivative_url($derivative_params_full, $thumbnail.src_image)}" rel="external">
33      <img src="{$pwg->derivative_url($derivative_params_thumb, $thumbnail.src_image)}" alt="{$thumbnail.TN_ALT}">
34    </a>
35  </li>
36{else}
37        <li style="display:none;">
38          <a href="{$pwg->derivative_url($derivative_params_full, $thumbnail.src_image)}" rel="external"></a>
39  </li>
40{/if}
41{/strip}{/foreach}
42</ul>
43{/if}
Note: See TracBrowser for help on using the repository browser.