Some infobox adjustments.

[pr0n] / files / pr0n-fullscreen.js

diff --git a/files/pr0n-fullscreen.js b/files/pr0n-fullscreen.js
index 86e73a731fafd77fc38bc81c296a5c4e60b06cf5..076c626a9a81c49dc59a22189ead0eebef165f83 100644 (file)
--- a/files/pr0n-fullscreen.js
+++ b/files/pr0n-fullscreen.js
@@ -104,7 +104,7 @@ function rename_element(old_name, new_name)
        return elem;
 }
 
-function display_image(url, backend_width, backend_height, elem_id, offset, preload)
+function display_image(url, backend_width, backend_height, elem_id, offset, box)
 {
        // See if this image already exists in the DOM; if not, add it.
        var img = document.getElementById(elem_id);
@@ -112,7 +112,7 @@ function display_image(url, backend_width, backend_height, elem_id, offset, prel
                img = document.createElement("img");
                img.id = elem_id;
                img.alt = "";
-               img.className = preload ? "fsbox" : "fsimg";
+               img.className = box ? "fsbox" : "fsimg";
        }
        img.style.position = "absolute";
        img.style.transformOrigin = "top left";
@@ -120,7 +120,7 @@ function display_image(url, backend_width, backend_height, elem_id, offset, prel
 
        if (offset === 0) {
                img.src = url;
-               position_image(img, backend_width, backend_height, offset, preload);
+               position_image(img, backend_width, backend_height, offset, box);
        } else {
                // This is a preload, so wait for the main image to be ready.
                // The test for .complete is an old IE hack, which I don't know if is relevant anymore.
@@ -134,7 +134,10 @@ function display_image(url, backend_width, backend_height, elem_id, offset, prel
                // Seemingly one needs to delay position_image(), or Firefox will set the initial
                // scroll offset completely off.
                img.style.display = 'none';
-               setTimeout(function() { position_image(img, backend_width, backend_height, offset, preload); img.style.display = null; }, 1);
+               setTimeout(function() {
+                       position_image(img, backend_width, backend_height, offset, box);
+                       img.style.display = null;
+               }, 1);
        }
 }
 
@@ -218,7 +221,7 @@ function set_opacity(id, amount)
        elem.style.opacity = amount;
 }
 
-function position_image(img, backend_width, backend_height, offset, preload)
+function position_image(img, backend_width, backend_height, offset, box)
 {
        var screen_size = find_width();
        var dpr = find_dpr();
@@ -240,15 +243,17 @@ function position_image(img, backend_width, backend_height, offset, preload)
        var left = (screen_size[0] - width) / 2;
        var top = (screen_size[1] - height) / 2;
 
-       if (global_infobox) top -= dpr * (24/2);
+       if (global_infobox) {
+               top = Math.max(top - dpr * (24/2), 0);
+       }
 
        // center the image on-screen
        img.style.position = "absolute";
        img.style.left = (left / dpr) + "px";
        img.style.transform = "translate(" + extra_x_offset + "px,0px)";
 
-       if (preload) {
-               img.style.top = (top + height) / dpr + "px";
+       if (box) {
+               img.style.top = Math.min(top + height, screen_size[1] - 24) / dpr + "px";
        } else {
                img.style.top = (top / dpr) + "px";
                img.style.lineHeight = (height / dpr) + "px";
@@ -381,11 +386,11 @@ function draw_text(msg)
        text.style.font = "24px verdana, arial, sans-serif";
        text.innerHTML = msg;
 
-       var main = document.getElementById("main");
-       main.appendChild(text);
+       document.getElementById("main").appendChild(text);
 
-       text.style.left = (main.clientWidth - text.clientWidth) / 2 + "px";
-       text.style.top = (main.clientHeight - text.clientHeight) / 2 + "px";
+       var screen_size = find_width();
+       text.style.left = (screen_size[0] - text.clientWidth) / 2 + "px";
+       text.style.top = (screen_size[1] - text.clientHeight) / 2 + "px";
 }
 
 function fade_text(opacity)
@@ -414,7 +419,7 @@ function select_image(evt, filename, selected)
        }
        
        var req = new XMLHttpRequest();
-       req.open("POST", window.location.origin + "/select", false);
+       req.open("POST", window.location.origin + "/select", true);
        req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        req.send("event=" + evt + "&filename=" + filename + "&selected=" + selected);
 
@@ -504,6 +509,12 @@ function set_swipe_pos(x, transition)
 {
        x = Math.max(x, -window.innerWidth);
        x = Math.min(x,  window.innerWidth);
+       if (!can_go_previous()) {
+               x = Math.min(x, window.innerWidth / 8);
+       }
+       if (!can_go_next()) {
+               x = Math.max(x, -window.innerWidth / 8);
+       }
 
        var dpr = find_dpr();
        var main = document.getElementById("main");
@@ -535,10 +546,10 @@ function end_swipe(e)
 {
        if (swiping) {
                var new_x = (e.changedTouches[0].pageX - swipe_start_x);
-               if (new_x < -window.innerWidth / 4) {
+               if (new_x < -window.innerWidth / 4 && can_go_next()) {
                        set_swipe_pos(-window.innerWidth, "transform 0.1s ease-out");
                        setTimeout(function() { go_next(); }, 100);
-               } else if (new_x > window.innerWidth / 4) {
+               } else if (new_x > window.innerWidth / 4 && can_go_previous()) {
                        set_swipe_pos(window.innerWidth, "transform 0.1s ease-out");
                        setTimeout(function() { go_previous(); }, 100);
                } else {
@@ -554,7 +565,6 @@ function swipe(e)
                var new_x = (e.changedTouches[0].pageX - swipe_start_x);
                set_swipe_pos(new_x, null);
        }
-       e.preventDefault();
 }
 
 window.onload = function() {