summaryrefslogtreecommitdiff
path: root/templates
diff options
context:
space:
mode:
Diffstat (limited to 'templates')
-rw-r--r--templates/default.xml33
-rw-r--r--templates/styles.css6
-rw-r--r--templates/template_album.html26
-rw-r--r--templates/template_index.html34
-rw-r--r--templates/template_picture.html15
5 files changed, 40 insertions, 74 deletions
diff --git a/templates/default.xml b/templates/default.xml
index 9197519..c903a4b 100644
--- a/templates/default.xml
+++ b/templates/default.xml
@@ -9,10 +9,11 @@
the "preview" size will be used instead. -->
<!-- Meaning of "original" is shifted here from previous versions;
- it's considered more like a bigger preview size for large screens now. -->
+ it's considered more like a bigger preview size for large screens now.
+ However it still serves the purpose of supplying metadata (EXIF etc.). -->
<!-- Corresponds with mandatory <item src> tag in album source file. -->
<!-- Note that the series of legacy <nofullsize> and <fullsize> tags control
- this image size availability. -->
+ this image size availability on the page. -->
<size name="original">
<landscape w="1200" h="800" />
<portrait w="1024" h="1024" />
@@ -72,31 +73,34 @@
<!-- particular design setup -->
<theme enabled="yes">
- <!-- When the <index> structure is missing, album design will be used for
- both list of albums and list of pictures. -->
+ <!-- Index pages may only contain thumbnails. When the <index> structure is
+ missing, album design will be used for both list of albums and list
+ of pictures. -->
<index>
<template>template_index.html</template>
<target_filename>index.html</target_filename>
<!-- specify thumbnail image size to be used here. -->
<thumbnail_size>thumbnail</thumbnail_size>
+ <!-- In case of a protected album, show special thumbnail (must be included
+ in supplemental_files). Comment out to use real thumbnail. -->
+ <protected_thumbnail>emblems-readonly_120.png</protected_thumbnail>
</index>
- <!-- This is mandatory. -->
+ <!-- Album definition is mandatory. -->
<album>
<template>template_album.html</template>
<target_filename>index.html</target_filename>
- <!-- which picture size to use for XXX tags (TODO) -->
- <picture_size>preview</picture_size>
- <!-- thumbnail_size is optional when thumbnails are not used on album pages -->
+ <!-- thumbnail_size is optional, omit it when thumbnails are not used on
+ album pages (will skip some tags substitution). -->
<thumbnail_size>thumbnail</thumbnail_size>
- <!-- In case of a protected album, show special thumbnail (must be included
- in supplemental_files). Comment out to use real thumbnail -->
- <protected_thumbnail>emblems-readonly_120.png</protected_thumbnail>
+ <!-- Just like thumbnail_size, also picture_size is optional, omit it
+ when images in their full sizes are not used on album pages. -->
+ <picture_size>preview</picture_size>
</album>
<!-- When the <picture> structure is missing, no pages for the particular
- images will be generated. Images are processed in either case, for use
- with album alone. -->
+ images will be generated. Images are processed in either case, for
+ potential use within album pages. -->
<picture>
<template>template_picture.html</template>
<!-- '%s' will be replaced with actual picture filename -->
@@ -120,7 +124,7 @@
or as a value constant (specify "value(DEFINE_NAME)" to retrieve the value).
For "ifdef" negation, use "ifndef" or "else". -->
<!-- Some defines are added during runtime and take priority over custom defines
- here. This way you can define default values here which would get eventually
+ here. This way you can define default values which would get eventually
overriden by the generator. -->
<!-- image border style, overriden by <border style> tags from the album source file -->
@@ -141,3 +145,4 @@
filenames to avoid conflicts. -->
</design_setup>
+
diff --git a/templates/styles.css b/templates/styles.css
index 4b5cc27..ca7121d 100644
--- a/templates/styles.css
+++ b/templates/styles.css
@@ -221,7 +221,7 @@ div.album_item a:hover {
border: 2px solid #A3BED4;
}
-div.album_item img {
+div.album_item img.landscape {
/* landscape */
padding-top: 2.25em;
}
@@ -344,7 +344,7 @@ div.index_item img {
top: 1.4em;
}
-.album_text {
+.album_text_landscape {
font-size: 190%;
font-weight: bold;
position: relative;
@@ -371,7 +371,7 @@ div.index_item img {
top: 0.65em;
}
-.album_subtext {
+.album_subtext_landscape {
font-size: 150%;
position: relative;
left: 13.1em;
diff --git a/templates/template_album.html b/templates/template_album.html
index 5413c5e..fde340f 100644
--- a/templates/template_album.html
+++ b/templates/template_album.html
@@ -52,33 +52,15 @@
<!-- ## Images -->
<div class="album_thumbs">
<!-- $(BEGIN_IMG_LIST) -->
- <!-- $(BEGIN_IMG_LIST_LANDSCAPE) -->
+ <!-- $(BEGIN_LIST_PICTURE) -->
<div class="album_item">
- <div class="position_marker" id="$(IMG_LIST_ID)"></div>
+ <div class="position_marker" id="$(IMG_POS_MARKER)"></div>
<a href="$(IMG_SUBPAGE)">
- <img src="$(IMG_THUMBNAIL)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="$(IMG_TITLE)" />
+ <img src="$(IMG_SRC_THUMB)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="$(IMG_TITLE)" class="$(THUMB_ORIENTATION)" />
<span class="album_thumb_text"><!-- $(IMG_FILENAME) --></span>
</a>
</div>
- <!-- $(END_IMG_LIST_LANDSCAPE) -->
- <!-- $(BEGIN_IMG_LIST_PORTRAIT) -->
- <div class="album_item">
- <div class="position_marker" id="$(IMG_LIST_ID)"></div>
- <a href="$(IMG_SUBPAGE)">
- <img src="$(IMG_THUMBNAIL)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="$(IMG_TITLE)" class="portrait" />
- <span class="album_thumb_text"><!-- $(IMG_FILENAME) --></span>
- </a>
- </div>
- <!-- $(END_IMG_LIST_PORTRAIT) -->
- <!-- $(BEGIN_IMG_LIST_SQUARED) -->
- <div class="album_item">
- <div class="position_marker" id="$(IMG_LIST_ID)"></div>
- <a href="$(IMG_SUBPAGE)">
- <img src="$(IMG_THUMBNAIL)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="$(IMG_TITLE)" class="squared" />
- <span class="album_thumb_text"><!-- $(IMG_FILENAME) --></span>
- </a>
- </div>
- <!-- $(END_IMG_LIST_SQUARED) -->
+ <!-- $(END_LIST_PICTURE) -->
<!-- $(BEGIN_LIST_SEPARATOR) -->
<div class="separators">
<div class="index_separator"><!-- $(LIST_SEPARATOR_TITLE) --></div>
diff --git a/templates/template_index.html b/templates/template_index.html
index 9f90bfe..36d4eec 100644
--- a/templates/template_index.html
+++ b/templates/template_index.html
@@ -52,39 +52,17 @@
<!-- ## Albums -->
<div class="index_thumbs">
<!-- $(BEGIN_IMG_LIST) -->
- <!-- $(BEGIN_IMG_LIST_LANDSCAPE) -->
+ <!-- $(BEGIN_LIST_PICTURE) -->
<div class="index_item">
- <div class="position_marker" id="$(IMG_LIST_ID)"></div>
+ <div class="position_marker" id="$(IMG_POS_MARKER)"></div>
<a href="$(ALBUM_SUBPATH)">
- <img src="$(IMG_THUMBNAIL)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="" />
- <span class="album_text"><!-- $(IMG_TITLE) --></span><br />
- <span class="album_subtext"><!-- $(IMG_DESCRIPTION) --><!-- $(ifdef(IS_PROTECTED)) --><span class="album_protected_note"><br /><br />(This album is password protected)</span><!-- $(endif(IS_PROTECTED)) --></span>
+ <img src="$(IMG_SRC_THUMB)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="" />
+ <span class="album_text_$(THUMB_ORIENTATION)"><!-- $(IMG_TITLE) --></span><br />
+ <span class="album_subtext_$(THUMB_ORIENTATION)"><!-- $(IMG_DESCRIPTION) --><!-- $(ifdef(IS_PROTECTED)) --><span class="album_protected_note"><br /><br />(This album is password protected)</span><!-- $(endif(IS_PROTECTED)) --></span>
<span class="album_note">(<!-- $(ALBUM_NUM_ITEMS) --> items)</span>
</a>
</div>
- <!-- $(END_IMG_LIST_LANDSCAPE) -->
- <!-- $(BEGIN_IMG_LIST_PORTRAIT) -->
- <div class="index_item">
- <div class="position_marker" id="$(IMG_LIST_ID)"></div>
- <a href="$(ALBUM_SUBPATH)">
- <img src="$(IMG_THUMBNAIL)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="" />
- <span class="album_text_portrait"><!-- $(IMG_TITLE) --></span><br />
- <span class="album_subtext_portrait"><!-- $(IMG_DESCRIPTION) --><!-- $(ifdef(IS_PROTECTED)) --><span class="album_protected_note"><br /><br />(This album is password protected)</span><!-- $(endif(IS_PROTECTED)) --></span>
- <span class="album_note">(<!-- $(ALBUM_NUM_ITEMS) --> items)</span>
- </a>
- </div>
- <!-- $(END_IMG_LIST_PORTRAIT) -->
- <!-- $(BEGIN_IMG_LIST_SQUARED) -->
- <div class="index_item">
- <div class="position_marker" id="$(IMG_LIST_ID)"></div>
- <a href="$(ALBUM_SUBPATH)">
- <img src="$(IMG_THUMBNAIL)" width="$(IMG_SIZE_THUMB_W)" height="$(IMG_SIZE_THUMB_H)" alt="" />
- <span class="album_text_squared"><!-- $(IMG_TITLE) --></span><br />
- <span class="album_subtext_squared"><!-- $(IMG_DESCRIPTION) --><!-- $(ifdef(IS_PROTECTED)) --><span class="album_protected_note"><br /><br />(This album is password protected)</span><!-- $(endif(IS_PROTECTED)) --></span>
- <span class="album_note">(<!-- $(ALBUM_NUM_ITEMS) --> items)</span>
- </a>
- </div>
- <!-- $(END_IMG_LIST_SQUARED) -->
+ <!-- $(END_LIST_PICTURE) -->
<!-- $(BEGIN_LIST_SEPARATOR) -->
<div class="separators">
<div class="album_list_separator"><!-- $(LIST_SEPARATOR_TITLE) --></div>
diff --git a/templates/template_picture.html b/templates/template_picture.html
index 6bd5291..f7e553e 100644
--- a/templates/template_picture.html
+++ b/templates/template_picture.html
@@ -3,6 +3,7 @@
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://www.w3.org/2005/10/profile">
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+<!-- $(BEGIN_SINGLE_PICTURE) -->
<title>$(PAGE_TITLE)</title>
<!-- $(CGG_META_TAGS) -->
<!-- $(CGG_ATOM_FEED_TAGS) -->
@@ -34,7 +35,7 @@
<!-- $(END_NAV_BAR) -->
</div>
<div class="navposition">
- <span class="navposnumber"><!-- $(FILE_NO) --></span> of <span class="navposnumber"><!-- $(TOTAL_ITEMS) --></span>
+ <span class="navposnumber"><!-- $(ITEM_INDEX) --></span> of <span class="navposnumber"><!-- $(TOTAL_ITEMS) --></span>
<span class="navposspacer"></span>
<a href="$(LINK_PREV)" rel="prev">&lt; Previous</a> :: <a href="$(LINK_NEXT)" rel="next">Next &gt;</a>
</div>
@@ -47,8 +48,8 @@
<div class="master_content">
<!-- ## Description -->
<div class="description">
- <div class="desc_title"><!-- $(TITLE) --></div>
- <div class="desc_text"><!-- $(DESCRIPTION) --></div>
+ <div class="desc_title"><!-- $(IMG_TITLE) --></div>
+ <div class="desc_text"><!-- $(IMG_DESCRIPTION) --></div>
</div>
<!-- ## Image -->
@@ -56,7 +57,7 @@
<a href="$(LINK_NEXT)" rel="next"><img src="$(IMG_SRC)" width="$(IMG_SIZE_W)" height="$(IMG_SIZE_H)" alt="" id="$(value(BORDER_STYLE))" /></a>
<!-- $(ifdef(HAS_FULLSIZE)) -->
<div class="img_preview_full">
- <a href="$(IMG_SRC_FULL)">See original size (<!-- $(IMG_SIZE_ORIG_W) -->x<!-- $(IMG_SIZE_ORIG_H) -->)</a>
+ <a href="$(IMG_SRC_FULLSIZE)">See original size (<!-- $(IMG_SIZE_FULLSIZE_W) -->x<!-- $(IMG_SIZE_FULLSIZE_H) -->)</a>
</div>
<!-- $(endif(HAS_FULLSIZE)) -->
</div>
@@ -91,10 +92,10 @@
</div>
<!-- $(endif(SHOW_EXIF_TABLE)) -->
+<!-- $(END_SINGLE_PICTURE) -->
+
<!-- ## Footnote, also acts as a bottom border -->
- <div class="footnote">
- <div class="desc_text"><!-- $(FOOTNOTE) --></div>
- </div>
+ <div class="footnote"></div>
</div> <!-- end of master_content -->