jplayer added

chrismatthieu · Jun 23, 2011 · 69ee953 · 69ee953
1 parent 28bc559
commit 69ee953
Show file tree

Hide file tree

Showing 12 changed files with 657 additions and 34 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/public/.DS_Store b/public/.DS_Store
diff --git a/public/index.html b/public/index.html
@@ -21,43 +21,111 @@
 
     <!-- CSS: implied media="all" -->
     <link rel="stylesheet" href="stylesheets/style.css">
+    <link type="text/css" href="stylesheets/skin/jplayer.blue.monday.css" rel="stylesheet" />
+
+                              <!--$ccc,.            .,,.
+                        .,cchc $$$$$$$$$$$c,    ,c$$$$$$c
+                      ,$$$$$$$ ?$$$$$$$"""',,c$$$$$??""$$L
+                    c$$$$$$$$$:$$$$$$$$$$$$?????"",n ?$$$
+                  ,$$$$$$$$$$$ J$$$$$$F"$$$$h uMMMMMMb $$$-.,,,,.
+                 c$$$$$$$$$$$F,$$$$$$P',$$$$$ MP""""MM,?$$cJ$$$$$$
+                $$$$$$$$$$$$F J$$$$$$c$$$$$$$.'     4M J?????$F $$
+              ,$$$$$F"$$$$$F J$$$$$$$$$$$$??$$c,     ,' xdMbn, d$$
+              $$$L`P',$$$$F J$$$$$$$$$$$$$ d$$$$$$$$$ xPPPPMMM $$P
+              $$$',$$$$$$P J$$$$$$$$$$$$$$cc$$$$$$$$$      4MP $$F
+            , $$$$$$$$P"  J$$$$$$$$$$$$$$$$$$$$$$$$$$h     JP' $$'
+            $c "$$$P"'..: $$$$$$$$$$$$$$$$$$$$$$$$$$$$$c,,... J$$
+           d$$$c,,. .::::.?$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$cJ$F
+         ,$$$$$$$$$ ::::: ?$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$'
+        z$$$$$$$$$F :::: .?$$$$$$$$$$$$$$$$$$$$$$$$$$."$")$$$$$$
+       z$$$$$$$$$$> :: ,dL`$$$$$$$$$$$$$$$$$$$$$$$$$$$ccd$$$$$$$c
+     .d$$$.`" $$$$'.: uMM" $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$.
+     $$$F"$P"$$$$$ :  P" . $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
+    $$$$$hcc$$$$$$ :...:'  ?$$h`"".$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$h
+    $$$$$$$$$$$$$$ ``_` ,M>`$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$.
+    $$$$$$$$$$$$$$ dMP JMM"  ""3$$"$"3$$$$$$$????$$$$$$$$$$$$$$$$$$h
+    $$$$$$$$$$$$$$ P  dMP .:`$$$$$ccc$$$$$$(,cccc ?$$$$$$$$$$$$$$$$$L
+    $$$$$$$$$$$$$P  ..' .::: $$$$$$$$$$$$$$$????$L $$$$$$$$$$$$$$$$$$
+    $$$$$$$$$$$$$F :::'''::' ?$$$$$$$$$$$$$Lcch ?$ $$$$$$$$$$$$$$$$$$c
+    $$$$$$$$$$$$$F ' ,mn ',db ?$$$$$$$$$$$$$$$$',$$$$$$$$$$$$$$$$$$$$$.
+    $$$$$$$$$$$$$L nMM" ,dMMP '$$$$$$$$$$$$$$$P $$$$$$$$$$$$$$$$$$$$$$h
+    $$$$$?$$$$$$$$ MP . MP" .. 3$C""$$$$$$$$$$cd$$$$$$$$$$$$$$$$$$??$?$.
+    $$$$$ $$$$$$$$ " ::....:::: 3$cd$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$hccc$$
+    $$$$$ $$$$$$$$  ::''`,`:' ,n $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$???$$$$$r
+    $$$$$ $$$$$$$$$  ,ndM .'.dMM `?$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ccc$$$$$F
+    $$$$P $L`".$$$$.4MM" .'.MP"... ?$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"" ,.
+    C"",dc`$$$$$$$$F`" .::....:::: ."?$$$$$$$$$$$$$$$$$$$$$$$$$$$$$hJ$$$$L
+    $$$$$$r'$$$$C"$$ ::::::``:::: nMb."?$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
+    $$$$$$$ "$$$$ $$c `` ,nM .:' dMP" . "$$$$$$$$$$$$$$$$$$$$$$$$$$".,.`$P
+    $$$$$$$$c ?$$."$$c 4MM" .:: `" .::' , ?$$$$$$$$$$$$$$$$$$$$$$$L,$$P "
+    $$$$$$$$$$.`?h $$$c 4'.:::'::'':: uMMM- "?$$$$$$$$"??3$$$$$$$$$$P"
+    $$$$$$$$$$$h.` `$$$h ''` ,mnr .:',MP" .:  "?$$$$$$$P?$$$$$$$$$P
+    $$$$$$$$$$$$$hc `$$$$c =MMP" :::.   .:: ,dMn."?$?$$hc,.$$$$$$P
+    $$$$.""$$$$$$P"   "?$$h,"P .::',nmn :: JMMP".. ` -z$$$$$$$$$"
+    $$$$$$$$$$$$"       "$$$h, ``,nMMP .:: ""..::',nMp`"?$$$$$P'
+    $$$$$$$$$$P           "$$$hc 4P"'.::'''_``:`,nMP"     `""'
+    $$$$$$$$P"              "?$$$c.'''',ndP" -' `"
+    $$$$$$$"                  `?$$$c, "4P'.. c
+    $$$$$"                       "?$$$hc, ``,P
+    $$P"                            "?$$$$cc$'
+    ""   cccc,                          """"
+         `"?$$h.
+      .,,.  `?$$.
+      $$$$hc, ?$$.
+      "??$$$$c,3$$
+            "?$$$F
+          ,$hd$P
+         ,$$$"
+       ,$$$"
+      ,$$$F
+     ,$$$$
+    J$$$$F
+    $$$$$'
+    $$$$F
+    $$$F
+    -->
+
 	</head>
 
   <body> 
-
-                               <!--    
-                               //|                              ,|
-                             //,/                             -~ |
-                           // / |                         _-~   /  ,
-                         /'/ / /                       _-~   _/_-~ |
-                        ( ( / /'                   _ -~     _-~ ,/'
-                         \~\/'/|             ____~~____\ _-~  _/,
-                 ,,)))))));, \/~-_     ____~~  __~~  __/~  _-~ /
-              __))))))))))))));,>/\   /        ____~~  \-~~ _-~
-             -\(((((''''(((((((( >~\/     __~~   ____~' _-~ ~|
-    __==//////((''  .     `)))))), /     _____-~~  ~~\~~____~ 
-            ))| @    ;-.     (((((/           _____~~'~~/
-            ( `|    /  )      )))/      ~~~~~__\____-~~____~~___
-               |   |   |       (/      __-~~~/______-~~  ,;::'  \         ,
-               o_);   ;        /      ____~~/           \,-~~~\  |       /|
-                     ;        (      __-~~/         `:::|      |;|      < >
-                    |   _      `____~~~~'      /      `:|       \;\_____// 
-              ______/\/~    |                 /        /         ~______~
-            /~;;.____/;;'  /          _______(   `;;;/               
-           / //  _;______;'_______~~~~~    |;;/\    /          
-          //  | |                        /  |  \;;,\              
-         (<_  | ;                      /',/_____'  _>
-          \_| ||_                     //~;~~~~~~~~~ 
-              `\_|                   (,~~ 
-                                      \~\ 
-                                       -->     
     <article>
       <h1>You've got the love</h1>
       <br>
       <h3>Mark Knight</h3>
       <br>
   	  <footer><small>&copy;2011 <a href="http://helloworld.im" title="Hello World">Hello World</a>.</small></footer>
 	  </article>
+
+	  <br>
+	  <div id="console" class="jp-jplayer"></div>
+    <div class="jp-audio">
+      <div class="jp-type-single">
+        <div id="jp_interface_1" class="jp-interface">
+          <ul class="jp-controls">
+            <li><a href="#" class="jp-play" tabindex="1">play</a></li>
+            <li><a href="#" class="jp-pause" tabindex="1">pause</a></li>
+            <li><a href="#" class="jp-stop" tabindex="1">stop</a></li>
+            <li><a href="#" class="jp-mute" tabindex="1">mute</a></li>
+            <li><a href="#" class="jp-unmute" tabindex="1">unmute</a></li>
+          </ul>
+          <div class="jp-progress">
+            <div class="jp-seek-bar">
+              <div class="jp-play-bar"></div>
+            </div>
+          </div>
+          <div class="jp-volume-bar">
+            <div class="jp-volume-bar-value"></div>
+          </div>
+          <div class="jp-current-time"></div>
+          <div class="jp-duration"></div>
+        </div>
+        <div id="jp_playlist_1" class="jp-playlist">
+          <ul>
+            <li>Title of media</li>
+          </ul>
+        </div>
+      </div>
+    </div>
 
     <!-- Hydrophilia Iced provided by Typekit -->
     <script src="http://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script>
@@ -73,6 +141,24 @@ <h3>Mark Knight</h3>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
     <script>window.jQuery || document.write("<script src='javascripts/jquery-1.5.1.min.js'>\x3C/script>")</script>
 
+    <!-- jPlayer -->
+    <script type="text/javascript" src="/javascripts/jquery.jplayer.min.js"></script>
+
+    <script type="text/javascript">
+      $(document).ready(function(){ 
+            $("#console").jPlayer({ 
+              ready: function () { 
+                $(this).jPlayer("setMedia", { 
+                  m4a: "http://mp3-vr-128.as34763.net/;stream/1" 
+                }); 
+              }, 
+              swfPath: "/jplayer", 
+              supplied: "m4a", 
+              nativeSupport: "false" 
+            }); 
+          });
+    </script>
+
     <!-- github.com/srobbin/jquery-backstretch Replace background.jpg with your own image -->
     <script type="text/javascript" src="javascripts/jquery.backstretch.min.js"></script>
     <script type="text/javascript">
@@ -86,7 +172,7 @@ <h3>Mark Knight</h3>
 
     <!-- mathiasbynens.be/notes/async-analytics-snippet Change UA-XXXXX-X to be your site's ID -->
     <script>
-      var _gaq=[["_setAccount","UA-10020436-27"],["_trackPageview"]];
+      var _gaq=[["_setAccount","UA-10020436-28"],["_trackPageview"]];
       (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1;
       g.src=("https:"==location.protocol?"//ssl":"//www")+".google-analytics.com/ga.js";
       s.parentNode.insertBefore(g,s)}(document,"script"));

diff --git a/public/javascripts/Jplayer.swf b/public/javascripts/Jplayer.swf