From d3b5bc229798af122d2d2afe3d5ecf48dda8e3f1 Mon Sep 17 00:00:00 2001 From: Alexander Roidl Date: Tue, 15 Nov 2022 20:56:26 +0100 Subject: [PATCH] audio change --- app/mydatabase.db | Bin 8192 -> 8192 bytes app/templates/addaudio.html | 202 +++++++++++------------------------- app/templates/list.html | 2 +- 3 files changed, 64 insertions(+), 140 deletions(-) diff --git a/app/mydatabase.db b/app/mydatabase.db index ceb794ad3c3e42829c9aabc81b51540328058568..1c24e49c02700313c8a8adad550a1306378b595a 100644 GIT binary patch delta 83 zcmZp0XmFSy&Db$f#+k8WW5N=CM*hjH0`g4!S2n8&NbxaF-|Q$inNdeeiJgIiL!8$$ ku{0$!-_SJP(9F!j)Wpcp)Kt&V#L&>hA|5QGm!F;v0IEtB7ytkO delta 83 zcmZp0XmFSy&DcIs#+k8wW5N=CM!w0c0`g2;Pd2LwNbxZq-s~thnNg?E&%xu*{oqID k!HK0QnfYe%hGu3K#wNxl=B9dPMux^_X7OMNz1#w008LvO2><{9 diff --git a/app/templates/addaudio.html b/app/templates/addaudio.html index 7b4ffeb..9d2094c 100755 --- a/app/templates/addaudio.html +++ b/app/templates/addaudio.html @@ -29,7 +29,7 @@ 

     
     
-    
+    
 
     

 
@@ -65,86 +65,71 @@ var audio;
 var state = "empty";
 var audio_context;
 
