mirror of
https://github.com/DavidVentura/cam-reverse
synced 2026-08-10 12:58:22 -04:00
103 lines
4.2 KiB
HTML
103 lines
4.2 KiB
HTML
<html>
|
|
<head>
|
|
<link rel="shortcut icon" href="/favicon.ico">
|
|
<title>${name}</title>
|
|
</head><body>
|
|
<h2>${name}</h2><a href="/camera/${id}"><img style="height: 640px" src="/camera/${id}"/></a><hr/>
|
|
<button onclick="toggle_audio()" id=audio disabled=true>Audio: disabled</button>
|
|
<button onclick="fetch('/rotate/${id}')">Rotate</button>
|
|
<button onclick="fetch('/mirror/${id}')">Mirror</button>
|
|
<script>
|
|
const alaw_to_s16_table = [
|
|
-5504, -5248, -6016, -5760, -4480, -4224, -4992, -4736, -7552, -7296, -8064, -7808, -6528, -6272, -7040, -6784, -2752,
|
|
-2624, -3008, -2880, -2240, -2112, -2496, -2368, -3776, -3648, -4032, -3904, -3264, -3136, -3520, -3392, -22016,
|
|
-20992, -24064, -23040, -17920, -16896, -19968, -18944, -30208, -29184, -32256, -31232, -26112, -25088, -28160,
|
|
-27136, -11008, -10496, -12032, -11520, -8960, -8448, -9984, -9472, -15104, -14592, -16128, -15616, -13056, -12544,
|
|
-14080, -13568, -344, -328, -376, -360, -280, -264, -312, -296, -472, -456, -504, -488, -408, -392, -440, -424, -88,
|
|
-72, -120, -104, -24, -8, -56, -40, -216, -200, -248, -232, -152, -136, -184, -168, -1376, -1312, -1504, -1440, -1120,
|
|
-1056, -1248, -1184, -1888, -1824, -2016, -1952, -1632, -1568, -1760, -1696, -688, -656, -752, -720, -560, -528, -624,
|
|
-592, -944, -912, -1008, -976, -816, -784, -880, -848, 5504, 5248, 6016, 5760, 4480, 4224, 4992, 4736, 7552, 7296,
|
|
8064, 7808, 6528, 6272, 7040, 6784, 2752, 2624, 3008, 2880, 2240, 2112, 2496, 2368, 3776, 3648, 4032, 3904, 3264,
|
|
3136, 3520, 3392, 22016, 20992, 24064, 23040, 17920, 16896, 19968, 18944, 30208, 29184, 32256, 31232, 26112, 25088,
|
|
28160, 27136, 11008, 10496, 12032, 11520, 8960, 8448, 9984, 9472, 15104, 14592, 16128, 15616, 13056, 12544, 14080,
|
|
13568, 344, 328, 376, 360, 280, 264, 312, 296, 472, 456, 504, 488, 408, 392, 440, 424, 88, 72, 120, 104, 24, 8, 56,
|
|
40, 216, 200, 248, 232, 152, 136, 184, 168, 1376, 1312, 1504, 1440, 1120, 1056, 1248, 1184, 1888, 1824, 2016, 1952,
|
|
1632, 1568, 1760, 1696, 688, 656, 752, 720, 560, 528, 624, 592, 944, 912, 1008, 976, 816, 784, 880, 848,
|
|
];
|
|
|
|
const alaw_to_s16 = (a_val) => {
|
|
return alaw_to_s16_table[a_val];
|
|
};
|
|
|
|
var audio_context;
|
|
const audio_button = document.getElementById('audio');
|
|
audio_button.disabled = !${audio};
|
|
update_audio_button();
|
|
|
|
function setup_audio() {
|
|
audio_context = new AudioContext();
|
|
const gain_node = audio_context.createGain(); // Declare gain node
|
|
const channels =1;
|
|
const sample_rate = 8000;
|
|
const audioBuffer = audio_context.createBuffer(channels, 960, sample_rate); // 960??
|
|
//const audioBuffer = audio_context.createBuffer(channels, decoded.length, sample_rate);
|
|
|
|
audio_context.onstatechange = () => {
|
|
console.log("Audio state is now ", audio_context.state);
|
|
update_audio_button(audio_context.state == "running");
|
|
};
|
|
|
|
gain_node.connect(audio_context.destination); // Connect gain node to speakers
|
|
audio_context.resume();
|
|
|
|
const evtSource = new EventSource("/audio/${id}");
|
|
evtSource.onopen = (e) => {
|
|
console.log("evtsource open");
|
|
}
|
|
evtSource.onerror = (e) => {
|
|
console.log("evtsource error", e);
|
|
}
|
|
let endsAt = 0;
|
|
let startAt = 0;
|
|
evtSource.onmessage = (e) => {
|
|
const nowBuffering = audioBuffer.getChannelData(0);
|
|
const u8 = Uint8Array.from(atob(e.data), c => c.charCodeAt(0));
|
|
new Int16Array(u8).map(alaw_to_s16).forEach((el, i) => nowBuffering[i] = el / 0x8000 );
|
|
|
|
const source_node = audio_context.createBufferSource();
|
|
source_node.buffer = audioBuffer;
|
|
source_node.connect(gain_node);
|
|
const now = Date.now();
|
|
if(now > endsAt) { // lost packets
|
|
startAt = 0;
|
|
} else {
|
|
startAt += audioBuffer.duration;
|
|
}
|
|
source_node.start(startAt);
|
|
endsAt = now + audioBuffer.duration * 1000;
|
|
};
|
|
}
|
|
|
|
function update_audio_button(on) {
|
|
if (${audio}) {
|
|
audio_button.innerText = "Audio: " + (on ? "on \u{1F508}" : "off \u{1F507}");
|
|
}
|
|
}
|
|
|
|
function toggle_audio() {
|
|
if (audio_context == undefined) {
|
|
setup_audio();
|
|
return;
|
|
}
|
|
if (audio_context.state == "running") {
|
|
audio_context.suspend();
|
|
return;
|
|
}
|
|
if (audio_context.state == "suspended") {
|
|
audio_context.resume();
|
|
return;
|
|
}
|
|
console.log("Unknown audio stream status");
|
|
}
|
|
</script>
|
|
</html>
|