edits

1 files changed, 29 insertions, 4 deletions

diff --git a/site/public/assets/javascripts/_env.js b/site/public/assets/javascripts/_env.js
index 45d5231..3a72e13 100644
--- a/site/public/assets/javascripts/_env.js
+++ b/site/public/assets/javascripts/_env.js
@@ -286,6 +286,21 @@ function build_scene () {
     offset: 200,
   }) )
   
+  var wasPrev = false, navWidth
+  function resize_for_prev_next(){
+    navWidth = $("nav").width()
+  }
+  resize_for_prev_next()
+  $(window).resize(resize_for_prev_next)
+  $(window).mousemove(function(e){
+    if (! gallery) return
+    prev = ((e.pageX - navWidth) / window.innerWidth) < 0.39
+    if (prev !== wasPrev) {
+      wasPrev = prev
+      $("#okgallery").toggleClass("prev", prev)
+    }
+  })
+  
 	strips.forEach(function(strip){ strip.update(0) })
 	
 	scene.update()
@@ -416,9 +431,15 @@ function build_gallery () {
   })
 
   $("#okgallery .video").each(function(){
-    var $play = $('<div class="play"></div>')
     var $el = $(this)
+    if (! is_mobile) {
+      var $underlay = $('<div class="underlay"></div>')
+      $underlay.css("background-image", $el.css("background-image"))
+      $el.css("background-image", 'none')
+    }    
+    var $play = $('<div class="play"></div>')
     $el.append($play)
+    $el.append($underlay)
     if (is_desktop) {
       $play.on("click", function(e){
         e.stopPropagation()
@@ -454,7 +475,11 @@ function build_gallery () {
       // load_video($el)
     }
     else {
-      gallery.next()
+      if ($("#okgallery").hasClass("prev")) {
+        gallery.previous()
+      } else {
+        gallery.next()
+      }
     }
   })
   gallery.loader.on("progress", function(imagesLoaded, loadingImage){
@@ -484,8 +509,8 @@ function load_video ($el) {
   var $embed = $('<iframe src="https://player.vimeo.com/video/' + vimeo_id + '?autoplay=1&title=0&byline=0&portrait=0" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>')
   $el.append($embed)
   if (! is_mobile) {
-    var $mask = $('<div class="mask"></div>')
-    $el.append($mask)
+//     var $mask = $('<div class="mask"></div>')
+//     $el.append($mask)
   }
   var player = $f( $el.find("iframe")[0] )
   $el.data('player', player)