blob: bdaa1f6c80ef6b62b5b5e277f7ef1e9634db7798 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
/// <reference lib="dom" />
import init, { decode_frame, decode_init } from "./codec_web.js"
console.log("init wasm");
await init()
console.log("done");
index("..")
async function index(url: string) {
const res = await fetch(url)
if (!res.ok) throw new Error("not ok");
document.body.innerHTML = await res.text();
const h1 = document.createElement("h1")
h1.textContent = "bv1 web player"
document.body.prepend(h1)
document.body.querySelectorAll("a").forEach(e => {
const u = url + "/" + e.textContent
e.onclick = ev => {
ev.preventDefault()
document.body.innerHTML = ""
play(u.toString())
}
})
}
async function play(url: string) {
decode_init(1920, 1080)
const res = await fetch(url)
if (!res.ok) throw new Error("not ok");
let buf: Uint8Array | undefined = new Uint8Array(await res.arrayBuffer())
const canvas = document.createElement("canvas")
canvas.width = 1920
canvas.height = 1080
document.body.append(canvas)
document.body.style.backgroundColor = "#111"
const ctx = canvas.getContext("2d")!
let debug = false;
document.body.addEventListener("keydown", ev => {
if (ev.code == "KeyD") debug = !debug;
})
setInterval(() => {
const frame = decode_frame(buf ?? new Uint8Array(), debug);
buf = undefined
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
const data = imageData.data;
for (let y = 0; y < 1080; y++) {
for (let x = 0; x < 1920; x++) {
const ti = (x + y * 1920) * 4;
const si = (x + y * 1920) * 3;
data[ti + 0] = frame[si + 0]
data[ti + 1] = frame[si + 1]
data[ti + 2] = frame[si + 2]
data[ti + 3] = 255
}
}
ctx.putImageData(imageData, 0, 0);
}, 1000 / 30)
}
|