-try {
-  // webkit shim
-  window.AudioContext = window.AudioContext || window.webkitAudioContext;
-  navigator.getUserMedia = ( navigator.getUserMedia ||
-                    navigator.webkitGetUserMedia ||
-                    navigator.mozGetUserMedia ||
-                    navigator.msGetUserMedia);
-  window.URL = window.URL || window.webkitURL;
-
-  var audio_context = new AudioContext;
-  console.log('Audio context set up.');
-  console.log('navigator.getUserMedia ' + (navigator.getUserMedia ? 'available.' : 'not present!'));
-} catch (e) {
-  alert('No web audio support in this browser!');
-}
 
 function record_audio(){
-  // if(state == "empty"){
-  // navigator.mediaDevices.getUserMedia({ audio: true })
-  // .then(stream => {
-  //   mediaRecorder = new MediaRecorder(stream);
-  //   mediaRecorder.start();
-
-  //   state = "recording";
-  //   document.getElementById('stop_btn').style.display = 'block'
-
-  //   seconds_int = setInterval(
-  //   function () {
-  //     document.getElementById("record_btn").innerHTML = seconds_rec + " s";
-  //     seconds_rec += 1;
-  // }, 1000);
-
-  //   const audioChunks = [];
-  //   mediaRecorder.addEventListener("dataavailable", event => {
-  //     audioChunks.push(event.data);
-  //   });
-
-  //   mediaRecorder.addEventListener("stop", () => {
-  //     // console.log("stopping");
-  //     // const audioBlob = new Blob(audioChunks, {type: 'audio/ogg; codecs=opus'});
-  //     // const audioUrl = URL.createObjectURL(audioBlob);
-  //     // var sound      = document.createElement('audio');
-  //     // sound.id       = 'audio-player';
-  //     // sound.controls = 'controls';
-  //     // sound.src      = audioUrl;
-  //     // console.log(audioUrl)
-  //     // sound.type     = 'audio/ogg; codecs=opus';
-  //     // document.getElementById("audio-player-container").innerHTML = sound.outerHTML;
-
-  //     //audio.play();
-  //     let file = new File(audioChunks, "audio.ogg",{type:"audio/ogg; codecs=opus"});
-  //     let container = new DataTransfer();
-  //     container.items.add(file);
-  //     document.getElementById("uploadedFile").files = container.files;
+  if(state == "empty"){
+  navigator.mediaDevices.getUserMedia({ audio: true })
+  .then(stream => {
+    mediaRecorder = new MediaRecorder(stream);
+    mediaRecorder.start();
+
+    state = "recording";
+    document.getElementById('stop_btn').style.display = 'block'
+
+    seconds_int = setInterval(
+    function () {
+      document.getElementById("record_btn").innerHTML = seconds_rec + " s";
+      seconds_rec += 1;
+  }, 1000);
+
+    const audioChunks = [];
+    mediaRecorder.addEventListener("dataavailable", event => {
+      audioChunks.push(event.data);
+    });
+
+    mediaRecorder.addEventListener("stop", () => {
+      console.log("stopping");
+      const audioBlob = new Blob(audioChunks, {type: 'audio/mpeg'});
+      const audioUrl = URL.createObjectURL(audioBlob);
+      var sound      = document.createElement('audio');
+      sound.id       = 'audio-player';
+      sound.controls = 'controls';
+      sound.src      = audioUrl;
+      console.log(audioUrl)
+      sound.type     = 'audio/mpeg';
+      document.getElementById("audio-player-container").innerHTML = sound.outerHTML;
+
+      
+      let file = new File([audioBlob], "audio.ogg",{type:"audio/mpeg"});
+      let container = new DataTransfer();
+      container.items.add(file);
+      document.getElementById("uploadedFile").files = container.files;
       
   
-  //     audio = new Audio(audioUrl);
-  //     audio.addEventListener("ended", function(){
-  //         audio.currentTime = 0;
-  //         document.getElementById("play_btn").innerHTML = 'play'
-  //     });
-  //     audio.addEventListener("timeupdate", function() {
-  //       var currentTime = audio.currentTime;
-  //       var duration = audio.duration;
-  //       $('.progress_bar').stop(true,true).animate({'width':(currentTime +.25)/duration*100+'%'},0,'linear');
-  //   });
-
-  //     document.getElementById('play_btn').style.display = 'block'
-  //     document.getElementById('redo_btn').style.display = 'block'
-  //     document.getElementById('stop_btn').style.display = 'none'
-  //     document.getElementById("record_btn").innerHTML = "recording…";
-  //     document.getElementById('record_btn').style.display = 'none'
-
-//     });
-
-//     setTimeout(() => {
-//       stop_audio()
-//     }, 1000 * 60);
-//   });
-// }
+      audio = new Audio(audioUrl);
+      audio.addEventListener("ended", function(){
+          audio.currentTime = 0;
+          document.getElementById("play_btn").innerHTML = 'play'
+      });
+      audio.addEventListener("timeupdate", function() {
+        var currentTime = audio.currentTime;
+        var duration = audio.duration;
+        $('.progress_bar').stop(true,true).animate({'width':(currentTime +.25)/duration*100+'%'},0,'linear');
+    });
+
+      document.getElementById('play_btn').style.display = 'block'
+      document.getElementById('redo_btn').style.display = 'block'
+      document.getElementById('stop_btn').style.display = 'none'
+      document.getElementById("record_btn").innerHTML = "recording…";
+      document.getElementById('record_btn').style.display = 'none'
+
+    });
+
+    setTimeout(() => {
+      stop_audio()
+    }, 1000 * 60);
+  });
+}
 }
 
 function stop_audio(){
@@ -176,67 +161,6 @@ function  play_audio(){
 
 
 
-$('.recorder .start').on('click', function() {
-        $this = $(this);
-        $recorder = $this.parent();
-        
-        navigator.getUserMedia({audio: true}, function(stream) {
-          var recorderObject = new MP3Recorder(audio_context, stream, { statusContainer: $recorder.find('.status'), statusMethod: 'replace' });
-          $recorder.data('recorderObject', recorderObject);
-          
-          recorderObject.start();
-        }, function(e) { });
-      });
-      
-      $('.recorder .stop').on('click', function() {
-        $this = $(this);
-        $recorder = $this.parent();
-        
-        recorderObject = $recorder.data('recorderObject');
-        recorderObject.stop();
-        
-        recorderObject.exportMP3(function(base64_mp3_data) {
-          var url = 'data:audio/mp3;base64,' + base64_mp3_data;
-          var au  = document.createElement('audio');
-
-          au.controls = true;
-          au.src = url;
-          $recorder.append(au);
-          
-          recorderObject.logStatus('');
-
-          var blob = dataURItoBlob(url);
-
-
-          let file = new File([blob], "audio.mp3",{type:"audio/mpeg"});
-          let container = new DataTransfer();
-          container.items.add(file);
-          document.getElementById("uploadedFile").files = container.files;
-
-
-        });
-
-      });
-
-      function dataURItoBlob(dataURI) {
-    // convert base64/URLEncoded data component to raw binary data held in a string
-    var byteString;
-    if (dataURI.split(',')[0].indexOf('base64') >= 0)
-        byteString = atob(dataURI.split(',')[1]);
-    else
-        byteString = unescape(dataURI.split(',')[1]);
-
-    // separate out the mime component
-    var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
-
-    // write the bytes of the string to a typed array
-    var ia = new Uint8Array(byteString.length);
-    for (var i = 0; i < byteString.length; i++) {
-        ia[i] = byteString.charCodeAt(i);
-    }
-
-    return new Blob([ia], {type:mimeString});
-}
 
 
 
diff --git a/app/templates/list.html b/app/templates/list.html
index cc8abf9..75f0817 100755
--- a/app/templates/list.html
+++ b/app/templates/list.html
@@ -21,7 +21,7 @@
         
       
        
     {% endfor %}