gogogo

mrshll · Nov 14, 2012 · 1ba4625 · 1ba4625
1 parent c97009b
commit 1ba4625
Show file tree

Hide file tree

Showing 3 changed files with 127 additions and 0 deletions.
diff --git a/fullScreenYoutube/index.html b/fullScreenYoutube/index.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html>
+
+  <head>
+    <meta charset=utf-8>
+    <title></title>
+
+    <meta name="viewport" content="width=device-width">
+
+    <style>
+      html { background: black; }
+    </style>
+
+    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
+
+  </head>
+
+  <body>
+
+    <iframe width="560" height="315" src="http://www.youtube.com/embed/3wPK3VIeT8I" frameborder="0" allowfullscreen></iframe>
+
+    <script>// By Chris Coyier & tweaked by Mathias Bynens
+
+      $(function() {
+
+        // Find all YouTube videos
+        var $allVideos = $("iframe[src^='http://www.youtube.com']"),
+
+        // The element that is fluid width
+        $fluidEl = $("body");
+
+        // Figure out and save aspect ratio for each video
+        $allVideos.each(function() {
+
+          $(this)
+          .data('aspectRatio', this.height / this.width)
+
+          // and remove the hard coded width/height
+          .removeAttr('height')
+          .removeAttr('width');
+
+        });
+
+        // When the window is resized
+        // (You'll probably want to debounce this)
+        $(window).resize(function() {
+
+          var newWidth = $fluidEl.width();
+
+          // Resize all videos according to their own aspect ratio
+          $allVideos.each(function() {
+
+            var $el = $(this);
+            $el
+            .width(newWidth)
+            .height(newWidth * $el.data('aspectRatio'));
+
+          });
+
+          // Kick off one resize to fix all videos on page load
+        }).resize();
+
+        });</script>
+
+    </body>
+
+  </html>
+
+
diff --git a/splash/.DS_Store b/splash/.DS_Store
diff --git a/splash/index_moz.html b/splash/index_moz.html
@@ -0,0 +1,58 @@
+<html>
+  <head>
+    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+    <script type="text/javascript" src="pixastic.custom.js"></script>
+  </head>
+  <body>
+
+    <img src="jamieface.png" id="jamieimg">
+
+    <!-- <canvas width="1000px" height="1000px" id="jamiecanv"> -->
+    <script type="text/javascript">
+      var hue_val = 30;
+      var iid = null;
+
+      // var canvas = document.getElementById('jamiecanv');
+      // var context = canvas.getContext('2d');
+      // var imageObj = new Image();
+
+      // imageObj.onload = function() {
+      //   context.drawImage(imageObj, 0, 0);
+      // };
+      // imageObj.src = "jamieface.png"
+      $('#jamieimg').live({
+        mouseenter:
+          function() {
+            console.log("Mouse in");
+            if ( !iid ){
+              this._iid = setInterval(function() {
+                  console.log(hue_val);
+
+                  Pixastic.process(document.getElementById('jamieimg'), "hsl", {
+                    hue : hue_val
+                    // saturation : 0,
+                    // lightness : 0
+                  });
+
+                  // hue_val = (hue_val + 1);
+              }, 100);
+
+              iid = this._iid;
+            }
+          },
+        mouseleave:
+          function() {
+            console.log("Mouse out");
+            iid && clearInterval(iid);
+            iid = null;
+          }
+
+      });
+      // $('#jamieimg').live('mouseleave', function(){
+      //       console.log("Mouse out");
+      //       g_iid && clearInterval(g_iid);
+      //     });
+    </script>
+
+  </body>
+</html>