gallery.js in servel-0.19.0

- old
+ new

@@ -1,12 +1,12 @@
 var $;
 
 var Gallery = (function() {
-  var TYPES = ["image", "video", "audio", "text"];
   var urls = [];
   var types = [];
   var currentIndex = 0;
+  var layoutItemMax = false;
   var $gallery;
 
   function initItems() {
     var links = document.querySelectorAll("#listing a.default.media");
     for(var i = 0; i < links.length; i++) {
@@ -17,32 +17,25 @@
     }
   }
 
   function renderText(url) {
     var http = new XMLHttpRequest();
-    http.open("GET", url, true);
+    http.open("GET", url);
     http.onload = function() {
       $("#text-content").innerHTML = ume(http.responseText);
       $("#text").scrollTop = 0;
       $("#text-anchor").focus();
     }
     http.send();
   }
 
   function clearContent() {
-    for(var i = 0; i < TYPES.length; i++) {
-      var type = TYPES[i];
-
-      $gallery.classList.remove(type);
-
-      if(type == "text") {
-        $("#text-content").innerHTML = "";
-      }
-      else {
-        $("#" + type).src = "about:none";
-      }
-    }
+    $gallery.classList.remove("image", "video", "audio", "text");
+    $("#image").src = "about:none";
+    $("#video").src = "about:none";
+    $("#audio").src = "about:none";
+    $("#text-content").innerHTML = "";
   }
 
   function render() {
     clearContent();
 
@@ -125,14 +118,19 @@
       }
       else if(e.target.matches("#page-next-10")) {
         e.stopPropagation();
         fastForward();
       }
-      else if(e.target.matches("#page-toggle-size")) {
+      else if(e.target.matches("#page-jump-listing")) {
         e.stopPropagation();
-        document.body.classList.toggle("split-screen");
+        $("#listing").scrollIntoView();
       }
+      else if(e.target.closest("#page-max-item")) {
+        e.stopPropagation();
+        layoutItemMax = !layoutItemMax;
+        layout();
+      }
     });
 
     window.addEventListener("keydown", function(e) {
       if(e.keyCode == 39 || ((e.keyCode == 32 || e.keyCode == 13) && atBottom())) {
         e.preventDefault();
@@ -143,14 +141,31 @@
         prev();
       }
     });
   }
 
+  function layout() {
+    var viewportHeight = document.documentElement.clientHeight + "px";
+    $gallery.style.minHeight = viewportHeight;
+    $("#controls").style.height = viewportHeight;
+
+    var maxHeight = layoutItemMax ? "none" : viewportHeight;
+    $("#image").style.maxHeight = maxHeight;
+    $("#video").style.maxHeight = maxHeight;
+    $("#audio").style.maxHeight = maxHeight;
+  }
+
+  function initLayout() {
+    window.addEventListener("resize", layout);
+    layout();
+  }
+
   function init() {
     $gallery = $("#gallery");
 
     initItems();
     initEvents();
+    initLayout();
     render();
   }
 
   return {
     init: init,
\ No newline at end of file