source: extensions/greydragon/template/picture.tpl @ 30210

Revision 30210, 16.8 KB checked in by SergeD, 5 years ago (diff)

version 1.0.13
+ New colorpack - GreyDragon
+ ADMIN: Added support for horizontal menu - "Static Menu - Header Bottom". When used with Additional Pages Plugin, pages except Root Page would be embeded

into menu bar instead of drop down menu.

+ ADMIN: Added option "Display navigation arrows" for Root page
+ ADMIN: Added option "Display navigation controls" for Root page
+ Added support for thumb shadow space - custom CSS is required (please refer to help section in admin area). Latest gdThumb is recomended.
+ CSS: cleanup

  • Removed hardcoded height for root page slideshow to accomodate navigation controls
  • Fixed issues with Categories List overlapping when Static menu is enabled
  • In Phote page, hide overflow photo when huge size is used
Line 
1{combine_script id='core.switchbox' load='async' require='jquery' path='themes/default/js/switchbox.js'}
2{combine_script id='picture-js' load='async' require='jquery' path='themes/greydragon/js/theme.photo.js'}
3
4{if isset($MENUBAR)}{$MENUBAR}{/if}
5<div id="content"{if isset($MENUBAR)} class="contentWithMenu"{/if}>
6
7{if isset($errors) or not empty($infos)}
8{include file='infos_errors.tpl'}
9{/if}
10
11{if !empty($PLUGIN_PICTURE_BEFORE)}{$PLUGIN_PICTURE_BEFORE}{/if}
12
13<div id="imageHeaderBar">
14  <div class="browsePath">
15    {$SECTION_TITLE}<span class="browsePathSeparator">{$LEVEL_SEPARATOR}</span><h2>{$current.TITLE}</h2>
16  </div>
17</div>
18
19<div id="imageToolBar">
20<div class="imageNumber">{$PHOTO}</div>
21{include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'}
22
23<div class="actionButtons">
24{if isset($current.unique_derivatives) && count($current.unique_derivatives)>1}
25{footer_script require='jquery'}{literal}
26function changeImgSrc(url,typeSave,typeMap) {
27  var theImg = document.getElementById("theMainImage");
28  if (theImg)
29  {
30    theImg.removeAttribute("width");theImg.removeAttribute("height");
31    theImg.src = url;
32    theImg.useMap = "#map"+typeMap;
33  }
34  jQuery('#derivativeSwitchBox .switchCheck').css('visibility','hidden');
35  jQuery('#derivativeChecked'+typeMap).css('visibility','visible');
36  document.cookie = 'picture_deriv='+typeSave+';path={/literal}{$COOKIE_PATH}{literal}';
37}
38(SwitchBox=window.SwitchBox||[]).push("#derivativeSwitchLink", "#derivativeSwitchBox");
39{/literal}{/footer_script}
40
41{strip}<a id="derivativeSwitchLink" title="{'Photo sizes'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
42  <span class="pwg-icon pwg-icon-sizes"></span><span class="pwg-button-text">{'Photo sizes'|@translate}</span>
43</a>
44<div id="derivativeSwitchBox" class="switchBox">
45  <div class="switchBoxTitle">{'Photo sizes'|@translate}</div>
46  {foreach from=$current.unique_derivatives item=derivative key=derivative_type}
47  <span class="switchCheck" id="derivativeChecked{$derivative->get_type()}"{if $derivative->get_type() ne $current.selected_derivative->get_type()} style="visibility:hidden"{/if}>&#x2714; </span>
48  <a href="javascript:changeImgSrc('{$derivative->get_url()|@escape:javascript}','{$derivative_type}','{$derivative->get_type()}')">
49    {$derivative->get_type()|@translate}<span class="derivativeSizeDetails"> ({$derivative->get_size_hr()})</span>
50  </a><br>
51  {/foreach}
52  {if isset($U_ORIGINAL)}
53    {combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'}
54  <a href="javascript:phpWGOpenWindow('{$U_ORIGINAL}','xxx','scrollbars=yes,toolbar=no,status=no,resizable=yes')" rel="nofollow">{'Original'|@translate}</a>
55  {/if}
56</div>
57{/strip}
58{/if}
59{strip}{if isset($U_SLIDESHOW_START)}
60  <a href="{$U_SLIDESHOW_START}" title="{'slideshow'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
61    <span class="pwg-icon pwg-icon-slideshow"></span><span class="pwg-button-text">{'slideshow'|@translate}</span>
62  </a>
63{/if}{/strip}
64{strip}{if isset($U_METADATA)}
65  <a href="{$U_METADATA}" title="{'Show file metadata'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
66    <span class="pwg-icon pwg-icon-camera-info"></span><span class="pwg-button-text">{'Show file metadata'|@translate}</span>
67  </a>
68{/if}{/strip}
69{strip}{if isset($current.U_DOWNLOAD)}
70  <a href="{$current.U_DOWNLOAD}" title="{'Download this file'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
71    <span class="pwg-icon pwg-icon-save"></span><span class="pwg-button-text">{'Download'|@translate}</span>
72  </a>
73{/if}{/strip}
74{if isset($PLUGIN_PICTURE_BUTTONS)}{foreach from=$PLUGIN_PICTURE_BUTTONS item=button}{$button}{/foreach}{/if}
75{if isset($PLUGIN_PICTURE_ACTIONS)}{$PLUGIN_PICTURE_ACTIONS}{/if}
76{strip}{if isset($favorite)}
77  <a href="{$favorite.U_FAVORITE}" title="{if $favorite.IS_FAVORITE}{'delete this photo from your favorites'|@translate}{else}{'add this photo to your favorites'|@translate}{/if}" class="pwg-state-default pwg-button" rel="nofollow">
78    <span class="pwg-icon pwg-icon-favorite-{if $favorite.IS_FAVORITE}del{else}add{/if}"></span><span class="pwg-button-text">{'Favorites'|@translate}</span>
79  </a>
80{/if}{/strip}
81{strip}{if isset($U_SET_AS_REPRESENTATIVE)}
82  <a id="cmdSetRepresentative" href="{$U_SET_AS_REPRESENTATIVE}" title="{'set as album representative'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
83    <span class="pwg-icon pwg-icon-representative"></span><span class="pwg-button-text">{'representative'|@translate}</span>
84  </a>
85{/if}{/strip}
86{strip}{if isset($U_PHOTO_ADMIN)}
87  <a id="cmdEditPhoto" href="{$U_PHOTO_ADMIN}" title="{'Modify information'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
88    <span class="pwg-icon pwg-icon-edit"></span><span class="pwg-button-text">{'Edit'|@translate}</span>
89  </a>
90{/if}{/strip}
91{strip}{if isset($U_CADDIE)}{*caddie management BEGIN*}
92{footer_script}
93{literal}function addToCadie(aElement, rootUrl, id)
94{
95if (aElement.disabled) return;
96aElement.disabled=true;
97var y = new PwgWS(rootUrl);
98y.callService(
99  "pwg.caddie.add", {image_id: id} ,
100  {
101    onFailure: function(num, text) { alert(num + " " + text); document.location=aElement.href; },
102    onSuccess: function(result) { aElement.disabled = false; }
103  }
104  );
105}{/literal}
106{/footer_script}
107  <a href="{$U_CADDIE}" onclick="addToCadie(this, '{$ROOT_URL}', {$current.id}); return false;" title="{'Add to caddie'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
108    <span class="pwg-icon pwg-icon-caddie-add"> </span><span class="pwg-button-text">{'Caddie'|@translate}</span>
109  </a>
110{/if}{/strip}{*caddie management END*}
111</div>
112</div>{*<!-- imageToolBar -->*}
113
114<div id="theImageAndInfos">
115<div id="theImage">
116{$ELEMENT_CONTENT}
117
118{if isset($U_SLIDESHOW_STOP)}
119<p>
120  [ <a href="{$U_SLIDESHOW_STOP}">{'stop the slideshow'|@translate}</a> ]
121</p>
122{/if}
123
124</div>
125{* {if $DISPLAY_NAV_THUMB}
126<div id="imageInfos">
127  <div class="navThumbs">
128    {if isset($previous)}
129      <a class="navThumb" id="linkPrev" href="{$previous.U_IMG}" title="{'Previous'|@translate} : {$previous.TITLE_ESC}" rel="prev">
130        <span class="thumbHover prevThumbHover"></span>
131        <img src="{$previous.derivatives.square->get_url()}" alt="{$previous.TITLE_ESC}">
132      </a>
133    {elseif isset($U_UP)}
134      <a class="navThumb" id="linkPrev" href="{$U_UP}" title="{'Thumbnails'|@translate}">
135        <div class="thumbHover">{'First Page'|@translate}<br><br>{'Go back to the album'|@translate}</div>
136      </a>
137    {/if}
138    {if isset($next)}
139      <a class="navThumb" id="linkNext" href="{$next.U_IMG}" title="{'Next'|@translate} : {$next.TITLE_ESC}" rel="next">
140        <span class="thumbHover nextThumbHover"></span>
141        <img src="{$next.derivatives.square->get_url()}" alt="{$next.TITLE_ESC}">
142      </a>
143    {elseif isset($U_UP)}
144      <a class="navThumb" id="linkNext"  href="{$U_UP}"  title="{'Thumbnails'|@translate}">
145        <div class="thumbHover">{'Last Page'|@translate}<br><br>{'Go back to the album'|@translate}</div>
146      </a>
147    {/if}
148  </div>
149</div>
150{/if} *}
151</div>
152{assign var=def_tab value="{$greydragon.p_pict_tab_default}"}
153{if !isset($metadata) && $def_tab == 'exif'}{$def_tab="desc"}{/if}
154{if !isset($COMMENT_COUNT) && $def_tab == 'comments'}{$def_tab="desc"}{/if}
155{if !isset($COMMENT_IMG) && $def_tab == 'desc'}{$def_tab="info"}{/if}
156{if $def_tab !== "hide"}
157<ul class="image-metadata"> 
158  {if isset($COMMENT_IMG)}<li {if $def_tab == 'desc'}class="active"{/if} rel="tab-desc">{'Description'|@translate}</li>{/if}
159  <li {if $def_tab == 'info'}class="active"{/if} rel="tab-meta">{'Info'|@translate}</li>
160  {if isset($metadata)}<li {if $def_tab == 'exif'}class="active"{/if} rel="tab-exif">{'Exif'|@translate}</li>{/if}
161  <li {if $def_tab == 'tags'}class="active"{/if} rel="tab-tags">{'Tags'|@translate}</li>
162  {if isset($COMMENT_COUNT)}<li {if $def_tab == 'comments'}class="active"{/if} rel="tab-comment">{$COMMENT_COUNT|@translate_dec:'%d comment':'%d comments'}</li>{/if}
163</ul>
164
165<div class="image-metadata-tabs"> 
166  {if isset($COMMENT_IMG)}
167  <div id="tab-desc" class="image-metadata-tab">
168    {$COMMENT_IMG}
169  </div>
170  {/if}
171
172  <div id="tab-meta" class="image-metadata-tab">
173    <dl id="standard" class="imageInfoTable">
174    {strip}
175      {if $display_info.author and isset($INFO_AUTHOR)}
176      <div id="Author" class="imageInfo">
177        <dt>{'Author'|@translate}</dt>
178        <dd>{$INFO_AUTHOR}</dd>
179      </div>
180      {/if}
181      {if $display_info.created_on and isset($INFO_CREATION_DATE)}
182      <div id="datecreate" class="imageInfo">
183        <dt>{'Created on'|@translate}</dt>
184        <dd>{$INFO_CREATION_DATE}</dd>
185      </div>
186      {/if}
187      {if $display_info.posted_on}
188      <div id="datepost" class="imageInfo">
189        <dt>{'Posted on'|@translate}</dt>
190        <dd>{$INFO_POSTED_DATE}</dd>
191      </div>
192      {/if}
193      {if $display_info.dimensions and isset($INFO_DIMENSIONS)}
194      <div id="Dimensions" class="imageInfo">
195        <dt>{'Dimensions'|@translate}</dt>
196        <dd>{$INFO_DIMENSIONS}</dd>
197      </div>
198      {/if}
199      {if $display_info.file}
200      <div id="File" class="imageInfo">
201        <dt>{'File'|@translate}</dt>
202        <dd>{$INFO_FILE}</dd>
203      </div>
204      {/if}
205      {if $display_info.filesize and isset($INFO_FILESIZE)}
206      <div id="Filesize" class="imageInfo">
207        <dt>{'Filesize'|@translate}</dt>
208        <dd>{$INFO_FILESIZE}</dd>
209      </div>
210      {/if}
211      {if $display_info.categories and isset($related_categories)}
212      <div id="Categories" class="imageInfo">
213        <dt>{'Albums'|@translate}</dt>
214        <dd>
215          <ul>
216            {foreach from=$related_categories item=cat}
217            <li>{$cat}</li>
218            {/foreach}
219          </ul>
220        </dd>
221      </div>
222      {/if}
223      {if $display_info.visits}
224      <div id="Visits" class="imageInfo">
225        <dt>{'Visits'|@translate}</dt>
226        <dd>{$INFO_VISITS}</dd>
227      </div>
228      {/if}
229
230      {if $display_info.rating_score and isset($rate_summary)}
231      <div id="Average" class="imageInfo">
232        <dt>{'Rating score'|@translate}</dt>
233        <dd>
234          {if $rate_summary.count}
235          <span id="ratingScore">{$rate_summary.score}</span> <span id="ratingCount">({$rate_summary.count|@translate_dec:'%d rate':'%d rates'})</span>
236          {else}
237          <span id="ratingScore">{'no rate'|@translate}</span> <span id="ratingCount"></span>
238          {/if}
239        </dd>
240      </div>
241      {/if}
242
243      {if isset($rating)}
244      <div id="rating" class="imageInfo">
245        <dt>
246          <span id="updateRate">{if isset($rating.USER_RATE)}{'Update your rating'|@translate}{else}{'Rate this photo'|@translate}{/if}</span>
247        </dt>
248        <dd>
249          <form action="{$rating.F_ACTION}" method="post" id="rateForm" style="margin:0;">
250          <div>
251            {foreach from=$rating.marks item=mark name=rate_loop}
252              {if isset($rating.USER_RATE) && $mark==$rating.USER_RATE}
253              <input type="button" name="rate" value="{$mark}" class="rateButtonSelected" title="{$mark}">
254              {else}
255              <input type="submit" name="rate" value="{$mark}" class="rateButton" title="{$mark}">
256              {/if}
257            {/foreach}
258            {strip}{combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'}
259            {combine_script id='rating' load='async' require='core.scripts' path='themes/default/js/rating.js'}
260            {footer_script}
261              var _pwgRatingAutoQueue = _pwgRatingAutoQueue||[];
262              _pwgRatingAutoQueue.push( {ldelim}rootUrl: '{$ROOT_URL}', image_id: {$current.id},
263                onSuccess : function(rating) {ldelim}
264                  var e = document.getElementById("updateRate");
265                  if (e) e.innerHTML = "{'Update your rating'|@translate|@escape:'javascript'}";
266                  e = document.getElementById("ratingScore");
267                  if (e) e.innerHTML = rating.score;
268                  e = document.getElementById("ratingCount");
269                  if (e) {ldelim}
270                    if (rating.count == 1) {ldelim}
271                      e.innerHTML = "({'%d rate'|@translate|@escape:'javascript'})".replace( "%d", rating.count);
272                    } else {ldelim}
273                      e.innerHTML = "({'%d rates'|@translate|@escape:'javascript'})".replace( "%d", rating.count);
274                    }
275                  {rdelim}
276              {rdelim}{rdelim} );
277            {/footer_script}
278            {/strip}
279          </div>
280          </form>
281        </dd>
282      </div>
283      {/if}
284
285      {if $display_info.privacy_level and isset($available_permission_levels)}
286      <div id="Privacy" class="imageInfo">
287        <dt>{'Who can see this photo?'|@translate}</dt>
288        <dd>
289          <div>
290            <a id="privacyLevelLink" href>{$available_permission_levels[$current.level]}</a>
291          </div>
292{combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'}
293{footer_script require='jquery'}{strip}
294  function setPrivacyLevel(id, level){
295    (new PwgWS('{$ROOT_URL}')).callService(
296      "pwg.images.setPrivacyLevel", { image_id:id, level:level},
297        {
298          method: "POST",
299          onFailure: function(num, text) { alert(num + " " + text); },
300          onSuccess: function(result) {
301          jQuery('#privacyLevelBox .switchCheck').css('visibility','hidden');
302          jQuery('#switchLevel'+level).prev('.switchCheck').css('visibility','visible');
303          jQuery('#privacyLevelLink').text(jQuery('#switchLevel'+level).text());
304        }
305      }
306    );
307  }
308  (SwitchBox=window.SwitchBox||[]).push("#privacyLevelLink", "#privacyLevelBox");
309{/strip}{/footer_script}
310          <div id="privacyLevelBox" class="switchBox" style="display:none">
311            {foreach from=$available_permission_levels item=label key=level}
312            <span class="switchCheck"{if $level != $current.level} style="visibility:hidden"{/if}>&#x2714; </span>
313            <a id="switchLevel{$level}" href="javascript:setPrivacyLevel({$current.id},{$level})">{$label}</a><br>
314            {/foreach}
315          </div>
316        </dd>
317      </div>
318      {/if}
319      {/strip}
320    </dl>
321  </div>
322
323  {if isset($metadata)}
324  <div id="tab-exif" class="image-metadata-tab">
325    <dl id="Metadata" class="imageInfoTable">
326    {foreach from=$metadata item=meta}
327      {foreach from=$meta.lines item=value key=label}
328      <div class="imageInfo">
329        <dt>{$label}</dt>
330        <dd>{$value}</dd>
331      </div>
332      {/foreach}
333    {/foreach}
334    </dl>
335  </div>
336  {/if}
337
338  <div id="tab-tags" class="image-metadata-tab">
339    {if $display_info.tags and isset($related_tags)}
340    <div>
341      <dd>
342      {foreach from=$related_tags item=tag name=tag_loop}{if !$smarty.foreach.tag_loop.first}, {/if}<a href="{$tag.URL}">{$tag.name}</a>{/foreach}
343      </dd>
344    </div>
345    {/if}
346  </div>
347
348  {if isset($COMMENT_COUNT)}
349  <div id="tab-comment" class="image-metadata-tab">
350    <div id="comments" {if (!isset($comment_add) && ($COMMENT_COUNT == 0))}class="noCommentContent"{else}class="commentContent"{/if}>
351      <div id="pictureComments">
352        {if isset($comment_add)}
353        <div id="commentAdd">
354          <h4>{'Add a comment'|@translate}</h4>
355          <form method="post" action="{$comment_add.F_ACTION}" id="addComment">
356            {if $comment_add.SHOW_AUTHOR}
357            <p><label for="author">{'Author'|@translate}{if $comment_add.AUTHOR_MANDATORY} ({'mandatory'|@translate}){/if} :</label></p>
358            <p><input type="text" name="author" id="author" value="{$comment_add.AUTHOR}"></p>
359            {/if}
360            {if $comment_add.SHOW_EMAIL}
361            <p><label for="email">{'Email address'|@translate}{if $comment_add.EMAIL_MANDATORY} ({'mandatory'|@translate}){/if} :</label></p>
362            <p><input type="text" name="email" id="email" value="{$comment_add.EMAIL}"></p>
363            {/if}
364            <p><label for="website_url">{'Website'|@translate} :</label></p>
365            <p><input type="text" name="website_url" id="website_url" value="{$comment_add.WEBSITE_URL}"></p>
366            <p><label for="contentid">{'Comment'|@translate} ({'mandatory'|@translate}) :</label></p>
367            <p><textarea name="content" id="contentid" rows="5" cols="50">{$comment_add.CONTENT}</textarea></p>
368            <p><input type="hidden" name="key" value="{$comment_add.KEY}">
369            <input type="submit" value="{'Submit'|@translate}"></p>
370          </form>
371        </div>
372        {/if}
373        {if isset($comments)}
374        <div id="pictureCommentList">
375          {if (($COMMENT_COUNT > 2) || !empty($navbar))}
376          <div id="pictureCommentNavBar">
377            {if $COMMENT_COUNT > 2}
378            <a href="{$COMMENTS_ORDER_URL}#comments" rel="nofollow" class="commentsOrder">{$COMMENTS_ORDER_TITLE}</a>
379            {/if}
380            {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if}
381          </div>
382          {/if}
383          {include file='comment_list.tpl'}
384        </div>
385        {/if}
386      </div>
387    </div>
388  </div>
389  {/if}
390</div>
391{/if}
392{if !empty($PLUGIN_PICTURE_AFTER)}{$PLUGIN_PICTURE_AFTER}{/if}
Note: See TracBrowser for help on using the repository browser.