annotate s4-media.js @ 996:a50f5b0b2c3d draft

Media player built in viewer box
author HIROSE Yuuji <yuuji@gentei.org>
date Sun, 16 Oct 2022 07:56:34 +0859
parents
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
996
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
1 document.addEventListener("DOMContentLoaded", () => {
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
2 var vplay = document.getElementById("video"),
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
3 spval = document.getElementById("speedval"),
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
4 volval = document.getElementById("volval"),
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
5 speed = document.getElementById("speed"),
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
6 volume = document.getElementById("volume");
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
7 speed.addEventListener("change", (e) => {
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
8 console.log(e.target.value);
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
9 var rate = e.target.value;
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
10 console.log(rate);
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
11 spval.innerText = rate+"%";
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
12 vplay.playbackRate = rate/100;
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
13 });
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
14 volume.addEventListener("change", (e) => {
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
15 console.log(e.target.value);
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
16 var rate = e.target.value;
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
17 volval.innerText = rate+"%";
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
18 console.log(rate);
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
19 vplay.volume = rate/100;
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
20 });
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
21 spval.innerText = (speed.value = vplay.playbackRate*100)+"%";
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
22 spval.value = vplay.playbackRate*100;
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
23 volval.innerText = (volume.value = (vplay.volume = 0.4)*100) + "%";
a50f5b0b2c3d Media player built in viewer box
HIROSE Yuuji <yuuji@gentei.org>
parents:
diff changeset
24 }, false);

yatex.org