diff --git a/dist/bookmarklet-video-speed.js b/dist/bookmarklet-video-speed.js index f7a881f..4be8b13 100644 --- a/dist/bookmarklet-video-speed.js +++ b/dist/bookmarklet-video-speed.js @@ -1,8 +1,8 @@ -(()=>{var H=Object.defineProperty;var b=n=>{throw TypeError(n)};var $=(n,e,t)=>e in n?H(n,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[e]=t;var o=(n,e,t)=>$(n,typeof e!="symbol"?e+"":e,t),A=(n,e,t)=>e.has(n)||b("Cannot "+t);var E=(n,e,t)=>e.has(n)?b("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(n):e.set(n,t);var a=(n,e,t)=>(A(n,e,"access private method"),t);var c="nunsez-video-bookmarklet";var h="".concat(c,"-state"),g="".concat(c,"-memory"),i="".concat(c,"-controller"),v="".concat(c,"-tickmarks"),T="".concat(c,"-stylesheet"),B="#".concat(i," * {box-sizing: border-box;color: #111;line-height:initial}")+"#".concat(i,", #").concat(i," .range, #").concat(i," .controls {margin: 0;padding: 4px;}")+"#".concat(i,", #").concat(i," .btn {border: 1px solid #444;border-radius: 4px;background-color: #eee;}")+"#".concat(i," {position: fixed;left: 8px;top: 8px;width: 150px;font: 15px monospace;box-shadow: 1px 1px 4px #444;user-select: none;z-index: 999999999;}")+"#".concat(i," .controls {display: flex;justify-content: space-between;align-items: center;}")+"#".concat(i," .btn {width: 20px;height: 20px;margin: 0;padding: 0;}")+"#".concat(i," .value {pointer-events: none;}")+"#".concat(i,' .value::after {content: "%";margin-left: 2px;}')+"#".concat(i," .range {width: 100%;}")+"#".concat(i," .range ~ * {display: none;}");function k(n){if(n.head.querySelector("#".concat(T)))return;let e=n.createElement("style");e.setAttribute("id",T),e.textContent=B,n.head.append(e)}var m=class n{constructor(e){o(this,"document");o(this,"speed");o(this,"videos",[]);o(this,"controller");o(this,"searchTimeoutId");o(this,"observer");this.document=e,this.speed=n.getSpeed(),this.observer=new MutationObserver(t=>this.refresh(t)),this.controller=new p(this)}static getSpeed(){let e=Number.parseInt(localStorage.getItem(g)||"");return Number.isNaN(e)?100:e}static getVideos(e){let t=[];return e.querySelectorAll("video, iframe").forEach(r=>{var l;if(r instanceof HTMLVideoElement)t.push(r);else if(r instanceof HTMLIFrameElement){let d=(l=n.getIDoc(r))==null?void 0:l.querySelector("video");d&&t.push(d)}}),t}static getIDoc(e){var t;try{return((t=e.contentWindow)==null?void 0:t.document)||e.contentDocument}catch(r){return console.log("iframe document is not reachable: "+e.src),null}}initialize(){this.observer.observe(document.body,{childList:!0}),this.controller.appendTo(document.body)}refresh(e){console.log("_mutationRecords",e),console.log("refresh",this.searchTimeoutId,this.controller),clearTimeout(this.searchTimeoutId),this.searchTimeoutId=setTimeout(()=>{this.videos=n.getVideos(this.document.body),this.setSpeed(this.speed)},500)}terminate(){console.log("terminate observer",this.observer),console.log("terminate oldController",this.controller),this.observer.disconnect(),this.controller.el.remove(),this.videos.forEach(e=>e.playbackRate=100/100)}setSpeed(e){if(!this.controller||Number.isNaN(e))return;e===5?this.speed>5?this.speed=0:this.speed=10:e>300?this.speed=300:e<0?this.speed=0:this.speed=e;let t=this.speed.toString();this.controller.value.textContent=t,this.controller.range.value=t,this.videos.forEach(r=>r.playbackRate=this.speed/100),console.log("set speed",this.videos,this.controller),localStorage.setItem(g,t)}},s,L,S,M,f,x,y,D,I,u=class u{constructor(e){E(this,s);o(this,"el");o(this,"subBtn",document.createElement("button"));o(this,"value",document.createElement("div"));o(this,"addBtn",document.createElement("button"));o(this,"range",document.createElement("input"));this.el=document.createElement("div"),this.el[h]=e}appendTo(e){var t;return(t=e.querySelector(i))==null||t.remove(),a(this,s,S).call(this),a(this,s,L).call(this),e.append(this.el),this}get state(){return this.el[h]}};s=new WeakSet,L=function(){this.range.addEventListener("input",()=>{let e=Number.parseFloat(this.range.value);this.state.setSpeed(e)}),this.subBtn.addEventListener("click",()=>this.state.setSpeed(this.state.speed-5)),this.addBtn.addEventListener("click",()=>this.state.setSpeed(this.state.speed+5))},S=function(){this.el.setAttribute("id",i),this.el.append(a(this,s,M).call(this),a(this,s,D).call(this),a(this,s,I).call(this,u.tickMarks))},M=function(){let e=document.createElement("div");return e.classList.add("controls"),e.append(a(this,s,f).call(this),a(this,s,x).call(this),a(this,s,y).call(this)),e},f=function(){return this.subBtn=document.createElement("button"),this.subBtn.textContent="-",this.subBtn.classList.add("btn","sub"),this.subBtn},x=function(){return this.value=document.createElement("div"),this.value.textContent=this.state.speed.toString(),this.value},y=function(){return this.addBtn=document.createElement("button"),this.addBtn.textContent="+",this.addBtn.classList.add("btn","add"),this.addBtn},D=function(){return this.range=document.createElement("input"),this.range.classList.add("range"),this.range.setAttribute("type","range"),this.range.setAttribute("min","10"),this.range.setAttribute("max","300"),this.range.setAttribute("step","10"),this.range.setAttribute("list",v),this.range.value=this.state.speed.toString(),this.range},I=function(e){let t=document.createElement("datalist");t.setAttribute("id",v);let r=e.map(l=>{let d=document.createElement("option");return d.value=l.toString(),d});return t.append(...r),t},o(u,"tickMarks",[10,50,100,150,200,250,300]);var p=u;function R(n){let e=n.document,t=e.querySelector("#".concat(i));if(t){let l=t[h];l==null||l.terminate(),t.remove();return}k(e),new m(e).initialize()}R(window);})(); +(()=>{var H=Object.defineProperty;var b=n=>{throw TypeError(n)};var $=(n,e,t)=>e in n?H(n,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[e]=t;var o=(n,e,t)=>$(n,typeof e!="symbol"?e+"":e,t),A=(n,e,t)=>e.has(n)||b("Cannot "+t);var E=(n,e,t)=>e.has(n)?b("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(n):e.set(n,t);var a=(n,e,t)=>(A(n,e,"access private method"),t);var d="nunsez-video-bookmarklet";var h="".concat(d,"-state"),g="".concat(d,"-memory"),i="".concat(d,"-controller"),T="".concat(d,"-tickmarks"),v="".concat(d,"-stylesheet"),B="#".concat(i," * {box-sizing: border-box;color: #111;line-height:initial}")+"#".concat(i,", #").concat(i," .range, #").concat(i," .controls {margin: 0;padding: 4px;}")+"#".concat(i,", #").concat(i," .btn {border: 1px solid #444;border-radius: 4px;background-color: #eee;}")+"#".concat(i," {position: fixed;left: 8px;top: 8px;width: 150px;font: 15px monospace;box-shadow: 1px 1px 4px #444;user-select: none;z-index: 999999999;}")+"#".concat(i," .controls {display: flex;justify-content: space-between;align-items: center;}")+"#".concat(i," .btn {width: 20px;height: 20px;margin: 0;padding: 0;}")+"#".concat(i," .value {pointer-events: none;}")+"#".concat(i,' .value::after {content: "%";margin-left: 2px;}')+"#".concat(i," .range {width: 100%;}")+"#".concat(i," .range ~ * {display: none;}");function k(n){if(n.head.querySelector("#".concat(v)))return;let e=n.createElement("style");e.setAttribute("id",v),e.textContent=B,n.head.append(e)}var m=class n{constructor(e){o(this,"document");o(this,"speed");o(this,"videos",[]);o(this,"controller");o(this,"searchTimeoutId");o(this,"observer");this.document=e,this.speed=n.getSpeed(),this.observer=new MutationObserver(t=>this.refresh(t)),this.controller=new p(this)}static getSpeed(){let e=Number.parseInt(localStorage.getItem(g)||"");return Number.isNaN(e)?100:e}static getVideos(e){let t=[];return e.querySelectorAll("video, iframe").forEach(r=>{var l;if(r instanceof HTMLVideoElement)t.push(r);else if(r instanceof HTMLIFrameElement){let c=(l=n.getIDoc(r))==null?void 0:l.querySelector("video");c&&t.push(c)}}),t}static getIDoc(e){var t;try{return((t=e.contentWindow)==null?void 0:t.document)||e.contentDocument}catch(r){return console.log("iframe document is not reachable: "+e.src),null}}initialize(){this.observer.observe(document.body,{childList:!0}),this.controller.appendTo(document.body)}refresh(e){console.log("_mutationRecords",e),console.log("refresh",this.searchTimeoutId,this.controller),clearTimeout(this.searchTimeoutId),this.searchTimeoutId=setTimeout(()=>{this.videos=n.getVideos(this.document.body),this.setSpeed(this.speed)},500)}terminate(){console.log("terminate observer",this.observer),console.log("terminate oldController",this.controller),console.log("terminate searchTimeoutId",this.searchTimeoutId),clearTimeout(this.searchTimeoutId),this.observer.disconnect(),this.controller.el.remove(),this.videos.forEach(e=>e.playbackRate=100/100)}setSpeed(e){if(!this.controller||Number.isNaN(e))return;e===5?this.speed>5?this.speed=0:this.speed=10:e>300?this.speed=300:e<0?this.speed=0:this.speed=e;let t=this.speed.toString();this.controller.value.textContent=t,this.controller.range.value=t,this.videos.forEach(r=>r.playbackRate=this.speed/100),console.log("set speed",this.videos,this.controller),localStorage.setItem(g,t)}},s,L,S,M,f,x,I,y,D,u=class u{constructor(e){E(this,s);o(this,"el");o(this,"subBtn",document.createElement("button"));o(this,"value",document.createElement("div"));o(this,"addBtn",document.createElement("button"));o(this,"range",document.createElement("input"));this.el=document.createElement("div"),this.el[h]=e}appendTo(e){var t;return(t=e.querySelector(i))==null||t.remove(),a(this,s,S).call(this),a(this,s,L).call(this),e.append(this.el),this}get state(){return this.el[h]}};s=new WeakSet,L=function(){this.range.addEventListener("input",()=>{let e=Number.parseFloat(this.range.value);this.state.setSpeed(e)}),this.subBtn.addEventListener("click",()=>this.state.setSpeed(this.state.speed-5)),this.addBtn.addEventListener("click",()=>this.state.setSpeed(this.state.speed+5))},S=function(){this.el.setAttribute("id",i),this.el.append(a(this,s,M).call(this),a(this,s,y).call(this),a(this,s,D).call(this,u.tickMarks))},M=function(){let e=document.createElement("div");return e.classList.add("controls"),e.append(a(this,s,f).call(this),a(this,s,x).call(this),a(this,s,I).call(this)),e},f=function(){return this.subBtn=document.createElement("button"),this.subBtn.textContent="-",this.subBtn.classList.add("btn","sub"),this.subBtn},x=function(){return this.value=document.createElement("div"),this.value.textContent=this.state.speed.toString(),this.value},I=function(){return this.addBtn=document.createElement("button"),this.addBtn.textContent="+",this.addBtn.classList.add("btn","add"),this.addBtn},y=function(){return this.range=document.createElement("input"),this.range.classList.add("range"),this.range.setAttribute("type","range"),this.range.setAttribute("min","10"),this.range.setAttribute("max","300"),this.range.setAttribute("step","10"),this.range.setAttribute("list",T),this.range.value=this.state.speed.toString(),this.range},D=function(e){let t=document.createElement("datalist");t.setAttribute("id",T);let r=e.map(l=>{let c=document.createElement("option");return c.value=l.toString(),c});return t.append(...r),t},o(u,"tickMarks",[10,50,100,150,200,250,300]);var p=u;function R(n){let e=n.document,t=e.querySelector("#".concat(i));if(t){let l=t[h];l==null||l.terminate(),t.remove();return}k(e),new m(e).initialize()}R(window);})(); /** * @file A script to control the speed of html5 video playback in the browser. * @author Alexander Mandrikov - * @version 2.1.0 + * @version 2.1.1 * @license AGPLv3 * @see {@link https://github.com/nunsez/bookmarklet-video-speed GitHub} for further information. */ diff --git a/main.ts b/main.ts index d6a9ab9..abb7e62 100644 --- a/main.ts +++ b/main.ts @@ -1,7 +1,7 @@ /** * @file A script to control the speed of html5 video playback in the browser. * @author Alexander Mandrikov - * @version 2.1.0 + * @version 2.1.1 * @license AGPLv3 * @see {@link https://github.com/nunsez/bookmarklet-video-speed GitHub} for further information. */ @@ -27,7 +27,7 @@ const STYLES = `#${CONTROLLER_ID} .range ~ * {display: none;}`; interface MyElement extends HTMLDivElement { - [STATE_ID]?: State + [STATE_ID]?: State; } function addStyles(document: Document) { @@ -101,8 +101,8 @@ class State { } refresh(_mutationRecords: MutationRecord[]) { - console.log('_mutationRecords', _mutationRecords) - console.log('refresh', this.searchTimeoutId, this.controller); + console.log("_mutationRecords", _mutationRecords); + console.log("refresh", this.searchTimeoutId, this.controller); clearTimeout(this.searchTimeoutId); this.searchTimeoutId = setTimeout(() => { @@ -112,8 +112,10 @@ class State { } terminate() { - console.log('terminate observer', this.observer) - console.log('terminate oldController', this.controller) + console.log("terminate observer", this.observer); + console.log("terminate oldController", this.controller); + console.log("terminate searchTimeoutId", this.searchTimeoutId); + clearTimeout(this.searchTimeoutId); this.observer.disconnect(); this.controller.el.remove(); this.videos.forEach((v) => v.playbackRate = DEFAULT_SPEED / 100); @@ -140,7 +142,7 @@ class State { this.controller.range.value = speedString; this.videos.forEach((v) => v.playbackRate = this.speed / 100); - console.log('set speed', this.videos, this.controller); + console.log("set speed", this.videos, this.controller); localStorage.setItem(STORAGE_ID, speedString); }