fix random play mode bug in audioplayer

Gruntfile.js

@@ -123,7 +123,7 @@ module.exports = function (grunt) {
           'node_modules/jio/complex_queries.js',
           'node_modules/jio/src/jio.storage/localstorage.js',
           'node_modules/jio/src/jio.storage/erp5storage.js',
-          'node_modules/jio/src/jio.storage/indexeddbstorage.js'   //xxx
+          'node_modules/jio/src/jio.storage/indexeddbstorage1.js'   //xxx
         ],
         relative_dest: "lib/jio.js",
         dest: "<%= global_config.dest %>/<%= concat.jio.relative_dest %>"

src/audioplayer/audioplayer.js

@@ -32,7 +32,7 @@
       return nextId();
     })
     .allowPublicAcquisition("sendTotalId", function (value) {
-      totalId = value;
+      totalId = value[0];  //array parameter
     })
     .allowPublicAcquisition("allNotify", function () {
       control.getTotalTime().then(function (value) {
@@ -83,11 +83,12 @@
           volume.setMax(3);
 
           next_context.onclick = function () {
-            control.setSong(nextId());
-            control.playSong();
-            animation.showAnimation();
-            control.getTotalTime().then(function (value) {
-              time.setMax(value);
+            control.setSong(nextId()).then(function () {
+              control.playSong();
+              animation.showAnimation();
+              control.getTotalTime().then(function (value) {
+                time.setMax(value);
+              });
             });
           };
           command_context.onclick = function () {

src/audioplayer/index.html

@@ -19,20 +19,21 @@
     <div class = "audioplayer">
       <button type="button">next</button>
       <button type="button">play/pause</button>
-      <div class = "control" data-gadget-url="../audioplayer_control/index.html" data-gadget-scope="control" >
+      <!-- data-gadget-sandbox="iframe" -->
+      <div class = "control" data-gadget-url="../audioplayer_control/index.html" data-gadget-scope="control">
       </div>
       
-      <div class = "animation" data-gadget-url="../audioplayer_animation/index.html" data-gadget-scope="animation" >
+      <div class = "animation" data-gadget-url="../audioplayer_animation/index.html" data-gadget-scope="animation">
       </div> 
    
-      <div class = "progress_time" data-gadget-url="../audioplayer_progress/index.html" data-gadget-scope="time" >
+      <div class = "progress_time" data-gadget-url="../audioplayer_progress/index.html" data-gadget-scope="time">
       </div>          
 
 
-      <div class = "progress_volume" data-gadget-url="../audioplayer_volume/index.html" data-gadget-scope="volume" >
+      <div class = "progress_volume" data-gadget-url="../audioplayer_volume/index.html" data-gadget-scope="volume">
       </div>
     
-      <div class = "title" data-gadget-url="../audioplayer_title/index.html" data-gadget-scope="title">
+      <div class = "title" data-gadget-url="../audioplayer_title/index.html" data-gadget-scope="title" >
       </div>
     </div>
     

src/audioplayer_animation/index.html

@@ -20,7 +20,6 @@
       <canvas width="400" height="350" id="canvas">
         !Canvas not supported by your browser
       </canvas>
-      
       <div id="mirrorWrapper">
         <canvas width="400" height="250" id="mirror"></canvas>
       </div>

src/audioplayer_control/control.js

@@ -19,9 +19,12 @@
     gadget.analyser.connect(gadget.gain);
     gadget.gain.gain.value = gadget.volume;
     gadget.gain.connect(gadget.audioCtx.destination);
-    gadget.audio.src =  URL.createObjectURL(gadget.playlist[id]);
-    gadget.audio.load();
-    gadget.allNotify();
+    return gadget.io.getIO(gadget.playlist[id]).then(function (file) {
+      gadget.audio.src =  URL.createObjectURL(file);
+      gadget.file = file;
+      gadget.audio.load();
+      gadget.allNotify();
+    });
   })
     .declareMethod('stopSong', function () {
       this.audio.pause();
@@ -39,7 +42,7 @@
       return this.volume;
     })
     .declareMethod('getTitle', function () {
-      return this.playlist[this.currentPlayId].name;
+      return this.playlist[this.currentPlayId];
     })
     .declareMethod('isPaused', function () {
       return this.audio.paused;
@@ -83,7 +86,7 @@
             resolve(event.target.result);
           }
         };
-        reader.readAsArrayBuffer(gadget.playlist[gadget.currentPlayId]);
+        reader.readAsArrayBuffer(gadget.file);
       });
 
 
@@ -121,6 +124,12 @@
         "ERROR:[configure] Tour browser does not support AudioContext"
       );
     }
+    g.getDeclaredGadget("io").then(function (e) {
+      g.io = e;
+      g.io.createIO({ "type" : "indexeddb",
+                      "database": "test"},
+                    "m");
+    });
     g.audio = new window.Audio();
     g.source = g.audioCtx.createMediaElementSource(g.audio);
     g.analyser = g.audioCtx.createAnalyser();
@@ -145,7 +154,9 @@
           }
         }
         if (found === false) {
-          g.playlist.push(input_context.files[index]);
+          g.io.setIO(input_context.files[index].name,
+                     input_context.files[index]);
+          g.playlist.push(input_context.files[index].name);
         }
       }
       g.sendTotalId(g.playlist.length);

src/audioplayer_control/index.html

@@ -5,11 +5,17 @@
     <!-- renderjs -->
     <script src="../<%= copy.rsvp.relative_dest %>" type="text/javascript"></script>
     <script src="../<%= copy.renderjs.relative_dest %>" type="text/javascript"></script>
+
+    <script src="../<%= copy.uri.relative_dest %>" type="text/javascript"></script>
+    <script src="../<%= copy.uritemplate.relative_dest %>" type="text/javascript"></script>
+    <script src="../<%= concat.jio.relative_dest %>" type="text/javascript"></script>
+
     
     <!-- custom script -->
     <script src="./control.js" type="text/javascript"></script>
   
-    
+    <div class ="io" data-gadget-url="../audioplayer_io/index.html" data-gadget-scope="io">
+    </div>    
   
   </head>
   <body>

src/audioplayer_io/io.js

-/*global window, rJS, RSVP, jIO, JSON */
+/*global window, rJS, RSVP, jIO, JSON, console, indexedDB */
 
 (function (window, jIO, rJS) {
   "use strict";
@@ -6,15 +6,16 @@
   var gk = rJS(window);
 
   gk.declareMethod('createIO', function (description, key) {
+    indexedDB.deleteDatabase("jio:test");
     this.jio = jIO.createJIO(description);
     this.key = key;
     this.jio.put({
       "_id" : key
     }).then(function () {
       description = JSON.stringify(description, null, "  ");
-      return ("JIO created: " + description + "\nwith key: " + key);
+      console.log("JIO created: " + description + "\nwith key: " + key);
     }).catch(function (e) {
-      return "jio created error: " + e.target.result;
+      console.log("jio created error: " + e.target.result);
     });
   })
     .declareMethod('getIO', function (attachment) {
@@ -30,10 +31,12 @@
     })
     .declareMethod('setIO', function (attachment, file) {
       var gadget = this;
-      return gadget.jio.putAttachment({
+      gadget.jio.putAttachment({
         "_id": gadget.key,
         "_attachment": attachment,
         "_blob": file
+      }).then(function (e) {
+        console.log(e);
       });
     })
     .declareMethod('showAllIO', function () {