From c5969b786a88a2793c4174fb5429b60e1d86abdf Mon Sep 17 00:00:00 2001 From: rvelices Date: Sat, 14 Jan 2012 06:19:22 +0000 Subject: bug 2514 improve prev/next navigation navigation on picture page git-svn-id: http://piwigo.org/svn/trunk@12880 68402e56-0260-453c-a942-63ccdbb3a9ee --- .../distributed/samples/my-picture.tpl | 2 +- themes/Sylvia/theme.css | 2 +- themes/clear/theme.css | 2 +- themes/dark/theme.css | 13 +++------- themes/default/template/picture.tpl | 2 +- themes/default/template/picture_content.tpl | 28 ++++++++++++++++------ themes/default/template/slideshow.tpl | 2 +- themes/default/theme.css | 24 ++++++++----------- 8 files changed, 39 insertions(+), 36 deletions(-) diff --git a/template-extension/distributed/samples/my-picture.tpl b/template-extension/distributed/samples/my-picture.tpl index 0bf9e0fa3..5d0c3c001 100644 --- a/template-extension/distributed/samples/my-picture.tpl +++ b/template-extension/distributed/samples/my-picture.tpl @@ -95,7 +95,7 @@ y.callService( {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'} -
+
{$ELEMENT_CONTENT} {if isset($COMMENT_IMG)} diff --git a/themes/Sylvia/theme.css b/themes/Sylvia/theme.css index 9093cd475..c8f96fe0c 100644 --- a/themes/Sylvia/theme.css +++ b/themes/Sylvia/theme.css @@ -332,7 +332,7 @@ border: 0; } -#theImage A, .illustration A, A.navThumb, A.navThumb { +#imageWrap A, .illustration A, A.navThumb, A.navThumb { border-bottom-width: 0; } .rateButtonStarFull, .rateButtonStarEmpty { diff --git a/themes/clear/theme.css b/themes/clear/theme.css index 1630bbdd6..f4006839a 100644 --- a/themes/clear/theme.css +++ b/themes/clear/theme.css @@ -23,7 +23,7 @@ H2, #menubar DT, #imageHeaderBar, #imageToolBar A:hover { border: 1px solid #d3d3d3; } -#theImage IMG { +#imageWrap IMG { border: 3px solid #d3d3d3; } diff --git a/themes/dark/theme.css b/themes/dark/theme.css index 3ff836163..80cf96b53 100644 --- a/themes/dark/theme.css +++ b/themes/dark/theme.css @@ -7,6 +7,7 @@ INPUT.rateButtonSelected /* <= why IE doesn't inherit this ? */ { H2, #menubar DT { color: #ffff80; + background-image: url(images/tableh1_bg.png); } @@ -20,13 +21,8 @@ BODY, H3, #imageToolBar A:hover { background-color: #505050; } -H2, #menubar DT { - background-image: url(images/tableh1_bg.png); -} - #imageHeaderBar H2 { background-image: none; - border: 0; } #imageHeaderBar { @@ -38,7 +34,7 @@ H2, #menubar DT { border: 1px solid #000; } -H2, #menubar DT, #imageToolBar { +#menubar DT, #imageToolBar { border-bottom: 1px solid #000; } @@ -50,11 +46,8 @@ FIELDSET, INPUT, SELECT, TEXTAREA, .thumbnails .wrap2:hover, -.content .thumbnailCategories .thumbnailCategory:hover, -.content .thumbnailCategories .thumbnailCategory:hover A { - background-color: #faebd7; +.content .thumbnailCategories .thumbnailCategory:hover{ border-color: yellow; /* thumbnails border color when mouse cursor is over it */ - color: black; } diff --git a/themes/default/template/picture.tpl b/themes/default/template/picture.tpl index 6fb873771..2416e5973 100644 --- a/themes/default/template/picture.tpl +++ b/themes/default/template/picture.tpl @@ -79,7 +79,7 @@ y.callService( {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'}
{**} -
+
{$ELEMENT_CONTENT} {if isset($COMMENT_IMG)} diff --git a/themes/default/template/picture_content.tpl b/themes/default/template/picture_content.tpl index cc85a1e05..6a87d3fab 100644 --- a/themes/default/template/picture_content.tpl +++ b/themes/default/template/picture_content.tpl @@ -1,10 +1,10 @@ -get_size_htm()} alt="{$ALT_IMG}" id="theMainImage" +get_size_htm()} alt="{$ALT_IMG}" id="theMainImage" usemap="#map{$current.selected_derivative->get_type()}" {if isset($COMMENT_IMG)} title="{$COMMENT_IMG|@strip_tags:false|@replace:'"':' '}" {else} title="{$current.TITLE|@replace:'"':' '} - {$ALT_IMG}" {/if}> {if count($current.unique_derivatives)>1} {footer_script}{literal} -function changeImgSrc(url,type,display) +function changeImgSrc(url,typeSave,typeMap,typeDisplay) { var theImg = document.getElementById("theMainImage"); if (theImg) @@ -12,9 +12,10 @@ function changeImgSrc(url,type,display) theImg.removeAttribute("width");theImg.removeAttribute("height"); theImg.src = url; var elt = document.getElementById("derivativeSwitchLink"); - if (elt) elt.innerHTML = display; + if (elt) elt.innerHTML = typeDisplay; + theImg.useMap = "#map"+typeMap; } - document.cookie = 'picture_deriv=' + type; + document.cookie = 'picture_deriv=' + typeSave; } function toggleDerivativeSwitchBox() @@ -35,10 +36,23 @@ function toggleDerivativeSwitchBox() {$current.selected_derivative->get_type()|@translate} -{/if} \ No newline at end of file +{/if} + +{foreach from=$current.unique_derivatives item=derivative key=derivative_type}{strip} + +{assign var='size' value=$derivative->get_size()} +{if isset($previous)} +{$previous.TITLE} +{/if} +{'Thumbnails'|@translate} +{if isset($next)} +{$next.TITLE} +{/if} + +{/strip}{/foreach} diff --git a/themes/default/template/slideshow.tpl b/themes/default/template/slideshow.tpl index a310935a2..db360737c 100644 --- a/themes/default/template/slideshow.tpl +++ b/themes/default/template/slideshow.tpl @@ -14,7 +14,7 @@ {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'}
-
+
{$ELEMENT_CONTENT} {if isset($COMMENT_IMG)}

{$COMMENT_IMG}

diff --git a/themes/default/theme.css b/themes/default/theme.css index bf7e9355d..5232b03a1 100644 --- a/themes/default/theme.css +++ b/themes/default/theme.css @@ -214,9 +214,10 @@ TD.calDayHead { } .thumbnailCategories LI { - margin:0; - padding:0; - float:left; + margin: 0; + padding: 0; + float: left; + width: 49.7%; /* 49.7% for 2 per line, 33.2% for 3 per line*/ } .thumbnailCategory { @@ -328,7 +329,7 @@ TD.calDayHead { #imageToolBar { text-align: center; clear: both; - margin-bottom: 4px; + margin-bottom: 2px; padding: 0; height: 28px; } @@ -342,7 +343,7 @@ TD.calDayHead { padding: 0.2em; position: absolute; left: 5px; - top: 100px; + top: 10%; } #derivativeSwitchBox, #sortOrderBox { @@ -351,12 +352,13 @@ TD.calDayHead { z-index: 100; } -#theImage { +#imageWrap { clear: left; text-align: center; + position: relative; /*so that the drivative switch link is positioned relative to us*/ } -#theImage>IMG { +#imageWrap>IMG { display: block; margin: 0 auto; border: 0; @@ -418,7 +420,7 @@ TD.calDayHead { } .contentWithMenu #imageToolBar, -.contentWithMenu #theImage { +.contentWithMenu #imageWrap { clear: none; } @@ -694,12 +696,6 @@ IMG.ui-datepicker-trigger { height: 140px; /* max thumbnail height + 2px */ } - -/* Category thumbnails on main page */ -.thumbnailCategories LI { - width: 49.7%; /* 49.7% for 2 per line, 33.2% for 3 per line*/ -} - /* Set defaults for thumbnails legend */ .thumbnails SPAN.thumbLegend { display: block; /* display: none; if you don't want legend */ -- cgit v1.2.3