summaryrefslogtreecommitdiffstats
path: root/themes
diff options
context:
space:
mode:
Diffstat (limited to 'themes')
-rw-r--r--themes/arun/stylesheet.css342
-rw-r--r--themes/arun/templates/calendar.tpl28
-rw-r--r--themes/arun/templates/credits.tpl20
-rw-r--r--themes/arun/templates/export.tpl14
-rw-r--r--themes/arun/templates/footer.tpl2
-rw-r--r--themes/arun/templates/header.tpl21
-rw-r--r--themes/arun/templates/index.tpl46
-rw-r--r--themes/arun/templates/photo_index.tpl179
-rw-r--r--themes/arun/templates/search.tpl72
-rw-r--r--themes/arun/templates/single_photo.tpl135
-rw-r--r--themes/arun/templates/slideshow.tpl28
-rw-r--r--themes/arun/templates/tags.tpl15
-rw-r--r--themes/arun/templates/welcome.tpl32
13 files changed, 934 insertions, 0 deletions
diff --git a/themes/arun/stylesheet.css b/themes/arun/stylesheet.css
new file mode 100644
index 0000000..14b52b9
--- /dev/null
+++ b/themes/arun/stylesheet.css
@@ -0,0 +1,342 @@
+body {
+ color: #000;
+ font-family: sans-serif;
+ font-style: normal;
+ margin: 0px;
+ padding: 0px;
+}
+
+body.slideshow {
+ color: #000;
+ font-family: sans-serif;
+ font-style: normal;
+ border: none;
+ padding: 10px;
+ text-align: center;
+}
+
+table, tr, td {
+ border-collapse: collapse;
+ padding: 0px;
+ empty-cells: show;
+ vertical-align: top;
+}
+
+/* left column containg search and tag-selection */
+.options {
+ position: absolute;
+ left: 0px;
+ top: 40px;
+ width: 265px;
+ max-width: 265px;
+ min-width: 265px;
+ padding-top: 8px;
+ padding-bottom: 10px;
+ padding-left: 5px;
+ padding-right: 10px;
+ border-right: solid 1px #000000;
+}
+
+/* main cell containing photo content */
+.content {
+ margin-top: 40px;
+ margin-left: 280px;
+ margin-right: 0px;
+ padding: 0px;
+}
+
+div.searchfor {
+ padding-top: 10px;
+ padding-right: 10px;
+ padding-bottom: 10px;
+ line-height: 21px;
+ font-size: 12px;
+ vertical-align: middle;
+ border-bottom: solid 1px #000000;
+}
+
+div.searchfor td.nowrap {
+ white-space: nowrap;
+}
+
+.menu {
+ position: absolute;
+ left: 0px;
+ top: 0px;
+ height: 30px;
+ width: 100%;
+ margin: 0px;
+ padding: 5px 0px;
+ border-bottom: solid 1px #000000;
+}
+
+.icons {
+ float: left;
+}
+
+/* logo 'text' */
+.logo {
+ background-color: #fff;
+ font-size: larger;
+ font-size: larger;
+ font-weight: bolder;
+ text-align: center;
+}
+
+div.header {
+ background-color: #fff;
+ padding: 10px;
+ vertical-align: middle;
+ white-space: nowrap;
+ text-align: left;
+ height: 2em;
+}
+
+div.header_title {
+ white-space: nowrap;
+ text-align: left;
+ float: left;
+}
+
+div.header_menu {
+ text-align: right;
+}
+
+div.tagresult{
+ height: 1px;
+ background-color: #ffffff;
+}
+
+div.tagresulttags{
+ padding: 5px 0px 5px 10px;
+ background-color: #eeeeec;
+ vertical-align: middle;
+}
+
+div.tagresulttag{
+ padding: 0 0 0 5px;
+ background-color: #eeeeec;
+ display: inline;
+}
+
+div.photo{
+ text-align: left;
+ margin-top: 20px;
+ margin-left: 20px;
+}
+
+div.photonavigation{
+ margin-left: 20px;
+}
+
+div.indexnavigation{
+ width: 100%;
+ margin-top: 20px;
+}
+
+div.indexnavigationright{
+ float: right;
+ width: 40px;
+ margin-right: 0px;
+ padding-right: 10px;
+}
+
+div.indexnavigationleft{
+ float: left;
+ margin: 0px;
+ padding-left: 10px;
+ width: 40px;
+}
+
+div.indexnavigationcenter{
+ text-align: center;
+}
+
+div.welcome {
+ padding: 10px;
+ margin-left: 10px;
+ margin-right: 10px;
+}
+
+div.welcome span {
+ float: left;
+ padding-right: 10px;
+ width: 150px;
+ text-align: center;
+}
+
+img {
+ border: none;
+}
+
+a {
+ font-size: 14px;
+ color: #e9b96e;
+ text-decoration: none;
+}
+
+a:hover {
+ color: #729fcf;
+}
+
+a.tag {
+ color: #000000;
+ text-decoration: underline;
+}
+
+a.tag:hover {
+ color: #729fcf;
+}
+
+a.smalltag {
+ font-size: 12px;
+ color: #000000;
+ text-decoration: underline;
+ font-style: italic;
+}
+
+a.smalltag:hover {
+ color: #729fcf;
+}
+
+div.thumb {
+ text-align: center;
+ vertical-align: top;
+ -moz-border-radius: 3px;
+ border-radius: 3px;
+ margin: 10px 0px 0px 10px;
+ background-color: #eeeeec;
+ padding: 10px;
+ float: left;
+}
+div.thumb:hover {
+ background-color: #729fcf;
+}
+
+div.thumb img.thumb {
+ border: 0px;
+ padding: 0px;
+ margin: 0px;
+}
+
+div.thumb a.thumblink {
+ font-size: 12px;
+ border: 0px;
+}
+
+div.thumb a.thumblink:hover {
+ color: #eeeeec;
+}
+
+.cb {
+ clear: both;
+}
+
+#photo_details {
+ width: 150px;
+ font-size: 12px;
+ padding: 10px;
+ -moz-border-radius: 1em;
+ border-radius: 1em;
+ z-index: 100;
+ float: right;
+ margin-top: 20px;
+ margin-right: 20px;
+}
+
+#HTML_AJAX_LOADING {
+ position: fixed;
+ z-index: 1000;
+ top: 10px;
+ right: 10px;
+ background-color: #e9b96e;
+ padding: 10px;
+ -moz-border-radius: 1em;
+ border-radius: 1em;
+}
+
+#available_tags,#selected_tags {
+ clip: auto;
+ overflow: auto;
+ border-bottom: solid 1px #000000;
+ padding-top: 10px;
+ padding-bottom: 10px;
+ padding-right: 10px;
+ line-height: 21px;
+}
+
+span.tags {
+ vertical-align: middle;
+ text-decoration: underline;
+}
+
+div.credits{
+ margin-top: 10px;
+ margin-left: 10px;
+}
+
+/*
+ * calendar layer
+ */
+
+a.calendar {
+ font-size: 14px;
+}
+
+table.calendar tr td {
+ border: solid 1px #00aa00;
+ padding: 1px;
+ text-align: center;
+ font-size: 14px;
+}
+
+.prevMonth {
+ font-size: 14px;
+ text-align: left;
+}
+.nextMonth {
+ font-size: 14px;
+ text-align: right;
+}
+
+#calendar {
+ position: absolute;
+ background-color: #ffffff;
+ visibility: hidden;
+ z-index: 1000;
+ border: solid 3px #aaaaaa;
+}
+
+#slide_navigation {
+ text-align: center;
+ padding: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+ vertical-align: middle;
+}
+
+#slide_close {
+ margin: 0 auto;
+ padding: 10px;
+}
+
+#slide_close img {
+ padding: 15px;
+ background-color: #000000;
+}
+
+input.submit,input.checkbox {
+ background-color: transparent;
+ border: 0px;
+}
+
+input, select, textarea {
+ background-color: #eeeeee;
+ color: #333333;
+ border: 1px solid #888888;
+ border-collapse: collapse;
+}
+
+#slider-1{
+ margin: 0 auto;
+}
diff --git a/themes/arun/templates/calendar.tpl b/themes/arun/templates/calendar.tpl
new file mode 100644
index 0000000..8c1d27e
--- /dev/null
+++ b/themes/arun/templates/calendar.tpl
@@ -0,0 +1,28 @@
+<table class="calendar">
+ <tr>
+ <td><a href="{$prev_month}" class="prevMonth">&lt;&lt;</a></td>
+ <td colspan="5">
+ {$current_month}
+ </td>
+ <td><a href="{$next_month}" class="nextMonth">&gt;&gt;</a></td>
+ </tr>
+ <tr>
+ <td>M</td>
+ <td>T</td>
+ <td>W</td>
+ <td>T</td>
+ <td>F</td>
+ <td>S</td>
+ <td>S</td>
+ </tr>
+ <!-- matrix -->
+ {section name="row" loop=$rows step=1}
+ {section name="col" loop=8 step=1}
+ {if isset($matrix[row][col]) }
+ {$matrix[row][col]}
+ {/if}
+ {/section}
+ {/section}
+ <!-- /matrix -->
+</table>
+
diff --git a/themes/arun/templates/credits.tpl b/themes/arun/templates/credits.tpl
new file mode 100644
index 0000000..2bc7b28
--- /dev/null
+++ b/themes/arun/templates/credits.tpl
@@ -0,0 +1,20 @@
+<div class="header">
+ <b>{$product} {$version}</b><br />
+</div>
+<div class="credits">
+ by Andreas Unterkircher<br />
+ Licensed under GPLv3, <a href="http://oss.netshadow.at/oss/phpfspot/Project" target="_blank">phpfspot</a>
+ <hr />
+ Some extensions:<br /><br />
+ <a href="http://wiki.bluga.net/HTML_AJAX/HomePage">HTML_AJAX</a> - AJAX communication with the server
+ <br />
+ <a href="http://prism-perfect.net/archive/php-tag-cloud-tutorial/">Jenny Ferenc</a> - PHP tag-cloud code
+ <br />
+ <a href="http://www.silvestre.com.ar/">Silvestre Herrera's</a> - the most icons are from the Nuovo icon kit.
+ <br />
+ <a href="http://www.huddletogether.com/projects/lightbox2/">Lightbox2</a> - photo preview
+ <br />
+ <a href="http://www.brandspankingnew.net/archive/2007/02/ajax_auto_suggest_v2.html">Ajax Auto Suggest</a> - Auto-Completion
+ <hr />
+ F-Spot database version: {$db_version}
+</div>
diff --git a/themes/arun/templates/export.tpl b/themes/arun/templates/export.tpl
new file mode 100644
index 0000000..d7443de
--- /dev/null
+++ b/themes/arun/templates/export.tpl
@@ -0,0 +1,14 @@
+{include file="header.tpl"}
+ <body>
+ <div id="frame">
+ <form action="javascript:#" onsubmit="setViewMode('{$web_path}', document.getElementsByName('format')[0].options[document.getElementsByName('format')[0].selectedIndex].value); return false;">
+ <select name="format">
+ <option value="HTML">HTML</option>
+ <option value="MoinMoin">MoinMoin Wiki</option>
+ <option value="MoinMoinList">MoinMoin Wiki List</option>
+ </select>
+ <input type="image" src="{$web_path}/resources/doit.png" alt="Switch View" />
+ </form>
+ <div id="output"></div>
+ </body>
+{include file="footer.tpl"}
diff --git a/themes/arun/templates/footer.tpl b/themes/arun/templates/footer.tpl
new file mode 100644
index 0000000..70723d9
--- /dev/null
+++ b/themes/arun/templates/footer.tpl
@@ -0,0 +1,2 @@
+ </body>
+</html>
diff --git a/themes/arun/templates/header.tpl b/themes/arun/templates/header.tpl
new file mode 100644
index 0000000..9e6fce5
--- /dev/null
+++ b/themes/arun/templates/header.tpl
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>{$page_title}</title>
+ <link href="{$web_path}/{$template_path}/stylesheet.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="{$web_path}/rpc.php?mode=init&amp;client=all"></script>
+ <script type="text/javascript" src="{$web_path}/phpfspot.js"></script>
+ <link rel="shortcut icon" href="{$web_path}/resources/gpl_16.png" type="image/png" />
+ <link rel="icon" href="{$web_path}/resources/gpl_16.png" type="image/png" />
+ { if isset($use_lightbox) }
+ <script type="text/javascript" src="{$web_path}/lightbox2/js/prototype.js"></script>
+ <script type="text/javascript" src="{$web_path}/lightbox2/js/scriptaculous.js?load=effects,builder"></script>
+ <script type="text/javascript" src="{$web_path}/lightbox2/js/lightbox.js"></script>
+ <link rel="stylesheet" href="{$web_path}/lightbox2/css/lightbox.css" type="text/css" media="screen" />
+ { /if }
+ { if isset($use_autocomplete) }
+ <script type="text/javascript" src="{$web_path}/autosuggest/js/bsn.AutoSuggest_2.1.3_comp.js"></script>
+ <link rel="stylesheet" href="{$web_path}/autosuggest/css/autosuggest_inquisitor.css" type="text/css" media="screen" charset="utf-8" />
+ { /if }
+ </head>
diff --git a/themes/arun/templates/index.tpl b/themes/arun/templates/index.tpl
new file mode 100644
index 0000000..c4378b2
--- /dev/null
+++ b/themes/arun/templates/index.tpl
@@ -0,0 +1,46 @@
+{include file="header.tpl"}
+ <body onload="init_phpfspot('{$web_path}');">
+
+ <!-- loading -->
+
+ <div id="HTML_AJAX_LOADING">
+ <img src="{$web_path}/resources/loading.gif" style="vertical-align: middle;" alt="Loading..." />&nbsp;&nbsp;Loading...
+ </div>
+
+ <!-- top menu -->
+
+ <div class="menu">
+ <div class="icons">
+ <a href="javascript:showPhotoIndex();" onclick="click(this);" title="Show Photo Index (CTRL+ALT+i)">
+photo index
+ </a>
+ <a href="javascript:resetAll();" onclick="click(this);" title="Reset selected-tags and search results (CTRL+ALT+r)">
+reset tags
+ </a>
+ <a href="javascript:showCredits();" onclick="click(this);" title="Show's a little credit page">
+about
+ </a>
+ </div>
+ <div class="logo">&nbsp;{$page_title}</div>
+ </div>
+ <!-- /top menu -->
+
+ <div style="clear: both;">
+ <!-- option column -->
+ <div class="options" style="float: left;">
+ <div>
+ {include file="search.tpl"}
+ </div>
+ <div id="tags">
+ {include file="tags.tpl"}
+ </div>
+ </div>
+ <!-- /option column -->
+
+ <!-- content column -->
+ <div id="content" class="content">
+ { $initial_content }
+ </div>
+ </div>
+
+{include file="footer.tpl"}
diff --git a/themes/arun/templates/photo_index.tpl b/themes/arun/templates/photo_index.tpl
new file mode 100644
index 0000000..9e4fbb0
--- /dev/null
+++ b/themes/arun/templates/photo_index.tpl
@@ -0,0 +1,179 @@
+<!-- Photo Index -->
+
+<!-- Header - displays count of matched photos and some link's -->
+
+<div class="header">
+ <div class="header_title">
+ <b>Photo Index</b>
+ {if isset($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 isset($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 isset($from_date) && isset($to_date) }
+ <br />
+ Results are limited to a date within {$from_date} to {$to_date}.
+ {/if}
+ </div>
+ <div class="header_menu">
+ {if isset($rss_link) }
+ <a href="{$rss_link}" target="_blank" title="RSS feed"><img src="{$web_path}/resources/rss.png" /></a>
+ {/if}
+ </div>
+</div>
+
+<!-- if result of a tag-search is displayed, show the selected tags
+ with some small pictures in a bar. -->
+
+{ if isset($tag_result) }
+<!-- seperator -->
+ <div class="tagresult"></div>
+ <!-- /seperator -->
+ <div class="tagresulttags" style="float: left;">
+ Tags:
+ </div>
+ <div class="tagresulttags">
+ { $selected_tags }
+ </div>
+{ /if }
+
+<!-- the photo matrix itself -->
+
+<div id="index">
+
+ {section name="thumb" loop=$thumbs step=1}
+
+ {if isset($images[thumb]) }
+
+ <div class="thumb" style="width: { $thumb_container_width }px; height: { $thumb_container_height }px;">
+ { if isset($user_friendly_url) }
+ <a href="{$web_path}/photoview/{$images[thumb]}" onclick="showPhoto({$images[thumb]}, 'scrollup'); return false;" id="thumblink{$images[thumb]}" name="image{$img_id[thumb]}" class="thumblink" onfocus="click(this);" title="{$img_title[thumb]}">
+ { else }
+ <a href="{$web_path}/index.php?mode=showp&amp;id={$images[thumb]}" onclick="showPhoto({$images[thumb]}, 'scrollup'); return false;" id="thumblink{$images[thumb]}" name="image{$img_id[thumb]}" class="thumblink" onfocus="click(this);" title="{$img_title[thumb]}">
+ { /if }
+ <img class="thumb" id="thumbimg{$images[thumb]}" width="{$img_width[thumb]}" height="{$img_height[thumb]}" src="{$web_path}/phpfspot_img.php?idx={$images[thumb]}&width={$width}" />
+ <br />
+ {$img_name[thumb]}
+ </a>
+ <!-- show lightbox eyes, if enabled -->
+ { if isset($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 }
+ <!-- show F-Spot photo rating value, if available -->
+ { if isset($img_rating[thumb]) }
+ <br />
+ {section name="rating" loop=$img_rating[thumb] step=1}
+ <img src="{$web_path}/resources/star.png" />
+ {/section}
+ { /if }
+ </div>
+
+ {/if}
+
+ {/section}
+
+</div>
+<br class="cb" />
+<div class="indexnavigation">
+
+ <!-- the right nav arrow -->
+ <div class="indexnavigationright">
+ { if !isset($next_url) || $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 !isset($previous_url) || $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 isset($page_selector) && $page_selector != "" }
+ {$page_selector}
+ { /if}
+ </div>
+</div>
+<br class="cb" />
+<script type="text/javascript" language="JavaScript">
+<!--
+ // image preloading
+ //
+ // these few javascript lines will try to speed up loading all the photo
+ // thumbnails. An array of all photos to display will be built written
+ // by the smarty-template. The js-code will then loop through this array
+ // and invoke loading of each photo. Sadly this does not work good on all
+ // browsers.
+ { counter start=-1 }
+
+ var current;
+ var image_urls = new Array();
+ var last_thumb;
+
+ {section name="thumb" loop=$thumbs step=1}
+ {if isset($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 -->
diff --git a/themes/arun/templates/search.tpl b/themes/arun/templates/search.tpl
new file mode 100644
index 0000000..acbcf3d
--- /dev/null
+++ b/themes/arun/templates/search.tpl
@@ -0,0 +1,72 @@
+<span class="tags">
+Search:
+</span>
+<form action="" onsubmit="startSearch(); return false;">
+<div class="searchfor">
+<table>
+ <tr>
+ <td>Tag:</td>
+ <td>
+ { if isset($use_autocomplete) }
+ <input type="text" name="searchfor_tag" id="searchfor_tag" value="{$searchfor_tag}" size="15" acdropdown="true" autocomplete_list="url:rpc.php?action=getxmltaglist&search=[S]&length=10" />
+ { literal }
+ <script type="text/javascript">
+ var options = {
+ script: "rpc.php?action=getxmltaglist&",
+ varname: "search",
+ json: false,
+ maxresults: 15
+ };
+ var as = new bsn.AutoSuggest('searchfor_tag', options);
+ </script>
+ { /literal }
+ { else }
+ <input type="text" name="searchfor_tag" value="{ if isset($searchfor_tag) }{$searchfor_tag}{ /if }" size="15" />
+ { /if }
+ </td>
+ <td>
+ <input type="image" class="submit" src="{$web_path}/resources/doit.png" alt="start search" title="start search" onclick="click(this);" />
+ </td>
+ </tr>
+ <tr>
+ <td>Date:</td>
+ <td class="nowarp">
+ { if ! isset($date_search_enabled) }
+ <input type="checkbox" class="checkbox" name="consider_date" value="Y" onclick="datesearch();" />
+ { else }
+ <input type="checkbox" class="checkbox" name="consider_date" value="Y" onclick="datesearch();" checked="checked" />
+ { /if }
+ consider date-range
+ </td>
+ <td>&nbsp;</td>
+ </tr>
+ <tr>
+ <td>&nbsp;</td>
+ <td>{$search_from_date} <a href="javascript:showCalendar('from');" onclick="click(this);"><img src="{$web_path}/resources/date.png" id="frompic" alt="from" /></a></td>
+ </tr>
+ <tr>
+ <td>&nbsp;</td>
+ <td>{$search_to_date} <a href="javascript:showCalendar('to');" onclick="click(this);"><img src="{$web_path}/resources/date.png" id="topic" alt="to" /></a></td>
+ <td>
+ <input type="image" class="submit" src="{$web_path}/resources/doit.png" alt="start search" title="start search" onclick="click(this);" />
+ </td>
+ </tr>
+ { if isset($has_rating) }
+ { /if }
+ <tr>
+ <td>
+ Sort-Order:&nbsp;
+ </td>
+ <td>
+ <select name="sort_order" onchange="update_sort_order(this);">
+ { sort_select_list }
+ </select>
+ </td>
+ <td>
+ &nbsp;
+ </td>
+ </tr>
+</table>
+</div>
+</form>
+<div id='calendar'></div>
diff --git a/themes/arun/templates/single_photo.tpl b/themes/arun/templates/single_photo.tpl
new file mode 100644
index 0000000..25235df
--- /dev/null
+++ b/themes/arun/templates/single_photo.tpl
@@ -0,0 +1,135 @@
+<!-- Single photo -->
+<div class="header">
+ <div class="header_title">
+ <b>Photo {$image_name}</b><br />
+ {if $photo_count > 0}
+ {$photo_number} of {$photo_count}
+ {if $photo_count == 1}
+ Photo
+ {else}
+ Photos
+ {/if}
+ {if isset($description) && $description != "" }
+ -&nbsp;{$description}<br />
+ {/if}
+ {/if}
+ </div>
+ <div class="header_menu">
+ <a href="javascript:zoom(-10);" title="zoom_out" onclick="click(this);"><img src="{$web_path}/resources/zoom-out.png" /></a>
+ <a href="javascript:zoom(0);" title="zoom_100" onclick="click(this);"><img src="{$web_path}/resources/zoom-100.png" /></a>
+ <a href="javascript:zoom(10);" title="zoom_in" onclick="click(this);"><img src="{$web_path}/resources/zoom-in.png" /></a>
+ <a href="javascript:startAutoBrowse();" title="auto browsing"><img id="autobrowse_ico" src="{$web_path}/resources/16_play.png" />&nbsp;Auto-Browse</a>
+ {if isset($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}
+ <a href="{$image_url_full}" title="orig_image" target="_blank" onclick="click(this);"><img src="{$web_path}/resources/original.png" alt="original resolution" />&nbsp;Fullsize</a>
+ </div>
+</div>
+
+<p class="cb">
+
+ <div id="photo_details">
+ { if isset($ExifMadeWith) }
+ <u><img src="{$web_path}/resources/camera.png" alt="camera icon" />&nbsp;Image taken with:</u><br />
+ {$ExifMadeWith}<br />
+ { /if }
+ { if isset($ExifMadeOn) }
+ <u><img src="{$web_path}/resources/date.png" alt="calendar icon" />&nbsp;Image made on:</u><br />
+ {$ExifMadeOn}<br />
+ { /if }
+ { if isset($ExifOrigResolution) }
+ <u><img src="{$web_path}/resources/image.png" alt="resolution icon" />&nbsp;Original resolution:</u><br />
+ {$ExifOrigResolution}px<br />
+ { /if }
+ <u>Size:</u>&nbsp;{$ExifFileSize}<br />
+ { if isset($image_rating) && $image_rating > 0 }
+ <u><img src="{$web_path}/resources/rating.png" alt="rating" />&nbsp;Rating:</u><br />
+ {section name="rating" loop=$image_rating step=1}
+ <img src="{$web_path}/resources/star.png" />
+ {/section}
+ <br />
+ { /if }
+ { if isset($has_versions) }
+ <br />
+ Versions:<br />
+ <select onchange="update_photo_version(this, {$photo});">
+ { photo_version_select_list photo=$photo current=$version }
+ </select>
+ <br />
+ { /if }
+ { if isset($tags) }
+ <br />
+ <u><img src="{$web_path}/resources/small_available_tags.png" alt="available tags" />&nbsp;Tagged with:</u><br />
+ { foreach from=$tags key=id item=name }
+ <a class="smalltag" href="javascript:Tags('add', '{$id}');" onfocus="click(this);">{$name}</a><br />
+ { /foreach }
+ { /if }
+ <hr>
+ { if isset($prev_img) && isset($previous_url) }
+ <u><img src="{$web_path}/resources/photo.png" alt="photo icon" />&nbsp;Previous:</u><br />
+ <a href="{$previous_url}" onfocus="click(this);" id="prev_link">
+ <img src="{$web_path}/phpfspot_img.php?idx={$prev_img}&amp;width={$mini_width}" /><br />
+ </a>
+ { /if}
+ { if isset($next_img) && isset($next_url) }
+ <u><img src="{$web_path}/resources/photo.png" alt="photo icon" />&nbsp;Next:</u><br />
+ <a href="{$next_url}" onfocus="click(this);" id="next_link">
+ <img src="{$web_path}/phpfspot_img.php?idx={$next_img}&amp;width={$mini_width}" /><br />
+ </a>
+ { /if}
+ </div>
+
+ <!-- the photo itself -->
+
+ <div class="photo">
+ { if !isset($next_url) || $next_url == "" }
+ <a href="{$image_url}" onclick="showPhotoIndex(); return false;" onfocus="click(this);" name="photo">
+ { else }
+ <a href="{$image_url}" onclick="{$next_url}; return false;" onfocus="click(this);" title="click for the next photo" name="photo">
+ { /if }
+ <img src="{$image_url}" width="{$width}" height="{$height}" alt="{$image_filename}" name="photo" id="photo" />
+ </a>
+ </div>
+
+ <!-- navigation arrows -->
+
+ <div class="photonavigation">
+
+ <!-- previous -->
+ { if !isset($previous_url) || $previous_url == "" }
+ <img src="{$web_path}/resources/arrow_left_gray.png" alt="first photo reached" />
+ { else }
+ <a href="{$previous_url}" onfocus="click(this);" title="click for the previous photo (left cursor)">
+ <img src="{$web_path}/resources/arrow_left.png" alt="previous photo" />
+ </a>
+ { /if }
+
+ <!-- back to index -->
+ <a href="javascript:showPhotoIndex({$current_page}, {$current_img});" onfocus="click(this);" title="click to go back to the index">
+ <img src="{$web_path}/resources/arrow_up.png" alt="photo index" />
+ </a>
+
+ <!-- next -->
+ { if !isset($next_url) || $next_url == "" }
+ <img src="{$web_path}/resources/arrow_right_gray.png" alt="last photo reached" />
+ { else }
+ <a href="{$next_url}" onfocus="click(this);" title="click for the next photo (right cursor)">
+ <img src="{$web_path}/resources/arrow_right.png" alt="next photo" />
+ </a>
+ { /if}
+ </div>
+</p>
+<script type="text/javascript">
+<!--
+ if(autobrowse && document.getElementById("autobrowse_ico"))
+ document.getElementById("autobrowse_ico").src = '{$web_path}/resources/16_pause.png';
+
+ /* lets preload to previous and the next image to speedup */
+ var image_next = new Image();
+ image_next.src = "{$web_path}/phpfspot_img.php?idx={$next_img}&width={$photo_width}";
+ var image_prev = new Image();
+ image_prev.src = "{$web_path}/phpfspot_img.php?idx={$prev_img}&width={$photo_width}";
+
+-->
+</script>
+<!-- /Single photo -->
diff --git a/themes/arun/templates/slideshow.tpl b/themes/arun/templates/slideshow.tpl
new file mode 100644
index 0000000..1e64dbc
--- /dev/null
+++ b/themes/arun/templates/slideshow.tpl
@@ -0,0 +1,28 @@
+{include file="header.tpl"}
+ <script type="text/javascript" src="{$web_path}/slider/js/range.js"></script>
+ <script type="text/javascript" src="{$web_path}/slider/js/timer.js"></script>
+ <script type="text/javascript" src="{$web_path}/slider/js/slider.js"></script>
+ <link type="text/css" rel="StyleSheet" href="{$web_path}/slider/css/bluecurve/bluecurve.css" />
+ <body onload="startSlideShow('{$web_path}');" class="slideshow">
+ <div id="slide_navigation">
+ <a href="javascript:prevSlide();" onclick="click(this);" title="slive to previous photo"><img id="rew_ico" src="{$web_path}/resources/32_rew.png" /></a>
+ <a href="javascript:pauseSlideShow();" onclick="click(this);"><img id="pause_ico" src="{$web_path}/resources/32_pause.png" /></a>
+ <a href="javascript:startSlideShow();" onclick="click(this);" title="stop and revert slideshow"><img id="stop_ico" src="{$web_path}/resources/32_stop.png" /></a>
+ <a href="javascript:nextSlide();" onclick="click(this);" title="slide to next photo"><img id="fwd_ico" src="{$web_path}/resources/32_fwd.png" /></a>
+ </div>
+ <div id="slide_close">
+ <a href="javascript:window.close();" title="click to close slideshow">
+ <img id="slide_img" alt="slideshow_img" />
+ </a>
+ </div>
+ <form>
+ <div id="slider-1" tabIndex="1" onclick="if(this.blur)this.blur();">
+ <input id="slider-input-1" name="slider-input-1" onclick="if(this.blur)this.blur();" />
+ </div>
+ </form>
+ <div id="current_slide_time"></div>
+ <script type="text/javascript">
+ initSlider();
+ </script>
+ </body>
+{include file="footer.tpl"}
diff --git a/themes/arun/templates/tags.tpl b/themes/arun/templates/tags.tpl
new file mode 100644
index 0000000..e36ddda
--- /dev/null
+++ b/themes/arun/templates/tags.tpl
@@ -0,0 +1,15 @@
+<span class="tags selectedtags">
+Selected Tags:
+</span>
+ &nbsp;
+ <input type="radio" name="condition" value="or" onclick="Tags('condition', this);" {if $current_condition == "or" } checked="checked" { /if } title="OR condition" />||
+ <input type="radio" name="condition" value="and" onclick="Tags('condition', this);" {if $current_condition == "and" } checked="checked" { /if } title="AND condition" />&amp;&amp;
+{ if isset($preset_selected_tags) }
+ <div id="selected_tags">{ $preset_selected_tags }</div>
+{ else }
+ <div id="selected_tags">no tags selected</div>
+{ /if }
+<span class="tags availabletags">
+Available Tags:
+</span>
+<div id="available_tags">{ $preset_available_tags }</div>
diff --git a/themes/arun/templates/welcome.tpl b/themes/arun/templates/welcome.tpl
new file mode 100644
index 0000000..b169343
--- /dev/null
+++ b/themes/arun/templates/welcome.tpl
@@ -0,0 +1,32 @@
+<!-- welcome -->
+<div class="header">
+Welcome, these are some of my pictures.
+</div>
+<div class="welcome">
+
+
+ <p>
+ <span>
+ <img src="{$web_path}/phpfspot_img.php?idx=rand&amp;width=150&amp;i=1" alt="random image" />
+ </span>
+ <span>
+ <img src="{$web_path}/phpfspot_img.php?idx=rand&amp;width=150&amp;i=2" alt="random image" />
+ </span>
+ <span>
+ <img src="{$web_path}/phpfspot_img.php?idx=rand&amp;width=150&amp;i=3" alt="random image" />
+ </span>
+ <span>
+ <img src="{$web_path}/phpfspot_img.php?idx=rand&amp;width=150&amp;i=4" alt="random image" />
+ </span>
+ <span>
+ <img src="{$web_path}/phpfspot_img.php?idx=rand&amp;width=150&amp;i=5" alt="random image" />
+ </span>
+ <span>
+ <img src="{$web_path}/phpfspot_img.php?idx=rand&amp;width=150&amp;i=6" alt="random image" />
+ </span>
+</p>
+ <p>
+ <a href="javascript:showPhotoIndex();"> Index of all photos.</a>
+ </p>
+</div>
+<!-- /welcome -->