mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-08 19:06:15 -08:00
- Replaced `toPascalCase` with `getGlobalName` in build and dev scripts to standardize global variable naming for packages. - Added `toCamelCase` and `getGlobalName` utility functions in `utils.js` to handle naming conventions based on package type.
8 lines
14 KiB
JavaScript
8 lines
14 KiB
JavaScript
/*!
|
|
* artplayer-plugin-websr.js v1.0.1
|
|
* Github: https://github.com/zhw2590582/ArtPlayer
|
|
* (c) 2017-2026 Harvey Zhao
|
|
* Released under the MIT License.
|
|
*/
|
|
!function(e,t){"object"===typeof exports&&"undefined"!==typeof module?module.exports=t():"function"==typeof define&&define.amd?(t.artplayerPluginWebsr=t(),define(function(){return t.artplayerPluginWebsr})):(e="undefined"!==typeof globalThis?globalThis:e||self).artplayerPluginWebsr=t()}(this,function(){"use strict";var e=Object.defineProperty,t=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,i=Math.pow,n=(t,r,s)=>r in t?e(t,r,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[r]=s,o=(e,i)=>{for(var o in i||(i={}))r.call(i,o)&&n(e,o,i[o]);if(t)for(var o of t(i))s.call(i,o)&&n(e,o,i[o]);return e},a=(e,t,r)=>n(e,"symbol"!==typeof t?t+"":t,r),l=(e,t,r)=>new Promise((s,i)=>{var n=e=>{try{a(r.next(e))}catch(t){i(t)}},o=e=>{try{a(r.throw(e))}catch(t){i(t)}},a=e=>e.done?s(e.value):Promise.resolve(e.value).then(n,o);a((r=r.apply(e,t)).next())});const d=class e{static isSupported(){try{const e="undefined"!==typeof Worker,t="undefined"!==typeof OffscreenCanvas||"undefined"!==typeof document&&!!document.createElement("canvas").transferControlToOffscreen,r="undefined"!==typeof Blob;return e&&t&&r}catch(e){return!1}}static isVideoSupported(){try{return"undefined"!==typeof VideoEncoder&&"undefined"!==typeof VideoDecoder}catch(e){return!1}}constructor(t={}){const r=t.weightsBaseUrl||"/weights";this.networks=t.networks||{small:{name:"anime4k/cnn-2x-l",weightsUrl:`${r}/cnn-8.json`},medium:{name:"anime4k/cnn-2x-16",weightsUrl:`${r}/cnn-16.json`},large:{name:"anime4k/cnn-2x-28",weightsUrl:`${r}/cnn-28.json`}},this.weightsBaseUrl=r,this.networkSize=t.networkSize||"medium",this.workerUrl=t.workerUrl||"/worker/main.js",this.timeouts=o(o({},e.DEFAULT_TIMEOUTS),t.timeouts||{}),this.delays=o(o({},e.DEFAULT_DELAYS),t.delays||{}),this.imageScale="number"===typeof t.imageScale&&t.imageScale>0?t.imageScale:2,this.videoScale="number"===typeof t.videoScale&&t.videoScale>0?t.videoScale:2,this.weightsCache=new Map,this.workerInstance=null,this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.realtimeLoopId=null,this.realtimeState=null,this.init()}init({prewarm:t=!0}={}){if(!e.isSupported())throw new Error("Upscaler is not supported in this environment");return t&&this.getWorker().postMessage({cmd:"isSupported"}),this}getWorker(){return this.workerInstance||(this.workerInstance=new Worker(this.workerUrl),this.workerInstance.onmessage=e=>this.handleWorkerMessage(e)),this.workerInstance}static extractProgressValue(e){var t,r,s;const i=null!=(s=null!=(r=null!=(t=e.data)?t:e.progress)?r:e.value)?s:e.percentage;return"number"===typeof i?Math.min(100,Math.max(0,Math.round(i))):null}handleBlobResponse(e){const t="video"===this.processingType?"videoBlob":"imageBlob",r=this.messageHandlers[t];e.data instanceof Blob&&r&&r({[t]:e.data})}requestBlob(){const e="video"===this.processingType?"getVideoBlob":"getImageBlob";this.getWorker().postMessage({cmd:e})}handleWorkerMessage(t){const{data:r}=t;if(!r.cmd)return;const{cmd:s}=r;if("progress"===s){const t=e.extractProgressValue(r);null!==t&&this.progressCallback&&this.progressCallback(t),this.messageHandlers.progress&&this.messageHandlers.progress(r)}else"finished"===s?r.data instanceof Blob?this.handleBlobResponse(r):this.requestBlob():this.messageHandlers[s]&&this.messageHandlers[s](r)}loadWeights(e){return l(this,null,function*(){if(this.validateNetworkSize(e),this.weightsCache.has(e))return this.weightsCache.get(e);const t=this.networks[e],r=yield fetch(t.weightsUrl);if(!r.ok)throw new Error(`Failed to fetch weights: ${r.statusText}`);const s=yield r.json();return this.weightsCache.set(e,s),s})}static loadImageMetadata(e,t){return new Promise((r,s)=>{const i=new Blob([e],{type:t}),n=URL.createObjectURL(i),o=new Image;o.onload=()=>{URL.revokeObjectURL(n),r({width:o.width,height:o.height})},o.onerror=()=>{URL.revokeObjectURL(n),s(new Error("Failed to load image"))},o.src=n})}static loadVideoMetadata(e,t){return new Promise((r,s)=>{const i=URL.createObjectURL(e),n=document.createElement("video");n.src=i;const o=setTimeout(()=>s(new Error("Timeout")),t);n.onloadedmetadata=()=>{clearTimeout(o),URL.revokeObjectURL(i),r({width:n.videoWidth,height:n.videoHeight,duration:n.duration})},n.onerror=()=>{clearTimeout(o),URL.revokeObjectURL(i),s(new Error("Failed to load video"))}})}createOffscreenCanvas(e,t,r=2){const s="number"===typeof r&&r>0?r:1,i=document.createElement("canvas");if(i.width=e*s,i.height=t*s,"function"!==typeof i.transferControlToOffscreen)throw new TypeError("OffscreenCanvas is not supported in this environment");return i.transferControlToOffscreen()}createBlobPromise(e,t){return new Promise((r,s)=>{const i=setTimeout(()=>{this.messageHandlers[e]&&(delete this.messageHandlers[e],s(new Error(`${e} processing timeout`)))},t);this.messageHandlers[e]=t=>{delete this.messageHandlers[e],clearTimeout(i);const n=t[e]||t.data;n instanceof Blob?r(n):s(new Error(`Invalid ${e} format`))}})}validateNetworkSize(e){if(!this.networks[e])throw new Error(`Invalid networkSize: use one of ${Object.keys(this.networks).join(", ")}`)}upscaleImage(t,r,s){return l(this,null,function*(){if(!t)throw new Error("Image file is required");const i=r||this.networkSize;this.validateNetworkSize(i),this.processingType="image";const n=yield t.arrayBuffer(),o=t.type||"image/jpeg",{width:a,height:l}=yield e.loadImageMetadata(n,o),d=yield this.loadWeights(i),c=this.networks[i],h="number"===typeof s&&s>0?s:this.imageScale,[u,m]=[this.createOffscreenCanvas(a,l,h),this.createOffscreenCanvas(a,l,1)],p=this.createBlobPromise("imageBlob",this.timeouts.IMAGE);return this.getWorker().postMessage({cmd:"init",data:{imageArrayBuffer:n,imageMimeType:o,upscaled:u,original:m,resolution:{width:a,height:l},network_name:c.name,weights:d}},[u,m]),setTimeout(()=>{this.getWorker().postMessage({cmd:"network",data:{name:c.name,imageArrayBuffer:n,imageMimeType:o,weights:d}}),setTimeout(()=>{this.getWorker().postMessage({cmd:"getImageBlob",data:{imageArrayBuffer:n,imageMimeType:o}})},this.delays.NETWORK)},this.delays.INIT),p})}upscaleVideo(t,r,s){return l(this,null,function*(){if(!t)throw new Error("Video file is required");const i=r||this.networkSize;if(this.validateNetworkSize(i),!e.isVideoSupported())throw new Error("WebCodecs API not supported. Requires Chrome 94+");this.processingType="video";const{width:n,height:o,duration:a}=yield e.loadVideoMetadata(t,this.timeouts.METADATA),l=yield this.loadWeights(i),d=this.networks[i],c="number"===typeof s&&s>0?s:this.videoScale,[h,u]=[this.createOffscreenCanvas(n,o,c),this.createOffscreenCanvas(n,o,1)],m=this.createBlobPromise("videoBlob",this.timeouts.VIDEO);return this.getWorker().postMessage({cmd:"process",file:t,fileSize:t.size,duration:a,adjustedResolution:{adjustedInputWidth:n,adjustedInputHeight:o,adjustedOutputWidth:n*c,adjustedOutputHeight:o*c},upscaled:h,original:u,weights:l,network_name:d.name,skipDemuxProgress:!0},[h,u]),m})}startRealtimeUpscale(e,t,r,s){return l(this,null,function*(){if(!e||!t)throw new Error("videoElement and canvasElement are required");const i=r||this.networkSize;this.validateNetworkSize(i);const n=this.networks[i],o=yield this.loadWeights(i),a="number"===typeof s&&s>0?s:this.videoScale;yield new Promise((t,r)=>{if(e.readyState>=1)return void t();let s,i;const n=()=>{e.removeEventListener("loadedmetadata",s),e.removeEventListener("error",i)};s=()=>{n(),t()},i=()=>{n(),r(new Error("Failed to load video metadata"))},e.addEventListener("loadedmetadata",s),e.addEventListener("error",i)});const d=e.videoWidth,c=e.videoHeight;if(!d||!c)throw new Error("Invalid video dimensions");const h=!t._upscalerTransferred;let u=null;if(h){if(t.width=d*a,t.height=c*a,"function"!==typeof t.transferControlToOffscreen)throw new TypeError("OffscreenCanvas is not supported in this environment");u=t.transferControlToOffscreen(),t._upscalerTransferred=!0}const m=document.createElement("canvas");m.width=d,m.height=c;const p=m.getContext("2d");this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null);const g={cmd:"realtimeInit",data:{upscaled:h?u:null,resolution:{width:d,height:c,scale:a,outputWidth:d*a,outputHeight:c*a},network_name:n.name,weights:o}};h&&u?this.getWorker().postMessage(g,[u]):this.getWorker().postMessage(g),this.realtimeState={running:!0,video:e,canvas:t,scale:a,busy:!1,frameIndex:0,captureCanvas:m,captureCtx:p};const f=()=>l(this,null,function*(){if(!this.realtimeState||!this.realtimeState.running)return;const e=this.realtimeState,t=e.video,r=t.HAVE_CURRENT_DATA||2;if(!t.paused&&!t.ended&&!e.busy&&t.readyState>=r&&t.videoWidth>0&&t.videoHeight>0){e.busy=!0;try{const r=e.captureCanvas,s=e.captureCtx;if(!r||!s)throw new Error("Missing capture canvas");s.drawImage(t,0,0,r.width,r.height);const i=yield createImageBitmap(r);e.frameIndex+=1,this.getWorker().postMessage({cmd:"realtimeFrame",frame:i},[i])}catch(s){console.warn("realtimeFrame error",s)}finally{this.realtimeState&&(this.realtimeState.busy=!1)}}this.realtimeLoopId=requestAnimationFrame(f)});this.realtimeLoopId=requestAnimationFrame(f)})}stopRealtimeUpscale(){this.realtimeLoopId&&(cancelAnimationFrame(this.realtimeLoopId),this.realtimeLoopId=null),this.realtimeState&&(this.realtimeState.running=!1,this.realtimeState=null)}downloadUpscaled(e,t,r=null){return l(this,null,function*(){const s=e.type.startsWith("video"),i=t||this.networkSize,n=s?yield this.upscaleVideo(e,i):yield this.upscaleImage(e,i),o=URL.createObjectURL(n),a=document.createElement("a");return a.href=o,a.download=r||`upscaled_${Date.now()}.${s?"mp4":"png"}`,a.click(),URL.revokeObjectURL(o),n})}getSupportedNetworks(){return Object.keys(this.networks)}static getGPUCapability(){return l(this,null,function*(){try{if(navigator.gpu){const e=yield navigator.gpu.requestAdapter();if(e){const t=e.limits.maxStorageBufferBindingSize/512,r=67108864;return Math.min(t,r)}}const e=document.createElement("canvas").getContext("webgl2");return e?i(e.getParameter(e.MAX_TEXTURE_SIZE),2):8388608}catch(e){return 8388608}})}static getBackendType(){try{return navigator.gpu?"webgpu":document.createElement("canvas").getContext("webgl2")?"webgl":"unknown"}catch(e){return"unknown"}}getAppState(){return{backend:e.getBackendType(),isProcessing:!1,progress:0,width:0,height:0}}onProgress(e){"function"===typeof e&&(this.progressCallback=e)}dispose(){this.stopRealtimeUpscale(),this.workerInstance&&(this.workerInstance.terminate(),this.workerInstance=null),this.messageHandlers={},this.progressCallback=null,this.processingType=null,this.weightsCache.clear()}};a(d,"DEFAULT_TIMEOUTS",{IMAGE:3e5,VIDEO:36e5,METADATA:1e4}),a(d,"DEFAULT_DELAYS",{INIT:500,NETWORK:300});let c=d;return function(e={networkSize:"medium",compare:!1,weightsBaseUrl:"/weights",workerUrl:"/worker/main.js",videoScale:2}){return t=>{const{$video:r,$player:s}=t.template,i=document.createElement("canvas");function n(){const e=t.video,r=s.offsetWidth||640,i=s.offsetHeight||360,n=(e.videoWidth||640)/(e.videoHeight||360);let o=r,a=i;return r/i>n?o=i*n:a=r/n,{displayWidth:o,displayHeight:a}}if(s.appendChild(i),i.style.position="absolute",i.style.zIndex="11",i.style.pointerEvents="none",i.style.top="50%",i.style.left="50%",i.style.transform="translate(-50%, -50%)",i.style.opacity="0",i.style.transition="opacity 0.2s ease",!c||!c.isSupported||!c.isSupported())return void console.warn("Upscaler is not supported in this environment");const o=new c({networkSize:e.networkSize||"medium",weightsBaseUrl:e.weightsBaseUrl||"/weights",workerUrl:e.workerUrl||"/worker/main.js",videoScale:e.videoScale||2});let a=!1;function d(){return l(this,null,function*(){if(!a){a=!0;try{yield new Promise((e,t)=>{if(r.readyState>=1)return void e();let s,i;const n=()=>{r.removeEventListener("loadedmetadata",s),r.removeEventListener("error",i)};s=()=>{n(),e()},i=()=>{n(),t(new Error("Failed to load video metadata"))},r.addEventListener("loadedmetadata",s),r.addEventListener("error",i)}),yield o.startRealtimeUpscale(r,i,e.networkSize||o.networkSize),requestAnimationFrame(()=>{i.style.opacity="1"})}catch(t){console.error("artplayer-plugin-upscaler: failed to start realtime",t)}}})}const{displayWidth:h,displayHeight:u}=n();i.style.width=`${h}px`,i.style.height=`${u}px`;let m=50,p=!1,g=!!e.compare;const f=document.createElement("div");function w(){if(g){const{displayWidth:e,displayHeight:t}=n(),r=`linear-gradient(to right, transparent 0%, transparent ${m}%, black ${m}%, black 100%)`;i.style.maskImage=r;const o=s.offsetWidth||640,a=((s.offsetHeight||360)-t)/2,l=(o-e)/2+e*m/100;f.style.top=`${a}px`,f.style.left=`${l}px`,f.style.height=`${t}px`,f.style.transform="translateX(-50%)"}else i.style.maskImage="none"}function y(e){g&&(p=!0)}function v(e){if(g&&p){const t=s.getBoundingClientRect(),{displayWidth:r}=n(),i=((s.offsetWidth||640)-r)/2,o=e.clientX-t.left;m=(o-i)/r*100,m=Math.max(0,Math.min(100,m)),w()}}function k(e){p=!1}return f.style.position="absolute",f.style.width="3px",f.style.backgroundColor="rgba(255, 255, 255, 0.75)",f.style.cursor="ew-resize",f.style.zIndex="12",f.style.pointerEvents="auto",f.style.display=g?"block":"none",f.style.boxShadow="0 0 2px rgba(0, 0, 0, 0.1)",g&&(s.appendChild(f),f.addEventListener("mousedown",y),document.addEventListener("mousemove",v),document.addEventListener("mouseup",k),w()),t.on("destroy",()=>{o&&"function"===typeof o.dispose&&o.dispose(),f.removeEventListener("mousedown",y),document.removeEventListener("mousemove",v),document.removeEventListener("mouseup",k)}),t.on("resize",()=>{const{displayWidth:e,displayHeight:t}=n();i.style.width=`${e}px`,i.style.height=`${t}px`,w()}),t.on("play",()=>{d()}),{name:"artplayerPluginWebsr",upscaler:o,update:function(r={}){if(r&&"object"===typeof r){if(Object.prototype.hasOwnProperty.call(r,"compare")){const t=!!r.compare;e.compare=t,g=t,g?(f.parentNode||s.appendChild(f),f.style.display="block",f.addEventListener("mousedown",y),document.addEventListener("mousemove",v),document.addEventListener("mouseup",k),w()):(i.style.maskImage="none",f.style.display="none",f.removeEventListener("mousedown",y),document.removeEventListener("mousemove",v),document.removeEventListener("mouseup",k))}if(r.networkSize){const s=r.networkSize;e.networkSize=s,o&&"function"===typeof o.stopRealtimeUpscale&&o.stopRealtimeUpscale(),a=!1,t.paused||d()}}}}}}});
|