UNPKG

@ezuikit/theme-plugin-record

Version:

回放主题

9 lines (8 loc) 19.3 kB
/* * * @ezuikit/theme-plugin-record v0.1.0 * Copyright (c) 2024-3-23 Ezviz-OpenBiz * Released under MIT the License. * */ import{recordIcon as e}from"@ezuikit/icons";import{PREFIX_CLASS_NAME as t,addClass as n,removeClass as r}from"@ezuikit/utils-dom";import{FOOTER_LEFT_CLS as a,FOOTER_PREFIX_CLS as o}from"@ezuikit/theme-plugin-footer";function i(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===n&&r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}i("");var s="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||"undefined"!=typeof msCrypto&&"function"==typeof msCrypto.getRandomValues&&msCrypto.getRandomValues.bind(msCrypto),c=new Uint8Array(16);function l(){if(!s)throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return s(c)}for(var u=/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i,d=[],f=0;f<256;++f)d.push((f+256).toString(16).substr(1));function p(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,n=(d[e[t+0]]+d[e[t+1]]+d[e[t+2]]+d[e[t+3]]+"-"+d[e[t+4]]+d[e[t+5]]+"-"+d[e[t+6]]+d[e[t+7]]+"-"+d[e[t+8]]+d[e[t+9]]+"-"+d[e[t+10]]+d[e[t+11]]+d[e[t+12]]+d[e[t+13]]+d[e[t+14]]+d[e[t+15]]).toLowerCase();if(!function(e){return"string"==typeof e&&u.test(e)}(n))throw TypeError("Stringified UUID is invalid");return n}function h(e,t,n){var r=(e=e||{}).random||(e.rng||l)();if(r[6]=15&r[6]|64,r[8]=63&r[8]|128,t){n=n||0;for(var a=0;a<16;++a)t[n+a]=r[a];return t}return p(r)}function m(e,t){return null!=t&&"undefined"!=typeof Symbol&&t[Symbol.hasInstance]?!!t[Symbol.hasInstance](e):e instanceof t}var g=function(){function e(){this._keyStr="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="}var t=e.prototype;return t.$=function(e){var t=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/,n=/^(?:\s*(<[\w\W]+>)[^>]*|.([\w-]*))$/;if(t.test(e)){var r=t.exec(e);return document.getElementById(r[2])}if(n.test(e)){for(var a=n.exec(e),o=document.getElementsByTagName("*"),i=[],s=0,c=o.length;s<c;s++)o[s].className.match(new RegExp("(\\s|^)"+a[2]+"(\\s|$)"))&&i.push(o[s]);return i}},t.dateFormat=function(e,t){var n={"M+":e.getMonth()+1,"d+":e.getDate(),"h+":e.getHours(),"m+":e.getMinutes(),"s+":e.getSeconds(),"q+":Math.floor((e.getMonth()+3)/3),S:e.getMilliseconds()};for(var r in/(y+)/.test(t)&&(t=t.replace(RegExp.$1,(e.getFullYear()+"").substr(4-RegExp.$1.length))),n)new RegExp("("+r+")").test(t)&&(t=t.replace(RegExp.$1,1===RegExp.$1.length?n[r]:("00"+n[r]).substr((""+n[r]).length)));return t},t.downloadFile=function(e,t){var n=e;m(e,Blob)||m(e,File)||(n=new Blob([e]));var r=window.URL.createObjectURL(n),a=window.document.createElement("a");a.href=r,a.download=t;var o=document.createEvent("MouseEvents");o.initEvent("click",!0,!0),a.dispatchEvent(o)},t.createxmlDoc=function(){for(var e,t=["MSXML2.DOMDocument","MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0","MSXML2.DOMDocument.3.0","Microsoft.XmlDom"],n=0,r=t.length;n<r;n++)try{e=new ActiveXObject(t[n]);break}catch(t){e=document.implementation.createDocument("","",null);break}return e.async="false",e},t.parseXmlFromStr=function(e){if(null===e||""===e)return null;var t=this.createxmlDoc();return"Netscape"===navigator.appName||"Opera"===navigator.appName?t=(new DOMParser).parseFromString(e,"text/xml"):t.loadXML(e),t},t.encode=function(e){var t,n,r,a,o,i,s,c="",l=0;for(e=this._utf8_encode(e);l<e.length;)a=(t=e.charCodeAt(l++))>>2,o=(3&t)<<4|(n=e.charCodeAt(l++))>>4,i=(15&n)<<2|(r=e.charCodeAt(l++))>>6,s=63&r,isNaN(n)?i=s=64:isNaN(r)&&(s=64),c=c+this._keyStr.charAt(a)+this._keyStr.charAt(o)+this._keyStr.charAt(i)+this._keyStr.charAt(s);return c},t.decode=function(e){var t,n,r,a,o,i,s="",c=0;for(e=e.replace(/[^A-Za-z0-9+/=]/g,"");c<e.length;)t=this._keyStr.indexOf(e.charAt(c++))<<2|(a=this._keyStr.indexOf(e.charAt(c++)))>>4,n=(15&a)<<4|(o=this._keyStr.indexOf(e.charAt(c++)))>>2,r=(3&o)<<6|(i=this._keyStr.indexOf(e.charAt(c++))),s+=String.fromCharCode(t),64!==o&&(s+=String.fromCharCode(n)),64!==i&&(s+=String.fromCharCode(r));return this._utf8_decode(s)},t._utf8_encode=function(e){e=e.replace(/\r\n/g,"\n");for(var t="",n=0;n<e.length;n++){var r=e.charCodeAt(n);r<128?t+=String.fromCharCode(r):r>127&&r<2048?(t+=String.fromCharCode(r>>6|192),t+=String.fromCharCode(63&r|128)):(t+=String.fromCharCode(r>>12|224),t+=String.fromCharCode(r>>6&63|128),t+=String.fromCharCode(63&r|128))}return t},t._utf8_decode=function(e){for(var t="",n=0,r=0,a=0;n<e.length;)if((r=e.charCodeAt(n))<128)t+=String.fromCharCode(r),n++;else if(r>191&&r<224)a=e.charCodeAt(n+1),t+=String.fromCharCode((31&r)<<6|63&a),n+=2;else{a=e.charCodeAt(n+1);var o=e.charCodeAt(n+2);t+=String.fromCharCode((15&r)<<12|(63&a)<<6|63&o),n+=3}return t},t.isFirefox=function(){var e=!1,t=navigator.userAgent.toLowerCase(),n="";return t.match(/firefox\/([\d.]+)/)&&(n=t.match(/firefox\/([\d.]+)/)[1],parseInt(n.split(".")[0],10)>-1&&(e=!0)),e},t.isSafari=function(){var e=!1,t=navigator.userAgent.toLowerCase(),n="";return t.match(/version\/([\d.]+).safari./)&&(n=t.match(/version\/([\d.]+).safari./)[1],parseInt(n.split(".")[0],10)>-1&&(e=!0)),e},t.isEdge=function(){return navigator.userAgent.toLowerCase().indexOf("edge")>-1},t.isIOS=function(){return!!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)},e}(),v=new g;window.requestFileSystem=window.requestFileSystem||window.webkitRequestFileSystem,window.URL=window.URL||window.webkitURL;var y,b=function(){function e(e,t,n,r){this.szUUID=e,this.szFileName=t,this.iStreamType=n,this.szPath="",this.bStart=!1,this.aStreamList=[],this.options=r,this.fileContents=[]}var t=e.prototype;return t.init=function(){var e=this;return new Promise((function(t){e.fileContents=[]}))},t.getDateDir=function(){return v.dateFormat(new Date,"yyyy-MM-dd")},t.writeFileHeader=function(e){var t=new Blob([e],{type:"application/octet-stream"});this.fileContents.push(t),this.bStart=!0},t.writeFileContent=function(e){var t=new Blob([e],{type:"application/octet-stream"});this.fileContents.push(t)},t.writeFile=function(e){var t=this;if(this.bStart)if(this.aStreamList.length>0){var n=this.aStreamList.shift();if(e.seek(e.length),e.length>=this.options.iFileSize)return void(this.options.cbEventHandler&&this.options.cbEventHandler(3001,this.szUUID));var r=new Blob([n]);e.write(r)}else setTimeout((function(){t.writeFile(e)}),1e3)},t.stopWriteFile=function(){var e=this;return this.bStart=!1,new Promise((function(t){var n=new Blob(e.fileContents,{type:"application/octet-stream"});e.fileContents=[],t(URL.createObjectURL(n))}))},e}(),S=function(){function e(e,t,n,r,a,o,i,s){this.szBasePath=e,this.szUUID=t,this.szFileName=n,this.aHeadBuf=new Uint8Array(r),this.iPackType=a,this.iStreamType=o,this.oWorker=null,this.oFileSystem=null,this.options=i,this.bHead=!0,this.staticPath=s,this.fileContents=[]}var t=e.prototype;return t.init=function(){var e=this;return new Promise((function(t,n){e.initWorker().then((function(){t(e.szUUID)}),(function(e){n(e)}))}))},t.initFileSystem=function(){var e=this;return this.oFileSystem=new b(this.szUUID,this.szFileName,this.iStreamType,this.options),new Promise((function(t,n){e.oFileSystem.init().then((function(){t()}),(function(e){n(e)}))}))},t.initWorker=function(){var e=this;return new Promise((function(t){var n,r=new Blob([(n=e.staticPath,void 0===n&&(n="https://open.ys7.com/assets/ezuikit_v3.6"),'(function() {\n const RECORDRTP = 0; //录制一份未经过转封装的码流原始数据,用于定位问题\n self.Module = { memoryInitializerRequest: loadMemInitFile(), TOTAL_MEMORY: 128*1024*1024 };\n importScripts = (function (globalEval) {\n var xhr = new XMLHttpRequest;\n return function importScripts() {\n var\n args = Array.prototype.slice.call(arguments)\n , len = args.length\n , i = 0\n , meta\n , data\n , content\n ;\n for (; i < len; i++) {\n if (args[i].substr(0, 5).toLowerCase() === "data:") {\n data = args[i];\n content = data.indexOf(",");\n meta = data.substr(5, content).toLowerCase();\n data = decodeURIComponent(data.substr(content + 1));\n if (/;s*base64s*[;,]/.test(meta)) {\n data = atob(data);\n }\n if (/;s*charset=[uU][tT][fF]-?8s*[;,]/.test(meta)) {\n data = decodeURIComponent(escape(data));\n }\n } else {\n xhr.open("GET", args[i], false);\n xhr.send(null);\n data = xhr.responseText;\n }\n globalEval(data);\n }\n };\n }(eval));\n importScripts(\''+n+'/js/transform/SystemTransform.js\');\n\n Module.postRun.push(function() {\n postMessage({type: "loaded"});\n });\n\n onmessage = function (e) {\n var data = e.data;\n\n if ("create" === data.type) {\n var iHeadLen = data.len;\n var pHead = Module._malloc(iHeadLen);\n\n var aData = Module.HEAPU8.subarray(pHead, pHead + iHeadLen);\n aData.set(new Uint8Array(data.buf));\n\n var iTransType = data.packType;//目标格式 RTP->PS\n if (RECORDRTP) {\n postMessage({type: "created"});\n postMessage({type: "outputData", buf: data.buf, dType: 1}, [data.buf]);\n } else {\n var iRet = Module._ST_Create(pHead, iHeadLen, iTransType);\n if (iRet != 0) {\n console.log("_ST_Create failed!");\n } else {\n Module._ST_Start();\n postMessage({type: "created"});\n }\n }\n\n } else if ("inputData" === data.type) {\n if (RECORDRTP) {\n var aFileData = new Uint8Array(data.buf); // 拷贝一份\n var iBufferLen = aFileData.length;\n var szBufferLen = iBufferLen.toString(16);\n if (szBufferLen.length === 1) {\n szBufferLen = "000" + szBufferLen;\n } else if (szBufferLen.length === 2) {\n szBufferLen = "00" + szBufferLen;\n } else if (szBufferLen.length === 3) {\n szBufferLen = "0" + szBufferLen;\n }\n var aData = [0, 0, parseInt(szBufferLen.substring(0, 2), 16), parseInt(szBufferLen.substring(2, 4), 16)];\n for(var iIndex = 0, iDataLength = aFileData.length; iIndex < iDataLength; iIndex++) {\n aData[iIndex + 4] = aFileData[iIndex]\n }\n var dataUint8 = new Uint8Array(aData);\n postMessage({type: "outputData", buf: dataUint8.buffer, dType: 2}, [dataUint8.buffer]);\n } else {\n var iDataLen = data.len;\n var pData = Module._malloc(iDataLen);\n\n var aData = Module.HEAPU8.subarray(pData, pData + iDataLen);\n aData.set(new Uint8Array(data.buf));\n\n var iRet = Module._ST_InputData(0, pData, iDataLen);\n if (iRet != 0) {\n //console.log("_ST_InputData failed!");// 一开始会有一些失败,但是不影响后面的文件存储\n }\n\n Module._free(pData);\n }\n } else if ("release" === data.type) {\n Module._ST_Stop();\n Module._ST_Release();\n\n close();\n }\n };\n\n function loadMemInitFile() {\n var req = new XMLHttpRequest();\n req.open(\'GET\', \''+n+"/js/transform/SystemTransform.js.mem');\n req.responseType = 'arraybuffer';\n req.send();\n\n return req;\n }\n})();")]),a=URL.createObjectURL(r);e.oWorker=new Worker(a),e.oWorker.onmessage=function(n){var r=n.data,a=e.iPackType;if(1===e.options.iPackage&&(a=12),"loaded"===r.type)e.oWorker.postMessage({type:"create",buf:e.aHeadBuf.buffer,len:40,packType:a},[e.aHeadBuf.buffer]);else if("created"===r.type)t();else if("outputData"===r.type){var o=new Uint8Array(r.buf);if(1===e.options.iPackage)if(e.bHead){var i=new Blob([o],{type:"video/mp4"});e.fileContents.push(i),e.bStart=!0,e.bHead=!1}else{var s=new Blob([o],{type:"video/mp4"});e.fileContents.push(s)}else if(1===r.dType){var c=new Blob([o],{type:"video/mp4"});e.fileContents.push(c),e.bStart=!0}else{var l=new Blob([o],{type:"application/octet-stream"});e.fileContents.push(l)}}}}))},t.inputData=function(e){if(this.oWorker){var t=new Uint8Array(e);this.oWorker.postMessage({type:"inputData",buf:t.buffer,len:t.length},[t.buffer])}},t.stopRecord=function(e){var t=this;return new Promise((function(n,r){t.oWorker?t.oWorker.postMessage({type:"release"}):r();var a=new Blob(t.fileContents,{type:"application/octet-stream"});t.fileContents=[];var o=URL.createObjectURL(a);if(t.bStart=!1,e){var i=document.createElement("a");i.href=o,i.download=t.szFileName,document.body.appendChild(i),i.click(),document.body.removeChild(i)}n(o)}))},e}(),w=(y=Symbol("STORAGELIST"),function(){function e(e,t,n){this.szBasePath=e,this[y]={},this.options={iFileSize:1073741824},Object.assign(this.options,t),"string"==typeof t.staticPath&&(this.staticPath=t.staticPath)}var t=e.prototype;return t.startRecord=function(e,t,n,r,a){var o=this,i=h(),s=Object.assign({},this.options,a),c=new S(this.szBasePath,i,e,t,n,r,s,this.staticPath);return new Promise((function(e,t){c.init().then((function(t){o[y][t]=c,e(t)}),(function(e){t(e)}))}))},t.inputData=function(e,t){var n=this[y][e];n&&n.inputData(t)},t.stopRecord=function(e,t){var n=this;return new Promise((function(r,a){var o=n[y][e];o?o.stopRecord(t).then((function(){delete n[y][e],r()}),(function(){a()})):a()}))},e}()),C=function(){function e(){this._oStorageManager=new w("./transform",{staticPath:"https://open.ys7.com/assets/ezuikit_v4.0"},void 0)}var t=e.prototype;return t.startRecord=function(e,t){var n=this;return t=null!=t?t:(new Date).getTime()+"",new Promise((function(r,a){n._oStorageManager.startRecord(t+".mp4",e,2,0,{cbEventHandler:function(e){a(e)},iPackage:0}).then((function(e){n.szStorageUUID=e,r(e)}),(function(e){a(e)}))}))},t.inputData=function(e){this.szStorageUUID&&this._oStorageManager.inputData(this.szStorageUUID,e)},t.stopRecord=function(e){var t=this;return void 0===e&&(e=!0),new Promise((function(n,r){t._oStorageManager.stopRecord(t.szStorageUUID,e).then((function(e){n(t.szStorageUUID),t.szStorageUUID=""}),(function(e){r(e)}))}))},e}(),D=function(){function e(){this.name="ezuikit-player-plugin-record",this.recording=!1,this._record=new C}var t=e.prototype;return t.exec=function(e){var t=this;this._player=e,setTimeout((function(){["stop","pause","destroy"].forEach((function(n){e.event.on(n,(function(){t.stopRecord()}))}))}),0)},t.startRecord=function(e,t){var n,r=this;return void 0===e&&(e=""+(new Date).getTime()),this._recordInputDataFn=function(e){var t;r._record.szStorageUUID&&(null==(t=r._record)||t.inputData(e.data))},null==(n=this._record)?void 0:n.startRecord(this._player._aHead,e).then((function(t){var n,a,o;r.recording=!0,null==(a=r._player)||null==(n=a.logger)||n.log("[PlayerRecordPlugin] start record video, filename: ",e),null==(o=r._player)||o.event.on("recordInputData",r._recordInputDataFn)}))},t.stopRecord=function(){var e,t,n,r;return this.recording?(this.recording=!1,null==(t=this._player)||null==(e=t.logger)||e.log("[PlayerRecordPlugin] stop record video"),null==(n=this._player)||n.event.off("recordInputData",this._recordInputDataFn),null==(r=this._record)?void 0:r.stopRecord()):Promise.resolve()},t.destroy=function(){var e=this;this.stopRecord().then((function(){var t,n;null==(n=e._player)||null==(t=n.logger)||t.log("[PlayerRecordPlugin] destroy"),e._record=null}))},e}();i(':root{--font-size:14px;--color:#fff;--background-color:#000;--active-color:#1890ff;--botton-color:var(--color);--botton-border-color:var(--color);--footer-height:48px;--footer-icon-size:27px;--footer-color:--color;--footer-background-color:var(--background-color,#000);--footer-active-color:var(--active-color,#1890ff);--header-height:var(--footer-height,48px);--header-icon-size:27px;--header-color:var(--footer-color);--header-background-color:var(-footer-bg-color,#000);--header-active-color:var(--footer-active-color,#1890ff);--date-picker-header-height:34px;--date-picker-color:#595959;--date-picker-primary-color:#1890ff;--date-picker-font-size:14px;--date-picker-border-color:rgba(5,5,5,.06);--date-picker-disable-border-color:rgba(0,0,0,.2);--data-picker-scrollbar-width:8px;--data-picker-border-radius:2px}.ezui-record-timer{align-items:center;background:rgba(0,0,0,.314);border-radius:12px;color:#fff;display:none;height:24px;left:50%;line-height:24px;padding:0 8px;position:absolute;text-align:center;transform:translateX(-50%);z-index:10}.ezui-record-timer:before{background:red;border-radius:100%;content:"";display:inline-block;height:8px;margin:0 8px 0 0;width:8px}');const R={multiple:8,left:0,bottom:102,scale:1,onChange:()=>{}},_=`${t}-record-timer`;class L{constructor(e,t={}){this.timer=null,this.$container=e,this.options=Object.assign({},R,t),this.$recordTimerContainer=this.render()}_formatSeconds(e){let t=parseInt(e+""),n=0,r=0,a="00",o="00",i="00";return t>59&&(n=parseInt(t/60+""),t=parseInt(t%60+""),n>59&&(r=parseInt(n/60+""),n=parseInt(n%60+""))),a=parseInt(t+"")>9?parseInt(t+"")+"":"0"+parseInt(t+""),o=parseInt(n+"")>9?parseInt(n+"")+"":"0"+parseInt(n+""),i=parseInt(r+"")>9?parseInt(r+"")+"":"0"+parseInt(r+""),r>0?i+":"+o+":"+a:n>0?o+":"+a:"00:"+a}show(){let e=0;this.$recordTimerContainer.style.display="inline-flex",this.timer=window.setInterval((()=>{++e,this._renderTimer(e)}),1e3)}hide(){this.timer&&clearInterval(this.timer),this.$recordTimerContainer.style.display="none",this._renderTimer(0)}_renderTimer(e){const t=this.$container.querySelector(`.${_} span`);t&&(t.innerHTML=this._formatSeconds(e))}render(){const e=document.createElement("div");return e.classList.add(_),e.style.bottom=this.options.bottom+"px",e.innerHTML="<span>00:00</span>",this.$container.appendChild(e),e}}function k(i){return function(s){const c=s;let l=!1;const u=new D;c.player.use(u);const d=e(null==i?void 0:i.icon),f=c.$container.querySelector(`.${a}`),p=c.$container.querySelector(`.${o}`);n(d,`${t}-disable`);const h=new L(p,{bottom:c.options.isMobile?36:102});function m(){l&&(h.hide(),u.stopRecord(),d.classList.remove(`${t}-active`),c.event.emit("stopRecord"),l=!1)}return d.addEventListener("click",(()=>{d.classList.contains(`${t}-disable`)||c.player.playing&&(l?m():(l||(h.show(),u.startRecord(),l=!0),d.classList.add(`${t}-active`),c.event.emit("startRecord")))})),["urlChange","talk","destroy","stop","pause","seek"].forEach((e=>{c.event.on(e,(()=>{m()}))})),["urlChange","stop","pause"].forEach((e=>{c.event.on(e,(()=>{n(d,`${t}-disable`)}))})),c.event.on("EVENT_CALLBACK",(e=>{"appearFirstFrameCallback"===e.data.type&&r(d,`${t}-disable`)})),f&&f.appendChild(d),d}}export{k as default};