Some opacity tweaks for the immersive experience.
authorSteinar H. Gunderson <sgunderson@bigfoot.com>
Fri, 20 Nov 2015 01:01:16 +0000 (02:01 +0100)
committerSteinar H. Gunderson <sgunderson@bigfoot.com>
Fri, 20 Nov 2015 01:01:16 +0000 (02:01 +0100)
files/pr0n-fullscreen.js
templates/default/fullscreen-footer

index c69f8a7a5830fc92f756356b7736b1db43fc34e1..a52bf8bddf930d3043722e2d0a790e62e3fc42df 100644 (file)
@@ -274,8 +274,8 @@ function relayout()
                prepare_preload(img, global_image_num + 1);
        }
 
-       set_opacity("previous", can_go_previous() ? global_default_opacity : 0.1);
-       set_opacity("next", can_go_next() ? global_default_opacity : 0.1);
+       set_opacity("previous", can_go_previous() ? global_default_opacity : global_disabled_opacity);
+       set_opacity("next", can_go_next() ? global_default_opacity : global_disabled_opacity);
        set_opacity("close", global_default_opacity);
        set_opacity("options", global_default_opacity);
 }
@@ -291,9 +291,9 @@ function go_previous()
                set_opacity("previous", global_default_opacity);
                prepare_preload(img, global_image_num - 1);
        } else {
-               set_opacity("previous", 0.1);
+               set_opacity("previous", global_disabled_opacity);
        }
-       set_opacity("next", can_go_next() ? global_default_opacity : 0.1);
+       set_opacity("next", can_go_next() ? global_default_opacity : global_disabled_opacity);
 }
 
 function go_next()
@@ -307,9 +307,9 @@ function go_next()
                set_opacity("next", global_default_opacity);
                prepare_preload(img, global_image_num + 1);
        } else {
-               set_opacity("next", 0.1);
+               set_opacity("next", global_disabled_opacity);
        }
-       set_opacity("previous", can_go_previous() ? global_default_opacity : 0.1);
+       set_opacity("previous", can_go_previous() ? global_default_opacity : global_disabled_opacity);
 }
 
 function do_close()
@@ -391,14 +391,14 @@ function key_down(which)
 {
        if (which == 39) {   // right
                if (can_go_next()) {
-                       set_opacity("next", 0.99);
+                       set_opacity("next", global_highlight_opacity);
                }
        } else if (which == 37) {   // left
                if (can_go_previous()) {
-                       set_opacity("previous", 0.99);
+                       set_opacity("previous", global_highlight_opacity);
                }
        } else if (which == 27) {   // escape
-               set_opacity("close", 0.99);
+               set_opacity("close", global_higlight_opacity);
        } else {
                check_for_hash_change();
        }
@@ -446,11 +446,15 @@ function check_for_hash_change() {
 
 function toggle_immersive() {
        if (global_default_opacity == 0.7) {
+               global_disabled_opacity = 0.0;
                global_default_opacity = 0.0;
+               global_highlight_opacity = 0.2;
                global_infobox = false;
                document.getElementById('immersivetoggle').innerHTML = 'Show decorations';
        } else {
+               global_disabled_opacity = 0.1;
                global_default_opacity = 0.7;
+               global_highlight_opacity = 1.0;
                global_infobox = true;
                document.getElementById('immersivetoggle').innerHTML = 'Hide all decorations';
        }
index de29479c48be82feaa27d4364719fd31b8f95728..2a3ef75bd17f1bd2cffab87f29f5e9a232372305 100644 (file)
@@ -2,7 +2,9 @@
 var global_return_url = "%RETURNURL%";
 var global_image_num = parse_image_num(%START%);
 var global_select = %SEL%;
+var global_disabled_opacity = 0.1;
 var global_default_opacity = 0.7;
+var global_highlight_opacity = 1.0;
 var global_infobox = true;
 // end generated
     </script>
@@ -10,10 +12,10 @@ var global_infobox = true;
   <body onresize="relayout();" onload="init_ajax(); relayout(); setInterval('check_for_hash_change()', 1000);" onkeydown="key_down(event.keyCode);" onkeyup="key_up(event.keyCode);" onhashchange="check_for_hash_change();" onclick="check_for_hash_change();">
     <div>
       <div class="container" id="main"><div id="iehack"></div></div>
-      <img id="previous" src="/previous.png" alt="&lt;-" onmousedown="if (can_go_previous()) set_opacity('previous', 1.0)" onmouseup="if (can_go_previous()) { set_opacity('previous', global_default_opacity); go_previous(); }" onmouseout="if (can_go_previous()) { set_opacity('previous', global_default_opacity); }" />
-      <img id="next" src="/next.png" alt="-&gt;" onmousedown="if (can_go_next()) set_opacity('next', 1.0)" onmouseup="if (can_go_next()) { set_opacity('next', global_default_opacity); go_next(); }" onmouseout="if (can_go_next()) { set_opacity('next', global_default_opacity); }" />
-      <img id="close" src="/close.png" alt="x" onmousedown="set_opacity('close', 1.0)" onmouseup="set_opacity('close', global_default_opacity); do_close();" onmouseout="set_opacity('close', global_default_opacity);" />
-      <img id="options" src="/options.png" alt="=" onmousedown="set_opacity('options', 1.0)" onmouseup="set_opacity('options', global_default_opacity); toggle_optionmenu();" onmouseout="set_opacity('options', global_default_opacity);" />
+      <img id="previous" src="/previous.png" alt="&lt;-" onmousedown="if (can_go_previous()) set_opacity('previous', global_highlight_opacity)" onmouseup="if (can_go_previous()) { set_opacity('previous', global_default_opacity); go_previous(); }" onmouseout="if (can_go_previous()) { set_opacity('previous', global_default_opacity); }" />
+      <img id="next" src="/next.png" alt="-&gt;" onmousedown="if (can_go_next()) set_opacity('next', global_highlight_opacity)" onmouseup="if (can_go_next()) { set_opacity('next', global_default_opacity); go_next(); }" onmouseout="if (can_go_next()) { set_opacity('next', global_default_opacity); }" />
+      <img id="close" src="/close.png" alt="x" onmousedown="set_opacity('close', global_highlight_opacity)" onmouseup="set_opacity('close', global_default_opacity); do_close();" onmouseout="set_opacity('close', global_default_opacity);" />
+      <img id="options" src="/options.png" alt="=" onmousedown="set_opacity('options', global_highlight_opacity)" onmouseup="set_opacity('options', global_default_opacity); toggle_optionmenu();" onmouseout="set_opacity('options', global_default_opacity);" />
       <div id="optionmenu"><p><a id="origdownload">Download original image</a></p><p><a id="immersivetoggle" href="javascript:toggle_optionmenu();toggle_immersive();">Hide all decorations</a></p></div>
     </div>
   </body>