Arreglando diseño para móviles

1 files changed, 53 insertions, 159 deletions

diff --git a/static/js/weabot.js b/static/js/weabot.js
index 6557f66..9ab84f3 100644
--- a/static/js/weabot.js
+++ b/static/js/weabot.js
@@ -40,9 +40,7 @@ function insert(text) {
       // IE
       var caretPos = textarea.caretPos;
       caretPos.text =
-        caretPos.text.charAt(caretPos.text.length - 1) == " "
-          ? text + " "
-          : text;
+        caretPos.text.charAt(caretPos.text.length - 1) == " " ? text + " " : text;
     } else if (textarea.setSelectionRange) {
       // Firefox
       var start = textarea.selectionStart;
@@ -58,25 +56,19 @@ function insert(text) {
   return false;
 }
 
-function quote(b, a) {
-  var v = eval("document." + a + ".message");
-  v.value += ">>" + b + "a\ndfs";
-  v.focus();
-}
-
 function checkhighlight() {
   var match;
-  if ((match = /#i([0-9]+)/.exec(document.location.toString())))
+  if ((match = /#i([0-9]+)/.exec(document.location.toString()))) {
     if (!document.forms.postform.message.value)
       insert(">>" + match[1] + "\r\n");
-  if ((match = /#([0-9]+)/.exec(document.location.toString())))
+  } else if ((match = /#([0-9]+)/.exec(document.location.toString()))) {
     highlight(match[1]);
+  }
 }
 
 function highlight(post) {
-  var cells = document.getElementsByClassName("reply");
-  for (var i = 0; i < cells.length; i++)
-    if (cells[i].className == "reply highlight") cells[i].className = "reply";
+  var hl = document.getElementsByClassName("reply highlight");
+  if (hl.length) { hl[0].className = "reply"; }
   var reply = document.getElementById("reply" + post);
   if (reply) {
     reply.className = "reply highlight";
@@ -92,16 +84,15 @@ function expandimg(e) {
   var img_w = parseInt(e.dataset.w);
   var img_h = parseInt(e.dataset.h);
   var thumb_w = parseInt(e.dataset.tw);
+  if (thumb_w < 1) return true;
   var thumb_h = parseInt(e.dataset.th);
   var format = img_url.substring(img_url.lastIndexOf(".") + 1, img_url.length);
   var exp_vid = 0;
 
   if (window.innerWidth > 900)
-    var ratio = Math.min((window.innerWidth - 130) / img_w, 1);
+  var ratio = Math.min((window.innerWidth - 130) / img_w, 1);
   else var ratio = Math.min((window.innerWidth - 40) / img_w, 1);
 
-  if (thumb_w < 1) return true;
-
   var img_cont = document.getElementById("thumb" + post_id);
   var post_block = img_cont.parentElement.parentElement.getElementsByTagName(
     "blockquote"
@@ -117,18 +108,17 @@ function expandimg(e) {
     }
 
   if (img) {
-    if (format == "webm" && exp_vid == 0)
+    if (format == "webm" || format == "mp4" && exp_vid == 0)
       var new_img = document.createElement("video");
     else var new_img = document.createElement("img");
+    
     new_img.setAttribute("class", "thumb");
     new_img.setAttribute("alt", "" + post_id);
 
-    if (
-      img.getAttribute("width") == "" + thumb_w &&
-      img.getAttribute("height") == "" + thumb_h
-    ) {
+    if (img.getAttribute("width") == "" + thumb_w &&
+    img.getAttribute("height") == "" + thumb_h) {
       // thumbnail -> fullsize
-      if (format == "webm") {
+      if (format == "webm" || format == "mp4") {
         new_img.setAttribute("controls", "");
         new_img.setAttribute("loop", "");
         new_img.setAttribute("autoplay", "");
@@ -136,19 +126,14 @@ function expandimg(e) {
       new_img.setAttribute("src", "" + img_url);
       new_img.setAttribute("width", img_w);
       new_img.setAttribute("height", img_h);
-      new_img.setAttribute(
-        "style",
-        "max-width:" +
-          Math.floor(img_w * ratio) +
-          "px;max-height:" +
-          Math.floor(img_h * ratio) +
-          "px;"
-      );
+      new_img.setAttribute("style", "max-width:" +
+        Math.floor(img_w * ratio) + "px;max-height:" +
+        Math.floor(img_h * ratio) + "px;");
       post_block.setAttribute("style", "");
       img_cont.style.display = "table";
     } else {
       // fullsize -> thumbnail
-      if (format == "webm") {
+      if (format == "webm" || format == "mp4") {
         new_img.removeAttribute("controls");
         new_img.removeAttribute("loop");
         new_img.removeAttribute("autoplay");
@@ -156,14 +141,9 @@ function expandimg(e) {
       new_img.setAttribute("src", "" + thumb_url);
       new_img.setAttribute("width", thumb_w);
       new_img.setAttribute("height", thumb_h);
-      post_block.setAttribute(
-        "style",
-        "margin-left:" +
-          (parseInt(thumb_w) + 40) +
-          "px;max-width:" +
-          (1000 - parseInt(thumb_w)) +
-          "px"
-      );
+      post_block.setAttribute("style", "margin-left:" +
+        (parseInt(thumb_w) + 40) + "px;max-width:" +
+        (1000 - parseInt(thumb_w)) + "px");
       img_cont.removeAttribute("style");
     }
 
@@ -179,20 +159,6 @@ function filePreview(e) {
   var prev = document.getElementById("filepreview");
   var noimg = document.getElementById("noimage");
   if (noimg) noimg = document.getElementById("noimage").parentNode;
-  if (file.size > maxsize * 1024) {
-    inpt.value = "";
-    return alert(
-      "El archivo es muy grande. El tamaño máximo es " + maxsize + " KB."
-    );
-  }
-  if (
-    !types.includes(
-      inpt.value.slice(inpt.value.lastIndexOf(".") + 1).toUpperCase()
-    )
-  ) {
-    inpt.value = "";
-    return alert("Tipo de archivo no soportado.");
-  }
   var read = new FileReader();
   read.readAsDataURL(file);
   read.onload = function() {
@@ -202,10 +168,8 @@ function filePreview(e) {
     var fname =
       file.name.length < 20 ? file.name : file.name.substr(0, 19) + "…";
     if (file.type.startsWith("image"))
-      prev.insertAdjacentHTML(
-        "beforeend",
-        '<img class="thumbpreview" src="' + read.result + '" /> ' + fname
-      );
+      prev.insertAdjacentHTML("beforeend",
+        '<img class="thumbpreview" src="' + read.result + '" /> ' + fname);
     else prev.insertAdjacentHTML("beforeend", fname);
     prev.appendChild(document.createTextNode(" ["));
     var btn = document.createElement("a");
@@ -286,25 +250,15 @@ function catSort(type) {
   var elem = document.getElementsByClassName("thread");
   var arr = Array.prototype.slice.call(elem);
   if (type == 0)
-    arr.sort(function(a, b) {
-      return a.dataset.num - b.dataset.num;
-    });
+    arr.sort(function(a, b) { return a.dataset.num - b.dataset.num; });
   else if (type == 1)
-    arr.sort(function(a, b) {
-      return b.dataset.id - a.dataset.id;
-    });
+    arr.sort(function(a, b) { return b.dataset.id - a.dataset.id; });
   else if (type == 2)
-    arr.sort(function(a, b) {
-      return a.dataset.id - b.dataset.id;
-    });
+    arr.sort(function(a, b) { return a.dataset.id - b.dataset.id; });
   else if (type == 3)
-    arr.sort(function(a, b) {
-      return b.dataset.res - a.dataset.res;
-    });
+    arr.sort(function(a, b) { return b.dataset.res - a.dataset.res; });
   else if (type == 4)
-    arr.sort(function(a, b) {
-      return a.dataset.res - b.dataset.res;
-    });
+    arr.sort(function(a, b) { return a.dataset.res - b.dataset.res; });
   for (var j = 0; j < arr.length; j++) cont.appendChild(arr[j]);
   localStorage.setItem("catalog", JSON.stringify(opcs));
 }
@@ -347,7 +301,7 @@ function catTeasers(teaser) {
     var style = document.createElement("style");
     style.id = "teaser_style";
     style.type = "text/css";
-    style.innerText = "#catalog p{display:none}";
+    style.innerText = "#catalog p {display:none}";
     document.head.appendChild(style);
     btn.innerText = "Mostrar";
   } else {
@@ -361,14 +315,9 @@ function catTeasers(teaser) {
 function catMenu(e) {
   var brd = document.getElementsByName("board")[0].value;
   var id = this.dataset.id;
-  this.insertAdjacentHTML(
-    "afterbegin",
+  this.insertAdjacentHTML("afterbegin",
     '<div id="thread_ctrl" style="margin-bottom:3px;">[<a href="/cgi/report/' +
-      brd +
-      "/" +
-      id +
-      '">Denunciar</a>] [<a href="#" class="hh">Ocultar</a>]'
-  );
+    brd + "/" + id + '">Denunciar</a>] [<a href="#" class="hh">Ocultar</a>]');
   this.getElementsByClassName("hh")[0].addEventListener("click", function(e) {
     document.getElementById("cat" + id + brd).style.display = "none";
     hiddenthreads.push(id + brd);
@@ -403,9 +352,7 @@ function catHidden() {
     e.preventDefault();
     for (var i = 0; i < hiddenthreads.length; i++) {
       try {
-        document
-          .getElementById("cat" + hiddenthreads[i])
-          .removeAttribute("style");
+        document.getElementById("cat" + hiddenthreads[i]).removeAttribute("style");
       } catch (err) {
         continue;
       }
@@ -437,28 +384,6 @@ function applyTheme() {
   set_stylesheet(newTheme);
 }
 
-function readableSize(B) {
-  var thresh = 1024;
-  if (Math.abs(B) < thresh) return B + " B";
-  var units = ["KB", "MB", "GB"];
-  var u = -1;
-  do {
-    B /= thresh;
-    ++u;
-  } while (Math.abs(B) >= thresh && u < units.length - 1);
-  return B.toFixed(1) + " " + units[u];
-}
-
-function fixFileSize() {
-  var obj = document.getElementsByClassName("fs");
-  for (var i = 0; i < obj.length; i++) {
-    var parts = obj[i].childNodes[2].textContent.split(" B, ");
-    var filesize = parts[0].substring(2);
-    obj[i].childNodes[2].textContent =
-      "-(" + readableSize(filesize) + ", " + parts[1];
-  }
-}
-
 document.addEventListener("DOMContentLoaded", function(e) {
   checkhighlight();
   if (localStorage.hasOwnProperty("weabot"))
@@ -474,33 +399,13 @@ document.addEventListener("DOMContentLoaded", function(e) {
     }
   }
 
-  if (screen.width < 720) {
-    var head = document.getElementById("main_nav");
-    var b = head.getElementsByTagName("a");
-    var s = document.createElement("select");
-    for (var i = 1; i < b.length; i++) {
-      var o = document.createElement("option");
-      o.value = b[i].href;
-      o.textContent = b[i].textContent;
-      if (b[i].className == "cur_brd") o.defaultSelected = true;
-      s.appendChild(o);
-    }
-    s.addEventListener("change", function(e) {
-      window.location.href = this.value;
-    });
-    head.removeChild(head.childNodes[0]);
-    head.className = "mob fix";
-    head.insertBefore(s, head.childNodes[0]);
-  }
-
   if (localStorage.hasOwnProperty("hiddenthreads")) {
     hiddenthreads = localStorage.getItem("hiddenthreads").split("!");
     if (document.getElementById("catalog")) {
       hidden_num = 0;
       for (var i = 0; i < hiddenthreads.length; i++) {
         try {
-          document.getElementById("cat" + hiddenthreads[i]).style.display =
-            "none";
+          document.getElementById("cat" + hiddenthreads[i]).style.display = "none";
           hidden_num++;
         } catch (err) {
           continue;
@@ -512,11 +417,8 @@ document.addEventListener("DOMContentLoaded", function(e) {
     } else {
       for (var i = 0; i < hiddenthreads.length; i++) {
         try {
-          document
-            .getElementById("unhide" + hiddenthreads[i])
-            .removeAttribute("style");
-          document.getElementById("thread" + hiddenthreads[i]).style.display =
-            "none";
+          document.getElementById("unhide" + hiddenthreads[i]).removeAttribute("style");
+          document.getElementById("thread" + hiddenthreads[i]).style.display = "none";
         } catch (err) {
           continue;
         }
@@ -529,14 +431,10 @@ document.addEventListener("DOMContentLoaded", function(e) {
     styleSelect.addEventListener("change", applyTheme, false);
     styleSelect.value = localStorage.getItem(style_cookie);
   }
-
+  
   if (document.getElementById("postform")) {
     setInputs("postform");
-    maxsize = document.getElementById("maxsize").innerText;
-    types = document.getElementById("filetypes").innerText.split(", ");
-    if (types.includes("JPG")) types.push("JPEG");
     postform.file.addEventListener("change", filePreview);
-    fixFileSize();
   }
 
   var del = document.getElementById("delform");
@@ -583,25 +481,21 @@ document.addEventListener("DOMContentLoaded", function(e) {
     }
   }
 });
-document.addEventListener(
-  "click",
-  function(e) {
-    var cn = e.target.className;
-    if (cn == "num") {
-      e.preventDefault();
-      postClick(e.target.textContent);
-      return;
-    }
-    if (cn == "tt") {
-      e.preventDefault();
-      togglethread(e.target);
-      return;
-    }
-    if (cn == "expimg") {
-      e.preventDefault();
-      expandimg(e.target);
-      return;
-    }
-  },
-  false
-);
+document.addEventListener("click", function(e) {
+  var cn = e.target.className;
+  if (cn == "num") {
+    e.preventDefault();
+    postClick(e.target.textContent);
+    return;
+  }
+  if (cn == "tt") {
+    e.preventDefault();
+    togglethread(e.target);
+    return;
+  }
+  if (cn == "expimg") {
+    e.preventDefault();
+    expandimg(e.target);
+    return;
+  }
+}, false);