add android compatibility

src/audioplayer/audioplayer.css

@@ -4,19 +4,17 @@
     margin: 30px 0 20px 0; 
     left :-100px; 
 }
-.title {
-    position: absolute;
-    top: 1%;
-    margin: 30px 0 20px 0;
-}
+
 input.notice{
     background: black;
     color: white;
+    position: absolute;
+    top: 30px;
 }
 
 .progress_time{
-    position: absolute;
-    top: 65%;
+    position: relative;
+    top: -180px;
     margin: 50px 0 20px 0;
 }
 

src/audioplayer/audioplayer.js

-/*global window, rJS, RSVP, console, $, jQuery, URL, location */
+/*global window, rJS, RSVP, console, $, jQuery, URL, location, webkitURL */
 /*jslint nomen: true*/
 
 (function (window, rJS, $, RSVP) {
@@ -24,7 +24,8 @@
     initializeFlag = false,
     list,
     titleSave,
-    playlist = [];
+    playlist = {};
+
   function nextId() {
     if (totalId <= 0) {
       return -1;
@@ -33,6 +34,19 @@
     currentId %= totalId;
     return currentId;
   }
+
+  function orient() {
+    if (window.orientation === 0 || window.orientation === 180) {
+      $("body").attr("class", "portrait");
+      window.orientation = 'portrait';
+      return;
+    }
+    if (window.orientation === 90 || window.orientation === -90) {
+      $("body").attr("class", "landscape");
+      window.orientation = 'landscape';
+    }
+  }
+
   rJS(window)
     .declareAcquiredMethod("pleaseRedirectMyHash", "pleaseRedirectMyHash")
     .allowPublicAcquisition("setCurrentTime", function (value) {
@@ -51,23 +65,26 @@
     })
     .allowPublicAcquisition("nextToPlay", function () {
       var id = nextId(),
-        name = playlist[id];
-
-      io.getIO(name).then(function (file) {
+        name = playlist.url[id];
+      control.setSong("http://localhost:8080/" + name)
+        .then(function () {
+          control.playSong();
+          title.setMessage(playlist.name[id]);
+          animation.showAnimation();
+        });
+      /*      io.getIO(name).then(function (file) {
         control.setSong(URL.createObjectURL(file)).then(function () {
           control.playSong();
-          title.setMessage(name);
+          title.setMessage(playlist.name[id]);
           animation.showAnimation();
         });
-      });
+      });*/
     })
     .allowPublicAcquisition("sendPlaylist", function (value) {
       playlist = value[0];
-      totalId =  playlist.length;  //array parameter
-      if (initializeFlag === false) {
-        that.render();
-        initializeFlag = true;
-      }
+      totalId =  playlist.url.length;  //array parameter
+      initializeFlag = true;
+      that.render();
     })
     .allowPublicAcquisition("sendTotalTime", function (value) {
       time.setMax(value[0]);
@@ -79,7 +96,9 @@
       addMusic_context = array[array.length - 2];
       list_context = array[array.length - 1];
       that = g;
-      initializeFlag = false;
+      window.addEventListener("orientationchange", function (e) {
+        orient();
+      });
       RSVP.all([
         g.getDeclaredGadget(
           "control"
@@ -174,12 +193,14 @@
       return this.aq_pleasePublishMyState({page: param});
     })
     .declareMethod("render", function (options) {
-      var id = nextId(),
-        name = playlist[id];
+      var id,
+        name,
+        urlDemand;
       if (initializeFlag === false) {
         return;
       }
-
+      id = nextId();
+      name = playlist.name[id];
       that.showPage(name)
         .then(function (result) {
           next_context.href = result;
@@ -235,7 +256,7 @@
           return;
         }
 
-        if (playlist.indexOf(options.page) === -1) {
+        if (playlist.name.indexOf(options.page) === -1) {
           animation.stopAnimation();
           error.display();
           that.noDisplay();
@@ -246,14 +267,17 @@
           animation.showAnimation();
           return;
         }
-        io.getIO(options.page).then(function (file) {
-          control.setSong(URL.createObjectURL(file)).then(function () {
+        urlDemand = playlist.url[
+          playlist.name.indexOf(options.page)
+        ];
+        control.setSong("http://localhost:8080/" +
+                        urlDemand)
+          .then(function () {
             control.playSong();
             title.setMessage(options.page);
             titleSave = options.page;
             animation.showAnimation();
           });
-        });
       } else {
         error.noDisplay();
         list.noDisplay();

src/audioplayer_control/control.js

 /*global window, rJS, RSVP, console, URL, Math,
-  FileReader, Uint8Array, File */
+  FileReader, Uint8Array, File, Audio*/
 /*jslint nomen: true*/
 
 (function (window, rJS) {
   "use strict";
-  var gk = rJS(window);
+  var gk = rJS(window),
+    arraytmp = [];
   gk.declareMethod('setSong', function (url) {  //configure a song
     var gadget = this;
     gadget.source.connect(gadget.analyser);
@@ -13,7 +14,12 @@
     gadget.gain.connect(gadget.audioCtx.destination);
     gadget.audio.src = url;
     gadget.audio.onloadedmetadata = function () {
-      gadget.sendTotalTime(gadget.audio.duration);
+      window.setTimeout(
+        function () {
+          gadget.sendTotalTime(gadget.audio.duration);
+        },
+        3000
+      );
     };
     gadget.audio.load();
   })
@@ -47,8 +53,26 @@
     .declareMethod('getFFTValue', function () {
       var gadget = this,
         tmp = {},
+        i,
         array = new Uint8Array(gadget.analyser.frequencyBinCount);
       gadget.analyser.getByteFrequencyData(array);
+      // if fft failed, random value
+      if (array[0] === 0 && array[50] === 0 && array[100] === 0) {
+        for (i = 0; i < 1024; i += 1) {
+          if (Math.floor(Math.random() * 10) > 5) {
+            arraytmp[i] -= 5;
+            if (arraytmp[i] < 0) {
+              arraytmp[i] = 0;
+            }
+          } else {
+            arraytmp[i] += 5;
+            if (arraytmp[i] > 255) {
+              arraytmp[i] = 100;
+            }
+          }
+          array[i] = arraytmp[i];
+        }
+      }
       tmp.array = array;
       tmp.length = array.length;
       return tmp;
@@ -56,6 +80,7 @@
     .declareAcquiredMethod("nextToPlay", "nextToPlay")
     .declareAcquiredMethod("sendTotalTime", "sendTotalTime");
   gk.ready(function (g) {
+    var i;
     g.volume = 1;
     window.AudioContext = window.AudioContext || window.webkitAudioContext
       || window.mozAudiocontext || window.msAudioContext;
@@ -66,7 +91,11 @@
         "ERROR:[control] " + e
       );
     }
-    g.audio = new window.Audio();
+    for (i = 0; i < 1024; i += 1) {
+      arraytmp[i] = Math.floor(Math.random() * 255);
+    }
+    g.audio = g.__element.getElementsByTagName('audio')[0];
+    g.audio.style.display = "none";
     g.source = g.audioCtx.createMediaElementSource(g.audio);
     g.analyser = g.audioCtx.createAnalyser();
     g.gain = g.audioCtx.createGain();

src/audioplayer_control/index.html

@@ -15,5 +15,8 @@
     <script src="./control.js" type="text/javascript"></script>
   </head>
   <body>
+    <audio controls>
+      <type="audio/mpeg">
+    </audio>
   </body>
 </html>

src/audioplayer_io/http.js

+/*global window, rJS, RSVP, jIO, JSON, console, indexedDB, Components */
+/*jslint nomen: true*/
+(function (window, jIO, rJS) {
+  "use strict";
+
+  var gk = rJS(window),
+    input_context;
+
+  gk.declareMethod('createIO', function (description, key) {
+
+    this.jio = jIO.createJIO(description);
+  })
+    .declareMethod('getIO', function (attachment) {
+      var gadget = this;
+      return gadget.jio.getAttachment({
+        "_id": attachment
+      }).then(function (response) {
+        return response.data;
+      }).fail(function (response) {
+        return "jio getIO error : " + response.target.result;
+      });
+    })
+    .declareMethod('removeIO', function (attachment) {
+      var gadget = this,
+        index;
+      index = gadget.playlist.name.indexOf(attachment);
+      gadget.playlist.url.splice(index, 1);
+      gadget.playlist.name.splice(index, 1);
+      gadget.sendPlaylist(gadget.playlist);
+    })
+    .declareMethod('display', function (attachment) {
+      input_context.style.display = "";
+    })
+    .declareMethod('noDisplay', function (attachment) {
+      input_context.style.display = "none";
+    })
+    .declareMethod('showAllIO', function () {
+      var gadget = this;
+      return gadget.jio.allDocs().then(function (result) {
+        return result.data.rows[0];
+      }).fail(function (error) {
+        return "ERROR : " + error;
+      });
+    })
+    .declareAcquiredMethod("sendPlaylist", "sendPlaylist");
+  gk.ready(function (g) {
+    var index,
+      url,
+      name,
+      urlArray = [],
+      nameArray = [];
+    input_context = g.__element.getElementsByTagName('input')[0];
+    input_context.style.display = "none";
+    g.playlist = {};
+    g.createIO({ "type" : "http",
+                 "database": "http://localhost:8080/"})
+      .then(function () {
+        g.showAllIO().then(function (result) {
+          while (result) {
+            index = result.indexOf("href=\"/");
+            if (index === -1) {
+              break;
+            }
+            result = result.substring(index + 7);
+            index = result.indexOf("\">");
+            url = result.substring(0, index);
+            if (url.indexOf(".mp3") === -1) {
+              result = result.substring(index + 2);
+            } else {
+              urlArray.push(url);
+              result = result.substring(index + 2);
+              index = result.indexOf("</a>");
+              name = result.substring(0, index);
+              nameArray.push(name);
+            }
+          }
+          g.playlist.url = urlArray;
+          g.playlist.name = nameArray;
+          g.sendPlaylist(g.playlist);
+        });
+      });
+  });
+}(window, jIO, rJS));

src/audioplayer_io/index.html

@@ -13,13 +13,13 @@
 
       
     <!-- custom script -->   
-    <script src="./io.js" type="text/javascript"></script>
+    <script src="./http.js" type="text/javascript"></script>
     
 
   </head>
   
 
   <body>
-    <input type = "file" multiple /> 
+    <input type = "file" webkitdirectory /> 
   </body>
 </html>

src/audioplayer_io/io.js

-/*global window, rJS, RSVP, jIO, JSON, console, indexedDB */
+/*global window, rJS, RSVP, jIO, JSON, console, indexedDB, Components */
 /*jslint nomen: true*/
 (function (window, jIO, rJS) {
   "use strict";
 
   var gk = rJS(window),
     input_context;
-
+//  Components.utils.import("resource://gre/modules/FileUtils.jsm");
   gk.declareMethod('createIO', function (description, key) {
 //    indexedDB.deleteDatabase("jio:test");
     this.jio = jIO.createJIO(description);

src/audioplayer_playlist/playlist.js

@@ -13,21 +13,21 @@
       this.playlist.style.display = "none";
       this.home.style.display = "none";
     })
-    .declareMethod('initList', function (array) {
+    .declareMethod('initList', function (playlist) {
       var i,
         docFragment = document.createDocumentFragment(),
         li;
       this.list.innerHTML = "";
-      for (i = 0; i < array.length; i += 1) {
+      for (i = 0; i < playlist.url.length; i += 1) {
         li = document.createElement("li");
         li.innerHTML =
           "<a href=#page="
-          + array[i]
+          + playlist.url[i]
           + ">"
-          + array[i]
+          + playlist.name[i]
           + "</a> "
           + " <a href=#page="
-          + array[i]
+          + playlist.name[i]
           + "&id=delete "
           + "data-rel=popup "
           + "data-position-to=window "

src/audioplayer_progress/index.html

@@ -23,7 +23,7 @@
 
   <div class="time" style="position:absolute;">
   </div>   
-  <progress class="pro">
+  <progress class="pro" style="width: 100%;">
   </progress>
    
  

src/audioplayer_progress/progress.css

 progress.pro {
+    position: absolute;
+    display: block;
     height: 25px;
     padding: 5px;
+    width:100%;
     margin: 50px 0 20px 0;
     -moz-border-radius: 5px;
     -webkit-border-radius: 5px;

src/audioplayer_progress/progress.js

@@ -58,7 +58,6 @@
     g.time = g.__element.getElementsByTagName('div')[1];
     g.bar.value = 0;
     g.bar.max = 1000;
-    g.bar.style.width = window.screen.availWidth + "px";
     g.time.style.left = g.bar.style.left;
     $(g.time).offset().top = $(g.bar).offset().top + 5;
     g.time.innerHTML = "--";

src/audioplayer_title/index.html

@@ -15,6 +15,6 @@
   
 
   <body>
-    <input type="text" class="notice" size="150">
+    <input type="text" class="notice" size="150" style="width: 100%;">
   </body>
 </html>

src/audioplayer_title/title.js

@@ -44,7 +44,6 @@
   gk.ready(function (g) {
     g.scroll = new BannerObject();
     g.input = g.__element.getElementsByTagName('input')[0];
-    g.input.style.width =  window.screen.availWidth + "px";
     g.scroll.size = g.input.size;
     function scroller() {
       g.scroll.out += " ";