summaryrefslogtreecommitdiffstats
path: root/themes/default/templates/photo_index.tpl
blob: 82f49596576234d13ee386c1914415c3f7261eed (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
<!-- Photo Index -->
<div class="header">
 <div style="float: left;">
  <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 style="text-align: right">
  {if $slideshow_link }
   <a href="{$slideshow_link}" title="Slideshow" target="_blank"><img src="resources/slideshow.png" /></a>
  {/if}
  {if $extern_link }
   <a href="{$extern_link}" title="Use this link to return to the current view"><img src="resources/link.png" /></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="resources/export.png" /></a>
  {/if}
  {if $rss_link }
   <a href="{$rss_link}" target="_blank" title="RSS feed"><img src="resources/rss.png" /></a>
  {/if}
 </div>
</div>

<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="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="resources/eyes.png" /></a>
    { /if }
   </div>

  {/if}

 {/section} 

</div>
<br class="clearboth" />
<div style="width: 100%; margin-top: 20px;">

 <!-- the right nav arrow -->
 <div style="float: right; width: 40px; margin-right: 0px; padding-right: 10px;">
 { if $next_url == "" }
  { if $count != 0 }
   <img src="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="resources/arrow_right.png" alt="next photo" />
  </a>
 { /if}
 </div>

 <!-- the left nav arrow -->
 <div style="float: left; margin: 0px; padding-left: 10px; width: 40px;">
 { if $previous_url == "" }
  { if $count != 0 }
   <img src="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="resources/arrow_left.png" alt="previous photo" />
  </a>
 { /if }
 </div>

 <!-- the middle page selector -->
 <div style="text-align: center;">
 { 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}] = '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 -->