adds touch events for covers and fixes bug

This commit is contained in:
Mathias Scherer 2021-04-04 22:35:25 +02:00
parent 5458ee0654
commit 586c7a39d8
No known key found for this signature in database
GPG Key ID: 6A618EAA2BC2C1E5

View File

@ -10,9 +10,11 @@ class Cover extends Base {
entity.onmousedown = (event) => { entity.onmousedown = (event) => {
this.addSlider(event.x, event.y); this.addSlider(event.x, event.y);
}; };
entity.onmouseup = () => { entity.onpointerdown = (event) => {
this.removeSlider(); this.addSlider(event.x, event.y)
}; }
entity.onmouseup = this.removeSlider
entity.ontouchend = this.removeSlider
return entity; return entity;
} }
@ -50,7 +52,9 @@ class Cover extends Base {
document.body.appendChild(slider); document.body.appendChild(slider);
document.body.addEventListener("mouseup", this.removeSlider); document.body.addEventListener("mouseup", this.removeSlider);
document.body.addEventListener("touchend", this.removeSlider)
document.body.addEventListener("mousemove", this.onSliderMove); document.body.addEventListener("mousemove", this.onSliderMove);
document.body.addEventListener("touchmove", this.onSliderMove);
this.sliderStartY = offsetY; this.sliderStartY = offsetY;
this.sliderState = this.state; this.sliderState = this.state;
@ -61,6 +65,8 @@ class Cover extends Base {
if (sliderFill) { if (sliderFill) {
const offset = this.sliderStartY - event.y; const offset = this.sliderStartY - event.y;
this.sliderState = this.state + Math.round((100 / 200) * offset); this.sliderState = this.state + Math.round((100 / 200) * offset);
if(this.sliderState > 100) this.sliderState = 100
if(this.sliderState < 0) this.sliderState = 0
sliderFill.style.height = `${this.sliderState}%`; sliderFill.style.height = `${this.sliderState}%`;
sliderFill.innerHTML = this.sliderState; sliderFill.innerHTML = this.sliderState;
} }
@ -72,7 +78,9 @@ class Cover extends Base {
slider.remove(); slider.remove();
} }
document.body.removeEventListener("mouseup", this.removeSlider); document.body.removeEventListener("mouseup", this.removeSlider);
document.body.removeEventListener("touchend", this.removeSlider)
document.body.removeEventListener("mousemove", this.onSliderMove); document.body.removeEventListener("mousemove", this.onSliderMove);
document.body.removeEventListener("touchmove", this.onSliderMove);
this.sendNewState(); this.sendNewState();
} }