From 58c43e6828cfdf42bd732249101ab0fd1ff45562 Mon Sep 17 00:00:00 2001
From: Felix Hartmann <st143665@stud.uni-stuttgart.de>
Date: Mon, 18 Feb 2019 01:24:06 +0100
Subject: [PATCH] able to play local files now

---
 src/static/index.html  |  9 +++++++++
 src/static/js/index.js | 31 +++++++++++++++++++++++++++----
 2 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/src/static/index.html b/src/static/index.html
index d8fad48..3f54fb1 100644
--- a/src/static/index.html
+++ b/src/static/index.html
@@ -89,6 +89,15 @@
               <input type="range" min="0" max="1000" value="700" class="slider" id="volume-slider">
             </div>
           </div>
+          <br>
+          <div class="row">
+            <div class="col-xs-6">
+              <p>
+                Wenn du eine Datei von deinem PC auswählen willst, drücke auf diesen Button:
+              </p>
+              <input id="extFile"  type="file" accept=".mp3,audio/*" >
+            </div>
+          </div>
         </div>
         <footer>
           <p>
diff --git a/src/static/js/index.js b/src/static/js/index.js
index 38da0e4..8cc41a6 100644
--- a/src/static/js/index.js
+++ b/src/static/js/index.js
@@ -112,6 +112,24 @@ $(function () {
     $(this).trigger('change');
   });
 
+  $('#extFile').change(function () {
+    event = this
+    if (event.files.length > 0) {
+    var file = event.files[0];
+    var reader = new FileReader();
+    var songName = event.files[0].name;
+    reader.addEventListener('load', function() {
+      var data = reader.result;
+      if(player != null && player.isPlaying())
+        player.pause();
+      player = new Player(songName, data);
+      player.init();
+      updateDisplay();
+    });
+    reader.readAsDataURL(file);
+  }
+  });
+
   updateDisplay();
 });
 
@@ -186,10 +204,15 @@ function resetLoop(){
   $( '#resetLoopBtn' ).prop("disabled", true);
 }
 
-var Player = function(songName) {
-  this.song = songName;
-  let dir = $( '#dir-dropdown' ).find(":selected").text();
-  this.url = './songs/' + dir + '/' + songName;
+var Player = function(songName, data=null) {
+  if(data != null){
+    this.song = songName;
+    this.url = data;
+  }else{
+    this.song = songName;
+    let dir = $( '#dir-dropdown' ).find(":selected").text();
+    this.url = './songs/' + dir + '/' + songName;
+  }
   this.howl = null;
   resetLoop();