1 | {combine_css path="plugins/Fotorama/fotorama/fotorama.css"} |
---|
2 | {combine_script id='fotorama' require='jquery' load='header' path='plugins/Fotorama/fotorama/fotorama.js'} |
---|
3 | |
---|
4 | {if $Fotorama.close_button} |
---|
5 | {combine_css path="plugins/Fotorama/template/close_button.css"} |
---|
6 | {/if} |
---|
7 | {if $Fotorama.info_button} |
---|
8 | {combine_css path="plugins/Fotorama/template/info_button.css"} |
---|
9 | {/if} |
---|
10 | |
---|
11 | <div class="fotorama" data-startindex="{$current_rank}" data-ratio="16/9" data-auto="false" |
---|
12 | data-width="100%" data-maxheight="100%" data-minheight="200" data-height="{$item_height}" |
---|
13 | data-shadows="{if $Fotorama.shadows}true{else}false{/if}" data-nav="{$Fotorama.nav}" data-fit="{$Fotorama.fit}" |
---|
14 | data-allowfullscreen="{$Fotorama.allowfullscreen}" data-autoplay="{if $Fotorama.autoplay}{$Fotorama.period}{else}false{/if}" |
---|
15 | data-transition="{$Fotorama.transition}" data-stopautoplayontouch="{if $Fotorama.stopautoplayontouch}true{else}false{/if}" |
---|
16 | data-loop="{if $Fotorama.loop}true{else}false{/if}" data-captions="false" data-thumbheight="{$Fotorama.thumbheight}" |
---|
17 | data-thumbwidth="{$Fotorama.thumbheight}"{if $Fotorama.clicktransition_crossfade} data-clicktransition="crossfade"{/if} |
---|
18 | data-keyboard="true"> |
---|
19 | </div> |
---|
20 | |
---|
21 | {if isset($U_SLIDESHOW_STOP)} |
---|
22 | <a href="{$U_SLIDESHOW_STOP}" class="fotorama__close-icon"></a> |
---|
23 | {/if} |
---|
24 | <a class="fotorama__info-icon"></a> |
---|
25 | |
---|
26 | {footer_script require='jquery'} |
---|
27 | window.blockFotoramaData = true; |
---|
28 | |
---|
29 | function update_picture(fotorama) { |
---|
30 | {if isset($replace_picture)} |
---|
31 | if (history.replaceState) |
---|
32 | history.replaceState(null, null, fotorama.activeFrame['url']); |
---|
33 | {else} |
---|
34 | if (history.replaceState) |
---|
35 | history.replaceState(null, null, fotorama.activeFrame['url']+(fotorama.activeFrame['url'].indexOf('?')==-1 ? '?' : '&')+'slideshow='); |
---|
36 | jQuery('#slideshow .browsePath a,a.fotorama__close-icon').attr('href', fotorama.activeFrame['url']); |
---|
37 | {/if} |
---|
38 | |
---|
39 | jQuery('a.fotorama__info-icon').attr('href', fotorama.activeFrame['url']+(fotorama.activeFrame['url'].indexOf('?')==-1 ? '?' : '&')+'slidestop='); |
---|
40 | |
---|
41 | jQuery('#slideshow .showtitle').text(fotorama.activeFrame['caption']); |
---|
42 | var idx = fotorama.activeIndex; |
---|
43 | {if isset($view_offset)} |
---|
44 | if (idx >= {$view_offset.from}) |
---|
45 | idx += {$view_offset.offset}; |
---|
46 | {/if} |
---|
47 | jQuery('#slideshow .imageNumber').text((idx+1)+'/{$TOTAL_ITEMS}'); |
---|
48 | document.title = fotorama.activeFrame['caption'] + ' | {$GALLERY_TITLE|escape:javascript}'; |
---|
49 | } |
---|
50 | |
---|
51 | var fullscreen = false; |
---|
52 | jQuery().ready(function() { |
---|
53 | jQuery('.fotorama') |
---|
54 | // Listen to the events |
---|
55 | .on('fotorama:showend', |
---|
56 | function (e, fotorama, extra) { |
---|
57 | if (!fullscreen) { |
---|
58 | update_picture(fotorama); |
---|
59 | } |
---|
60 | {if !empty($view_borders)} |
---|
61 | {if $view_borders[0] < $view_borders[1]} |
---|
62 | if (fotorama.activeIndex <= {$view_borders[0]}{if $Fotorama_has_thumbs}+5{/if} || |
---|
63 | fotorama.activeIndex >= {$view_borders[1]}{if $Fotorama_has_thumbs}-5{/if} ) |
---|
64 | {else} |
---|
65 | if (fotorama.activeIndex <= {$view_borders[0]}{if $Fotorama_has_thumbs}+5{/if} && |
---|
66 | fotorama.activeIndex >= {$view_borders[1]}{if $Fotorama_has_thumbs}-5{/if} ) |
---|
67 | {/if} |
---|
68 | { |
---|
69 | fotorama.stopAutoplay(); |
---|
70 | var url = fotorama.activeFrame.url + (fotorama.activeFrame.url.indexOf('?')==-1 ? '?' : '&')+'slideshow='; |
---|
71 | {if !$Fotorama.only_fullscreen} |
---|
72 | if (fullscreen) url += "&fullscreen"; |
---|
73 | {/if} |
---|
74 | window.location = url; |
---|
75 | } |
---|
76 | {/if} |
---|
77 | } |
---|
78 | ) |
---|
79 | .on('fotorama:fullscreenenter', |
---|
80 | function (e, fotorama, extra) { |
---|
81 | fotorama.setOptions({ |
---|
82 | nav: "{$Fotorama.fullscreen_nav}", |
---|
83 | {if $Fotorama.enable_caption} |
---|
84 | captions: "true", |
---|
85 | {/if} |
---|
86 | }); |
---|
87 | {if $Fotorama.autoplay} |
---|
88 | fotorama.startAutoplay(); |
---|
89 | {/if} |
---|
90 | |
---|
91 | if (jQuery('.fotorama').attr('data-allowfullscreen') == 'native') |
---|
92 | fullscreen = true; |
---|
93 | } |
---|
94 | ) |
---|
95 | .on('fotorama:fullscreenexit', |
---|
96 | function (e, fotorama, extra) { |
---|
97 | {if $Fotorama.only_fullscreen} |
---|
98 | {if isset($replace_picture)} |
---|
99 | window.location.replace('{$U_SLIDESHOW_STOP}'); |
---|
100 | {else} |
---|
101 | window.location.replace(fotorama.activeFrame['url']); |
---|
102 | {/if} |
---|
103 | {else} |
---|
104 | |
---|
105 | fotorama.setOptions({ |
---|
106 | nav: "{$Fotorama.nav}", |
---|
107 | {if $Fotorama.enable_caption} |
---|
108 | captions: "false", |
---|
109 | {/if} |
---|
110 | }); |
---|
111 | |
---|
112 | update_picture(fotorama); |
---|
113 | |
---|
114 | fullscreen = false; |
---|
115 | {/if} |
---|
116 | } |
---|
117 | ) |
---|
118 | // Initialize fotorama manually |
---|
119 | .fotorama({ |
---|
120 | data: [ |
---|
121 | {foreach from=$items item=thumbnail} |
---|
122 | { |
---|
123 | caption: "{$thumbnail.TITLE|escape:javascript}", |
---|
124 | full: "{str_replace('&', '&', $thumbnail.derivative_big->get_url())}", |
---|
125 | img: "{str_replace('&', '&', $thumbnail.derivative->get_url())}", |
---|
126 | {if $Fotorama_has_thumbs} |
---|
127 | thumb: "{$thumbnail.derivative_thumb->get_url()}", |
---|
128 | {assign var=thumb_size value=$thumbnail.derivative_thumb->get_size()} |
---|
129 | thumbratio: {$thumb_size[0]/$thumb_size[1]}, |
---|
130 | {/if} |
---|
131 | url: "{$thumbnail.url}" |
---|
132 | {if !empty($thumbnail.video)} |
---|
133 | ,video:"{$thumbnail.video}"{if !empty($thumbnail.video_id)},id:"{$thumbnail.video_id}"{/if} |
---|
134 | {/if} |
---|
135 | },{/foreach} |
---|
136 | ] |
---|
137 | }); |
---|
138 | |
---|
139 | {if $Fotorama.only_fullscreen} |
---|
140 | jQuery('.fotorama').data('fotorama').requestFullScreen(); |
---|
141 | {else} |
---|
142 | {if $Fotorama.resize} |
---|
143 | jQuery('.fotorama').data('fotorama').resize({ |
---|
144 | height: jQuery(window).height() |
---|
145 | }); |
---|
146 | jQuery('html,body').animate({ scrollTop: jQuery('.fotorama').offset().top }, 'slow'); |
---|
147 | {/if} |
---|
148 | {if isset($smarty.get.fullscreen)} |
---|
149 | jQuery('.fotorama').data('fotorama').requestFullScreen(); |
---|
150 | {/if} |
---|
151 | {/if} |
---|
152 | |
---|
153 | }); |
---|
154 | |
---|
155 | {if $Fotorama.close_button} |
---|
156 | jQuery('.fotorama').on('fotorama:ready', function (e, fotorama) { |
---|
157 | jQuery('.fotorama__close-icon').detach().insertAfter('.fotorama__fullscreen-icon'); |
---|
158 | }); |
---|
159 | {/if} |
---|
160 | {if $Fotorama.info_button} |
---|
161 | jQuery('.fotorama').on('fotorama:ready', function (e, fotorama) { |
---|
162 | jQuery('.fotorama__info-icon').detach().insertAfter('.fotorama__fullscreen-icon'); |
---|
163 | }); |
---|
164 | {/if} |
---|
165 | |
---|
166 | {if $Fotorama.autoplay} |
---|
167 | $(document).keypress(function(e) { |
---|
168 | if(e.which == 43) { |
---|
169 | jQuery('.fotorama').data('fotorama').setOptions({ |
---|
170 | autoplay: jQuery('.fotorama').data('fotorama').options['autoplay'] * 1.4 |
---|
171 | }); |
---|
172 | } |
---|
173 | if(e.which == 45) { |
---|
174 | jQuery('.fotorama').data('fotorama').setOptions({ |
---|
175 | autoplay: jQuery('.fotorama').data('fotorama').options['autoplay'] / 1.4 |
---|
176 | }); |
---|
177 | } |
---|
178 | }); |
---|
179 | {/if} |
---|
180 | {/footer_script} |
---|