Fix centering of text again.

[pr0n] / files / pr0n-fullscreen.js

diff --git a/files/pr0n-fullscreen.js b/files/pr0n-fullscreen.js
index 14b080d5d830766750c0c9ac69b14dba4f11beff..d9d37c6131b8226a952e95677f2991d9e404f2d2 100644 (file)
--- a/files/pr0n-fullscreen.js
+++ b/files/pr0n-fullscreen.js
@@ -169,6 +169,7 @@ function display_image_num(num, offset)
                        url = window.location.origin + "/" + evt + "/" + backend_width + "x" + backend_height + "@" + dpr.toFixed(2) + "/box/" + filename;
                }
                display_image(url, adjusted_size[2], adjusted_size[3], elem_id, offset, true);
+               document.getElementById(elem_id).style.transform += " scale(" + (1.0 / dpr) + ")";
        }
 
        if (offset === 0) {
@@ -380,11 +381,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)
@@ -413,7 +414,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);
 
@@ -496,10 +497,79 @@ function toggle_immersive() {
 }
 window['toggle_immersive'] = toggle_immersive;
 
+var swiping = false;
+var swipe_start_x = 0;
+
+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");
+       var children = main.children;
+       var to_remove = [];
+       for (var i = 0; i < children.length; i++) {
+               var child = children[i];
+               if (child.className === "fsimg") {
+                       var inum = parseInt(child.id);
+                       var offset = inum - global_image_num;
+                       child.style.transition = transition;
+                       child.style.transform = "translate(" + (x + find_width()[0] * offset / dpr) + "px,0px)";
+               } else if (child.className === "fsbox") {
+                       var inum = parseInt(child.id.replace("_box", ""));
+                       var offset = inum - global_image_num;
+                       child.style.transition = transition;
+                       child.style.transform = "translate(" + (x + find_width()[0] * offset / dpr) + "px,0px) scale(" + (1.0 / dpr) + ")";
+               }
+       }
+}
+
+function start_swipe(e)
+{
+       swiping = true;
+       swipe_start_x = e.changedTouches[0].pageX;
+}
+
+function end_swipe(e)
+{
+       if (swiping) {
+               var new_x = (e.changedTouches[0].pageX - swipe_start_x);
+               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 && can_go_previous()) {
+                       set_swipe_pos(window.innerWidth, "transform 0.1s ease-out");
+                       setTimeout(function() { go_previous(); }, 100);
+               } else {
+                       set_swipe_pos(0, "transform 0.1s ease-out");
+               }
+               swiping = false;
+       }
+}
+
+function swipe(e)
+{
+       if (swiping) {
+               var new_x = (e.changedTouches[0].pageX - swipe_start_x);
+               set_swipe_pos(new_x, null);
+       }
+}
+
 window.onload = function() {
        relayout();
        setInterval(check_for_hash_change, 1000);
 
+       document.addEventListener('touchstart', start_swipe, false);
+       document.addEventListener('touchend', end_swipe, false);
+       document.addEventListener('touchmove', swipe, false)
+
        var body = document.body;
        body.onresize = function() { relayout(); };
        body.onkeydown = function(evt) { key_down(evt.keyCode); };