voussoir/etiquette
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Improve variables; Focus tag box on zoom and unzoom.

Browse source
This commit is contained in:
voussoir 2017-04-22 21:18:53 -07:00
parent 82ca1a08da
commit 1efdbb33c4
1 changed files with 16 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
templates/photo.html
View file

@ -83,6 +83,7 @@
max-width: 100%; max-width: 100%;
max-height: 100%; max-height: 100%;
width: 100%; width: 100%;
overflow: hidden;
} }
#refresh_metadata_button #refresh_metadata_button
{ {
@ -294,32 +295,32 @@ function refresh_metadata(photoid)
function enable_hoverzoom() function enable_hoverzoom()
{ {
console.log("enable"); console.log("enable zoom");
div = document.getElementById("photo_img_holder"); img_holder = document.getElementById("photo_img_holder");
img = document.getElementById("photo_img"); img = document.getElementById("photo_img");
if (img.naturalWidth < div.offsetWidth && img.naturalHeight < div.offsetHeight) if (img.naturalWidth < img_holder.offsetWidth && img.naturalHeight < img_holder.offsetHeight)
{ {
return; return;
} }
img.style.opacity = 0; img.style.opacity = "0";
img.style.display = "none"; img.style.display = "none";
div.style.cursor = "zoom-out"; img_holder.style.cursor = "zoom-out";
div.style.backgroundImage = "url('{{file_link}}')"; img_holder.style.backgroundImage = "url('{{file_link}}')";
div.onmousemove = move_hoverzoom; img_holder.onmousemove = move_hoverzoom;
setTimeout(function(){div.onclick = disable_hoverzoom;}, 100); setTimeout(function(){img_holder.onclick = toggle_hoverzoom;}, 100);
return true; return true;
} }
function disable_hoverzoom() function disable_hoverzoom()
{ {
console.log("disable"); console.log("disable zoom");
div = document.getElementById("photo_img_holder"); img_holder = document.getElementById("photo_img_holder");
img = document.getElementById("photo_img"); img = document.getElementById("photo_img");
img.style.opacity = 100; img.style.opacity = "100";
div.style.cursor = ""; img_holder.style.cursor = "";
img.style.display=""; img.style.display="";
div.style.backgroundImage = "none"; img_holder.style.backgroundImage = "none";
div.onmousemove = null; img_holder.onmousemove = null;
div.onclick = null; img_holder.onclick = null;
} }
function toggle_hoverzoom() function toggle_hoverzoom()
{ {