Jerry/cyp
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

fixed x-range, seekcur optimization

Browse source
This commit is contained in:
Ondřej Žára 2020-05-06 13:27:44 +02:00
parent 2b33e39169
commit ac40ec8f2c
4 changed files with 18 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/cyp.js
View file

@ -61,6 +61,8 @@ class Range extends HTMLElement {
}
attributeChangedCallback(name, oldValue, newValue) {
if (!this.firstChild) { return; }
switch (name) {
case "min":
case "max":
@ -957,7 +959,6 @@ class Player extends Component {
const all = this.querySelectorAll("[class]");
[...all].forEach(node => DOM[node.className] = node);
DOM.progress = DOM.timeline.querySelector("x-range");
DOM.progress.step = "0.1"; // FIXME
DOM.volume = DOM.volume.querySelector("x-range");
this._dom = DOM;
@ -1107,9 +1108,14 @@ class Player extends Component {
this._app.mpd.command(`repeat ${isRepeat ? "0" : "1"}`);
});
DOM.volume.addEventListener("input", e => this._app.mpd.command(`setvol ${e.target.valueAsNumber}`));
DOM.progress.addEventListener("input", e => this._app.mpd.command(`seekcur ${e.target.valueAsNumber}`));
DOM.progress.addEventListener("input", e => {
let elapsed = e.target.valueAsNumber;
this._current.elapsed = elapsed;
this._current.at = performance.now();
this._app.mpd.command(`seekcur ${elapsed}`);
});
DOM.volume.addEventListener("input", e => this._app.mpd.command(`setvol ${e.target.valueAsNumber}`));
DOM.mute.addEventListener("click", _ => this._app.mpd.command(`setvol ${this._toggledVolume}`));
}

2
app/index.html
View file

@ -16,7 +16,7 @@
<span class="subtitle"></span>
<div class="timeline">
<span class="elapsed"></span>
<x-range></x-range>
<x-range step="0.1"></x-range>
<span class="duration"></span>
</div>
</div>

10
app/js/elements/player.js
View file

@ -21,7 +21,6 @@ class Player extends Component {
const all = this.querySelectorAll("[class]");
[...all].forEach(node => DOM[node.className] = node);
DOM.progress = DOM.timeline.querySelector("x-range");
DOM.progress.step = "0.1"; // FIXME
DOM.volume = DOM.volume.querySelector("x-range");
this._dom = DOM;
@ -171,9 +170,14 @@ class Player extends Component {
this._app.mpd.command(`repeat ${isRepeat ? "0" : "1"}`);
});
DOM.volume.addEventListener("input", e => this._app.mpd.command(`setvol ${e.target.valueAsNumber}`));
DOM.progress.addEventListener("input", e => this._app.mpd.command(`seekcur ${e.target.valueAsNumber}`));
DOM.progress.addEventListener("input", e => {
let elapsed = e.target.valueAsNumber;
this._current.elapsed = elapsed;
this._current.at = performance.now();
this._app.mpd.command(`seekcur ${elapsed}`);
});
DOM.volume.addEventListener("input", e => this._app.mpd.command(`setvol ${e.target.valueAsNumber}`));
DOM.mute.addEventListener("click", _ => this._app.mpd.command(`setvol ${this._toggledVolume}`));
}

2
package.json
View file

@ -4,7 +4,7 @@
"description": "",
"main": "index.js",
"dependencies": {
"custom-range": "^1.0.3",
"custom-range": "^1.1.0",
"node-static": "^0.7.11",
"ws2mpd": "^2.2.0"
},