aboutsummaryrefslogtreecommitdiffstats
path: root/themes
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--themes/clear/theme.css4
-rw-r--r--themes/dark/theme.css4
-rw-r--r--themes/default/template/picture_content.tpl26
-rw-r--r--themes/default/theme.css13
4 files changed, 39 insertions, 8 deletions
diff --git a/themes/clear/theme.css b/themes/clear/theme.css
index 838f33980..258d8b57c 100644
--- a/themes/clear/theme.css
+++ b/themes/clear/theme.css
@@ -14,12 +14,12 @@ H2, #menubar DT, #imageHeaderBar, #imageToolBar A:hover {
background-color: #d3d3d3;
}
-#menubar DL, .content, #imageToolBar, .header_notes {
+#menubar DL, .content, #imageToolBar, #derivativeSwitchLink, #derivativeSwitchBox, .header_notes {
background-color: #eeeeee;
}
/* borders */
-#menubar DL, .content, #imageToolBar {
+#menubar DL, .content, #imageToolBar, #derivativeSwitchLink, #derivativeSwitchBox {
border: 1px solid #d3d3d3;
}
diff --git a/themes/dark/theme.css b/themes/dark/theme.css
index aa3975b43..eca78dc9a 100644
--- a/themes/dark/theme.css
+++ b/themes/dark/theme.css
@@ -16,7 +16,7 @@ BODY, H3, #imageToolBar A:hover {
background-color: #2f2f2f;
}
-#menubar DL, .content, #imageToolBar, #imageHeaderBar, .header_notes {
+#menubar DL, .content, #imageToolBar, #imageHeaderBar, #derivativeSwitchLink, #derivativeSwitchBox, .header_notes {
background-color: #505050;
}
@@ -34,7 +34,7 @@ H2, #menubar DT {
}
/* borders */
-#menubar DL, .content{
+#menubar DL, .content, #derivativeSwitchLink, #derivativeSwitchBox{
border: 1px solid #000;
}
diff --git a/themes/default/template/picture_content.tpl b/themes/default/template/picture_content.tpl
index a4a9b4760..6fc743a02 100644
--- a/themes/default/template/picture_content.tpl
+++ b/themes/default/template/picture_content.tpl
@@ -4,20 +4,38 @@
{/if}>
{if count($current.available_derivative_types)>1}
{footer_script}{literal}
-function changeImgSrc(url,type)
+function changeImgSrc(url,type,display)
{
var theImg = document.getElementById("theMainImage");
if (theImg)
{
theImg.removeAttribute("width");theImg.removeAttribute("height");
theImg.src = url;
+ var elt = document.getElementById("derivativeSwitchLink");
+ if (elt) elt.innerHTML = display;
}
document.cookie = 'picture_deriv=' + type;
}
+
+function toggleDerivativeSwitchBox()
+{
+ var elt = document.getElementById("derivativeSwitchBox"),
+ ePos = document.getElementById("derivativeSwitchLink");
+ if (elt.style.display==="none")
+ {
+ elt.style.position = "absolute";
+ elt.style.left = (ePos.offsetLeft + 10) + "px";
+ elt.style.top = (ePos.offsetTop + ePos.offsetHeight) + "px";
+ elt.style.display="";
+ }
+ else
+ elt.style.display="none";
+}
{/literal}{/footer_script}
-<p>
+<a id="derivativeSwitchLink" onclick="toggleDerivativeSwitchBox()" style="cursor:pointer">{$current.selected_derivative->get_type()|@translate}</a>
+<div id="derivativeSwitchBox" onclick="toggleDerivativeSwitchBox()" style="display:none">
{foreach from=$current.available_derivative_types item=derivative_type}
-<a onclick="changeImgSrc('{$current.derivatives[$derivative_type]->get_url()|@escape:javascript}', '{$derivative_type}')" title="{$current.derivatives[$derivative_type]->get_size_hr()}">{$derivative_type}</a>
+<a onclick="changeImgSrc('{$current.derivatives[$derivative_type]->get_url()|@escape:javascript}', '{$derivative_type}', '{$derivative_type|@translate|@escape:javascript}')" style="cursor:pointer">{$derivative_type|@translate} ({$current.derivatives[$derivative_type]->get_size_hr()})</a><br>
{/foreach}
-</p>
+</div>
{/if} \ No newline at end of file
diff --git a/themes/default/theme.css b/themes/default/theme.css
index 73a2e0d20..dfdb2f40e 100644
--- a/themes/default/theme.css
+++ b/themes/default/theme.css
@@ -338,6 +338,19 @@ TD.calDayHead {
#imageToolBar .pwg-button {width:42px;}
+#derivativeSwitchLink {
+ padding: 0.2em;
+ position: absolute;
+ left: 5px;
+ top: 100px;
+}
+
+#derivativeSwitchBox {
+ padding: 0.5em;
+ border-radius: 4px;
+ z-index: 100;
+}
+
#theImage {
clear: left;
text-align: center;