Mirrors/webamp
1
0
Fork 0
mirror of https://github.com/captbaritone/webamp.git synced 2026-07-22 09:37:17 +00:00
Code Issues Projects Releases Wiki Activity

Clean up old experiments

Browse source
This commit is contained in:
Jordan Eldredge 2018-01-01 21:21:18 -08:00
parent 8b36767eb9
commit e441706809
4 changed files with 0 additions and 198 deletions
Download patch file Download diff file Expand all files Collapse all files

79
experiments/audioAbstraction/app.js
View file

@ -1,79 +0,0 @@
/* global ElementSource BufferSource */
const play = document.getElementById("play");
const pause = document.getElementById("pause");
const stop = document.getElementById("stop");
const eject = document.getElementById("eject");
const url = document.getElementById("url");
const loadUrl = document.getElementById("loadUrl");
const info = document.getElementById("info");
const position = document.getElementById("position");
const sourceType = document.getElementById("sourceType");
const autoplay = document.getElementById("autoplay");
const context = new (window.AudioContext || window.webkitAudioContext)();
const getSourceClass = () =>
sourceType.value === "buffer" ? BufferSource : ElementSource;
let source = new (getSourceClass())(context, context.destination);
source.setAutoPlay(true);
sourceType.addEventListener("change", () => {
source.disconnect();
source = new (getSourceClass())(context, context.destination);
source.setAutoPlay(true);
});
//const source = new BufferSource(context, context.destination);
play.addEventListener("click", () => {
source.play();
});
pause.addEventListener("click", () => {
source.pause();
});
stop.addEventListener("click", () => {
source.stop();
});
eject.addEventListener("change", e => {
source.loadFile(e.target.files[0]);
});
loadUrl.addEventListener("click", () => {
source.loadUrl(url.value);
});
position.addEventListener("change", () => {
const percent = position.value / 100;
const newTime = source.getDuration() * percent;
source.seekToTime(newTime);
});
autoplay.addEventListener("change", () => {
source.setAutoPlay(autoplay.checked);
});
const updateInfo = () => {
const data = {
numberOfChannels: source.getNumberOfChannels(),
status: source.getStatus(),
duration: source.getDuration(),
timeElapsed: source.getTimeElapsed(),
sampleRate: source.getSampleRate(),
loop: source.getLoop(),
autoplay: source.getAutoPlay()
};
info.value = JSON.stringify(data, null, 2);
};
info.addEventListener("click", updateInfo);
source.on("statusChange", () => {
updateInfo();
});
source.on("positionChange", () => {
const percent = source.getTimeElapsed() / source.getDuration();
position.value = percent * 100;
updateInfo();
});

36
experiments/audioAbstraction/index.html
View file

@ -1,36 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Audio Abstraction</title>
</head>
<body>
<select id='sourceType'>
<option value='buffer'>Bufer</option>
<option value='element'>Element</option>
</select>
<button id='play'>Play</button>
<button id='pause'>Pause</button>
<button id='stop'>Stop</button>
<br />
<input type='file' id='eject' name='eject' />
<br />
<input id='url' name='url' value="../../mp3/llama-2.91.mp3" />
<button id='loadUrl'>Load URL</button>
<br />
<input type='range' id='position' min="0" max="100" />
<br /> Autoplay:
<input type='checkbox' id='autoplay' checked />
<br>
<textarea id='info' cols="50" rows="20"></textarea>
<script src="./emitter.js"></script>
<script src="./bufferSource.js"></script>
<script src="./elementSource.js"></script>
<script src="./app.js"></script>
</body>
</html>

13
experiments/createObjectURL/index.html
View file

@ -1,13 +0,0 @@
<html>
<head></head>
<body>
<input type='file' id='input' />
<audio controls id='audio' src=""></audio>
<canvas id='oscilloscope'></canvas>
<button id='podcast'>Load Podcast</button>
<script src="index.js"></script>
</body>
</html>

70
experiments/createObjectURL/index.js
View file

@ -1,70 +0,0 @@
const context = new (window.AudioContext || window.webkitAudioContext)();
const audio = document.getElementById("audio");
audio.autoplay = true;
audio.controls = true;
audio.setAttribute("crossOrigin", "anonymous");
const source = context.createMediaElementSource(audio);
const analyser = context.createAnalyser();
source.connect(analyser);
analyser.fftSize = 2048;
const bufferLength = analyser.frequencyBinCount;
const dataArray = new Uint8Array(bufferLength);
analyser.getByteTimeDomainData(dataArray);
// Get a canvas defined with ID "oscilloscope"
const canvas = document.getElementById("oscilloscope");
const canvasCtx = canvas.getContext("2d");
// draw an oscilloscope of the current audio source
function draw() {
requestAnimationFrame(draw);
analyser.getByteTimeDomainData(dataArray);
canvasCtx.fillStyle = "rgb(200, 200, 200)";
canvasCtx.fillRect(0, 0, canvas.width, canvas.height);
canvasCtx.lineWidth = 2;
canvasCtx.strokeStyle = "rgb(0, 0, 0)";
canvasCtx.beginPath();
const sliceWidth = canvas.width * 1.0 / bufferLength;
let x = 0;
for (let i = 0; i < bufferLength; i++) {
const v = dataArray[i] / 128.0;
const y = v * canvas.height / 2;
if (i === 0) {
canvasCtx.moveTo(x, y);
} else {
canvasCtx.lineTo(x, y);
}
x += sliceWidth;
}
canvasCtx.lineTo(canvas.width, canvas.height / 2);
canvasCtx.stroke();
}
draw();
source.connect(context.destination);
document.getElementById("input").addEventListener("change", e => {
const url = URL.createObjectURL(e.target.files[0]);
audio.src = url;
});
document.getElementById("podcast").addEventListener("click", () => {
const url =
"http://cf-media.sndcdn.com/XjYswaAshTWP?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiKjovL2NmLW1lZGlhLnNuZGNkbi5jb20vWGpZc3dhQXNoVFdQIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNTA2MDA3OTkxfX19XX0_&Signature=rGScfcjqJp3ZFMeeiovou39xp8q78CHEyEYgHtjXQ3rKDhzQza9Bv9JFDexhdWlLD2xw7JQ8OHhRPaG5CKwQy1bojrwBSdwFaXZD2LIRmuQE5gRToNs6Glop89cBpDBbTKRWLFLZ37dH9kB438C-6TKB1yygzLVTSsx6p9Dt1mWldVaKDKxApDYYUuPvVq9ZCLScAoa2-4jOmPzmPjcoyrX~3BdLCRhXYYlxNTFBEKXmWhnBq10ZD01ERz-32WGcM1IydxIIoCsthgNBgDHoig26~YM7vskXswf8khi9i02cuAZcCPLIgKBdbFcHiRRErwd4Qq1hv210gH~hcIXTEg__&Key-Pair-Id=APKAJAGZ7VMH2PFPW6UQ";
audio.src = url;
});