summaryrefslogtreecommitdiffstats
path: root/themes/default/templates/photo_index.tpl
blob: 2dedf86d89e3fbb1c4c1f1bba9e4d822ccce64f7 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
<!-- Photo Index -->

<!-- Header - displays count of matched photos and some link's -->

<div class="header">
 <div class="subheader">
  <b>Photo Index</b>
  {if $searchfor }
   {if $count == 1}
    {$count} image is the result for your search about "{$searchfor}".
   {else}
    {$count} images are the result for your search about "{$searchfor}".
   {/if}
  {elseif $tag_result}
   {if $count == 1}
    {$count} image has been found for the selected tags.
   {else}
    {$count} images have been found for the selected tags.
   {/if}
  {else}
   {if $count == 1}
    {$count} image has been found.
   {else}
    {$count} images have been found.
   {/if}
  {/if}
  {if $from_date && $to_date }
   <br />
   Results are limited to a date within {$from_date} to {$to_date}.
  {/if}
 </div>
<div class="textright">
  {if $slideshow_link }
   <a href="{$slideshow_link}" title="Slideshow" target="_blank"><img src="{$web_path}/resources/slideshow.png" />&nbsp;Slideshow</a>
  {/if}
  {if $extern_link }
   <a href="{$extern_link}" title="Use this link to return to the current view"><img src="{$web_path}/resources/link.png" />&nbsp;External Link</a>
  {/if} 
  {if $export_link }
   <a href="{$export_link}" target="_blank" title="this will open a new browser window where you can export this page in several formats"><img src="{$web_path}/resources/export.png" />&nbsp;Export</a>
  {/if}
  {if $rss_link }
   <a href="{$rss_link}" target="_blank" title="RSS feed"><img src="{$web_path}/resources/rss.png" />&nbsp;RSS-Feed</a>
  {/if}
 </div>
</div>

<!-- if result of a tag-search is displayed, show the selected tags
     with some small pictures in a bar. -->

{ if $tag_result }
<div class="tagresult"></div>
<div class="subheader">
 <div class="tagresulttags">
 Tags:
 </div>
 { $selected_tags }
</div>
{ /if }

<!-- the photo matrix itself -->

<div id="index">

 {section name="thumb" loop=$thumbs step=1}

  {if $images[thumb] }

   <div class="thumb" onmouseover="setBackGrdColor(this, 'mouseover');" onmouseout="setBackGrdColor(this, 'mouseout');" style="width: { $thumb_container_width }px; height: { $thumb_container_height }px;">
    <a href="javascript:showImage({$images[thumb]}, 'scrollup');" id="thumblink{$images[thumb]}" name="image{$img_id[thumb]}" class="thumblink" onclick="click(this);" title="{$img_title[thumb]}">
     <img class="thumb" id="thumbimg{$images[thumb]}" width="{$img_width[thumb]}" height="{$img_height[thumb]}" />
     <br />
    {$img_name[thumb]}
    </a>
    { if $use_lightbox }
    <a href="{$web_path}/phpfspot_img.php?idx={$images[thumb]}&amp;width={$preview_width}" alt="thumb_{$images[thumb]}" rel="lightbox[photoidx]" title="Preview of {$img_fullname[thumb]}"><img src="{$web_path}/resources/eyes.png" /></a>
    { /if }
   </div>

  {/if}

 {/section} 

</div>
<br class="clearboth" />
<div class="indexnavigation">

 <!-- the right nav arrow -->
 <div class="indexnavigationright">
 { if $next_url == "" }
  { if $count != 0 }
   <img src="{$web_path}/resources/arrow_right_gray.png" alt="last page reached" />
  { /if }
 { else }
  <a href="{$next_url}" id="next_link" title="click for the next page (right cursor)">
   <img src="{$web_path}/resources/arrow_right.png" alt="next photo" />
  </a>
 { /if}
 </div>

 <!-- the left nav arrow -->
 <div class="indexnavigationleft">
 { if $previous_url == "" }
  { if $count != 0 }
   <img src="{$web_path}/resources/arrow_left_gray.png" alt="first page reached" />
  { /if }
 { else }
  <a href="{$previous_url}" id="prev_link" title="click for the previous page (left cursor)">
  <img src="{$web_path}/resources/arrow_left.png" alt="previous photo" />
  </a>
 { /if }
 </div>

 <!-- the middle page selector -->
 <div class="indexnavigationcenter">
 { if $page_selector != "" }
  {$page_selector}
 { /if}
 </div>
</div>
<br class="clearboth" />
<script type="text/javascript" language="JavaScript">
<!--
   /*** image preloading ***/
   { counter start=-1 }

   var current;
   var image_urls = new Array();
   var last_thumb;

   {section name="thumb" loop=$thumbs step=1}
      {if $images[thumb] }
         image_urls[{counter}] = '{$web_path}/phpfspot_img.php?idx={$images[thumb]}&width={$width}';
         last_thumb = {$images[thumb]};
      {/if}
   {/section}

   preloadPhotos(image_urls);

   // auto-scroll
   //
   // if browser is to far down the page, that he can't see the photo at all
   // scroll it up so that at least the last photo becomes visisble.
   { literal }

   var ywnd = 0;
   var yimg = 0;
   // check where we are with the browser
   if (window.pageYOffset) {
      ywnd = window.pageYOffset;
   } else if (document.body && document.body.scrollTop) {
      ywnd = document.body.scrollTop;
   }
   // check the y-pos of the last thumbnail
   if(thumbimg = document.getElementById('thumbimg' + last_thumb)) {
      yimg = findPos(thumbimg,'top');
   }
   // if the browser-window is scrolled further then the last_thumb, scroll back
   if(ywnd > yimg) {
      window.scrollTo(0, yimg-100);
   }

   { /literal }
   // auto-scroll

-->
</script>
<!-- /Photo Index -->