2019-08-03 11:32:39 +03:00
|
|
|
/*
|
|
|
|
NAME
|
|
|
|
main.js
|
|
|
|
|
|
|
|
AUTHOR
|
|
|
|
Trek Hopton <trek@ausocean.org>
|
2019-08-16 09:51:07 +03:00
|
|
|
Alan Noble <alan@ausocean.org>
|
2019-08-03 11:32:39 +03:00
|
|
|
|
|
|
|
LICENSE
|
|
|
|
This file is Copyright (C) 2018 the Australian Ocean Lab (AusOcean)
|
|
|
|
|
|
|
|
It is free software: you can redistribute it and/or modify them
|
|
|
|
under the terms of the GNU General Public License as published by the
|
|
|
|
Free Software Foundation, either version 3 of the License, or (at your
|
|
|
|
option) any later version.
|
|
|
|
|
|
|
|
It is distributed in the hope that it will be useful, but WITHOUT
|
|
|
|
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
|
|
|
|
FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
|
|
|
|
for more details.
|
|
|
|
|
|
|
|
You should have received a copy of the GNU General Public License in gpl.txt.
|
|
|
|
If not, see [GNU licenses](http://www.gnu.org/licenses).
|
|
|
|
*/
|
|
|
|
|
2019-07-23 11:27:03 +03:00
|
|
|
window.onload = function () {
|
2019-08-16 09:51:07 +03:00
|
|
|
document.getElementById('fileinput').addEventListener('change', processData);
|
2019-08-11 10:24:30 +03:00
|
|
|
}
|
2019-07-23 11:27:03 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
function processData() {
|
|
|
|
const input = event.target.files[0]
|
|
|
|
const reader = new FileReader()
|
2019-07-23 11:27:03 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
reader.onload = event => {
|
|
|
|
bytes = new Uint8Array(event.target.result)
|
2019-07-23 07:58:43 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
// decode adpcm to pcm
|
|
|
|
var decoded = decode(Array.from(bytes))
|
2019-07-24 11:25:02 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
// convert raw pcm to wav
|
|
|
|
var wav = pcmToWav(decoded, 48000, 1, 16);
|
2019-08-03 11:32:39 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
// play wav data in player
|
|
|
|
const blob = new Blob([Uint8Array.from(wav)], {
|
|
|
|
type: 'audio/wav'
|
|
|
|
});
|
|
|
|
const url = URL.createObjectURL(blob);
|
2019-08-03 11:32:39 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
const audio = document.getElementById('audio');
|
|
|
|
const source = document.getElementById('source');
|
2019-08-03 11:32:39 +03:00
|
|
|
|
2019-08-11 10:24:30 +03:00
|
|
|
source.src = url;
|
|
|
|
audio.load();
|
|
|
|
audio.play();
|
|
|
|
}
|
|
|
|
reader.onerror = error => reject(error)
|
|
|
|
reader.readAsArrayBuffer(input)
|
2019-07-23 07:58:43 +03:00
|
|
|
|
2019-08-16 09:51:07 +03:00
|
|
|
}
|
|
|
|
|
2019-08-16 12:08:14 +03:00
|
|
|
// getQuery gets everything after the question mark in the URL.
|
|
|
|
function getQuery() {
|
|
|
|
var regex = new RegExp("\\?(.*)");
|
|
|
|
var match = regex.exec(window.location.href);
|
|
|
|
if (match == null) {
|
|
|
|
return '';
|
2019-08-16 09:51:07 +03:00
|
|
|
} else {
|
2019-08-16 12:08:14 +03:00
|
|
|
return decodeURIComponent(match[1].replace(/\+/g, " "));
|
2019-08-16 09:51:07 +03:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-08-16 12:08:14 +03:00
|
|
|
function load() {
|
|
|
|
var url = document.getElementById('url').value;
|
|
|
|
if (url == "") {
|
|
|
|
url = getQuery()
|
|
|
|
document.getElementById('url').value = url;
|
2019-08-16 09:51:07 +03:00
|
|
|
}
|
2019-08-16 12:08:14 +03:00
|
|
|
if (url[0] == '/') {
|
|
|
|
url = window.location.protocol + '//' + window.location.host + url;
|
2019-08-16 09:51:07 +03:00
|
|
|
}
|
2019-08-16 12:08:14 +03:00
|
|
|
if (url == "") {
|
|
|
|
return;
|
2019-08-16 09:51:07 +03:00
|
|
|
}
|
2019-08-16 12:08:14 +03:00
|
|
|
var video = document.getElementById('video');
|
|
|
|
|
|
|
|
if (Hls.isSupported()) {
|
|
|
|
console.log("play: browser can play HLS.")
|
|
|
|
var hls = new Hls({
|
|
|
|
autoStartLoad: true,
|
|
|
|
debug: true,
|
|
|
|
startFragPrefetch: true
|
|
|
|
});
|
|
|
|
hls.loadSource(url);
|
|
|
|
hls.attachMedia(video);
|
|
|
|
|
|
|
|
hls.on(Hls.Events.ERROR, function (event, data) {
|
|
|
|
if (data.fatal) {
|
|
|
|
switch (data.type) {
|
|
|
|
case Hls.ErrorTypes.NETWORK_ERROR:
|
|
|
|
console.log("play: fatal network error encountered, trying to recover.");
|
|
|
|
hls.startLoad();
|
|
|
|
break;
|
|
|
|
case Hls.ErrorTypes.MEDIA_ERROR:
|
|
|
|
console.log("play: fatal media error encountered, trying to recover.");
|
|
|
|
hls.recoverMediaError();
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
console.log("play: fatal error, cannot recover.");
|
|
|
|
hls.destroy();
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
console.log("play: " + data.type + "error, " + data.details);
|
|
|
|
}
|
|
|
|
});
|
2019-08-16 09:51:07 +03:00
|
|
|
|
2019-08-16 12:08:14 +03:00
|
|
|
hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
|
|
playPromise = video.play();
|
|
|
|
if (playPromise !== undefined) {
|
|
|
|
playPromise.then(_ => {
|
|
|
|
console.log("play: autoplay started.")
|
|
|
|
document.getElementById('msg').innerHTML = "";
|
|
|
|
}).catch(error => {
|
|
|
|
console.log("play: autoplay was prevented.")
|
|
|
|
document.getElementById('msg').innerHTML = "Autoplay prevented. Hit play button to start."
|
|
|
|
// Remove the message once playing starts.
|
|
|
|
video.addEventListener('playing', function (e) {
|
|
|
|
document.getElementById('msg').innerHTML = "";
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
2019-08-16 09:51:07 +03:00
|
|
|
|
2019-08-16 12:08:14 +03:00
|
|
|
} else if (video.canPlayType('application/vnd.apple.mpegurl')) {
|
|
|
|
console.log("play: browser can handle vnd.apple.mpegurl.")
|
|
|
|
video.src = url;
|
|
|
|
video.addEventListener('loadedmetadata', function () {
|
|
|
|
video.play();
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
console.log("play: HLS not supported by browser.")
|
2019-08-16 09:51:07 +03:00
|
|
|
}
|
2019-07-18 09:34:50 +03:00
|
|
|
}
|