ezuikit.js 78 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584
  1. "use strict";
  2. /**
  3. * EZUIKitPlayer for npm
  4. */
  5. (function (global, factory) {
  6. "use strict";
  7. if (typeof module === "object" && typeof module.exports === "object") {
  8. module.exports = global.document ? factory(global, true) : function (w) {
  9. if (!w.document) {
  10. throw new Error("EZUIPlayer requires a window with a document");
  11. }
  12. return factory(w);
  13. };
  14. } else {
  15. factory(global);
  16. } // Pass this if window is not defined yet
  17. })(typeof window !== "undefined" ? window : void 0, function (window, noGlobal) {
  18. // 加载js
  19. function addJs(filepath, callback) {
  20. var headerScript = document.getElementsByTagName('head')[0].getElementsByTagName("script");
  21. var isReady = false;
  22. for (var i = 0; i < headerScript.length; i++) {
  23. if (headerScript[i].getAttribute("src") == filepath) {
  24. isReady = true;
  25. callback();
  26. }
  27. }
  28. if (!isReady) {
  29. var oJs = document.createElement("script");
  30. oJs.setAttribute("src", filepath);
  31. oJs.onload = callback;
  32. document.getElementsByTagName("head")[0].appendChild(oJs);
  33. }
  34. } // 加载css
  35. function addCss(filepath, callback) {
  36. var headerLink = document.getElementsByTagName('head')[0].getElementsByTagName("link");
  37. var isReady = false;
  38. for (var i = 0; i < headerLink.length; i++) {
  39. if (headerLink[i].getAttribute("href") == filepath) {
  40. isReady = true;
  41. callback();
  42. }
  43. }
  44. if (!isReady) {
  45. var oJs = document.createElement('link');
  46. oJs.rel = 'stylesheet';
  47. oJs.type = 'text/css';
  48. oJs.href = filepath;
  49. oJs.onload = callback;
  50. document.getElementsByTagName("head")[0].appendChild(oJs);
  51. }
  52. } // 通用请求方法
  53. function request(url, method, params, header, success, error) {
  54. var _url = url;
  55. var http_request = new XMLHttpRequest();
  56. http_request.onreadystatechange = function () {
  57. if (http_request.readyState == 4) {
  58. if (http_request.status == 200) {
  59. var _data = JSON.parse(http_request.responseText);
  60. success(_data);
  61. }
  62. }
  63. };
  64. http_request.open(method, _url, true); // http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  65. var data = new FormData();
  66. for (var i in params) {
  67. data.append(i, params[i]);
  68. }
  69. http_request.send(data);
  70. }
  71. ; // 全局属性
  72. var EZUIKit = {
  73. EZUIKitPlayer: undefined,
  74. EZUIKitTalk: undefined,
  75. opt: {
  76. apiDomain: 'https://open.ys7.com/api/lapp/live/talk/url',
  77. filePath: 'https://open.ys7.com/assets/ezuikit_v2.6.4',
  78. accessToken: '',
  79. url: '',
  80. deviceSerial: '',
  81. channelNo: '',
  82. id: '',
  83. talkLink: '',
  84. rtcUrl: '',
  85. ttsUrl: '',
  86. stream: '',
  87. // 对讲插件依赖
  88. isReliesReady: false,
  89. template: 'simple',
  90. plugin: [],
  91. // 加载插件,talk-对讲
  92. audio: 1,
  93. // 声音id 0-不开启 1-开启
  94. autoplay: 1,
  95. videoLoading: false,
  96. },
  97. state: {
  98. countTimer: undefined,
  99. // countTime 计时器
  100. recodeTime: 0,
  101. // 录音时间
  102. recodeTimer: undefined,
  103. //录音时长 计时器
  104. recodeTime: 0,
  105. fetchDefaultList: false,
  106. // 是否拉取默认语音-当用户语音为空
  107. page: 0,
  108. // 语音当前页
  109. pageSize: 5
  110. },
  111. handleTalkSuccess: function(){},
  112. handleTalkError: function(){},
  113. };
  114. /**
  115. * 视频播放器-开始
  116. */
  117. var domain = "https://open.ys7.com";
  118. var filePathDomain = domain;
  119. var EZUIKitPlayer = function EZUIKitPlayer(params) {
  120. var _this = this;
  121. this.opt = {
  122. id: params.id,
  123. apiDomain: domain + '/api/lapp/live/talk/url',
  124. filePath: filePathDomain + '/assets/ezuikit_v2.6.4',
  125. decoderVersion: '',
  126. accessToken: '',
  127. url: '',
  128. deviceSerial: '',
  129. channelNo: '',
  130. talkLink: '',
  131. rtcUrl: '',
  132. ttsUrl: '',
  133. stream: '',
  134. // 对讲插件依赖
  135. isReliesReady: false,
  136. template: 'simple',
  137. plugin: [],
  138. // 加载插件,talk-对讲
  139. audio: 1,
  140. // 声音id 0-不开启 1-开启
  141. autoplay: 1,
  142. fullScreenStatus: 0,
  143. bSupporDoubleClickFull: true,
  144. videoLoading: false,
  145. };
  146. this.params = params;
  147. if (params.id) {
  148. this.opt.id = params.id;
  149. }
  150. if (params.accessToken) {
  151. this.opt.accessToken = params.accessToken;
  152. }
  153. if (typeof params.audio !== 'undefined') {
  154. this.opt.audio = params.audio;
  155. }
  156. if (typeof params.decoderVersion !== 'undefined') {
  157. this.opt.decoderVersion = params.decoderVersion;
  158. }
  159. if (typeof params.env !== 'undefined') {
  160. if(typeof params.env.domain !== 'undefined'){
  161. domain = params.env.domain;
  162. this.opt.apiDomain = domain + '/api/lapp/live/talk/url';
  163. }
  164. if(typeof params.env.filePathDomain !== 'undefined'){
  165. filePathDomain = params.env.filePathDomain;
  166. this.opt.filePathDomain = params.env.filePathDomain;
  167. }
  168. }
  169. if (params.url) {
  170. this.opt.url = params.url;
  171. this.opt.deviceSerial = params.url.split("/")[3];
  172. this.opt.channelNo = params.url.split("/")[4].split(".")[0];
  173. }
  174. if (typeof params.template !== 'undefined') {
  175. this.opt.template = params.template;
  176. }
  177. if (params.plugin) {
  178. this.opt.plugin = params.plugin;
  179. }
  180. if (typeof params.autoplay !== 'undefined') {
  181. this.opt.autoplay = params.autoplay ? 1 : 0;
  182. }
  183. if (typeof params.bSupporDoubleClickFull !== 'undefined') {
  184. this.opt.bSupporDoubleClickFull = params.bSupporDoubleClickFull;
  185. }
  186. if (typeof params.handleTalkSuccess !== 'undefined') {
  187. window.EZUIKit.handleTalkSuccess = params.handleTalkSuccess;
  188. }
  189. if (typeof params.handleTalkError !== 'undefined') {
  190. window.EZUIKit.handleTalkError = params.handleTalkError;
  191. }
  192. var id = this.opt.id;
  193. var domElement = document.getElementById(id); // 间隙
  194. domElement.style.fontSize = 0;
  195. domElement.style.overflowY = 'auto';
  196. domElement.style.position = 'relative';
  197. /**
  198. * 渲染iframe视频框
  199. */
  200. var iframe = document.createElement('iframe');
  201. domain = "https://test12open.ys7.com"
  202. function matchIframeUrl() {
  203. switch (_this.opt.template) {
  204. case 'simple':
  205. var iframeUrl = domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
  206. var controlsValue = "";
  207. if(typeof params.controls !== 'undefined' && params.controls){
  208. console.log("typeof" ,typeof params.controls)
  209. controlsValue = "play,voice,hd,fullScreen";
  210. if(params.controls.length > 0){
  211. controlsValue = params.controls.join(",");
  212. iframeUrl += ('&controls=' + controlsValue);
  213. }
  214. }
  215. if (params.websocketParams) {
  216. iframeUrl += ('&websocketParams=' + JSON.stringify(params.websocketParams))
  217. }
  218. return iframeUrl;
  219. case 'standard':
  220. return domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=1" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
  221. case 'security':
  222. return domain + "/ezopen/h5/iframe_se?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
  223. default:
  224. return domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
  225. }
  226. }
  227. iframe.src = matchIframeUrl(); // 默认取容器宽高
  228. var iframeHeight = document.getElementById(id).offsetHeight;
  229. var iframeWidth = document.getElementById(id).offsetWidth;
  230. if (params.height) {
  231. iframeHeight = parseInt(params.height);
  232. if(/\%$/.test(params.height)) {
  233. iframeWidth = document.getElementById(id).offsetWidth * (parseInt(params.height) /100);
  234. }
  235. }
  236. if (params.width) {
  237. iframeWidth = parseInt(params.width);
  238. if(/\%$/.test(params.width)) {
  239. iframeWidth = document.getElementById(id).offsetWidth * (parseInt(params.width) /100);
  240. }
  241. }
  242. iframe.width = iframeWidth;
  243. iframe.height = iframeHeight;
  244. iframe.id = 'EZUIKitPlayer-' + id; // 部分iframe属性
  245. iframe.setAttribute("allowfullscreen", true);
  246. iframe.setAttribute("allow", "autoplay");
  247. iframe.setAttribute("frameborder", 0);
  248. domElement.appendChild(iframe);
  249. var jqueryJS = _this.opt.filePath + '/js/jquery.js';
  250. var layerJs = 'https://open.ys7.com/assets/layer/layer.js';
  251. addJs(jqueryJS, function () {
  252. addJs(layerJs, function () {
  253. // });
  254. // });
  255. /**
  256. * 渲染header
  257. */
  258. if (matchHeaderOpt().headerContainer) {
  259. // if (params.header && params.header instanceof Array) {
  260. var headerContainer = document.createElement('div');
  261. headerContainer.setAttribute('class', 'panel-top');
  262. var controsDOM = document.createElement('div');
  263. controsDOM.setAttribute('class', 'contros');
  264. headerContainer.appendChild(controsDOM);
  265. domElement.insertBefore(headerContainer, iframe);
  266. if (matchHeaderOpt().capturePictureModule) {
  267. // 截图
  268. var capturePictureDOM = document.createElement('span');
  269. capturePictureDOM.innerHTML = '<span title="截图">' + '<svg id="capturePicture" title="截图" t="1578882764585" class="icon" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="5958" width="24" height="24">' + ' <path' + ' d="M887.296 315.904h-153.6c-51.2 0-68.096-102.4-119.296-102.4H392.704c-34.304 0-51.2 102.4-102.4 102.4h-153.6c-29.696 0-51.2 21.504-51.2 51.2v439.296c0 25.6 21.504 47.104 51.2 47.104h751.104c29.696 0 51.2-21.504 51.2-51.2v-435.2c-0.512-30.208-21.504-51.2-51.712-51.2zM512 768c-115.2 0-204.8-89.6-204.8-200.704s89.6-200.704 204.8-200.704 204.8 89.6 204.8 200.704-93.696 200.704-204.8 200.704z m247.296-354.304c-12.8 0-25.6-12.8-25.6-25.6s12.8-25.6 25.6-25.6 25.6 12.8 25.6 25.6c0 17.408-12.8 25.6-25.6 25.6zM256 264.704c0-8.704-8.704-16.896-16.896-16.896h-51.2c-8.704 0-16.896 8.704-16.896 16.896V281.6H256v-16.896z m256 148.992c-85.504 0-153.6 68.096-153.6 153.6s68.096 153.6 153.6 153.6 153.6-68.096 153.6-153.6-68.096-153.6-153.6-153.6z"' + ' fill="#ffffff" p-id="5959"></path>' + '</svg>' + '</span>';
  270. capturePictureDOM.onclick = function () {
  271. _this.capturePicture();
  272. };
  273. controsDOM.appendChild(capturePictureDOM);
  274. }
  275. console.log("matchHeaderOpt().saveModule", matchHeaderOpt().saveModule);
  276. if (matchHeaderOpt().saveModule) {
  277. var startSaveDOM = document.createElement('span');
  278. startSaveDOM.innerHTML = '<span title="开始录像">' + ' <svg id="startSave" t="1578882716693" class="icon" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">' + ' <path' + ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"' + ' p-id="3783" fill="#ffffff"></path>' + ' </svg>' + '</span>';
  279. startSaveDOM.onclick = function () {
  280. _this.startSave();
  281. document.getElementById('startSave').setAttribute('class', 'icon hide');
  282. document.getElementById('stopSave').setAttribute('class', 'icon');
  283. };
  284. controsDOM.appendChild(startSaveDOM);
  285. var stopSaveDOM = document.createElement('span');
  286. stopSaveDOM.innerHTML = '<span title="结束录像">' + ' <svg id="stopSave" t="1578882716693" class="icon hide" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">' + ' <path' + ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"' + ' p-id="3783" fill="red"></path>' + ' </svg>' + ' </span>';
  287. stopSaveDOM.onclick = function () {
  288. _this.stopSave();
  289. document.getElementById('stopSave').setAttribute('class', 'icon hide');
  290. document.getElementById('startSave').setAttribute('class', 'icon');
  291. };
  292. controsDOM.appendChild(stopSaveDOM);
  293. }
  294. if (matchHeaderOpt().zoomModule) {
  295. var enableZoomDOM = document.createElement('span');
  296. enableZoomDOM.innerHTML = '<span title="开启电子放大">' + ' <svg id="enableZoom" t="1578882639834" class="icon" viewBox="0 0 1000 1000" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">' + ' <path' + ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"' + ' p-id="2228" fill="#ffffff"></path>' + ' </svg>' + '</span>';
  297. enableZoomDOM.onclick = function () {
  298. _this.enableZoom();
  299. document.getElementById('enableZoom').setAttribute('class', 'icon hide');
  300. document.getElementById('closeZoom').setAttribute('class', 'icon');
  301. };
  302. controsDOM.appendChild(enableZoomDOM);
  303. var closeZoomDOM = document.createElement('span');
  304. closeZoomDOM.innerHTML = '<span title="关闭电子放大">' + ' <svg id="closeZoom" t="1578882639834" class="icon hide" viewBox="0 0 1000 1000" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">' + ' <path' + ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"' + ' p-id="2228" fill="red"></path>' + ' </svg>' + '</span>';
  305. closeZoomDOM.onclick = function () {
  306. _this.closeZoom();
  307. document.getElementById('closeZoom').setAttribute('class', 'icon hide');
  308. document.getElementById('enableZoom').setAttribute('class', 'icon');
  309. };
  310. controsDOM.appendChild(closeZoomDOM);
  311. }
  312. }
  313. /**
  314. * 渲染footer
  315. */
  316. /** 根据配置匹配底部渲染 */
  317. function matchFooterOpt() {
  318. var result = {
  319. footerContainer: false,
  320. talkModule: false,
  321. broadcastModule: false,
  322. hdModule: false,
  323. fullScreenModule: false
  324. };
  325. var template = _this.opt.template;
  326. switch (template) {
  327. case 'simple':
  328. if (params.footer && params.footer instanceof Array) {
  329. var footer = params.footer;
  330. result = {
  331. footerContainer: true,
  332. talkModule: footer.indexOf('talk') !== -1,
  333. broadcastModule: footer.indexOf('broadcast') !== -1,
  334. hdModule: footer.indexOf('hd') !== -1,
  335. fullScreenModule: footer.indexOf('fullScreen') !== -1
  336. };
  337. }
  338. break;
  339. case 'standard':
  340. if (params.footer && params.footer instanceof Array) {
  341. var footer = params.footer;
  342. result = {
  343. footerContainer: true,
  344. talkModule: footer.indexOf('talk') !== -1,
  345. broadcastModule: footer.indexOf('broadcast') !== -1,
  346. hdModule: footer.indexOf('hd') !== -1,
  347. fullScreenModule: footer.indexOf('fullScreen') !== -1
  348. };
  349. }
  350. break;
  351. case 'security':
  352. break;
  353. case 'voice':
  354. result = {
  355. footerContainer: true,
  356. talkModule: true,
  357. broadcastModule: true,
  358. hdModule: true,
  359. fullScreenModule: true
  360. };
  361. break;
  362. }
  363. return result;
  364. }
  365. /** 根据配置匹配底部渲染 */
  366. function matchHeaderOpt() {
  367. var result = {
  368. headerContainer: false,
  369. capturePictureModule: false,
  370. saveModule: false,
  371. zoomModule: false
  372. };
  373. var template = _this.opt.template;
  374. switch (template) {
  375. case 'simple':
  376. if (params.header && params.header instanceof Array) {
  377. var header = params.header;
  378. result = {
  379. headerContainer: true,
  380. capturePictureModule: header.indexOf('capturePicture') !== -1,
  381. saveModule: header.indexOf('save') !== -1,
  382. zoomModule: header.indexOf('zoom') !== -1
  383. };
  384. }
  385. break;
  386. case 'standard':
  387. break;
  388. case 'security':
  389. break;
  390. case 'voice':
  391. result = {
  392. headerContainer: true,
  393. capturePictureModule: true,
  394. saveModule: true,
  395. zoomModule: true
  396. };
  397. break;
  398. }
  399. return result;
  400. }
  401. if (matchFooterOpt().footerContainer || _this.opt.plugin.indexOf('talk') !== -1) {
  402. var recoderCSS = _this.opt.filePath + '/npm/css/recoder.css';
  403. var recoderJs = _this.opt.filePath + '/npm/js/recoder.js';
  404. var recorderJs = _this.opt.filePath + '/recorder.js'; // addCss()
  405. addCss(recoderCSS, function () { });
  406. addJs(recoderJs, function () {
  407. addJs(recorderJs, function () { });
  408. }); // 对讲模块
  409. if (_this.opt.plugin.indexOf('talk') !== -1 || matchFooterOpt().talkModule) {
  410. function apiSuccess(data) {
  411. console.log("data", data);
  412. if (data.code == 200) {
  413. var apiResult = data.data;
  414. if (apiResult) {
  415. // 临时将https转换为websocket
  416. var rtcTrunk = apiResult.rtcUrl;
  417. if (rtcTrunk.indexOf("ws") === -1) {
  418. rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
  419. }
  420. _this.opt.rtcUrl = rtcTrunk;
  421. _this.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
  422. var talk = "talk://" + _this.opt.deviceSerial + ":0:" + _this.opt.channelNo + ":cas.ys7.com:6500";
  423. _this.opt.talkLink = _this.opt.ttsUrl + "/" + talk;
  424. _this.opt.stream = apiResult.stream;
  425. console.log("_this.opt", _this.opt); // 加载依赖
  426. if (!_this.opt.isReliesReady) {
  427. var adapeterJS = _this.opt.filePath + '/npm/js/adapeter.js';
  428. var janusJS = _this.opt.filePath + '/npm/js/janus.js';
  429. var ttsJS = _this.opt.filePath + '/npm/js/tts.js';
  430. console.log("加载jquery.js");
  431. addJs(adapeterJS, function () {
  432. console.log("加载adapeter.js");
  433. addJs(janusJS, function () {
  434. console.log("加载janus.js");
  435. addJs(ttsJS, function () {
  436. console.log("加载tts.js"); // 文件加载完毕;
  437. _this.opt.isReliesReady = true;
  438. });
  439. });
  440. });
  441. } // 创建DOM
  442. if (!document.getElementById("audioleft")) {
  443. var audioleft = document.createElement('div');
  444. audioleft.style.display = 'none';
  445. audioleft.id = 'audioleft';
  446. document.body.appendChild(audioleft);
  447. }
  448. if (!document.getElementById("audioright")) {
  449. var audioright = document.createElement('div');
  450. audioright.style.display = 'none';
  451. audioright.id = 'audioright';
  452. document.body.appendChild(audioright);
  453. }
  454. }
  455. }
  456. EZUIKit.opt = _this.opt;
  457. }
  458. function apiError(err) {
  459. if (params.handleError) {
  460. params.handleError(err);
  461. }
  462. }
  463. request(_this.opt.apiDomain, 'POST', {
  464. accessToken: _this.opt.accessToken,
  465. deviceSerial: _this.opt.deviceSerial,
  466. channelNo: _this.opt.channelNo
  467. }, '', apiSuccess, apiError);
  468. }
  469. if (matchFooterOpt().footerContainer) {
  470. // 底部容器
  471. var footerContainer = document.createElement('div');
  472. footerContainer.setAttribute("class", 'audio-controls');
  473. domElement.appendChild(footerContainer);
  474. if (matchFooterOpt().hdModule || matchFooterOpt().fullScreenModule) {
  475. // 底部右侧元素
  476. var rightContros = document.createElement('div');
  477. rightContros.setAttribute('class', 'contros');
  478. footerContainer.appendChild(rightContros);
  479. if (matchFooterOpt().hdModule) {
  480. // 高清-标清切换
  481. var hdDom = document.createElement('span');
  482. hdDom.setAttribute('id', 'video-hd');
  483. hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
  484. hdDom.onclick = function () {
  485. // 停止
  486. if(_this.opt.videoLoading){
  487. layer.msg("视频加载中,请稍后");
  488. return false;
  489. }else {
  490. var stopPromise = _this.stop();
  491. _this.opt.videoLoading = true;
  492. stopPromise.then((data)=>{
  493. _this.opt.videoLoading = false;
  494. if (_this.opt.url.indexOf('.hd') === -1) {
  495. _this.opt.url = _this.opt.url.replace('.live', '.hd.live');
  496. hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
  497. } else {
  498. _this.opt.url = _this.opt.url.replace('.hd.live', '.live');
  499. hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
  500. }
  501. _this.play(_this.opt.url)
  502. })
  503. .catch((error)=>{
  504. console.log("error",error)
  505. })
  506. }
  507. //iframe.src = domain +"/ezopen/h5/iframe?url=" + _this.opt.url.replace('.hd.live', '.live') + "&autoplay=1&audio=" + _this.opt.audio + "&accessToken=" + _this.opt.accessToken + "&templete=" + 0;
  508. };
  509. rightContros.appendChild(hdDom);
  510. }
  511. if (matchFooterOpt().fullScreenModule) {
  512. // 声音控制
  513. var openSoundDOM = document.createElement('span');
  514. openSoundDOM.setAttribute('class', 'hide');
  515. openSoundDOM.setAttribute('id', 'ezuikit-open-sound');
  516. openSoundDOM.setAttribute('title', '打开声音');
  517. openSoundDOM.setAttribute('style', 'vertical-align: top;');
  518. openSoundDOM.innerHTML = '<svg t="1590476263239" class="icon" viewBox="0 0 1178 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2273" width="16" height="16"><path d="M665.6 51.2 665.6 51.2c-10.24-30.72-40.96-51.2-71.68-51.2-5.12 0-15.36 0-20.48 5.12l0 0L358.4 153.6 51.2 209.92l0 0C20.48 220.16 0 250.88 0 281.6 0 286.72 0 291.84 0 307.2l0 0 0 409.6 0 0c0 15.36 0 20.48 0 25.6 0 30.72 20.48 61.44 51.2 71.68l0 0L358.4 870.4l97.28 71.68 107.52 76.8 0 0c5.12 5.12 15.36 5.12 25.6 5.12 40.96 0 76.8-35.84 76.8-76.8 0-10.24 0-10.24 0-25.6l0 0L665.6 51.2zM563.2 870.4l-153.6-102.4-307.2-51.2L102.4 307.2l307.2-51.2 153.6-102.4L563.2 870.4z" p-id="2274" fill="#FF0000"></path><path d="M1049.6 537.6l112.64-112.64c20.48-20.48 20.48-56.32 0-76.8-20.48-20.48-56.32-20.48-76.8 0L972.8 460.8l-112.64-112.64c0 0 0 0 0 0-20.48-20.48-56.32-20.48-76.8 0 0 0 0 0 0 0-20.48 20.48-20.48 56.32 0 76.8l112.64 112.64-112.64 112.64c-20.48 20.48-20.48 56.32 0 76.8 20.48 20.48 56.32 20.48 76.8 0L972.8 614.4l112.64 112.64c20.48 20.48 56.32 20.48 76.8 0s20.48-56.32 0-76.8L1049.6 537.6z" p-id="2275" fill="#FF0000"></path></svg>';
  519. openSoundDOM.onclick = function () {
  520. _this.openSound(0);
  521. openSoundDOM.setAttribute('class', 'hide');
  522. closeSoundDOM.setAttribute('class', '');
  523. }; // 声音控制
  524. var closeSoundDOM = document.createElement('span');
  525. openSoundDOM.setAttribute('id', 'ezuikit-close-sound');
  526. closeSoundDOM.setAttribute('class', 'hide');
  527. closeSoundDOM.setAttribute('title', '关闭声音');
  528. closeSoundDOM.setAttribute('style', 'vertical-align: top;');
  529. closeSoundDOM.innerHTML = '<svg t="1590414410633" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="20545" width="16" height="16"><path d="M840.533333 98.133333c-17.066667-17.066667-42.666667-17.066667-59.733333 0-17.066667 17.066667-17.066667 42.666667 0 59.733334C883.2 256 938.666667 392.533333 938.666667 533.333333c0 140.8-55.466667 277.333333-157.866667 375.466667-17.066667 17.066667-17.066667 42.666667 0 59.733333 8.533333 8.533333 21.333333 12.8 29.866667 12.8 8.533333 0 21.333333-4.266667 29.866666-12.8 115.2-110.933333 183.466667-268.8 183.466667-435.2 0-166.4-68.266667-324.266667-183.466667-435.2zM571.733333 12.8c-17.066667-8.533333-34.133333-4.266667-46.933333 8.533333L281.6 256H42.666667c-25.6 0-42.666667 17.066667-42.666667 42.666667v426.666666c0 25.6 17.066667 42.666667 42.666667 42.666667h238.933333l243.2 234.666667c8.533333 8.533333 17.066667 12.8 29.866667 12.8 4.266667 0 12.8 0 17.066666-4.266667 17.066667-8.533333 25.6-21.333333 25.6-38.4V51.2c0-17.066667-8.533333-34.133333-25.6-38.4zM512 870.4l-183.466667-179.2c-8.533333-4.266667-17.066667-8.533333-29.866666-8.533333H85.333333V341.333333h213.333334c12.8 0 21.333333-4.266667 29.866666-12.8L512 153.6v716.8z" p-id="20546" fill="#ffffff"></path><path d="M759.466667 349.866667c-12.8-21.333333-38.4-25.6-59.733334-8.533334-21.333333 12.8-25.6 38.4-8.533333 59.733334 21.333333 29.866667 34.133333 76.8 34.133333 123.733333 0 46.933333-12.8 93.866667-34.133333 123.733333-12.8 21.333333-8.533333 46.933333 8.533333 59.733334 8.533333 4.266667 17.066667 8.533333 25.6 8.533333 12.8 0 25.6-4.266667 34.133334-17.066667 34.133333-46.933333 51.2-106.666667 51.2-174.933333 0-68.266667-17.066667-128-51.2-174.933333z" p-id="20547" fill="#ffffff"></path></svg>';
  530. closeSoundDOM.onclick = function () {
  531. _this.closeSound(0);
  532. openSoundDOM.setAttribute('class', '');
  533. closeSoundDOM.setAttribute('class', 'hide');
  534. };
  535. rightContros.appendChild(openSoundDOM);
  536. rightContros.appendChild(closeSoundDOM);
  537. } // 根据当前音频配置展示
  538. if (_this.opt.audio == 1) {
  539. closeSoundDOM.setAttribute('class', '');
  540. } else {
  541. openSoundDOM.setAttribute('class', '');
  542. _this.closeSound(0);
  543. }
  544. if (matchFooterOpt().fullScreenModule) {
  545. // 全屏控制
  546. var fullScreenDOM = document.createElement('span');
  547. fullScreenDOM.setAttribute('title', '全屏');
  548. fullScreenDOM.setAttribute('style', 'vertical-align: top;');
  549. fullScreenDOM.innerHTML = '<svg id="fullScreen" t="1578020167938" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5035" width="16" height="16"> <path d="M348.373333 625.706667l-128 128-64 64v-128a33.28 33.28 0 0 0-35.413333-35.413334A33.493333 33.493333 0 0 0 85.333333 689.706667v213.333333A33.706667 33.706667 0 0 0 120.96 938.666667h213.333333a35.626667 35.626667 0 0 0 0-71.04h-128l64-64 128-128a35.2 35.2 0 0 0-49.92-49.92zM206.293333 156.373333h128a33.28 33.28 0 0 0 35.413334-35.413333A33.493333 33.493333 0 0 0 334.293333 85.333333H113.706667c-7.04 0-14.08 7.04-21.333334 14.293334a26.026667 26.026667 0 0 0-7.04 21.333333v213.333333a33.493333 33.493333 0 0 0 35.626667 35.413334 33.28 33.28 0 0 0 35.413333-35.413334v-128l192 192a35.2 35.2 0 0 0 49.92-49.92zM903.04 85.333333h-213.333333a33.493333 33.493333 0 0 0-35.413334 35.626667 33.28 33.28 0 0 0 35.413334 35.413333h128l-64 64-128 128a35.2 35.2 0 0 0 49.92 49.92l128-128 64-64v128a35.626667 35.626667 0 0 0 71.04 0v-213.333333A33.706667 33.706667 0 0 0 903.04 85.333333zM903.04 654.293333a33.28 33.28 0 0 0-35.413333 35.413334v128l-64-64-128-128a35.2 35.2 0 0 0-49.92 49.92l128 128 64 64h-128a35.626667 35.626667 0 0 0 0 71.04h213.333333A33.706667 33.706667 0 0 0 938.666667 903.04v-213.333333a33.493333 33.493333 0 0 0-35.626667-35.413334z" p-id="5036" fill="#ffffff"></path></svg>';
  550. fullScreenDOM.onclick = function () {
  551. _this.fullScreen();
  552. };
  553. rightContros.appendChild(fullScreenDOM);
  554. }
  555. }
  556. if (matchFooterOpt().talkModule) {
  557. // 对讲
  558. var startTalkDOM = document.createElement('div');
  559. var stopTalkDOM = document.createElement('div');
  560. startTalkDOM.setAttribute("class", "ptp-talk off");
  561. startTalkDOM.innerHTML = '<span title="对讲">' + '<svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1641" width="16" height="16">' + ' <path' + ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"' + ' p-id="1642" fill="#ffffff"></path>' + ' <path' + ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"' + ' p-id="1643" fill="#ffffff"></path>' + ' <path' + ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"' + ' p-id="1644" fill="#ffffff"></path>' + ' </svg>' + ' </span>' + ' <span>开启对讲</span>';
  562. startTalkDOM.onclick = function () {
  563. console.log("EZUIKit.state.countTimer", EZUIKit.state.countTimer);
  564. if (EZUIKit.state.countTimer) {
  565. window.layer.msg("语音设备正忙,请稍后重试");
  566. return false;
  567. }
  568. countTime('add', 0);
  569. console.log("开始对讲,关闭声音");
  570. _this.closeSound(0);
  571. console.log(_this.opt);
  572. _this.startTalk();
  573. this.setAttribute("class", "ptp-talk off hide");
  574. stopTalkDOM.setAttribute("class", "ptp-talk on");
  575. };
  576. stopTalkDOM.setAttribute("class", "ptp-talk on hide");
  577. stopTalkDOM.innerHTML = '<span title="对讲">' + ' <svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1641" width="16" height="16">' + ' <path' + ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"' + ' p-id="1642" fill="#ff0000"></path>' + ' <path' + ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"' + ' p-id="1643" fill="#ff0000"></path>' + ' <path' + ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"' + ' p-id="1644" fill="#ff0000"></path>' + ' </svg>' + ' </span>' + '<span>关闭对讲</span>';
  578. stopTalkDOM.onclick = function () {
  579. console.log(_this.opt);
  580. _this.stopTalk();
  581. countTime('destory', 0);
  582. _this.openSound(0);
  583. this.setAttribute("class", "ptp-talk on hide");
  584. startTalkDOM.setAttribute("class", "ptp-talk off");
  585. };
  586. footerContainer.appendChild(startTalkDOM);
  587. footerContainer.appendChild(stopTalkDOM);
  588. }
  589. if (matchFooterOpt().broadcastModule) {
  590. var startBroadcastDOM = document.createElement('div');
  591. var stopBroadcastDOM = document.createElement('div');
  592. startBroadcastDOM.setAttribute("class", 'broadcast off');
  593. stopBroadcastDOM.setAttribute("class", "broadcast on hide");
  594. startBroadcastDOM.innerHTML = ' <span title="语音播报">' + ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1126" width="16" height="16">' + ' <path' + ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"' + ' fill="#ffffff" p-id="1127"></path>' + ' </svg>' + '</span>' + '<span>语音播报</span>';
  595. startBroadcastDOM.onclick = function () {
  596. this.setAttribute("class", "broadcast off hide");
  597. stopBroadcastDOM.setAttribute("class", "broadcast on");
  598. };
  599. stopBroadcastDOM.innerHTML = '<div class="pop-hover">' + ' <div class="pop-hover-content">' + ' <div class="vioce-list" id="voice-list">' + ' <ul class="voice-list-ul">' + ' </ul>' + ' <div id="voice-list-end"></div>' + ' </div>' + ' <div id="voice-custom" style="text-align: center;">自定义语音</div>' + ' </div>' + '</div>' + '<span title="语音播报">' + ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1126" width="16" height="16">' + ' <path' + ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"' + ' fill="#ff0000" p-id="1127"></path>' + ' </svg>' + '</span>' + '<span>语音播报</span>'; // //自定义语音唤起
  600. // document.getElementById("voice-custom").onclick = function(){
  601. // console.log("显示自定义语音");
  602. // }
  603. stopBroadcastDOM.onclick = function () {
  604. this.setAttribute("class", "broadcast on hide");
  605. startBroadcastDOM.setAttribute("class", "broadcast off");
  606. };
  607. footerContainer.appendChild(startBroadcastDOM);
  608. footerContainer.appendChild(stopBroadcastDOM); // 召唤自定义语言
  609. document.getElementById("voice-custom").onclick = function () {
  610. console.log("显示自定义语音");
  611. startSpeakDOM.setAttribute('class', 'speak off');
  612. }; // 获取语音列表
  613. fetchVoiceList(0);
  614. function fetchVoiceList(page) {
  615. function apiSuccess(data) {
  616. console.log("data", data);
  617. if (data.code == 200) {
  618. randerVoliceList(data.data, 5);
  619. EZUIKit.state.page = data.page.page; // 如果用户语音列表为空
  620. if (page == 0 && data.data.length == 0 && !EZUIKit.state.fetchDefaultList) {
  621. // 获取用户语音为空
  622. EZUIKit.state.fetchDefaultList = true;
  623. fetchVoiceList(0);
  624. }
  625. }
  626. }
  627. function apiError(err) {
  628. console.log("err", err);
  629. }
  630. request( domain + '/api/lapp/voice/query', 'POST', {
  631. accessToken: _this.opt.accessToken,
  632. pageStart: page,
  633. pageSize: EZUIKit.state.pageSize,
  634. default: EZUIKit.state.fetchDefaultList ? 'true' : 'false'
  635. }, '', apiSuccess, apiError);
  636. }
  637. function randerVoliceList(data) {
  638. console.log("renderVoliceList", data);
  639. if (data && data.length > 0) {
  640. for (var i = 0; i < data.length; i++) {
  641. var voiceItem = document.createElement('li');
  642. voiceItem.innerHTML = "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? data[i]["voiceName"].substr(0, 10) + "..." : data[i]["voiceName"]) + "</li>";
  643. document.getElementsByClassName('voice-list-ul')[0].append(voiceItem); // "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>";
  644. // $("#voice-list ul").append("<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>");
  645. voiceItem.onclick = function (e) {
  646. console.log("点击元素", e.target, e.target.dataset.url);
  647. var voiceUrl = e.target.dataset.url;
  648. var time = e.target.dataset.time;
  649. playListOfVoice(voiceUrl, time);
  650. };
  651. }
  652. if (data.length === EZUIKit.state.pageSize) {
  653. document.getElementById('voice-list-end').innerHTML = "向下滚动加载更多";
  654. } else {
  655. document.getElementById('voice-list-end').innerHTML = "没有更多数据了";
  656. }
  657. }
  658. }
  659. function playListOfVoice(voiceUrl, time) {
  660. console.log("播放语音", voiceUrl, time); // decoder && decoder.closeSound(0);
  661. function apiSuccess(data) {
  662. console.log("data.data", data.data);
  663. if (data.code == 200) {
  664. // $("#startBroadcast").show();
  665. // $("#stopBroadcast").hide();
  666. countTime('sub', parseInt(time));
  667. } else if (data.code == "10001") {
  668. window.layer.msg("未找到当前语音");
  669. } else {
  670. window.layer.msg(data.msg || '发送失败,请稍后再试');
  671. } // padding = false;
  672. }
  673. function apiError(err) {
  674. console.log("err", err);
  675. }
  676. request( domain + '/api/lapp/voice/send', 'POST', {
  677. accessToken: _this.opt.accessToken,
  678. deviceSerial: _this.opt.deviceSerial,
  679. channelNo: _this.opt.channelNo,
  680. fileUrl: voiceUrl
  681. }, '', apiSuccess, apiError);
  682. } // 自定义语音
  683. // 对讲
  684. var startSpeakDOM = document.createElement('div');
  685. var stopSpeakDOM = document.createElement('div');
  686. startSpeakDOM.setAttribute('class', 'speak off hide');
  687. stopSpeakDOM.setAttribute('class', 'speak on hide');
  688. startSpeakDOM.setAttribute('id', 'startSpeak');
  689. stopSpeakDOM.setAttribute('id', 'stopSpeak');
  690. startSpeakDOM.innerHTML = '<span title="按住说话">' + ' <svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1639" width="16" height="16">' + ' <path' + ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"' + ' p-id="1640" fill="#ffffff"></path>' + ' </svg>' + '</span>' + '<span>按住说话</span>';
  691. stopSpeakDOM.innerHTML = '<span title="按住说话">' + '<svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1639" width="16" height="16">' + ' <path' + ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"' + ' p-id="1640" fill="#ff0000"></path>' + '</svg>' + '</span>' + '<span>松开发送</span>';
  692. footerContainer.appendChild(startSpeakDOM);
  693. footerContainer.appendChild(stopSpeakDOM);
  694. document.getElementById("voice-list").onscroll = function (e) {
  695. var sum = this.scrollHeight;
  696. console.log("sum", sum, this.scrollTop, document.getElementById("voice-list").clientHeight);
  697. if (sum <= this.scrollTop + this.clientHeight) {
  698. console.log("拖动到底,执行加载", EZUIKit.state.page);
  699. fetchVoiceList(++EZUIKit.state.page);
  700. }
  701. }; // $("#voice-list").unbind("scroll").bind("scroll", function (e) {
  702. // // console.log("e",e,this.scrollHeight, $(this).scrollTop() + $(this).height())
  703. // var sum = this.scrollHeight;
  704. // if (sum <= $(this).scrollTop() + $(this).height()) {
  705. // console.log("拖动到底,执行加载", page);
  706. // fetchVoiceList(++page);
  707. // }
  708. // loading = false;
  709. // });
  710. // time-area
  711. var timeAreaDOM = document.createElement('div');
  712. timeAreaDOM.setAttribute('class', 'time-area');
  713. timeAreaDOM.setAttribute('id', 'time-area');
  714. timeAreaDOM.innerHTML = '00:00';
  715. footerContainer.appendChild(timeAreaDOM); // 按住说话
  716. var recorder;
  717. document.getElementById('startSpeak').onmousedown = function () {
  718. if (EZUIKit.state.countTimer) {
  719. window.layer.msg("语音设备正忙,请稍后重试");
  720. return false;
  721. }
  722. console.log("按住说话");
  723. startSpeakDOM.setAttribute('class', 'speak off hide');
  724. stopSpeakDOM.setAttribute('class', 'speak on'); // console.log("startRecording",startRecording);
  725. // startRecording();
  726. voiceInit();
  727. countTime('add', 0);
  728. setTimeout(function () {
  729. EZUIKit.state.recodeTime = 0;
  730. startRecording();
  731. }, 1000);
  732. if (EZUIKit.state.recodeTimer) {
  733. // 先清空计数器
  734. clearInterval(EZUIKit.state.recodeTimer);
  735. }
  736. EZUIKit.state.recodeTimer = setInterval(function () {
  737. if (EZUIKit.state.recodeTime >= 59) {
  738. _this.stopTalk();
  739. countTime('destory', 0);
  740. this.setAttribute("class", "ptp-talk on hide");
  741. startTalkDOM.setAttribute("class", "ptp-talk off");
  742. window.layer.msg("不超过1分钟");
  743. } else {
  744. EZUIKit.state.recodeTime = EZUIKit.state.recodeTime + 1;
  745. }
  746. }, 1000);
  747. /** 录音控制 */
  748. var audio_context;
  749. function startUserMedia(stream) {
  750. var input = audio_context.createMediaStreamSource(stream);
  751. recorder = new window.Recorder(input);
  752. }
  753. function startRecording() {
  754. recorder && recorder.record();
  755. }
  756. function stopRecording() {
  757. recorder && recorder.stop();
  758. recorder.clear();
  759. }
  760. function voiceInit() {
  761. console.log("run init");
  762. try {
  763. // webkit shim
  764. window.AudioContext = window.AudioContext || window.webkitAudioContext;
  765. navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
  766. window.URL = window.URL || window.webkitURL;
  767. audio_context = new AudioContext();
  768. console.log('Audio context set up.');
  769. console.log('navigator.getUserMedia ' + (navigator.getUserMedia ? 'available.' : 'not present!'));
  770. } catch (e) {
  771. console.log("err", e);
  772. window.layer.msg('No web audio support in this browser!');
  773. }
  774. navigator.getUserMedia({
  775. audio: true
  776. }, startUserMedia, function (e) {
  777. console.log('No live audio input: ' + e);
  778. });
  779. }
  780. ;
  781. }; // 松开发送
  782. document.getElementById('stopSpeak').onmouseup = function () {
  783. console.log("松开发送");
  784. stopSpeakDOM.setAttribute('class', 'speak on hide');
  785. stopSpeakFun();
  786. function stopSpeakFun() {
  787. countTime('destory', 0);
  788. if (EZUIKit.state.recodeTime < 1) {
  789. window.layer.msg("说话时间过短");
  790. clearInterval(EZUIKit.state.recodeTimer);
  791. return false;
  792. }
  793. clearInterval(EZUIKit.state.recodeTimer);
  794. wavUpload();
  795. }
  796. function wavUpload() {
  797. try {
  798. recorder && recorder.stop(); // createAudioDom();
  799. recorder && recorder.exportWAV(function (wav_file) {
  800. console.log("wav_file", wav_file);
  801. if (wav_file.size < 1000) {
  802. window.layer.msg("录音失败,请重试"); // recodeTime = 0;
  803. EZUIKit.state.recodeTime = 0;
  804. return false;
  805. } // 测试
  806. countTime('sub', EZUIKit.state.recodeTime + 2); // 延时
  807. var formdata = new FormData(); // form 表单 {key:value}
  808. formdata.append("voiceFile", wav_file); // form input type="file"
  809. formdata.append("accessToken", _this.opt.accessToken);
  810. formdata.append("deviceSerial", _this.opt.deviceSerial);
  811. formdata.append("channelNo", _this.opt.channelNo); // padding = true;
  812. function apiSuccess(data) {
  813. console.log("data.data", data.data);
  814. if (data.code == 200) {
  815. // $("#startBroadcast").show();
  816. // $("#stopBroadcast").hide();
  817. countTime('sub', EZUIKit.state.recodeTime + 2);
  818. } else if (data.code == "10001") {
  819. window.layer.msg("未找到当前语音");
  820. } else {
  821. window.layer.msg(data.msg || '发送失败,请稍后再试');
  822. } // padding = false;
  823. }
  824. function apiError(err) {
  825. console.log("err", err);
  826. }
  827. request(domain + '/api/lapp/voice/sendonce', 'POST', {
  828. voiceFile: wav_file,
  829. accessToken: _this.opt.accessToken,
  830. deviceSerial: _this.opt.deviceSerial,
  831. channelNo: _this.opt.channelNo
  832. }, '', apiSuccess, apiError);
  833. });
  834. recorder && recorder.clear();
  835. } catch (err) {
  836. console.log(err);
  837. }
  838. }
  839. };
  840. }
  841. /* 时间计数 */
  842. function countTime(type, start) {
  843. clearInterval(EZUIKit.state.countTimer);
  844. if (type === 'add') {
  845. var i = start;
  846. EZUIKit.state.countTimer = setInterval(function () {
  847. ++i;
  848. document.getElementById("time-area").innerHTML = formatSeconds(i);
  849. }, 1000);
  850. } else if (type === 'sub') {
  851. var i = start;
  852. EZUIKit.state.countTimer = setInterval(function () {
  853. if (i > 0) {
  854. i--;
  855. document.getElementById("time-area").innerHTML = formatSeconds(i);
  856. } else {
  857. clearInterval(EZUIKit.state.countTimer);
  858. EZUIKit.state.countTimer = undefined;
  859. console.log("倒计时结束,开启声音"); // decoder.openSound(0);
  860. }
  861. }, 1000);
  862. } else if (type === 'destory') {
  863. clearInterval(EZUIKit.state.countTimer);
  864. EZUIKit.state.countTimer = undefined;
  865. document.getElementById("time-area").innerHTML = '00:00';
  866. } //将秒数转换为时分秒格式
  867. function formatSeconds(value) {
  868. var theTime = parseInt(value); // 秒
  869. var middle = 0; // 分
  870. var hour = 0; // 小时
  871. var secondV = '00';
  872. var minV = '00';
  873. var hourV = '00';
  874. if (theTime > 59) {
  875. middle = parseInt(theTime / 60);
  876. theTime = parseInt(theTime % 60);
  877. if (middle > 59) {
  878. hour = parseInt(middle / 60);
  879. middle = parseInt(middle % 60);
  880. }
  881. }
  882. secondV = parseInt(theTime) > 9 ? parseInt(theTime) : '0' + parseInt(theTime);
  883. minV = parseInt(middle) > 9 ? parseInt(middle) : '0' + parseInt(middle);
  884. hourV = parseInt(hour) > 9 ? parseInt(hour) : '0' + parseInt(hour);
  885. if (hour > 0) {
  886. return hourV + ':' + minV + ':' + secondV;
  887. } else if (middle > 0) {
  888. return minV + ':' + secondV;
  889. } else {
  890. return '00:' + secondV;
  891. }
  892. }
  893. }
  894. /* 将秒数转换为时分秒格式 */
  895. function formatSeconds(value) {
  896. var theTime = parseInt(value); // 秒
  897. var middle = 0; // 分
  898. var hour = 0; // 小时
  899. var secondV = '00';
  900. var minV = '00';
  901. var hourV = '00';
  902. if (theTime > 59) {
  903. middle = parseInt(theTime / 60);
  904. theTime = parseInt(theTime % 60);
  905. if (middle > 59) {
  906. hour = parseInt(middle / 60);
  907. middle = parseInt(middle % 60);
  908. }
  909. }
  910. secondV = parseInt(theTime) > 9 ? parseInt(theTime) : '0' + parseInt(theTime);
  911. minV = parseInt(middle) > 9 ? parseInt(middle) : '0' + parseInt(middle);
  912. hourV = parseInt(hour) > 9 ? parseInt(hour) : '0' + parseInt(hour);
  913. if (hour > 0) {
  914. return hourV + ':' + minV + ':' + secondV;
  915. } else if (middle > 0) {
  916. return minV + ':' + secondV;
  917. } else {
  918. return '00:' + secondV;
  919. }
  920. }
  921. }
  922. }
  923. })
  924. })
  925. // iframe 传递数据
  926. var _this = this;
  927. window.addEventListener("message", function (event) {
  928. console.log("EZUIKitPlayer收到反馈", event);
  929. var origin = event.origin;
  930. var id = _this.opt.id;
  931. if (event.data.type) {
  932. switch (event.data.type) {
  933. case 'openSound':
  934. if (id == event.data.id && params.openSoundCallBack) {
  935. params.openSoundCallBack(event.data);
  936. }
  937. break;
  938. case 'closeSound':
  939. if (id == event.data.id && params.closeSoundCallBack) {
  940. params.closeSoundCallBack(event.data);
  941. }
  942. break;
  943. case 'capturePicture':
  944. if (id == event.data.id && params.capturePictureCallBack) {
  945. params.capturePictureCallBack(event.data);
  946. }
  947. break;
  948. case 'startSave':
  949. if (id == event.data.id && params.startSaveCallBack) {
  950. params.startSaveCallBack(event.data);
  951. }
  952. break;
  953. case 'stopSave':
  954. if (id == event.data.id && params.stopSaveCallBack) {
  955. params.stopSaveCallBack(event.data);
  956. }
  957. break;
  958. case 'fullScreen':
  959. if (id == event.data.id && params.fullScreenCallBack) {
  960. params.fullScreenCallBack(event.data);
  961. }
  962. break;
  963. case 'getOSDTime':
  964. if (id == event.data.id && params.getOSDTimeCallBack) {
  965. params.getOSDTimeCallBack(event.data);
  966. }
  967. break;
  968. case 'handleSuccess':
  969. if (id == event.data.id && params.handleSuccess) {
  970. params.handleSuccess(event.data);
  971. }
  972. break;
  973. case 'handleError':
  974. if (id == event.data.id && params.handleError) {
  975. params.handleError(event.data);
  976. }
  977. break;
  978. case 'dblclick':
  979. if (id == event.data.id && _this.opt.bSupporDoubleClickFull) {
  980. if(_this.opt.fullScreenStatus === 0){
  981. _this.fullScreen();
  982. } else {
  983. _this.cancelFullScreen();
  984. }
  985. }
  986. break;
  987. }
  988. }
  989. });
  990. // 全屏变化回调
  991. function fullscreenchange(data) {
  992. _this.opt.fullScreenStatus = data ? 1 : 0;
  993. if (params.fullScreenChangeCallBack) {
  994. params.fullScreenChangeCallBack({data:data,id: _this.opt.id});
  995. }
  996. }
  997. if (typeof document.fullScreen !== "undefined") {
  998. document.addEventListener("fullscreenchange", function() {
  999. var e = document.fullscreen || false;
  1000. fullscreenchange(e)
  1001. })
  1002. } else if (typeof document.webkitIsFullScreen !== "undefined") {
  1003. document.addEventListener("webkitfullscreenchange", function() {
  1004. var e = document.webkitIsFullScreen || false;
  1005. fullscreenchange(e)
  1006. })
  1007. } else if (typeof document.mozFullScreen !== "undefined") {
  1008. document.addEventListener("mozfullscreenchange", function() {
  1009. var e = document.mozFullScreen || false;
  1010. fullscreenchange(e)
  1011. })
  1012. }
  1013. }; // 播放相关API
  1014. EZUIKitPlayer.prototype.play = function (data) {
  1015. var id = 'EZUIKitPlayer-' + this.opt.id;
  1016. var player = document.getElementById(id).contentWindow;
  1017. if (typeof data === 'object' && data.url) {
  1018. this.opt.url = data.url;
  1019. }
  1020. if (typeof data === 'object' && data.accessToken) {
  1021. this.opt.accessToken = data.accessToken;
  1022. }
  1023. if (typeof data === 'string') {
  1024. this.opt.url = data;
  1025. }
  1026. player.postMessage({
  1027. action: "play",
  1028. accessToken: this.opt.accessToken,
  1029. url: this.opt.url
  1030. }, domain + "/ezopen/h5/iframe");
  1031. var _this = this;
  1032. this.opt.videoLoading = true;
  1033. var promise = new Promise(function(resolve,reject) {
  1034. window.addEventListener("message", function (event) {
  1035. var playId = _this.opt.id;
  1036. if (playId == event.data.id && event.data.type === 'handleSuccess') {
  1037. setTimeout(()=>{
  1038. _this.opt.videoLoading = false;
  1039. },1000)
  1040. resolve(event.data);
  1041. }
  1042. });
  1043. });
  1044. return promise;
  1045. };
  1046. EZUIKitPlayer.prototype.stop = function () {
  1047. var id = 'EZUIKitPlayer-' + this.opt.id;
  1048. var player = document.getElementById(id).contentWindow;
  1049. player.postMessage("stop", domain + "/ezopen/h5/iframe");
  1050. var _this = this;
  1051. var promise = new Promise(function(resolve,reject) {
  1052. window.addEventListener("message", function (event) {
  1053. var playId = _this.opt.id;
  1054. if (playId == event.data.id && event.data.type === 'stop') {
  1055. resolve(event.data);
  1056. }
  1057. });
  1058. });
  1059. return promise;
  1060. };
  1061. EZUIKitPlayer.prototype.openSound = function () {
  1062. var id = 'EZUIKitPlayer-' + this.opt.id;
  1063. var player = document.getElementById(id).contentWindow;
  1064. player.postMessage("openSound", domain + "/ezopen/h5/iframe");
  1065. var _this = this;
  1066. var promise = new Promise(function(resolve,reject) {
  1067. window.addEventListener("message", function (event) {
  1068. var playId = _this.opt.id;
  1069. if (playId == event.data.id && event.data.type === 'openSound') {
  1070. resolve(event.data);
  1071. }
  1072. });
  1073. });
  1074. return promise;
  1075. };
  1076. EZUIKitPlayer.prototype.closeSound = function () {
  1077. var id = 'EZUIKitPlayer-' + this.opt.id;
  1078. var player = document.getElementById(id).contentWindow;
  1079. player.postMessage("closeSound", domain + "/ezopen/h5/iframe");
  1080. var _this = this;
  1081. var promise = new Promise(function(resolve,reject) {
  1082. window.addEventListener("message", function (event) {
  1083. var playId = _this.opt.id;
  1084. if (playId == event.data.id && event.data.type === 'closeSound') {
  1085. resolve(event.data);
  1086. }
  1087. });
  1088. });
  1089. return promise;
  1090. };
  1091. EZUIKitPlayer.prototype.startSave = function (fileName) {
  1092. var id = 'EZUIKitPlayer-' + this.opt.id;
  1093. var player = document.getElementById(id).contentWindow;
  1094. player.postMessage({
  1095. action: "startSave",
  1096. fileName: fileName || 'default'
  1097. }, domain + "/ezopen/h5/iframe");
  1098. var _this = this;
  1099. var promise = new Promise(function(resolve,reject) {
  1100. window.addEventListener("message", function (event) {
  1101. var playId = _this.opt.id;
  1102. if (playId == event.data.id && event.data.type === 'startSave') {
  1103. resolve(event.data);
  1104. }
  1105. });
  1106. });
  1107. return promise;
  1108. };
  1109. EZUIKitPlayer.prototype.stopSave = function () {
  1110. var id = 'EZUIKitPlayer-' + this.opt.id;
  1111. var player = document.getElementById(id).contentWindow;
  1112. player.postMessage("stopSave", domain + "/ezopen/h5/iframe");
  1113. var _this = this;
  1114. var promise = new Promise(function(resolve,reject) {
  1115. window.addEventListener("message", function (event) {
  1116. var playId = _this.opt.id;
  1117. if (playId == event.data.id && event.data.type === 'stopSave') {
  1118. resolve(event.data);
  1119. }
  1120. });
  1121. });
  1122. return promise;
  1123. };
  1124. EZUIKitPlayer.prototype.fullScreen = function () {
  1125. if(this.opt.fullScreenStatus === 1){
  1126. return false
  1127. }
  1128. var _this = this;
  1129. var id = 'EZUIKitPlayer-' + this.opt.id;
  1130. var player = document.getElementById(id).contentWindow;
  1131. if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
  1132. // console.log('移动端全屏');
  1133. var width = document.documentElement.clientWidth;
  1134. var height = document.documentElement.clientHeight;
  1135. // wrapper = document.getElementById("test"),
  1136. var wrapper = document.body;//document.body 属性返回 <body> 元素, document.documentElement 属性返回 <html> 元素。
  1137. wrapper =document.getElementById(id);
  1138. var style = "";
  1139. style += "width:" + height + "px;";// 注意旋转后的宽高切换
  1140. style += "height:" + width + "px;";
  1141. style += "-webkit-transform: rotate(90deg); transform: rotate(90deg);";
  1142. // 注意旋转中点的处理
  1143. style += "-webkit-transform-origin: " + width / 2 + "px " + width / 2 + "px;";
  1144. style += "transform-origin: " + width / 2 + "px " + width / 2 + "px;";
  1145. style += 'position: fixed;top: 0;left: 0;z-index:10';
  1146. wrapper.style.cssText = style;
  1147. var cancelFullDOM = document.createElement('div');
  1148. cancelFullDOM.id = id + "cancel-full-screen"
  1149. var cancelFullDOMStyle="width:30px;height:"+height+"px;z-index:1000;position:fixed;top:0px;right:0px;";
  1150. cancelFullDOMStyle += "background-image: url(https://resource.ys7cloud.com/group1/M00/00/7E/CtwQE1-01qeAH2wAAAABOliqQ5g167.png);"
  1151. cancelFullDOMStyle += "background-size: contain;background-repeat:no-repeat;background-color:rgba(0,0,0,0.2)"
  1152. cancelFullDOM.style = cancelFullDOMStyle;
  1153. cancelFullDOM.onclick = function(){
  1154. _this.cancelFullScreen();
  1155. }
  1156. document.body.appendChild(cancelFullDOM);
  1157. setTimeout(function () {
  1158. player.postMessage('autoResize', domain + "/ezopen/h5/iframe")
  1159. }, 500)
  1160. } else {
  1161. // console.log('pc端全屏');
  1162. var requestFullScreen = function (element) {
  1163. var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
  1164. if (requestMethod) {
  1165. requestMethod.call(element);
  1166. } else if (typeof window.ActiveXObject !== "undefined") {
  1167. var wscript = new ActiveXObject("WScript.Shell");
  1168. if (wscript !== null) {
  1169. wscript.SendKeys("{F11}");
  1170. }
  1171. }
  1172. }
  1173. requestFullScreen(document.getElementById(id));
  1174. }
  1175. if (this.params.fullScreenCallBack) {
  1176. this.params.fullScreenCallBack(this.opt.id);
  1177. }
  1178. this.opt.fullScreenStatus = 1;
  1179. };
  1180. EZUIKitPlayer.prototype.cancelFullScreen = function () {
  1181. if(this.opt.fullScreenStatus === 0){
  1182. return false
  1183. }
  1184. var id = 'EZUIKitPlayer-' + this.opt.id;
  1185. var player = document.getElementById(id).contentWindow;
  1186. if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
  1187. var width = document.getElementById(id).width;
  1188. var height = document.getElementById(id).height;
  1189. // wrapper = document.getElementById("test"),
  1190. var wrapper = document.body;//document.body 属性返回 <body> 元素, document.documentElement 属性返回 <html> 元素。
  1191. wrapper =document.getElementById(id);
  1192. var style = "";
  1193. style += "width:" + width + "px;";
  1194. style += "height:" + height + "px;";
  1195. style += "-webkit-transform: rotate(0); transform: rotate(0);";
  1196. style += "-webkit-transform-origin: 0 0;";
  1197. style += "transform-origin: 0 0;";
  1198. wrapper.style.cssText = style;
  1199. setTimeout(function () {
  1200. player.postMessage("autoResize", domain + "/ezopen/h5/iframe")
  1201. }, 500);
  1202. var cancelFullDOMId = id + "cancel-full-screen";
  1203. var cancelFullDOM = document.getElementById(cancelFullDOMId);
  1204. if(cancelFullDOM){
  1205. document.body.removeChild(cancelFullDOM)
  1206. }
  1207. } else {
  1208. if (document.exitFullscreen) {
  1209. document.exitFullscreen();
  1210. } else if (document.webkitCancelFullScreen) {
  1211. document.webkitCancelFullScreen();
  1212. } else if (document.mozCancelFullScreen) {
  1213. document.mozCancelFullScreen();
  1214. }
  1215. }
  1216. if (this.params.cancelFullScreenCallBack) {
  1217. this.params.cancelFullScreenCallBack(this.opt.id);
  1218. }
  1219. this.opt.fullScreenStatus = 0;
  1220. }
  1221. EZUIKitPlayer.prototype.capturePicture = function (fileName,isUndownload) {
  1222. var id = 'EZUIKitPlayer-' + this.opt.id;
  1223. var player = document.getElementById(id).contentWindow;
  1224. player.postMessage({
  1225. action: "capturePicture",
  1226. fileName: fileName || 'default',
  1227. isUndownload: isUndownload,
  1228. }, domain + "/ezopen/h5/iframe");
  1229. var _this = this;
  1230. var promise = new Promise(function(resolve,reject) {
  1231. window.addEventListener("message", function (event) {
  1232. var playId = _this.opt.id;
  1233. if (playId == event.data.id && event.data.type === 'capturePicture') {
  1234. resolve(event.data);
  1235. }
  1236. });
  1237. });
  1238. return promise;
  1239. };
  1240. EZUIKitPlayer.prototype.enableZoom = function () {
  1241. var id = 'EZUIKitPlayer-' + this.opt.id;
  1242. var player = document.getElementById(id).contentWindow;
  1243. player.postMessage("enableZoom", domain + "/ezopen/h5/iframe");
  1244. };
  1245. EZUIKitPlayer.prototype.closeZoom = function () {
  1246. var id = 'EZUIKitPlayer-' + this.opt.id;
  1247. var player = document.getElementById(id).contentWindow;
  1248. player.postMessage("closeZoom", domain + "/ezopen/h5/iframe");
  1249. };
  1250. EZUIKitPlayer.prototype.getOSDTime = function () {
  1251. var id = 'EZUIKitPlayer-' + this.opt.id;
  1252. var player = document.getElementById(id).contentWindow;
  1253. player.postMessage("getOSDTime", domain + "/ezopen/h5/iframe");
  1254. var _this = this;
  1255. var promise = new Promise(function(resolve,reject) {
  1256. window.addEventListener("message", function (event) {
  1257. var playId = _this.opt.id;
  1258. if (playId == event.data.id && event.data.type === 'getOSDTime') {
  1259. resolve(event.data);
  1260. }
  1261. });
  1262. });
  1263. return promise;
  1264. };
  1265. EZUIKitPlayer.prototype.autoResize = function () {
  1266. var id = 'EZUIKitPlayer-' + this.opt.id;
  1267. var player = document.getElementById(id).contentWindow;
  1268. player.postMessage("autoResize", domain + "/ezopen/h5/iframe")
  1269. };
  1270. EZUIKitPlayer.prototype.reSize = function (width,height) {
  1271. var id = 'EZUIKitPlayer-' + this.opt.id;
  1272. var player = document.getElementById(id).contentWindow;
  1273. var containerDOM = document.getElementById(this.opt.id);
  1274. containerDOM.style.width = width + 'px';
  1275. containerDOM.style.height = height + 'px';
  1276. var playDOM = document.getElementById(id);
  1277. playDOM.setAttribute("width",width);
  1278. playDOM.setAttribute("height",height);
  1279. playDOM.style.width = width + 'px';
  1280. playDOM.style.height = height + 'px';
  1281. setTimeout(function(){
  1282. player.postMessage({
  1283. action: 'autoResize',
  1284. }, domain + "/ezopen/h5/iframe");
  1285. },500)
  1286. };
  1287. EZUIKitPlayer.prototype.startTalk = function () {
  1288. console.log("执行开始对讲");
  1289. console.log(this.opt);
  1290. var _this = this;
  1291. EZUIKit.opt = this.opt;
  1292. var apiSuccess = function(data) {
  1293. if (data.code == 200) {
  1294. var apiResult = data.data;
  1295. if (apiResult) {
  1296. // 临时将https转换为websocket
  1297. var rtcTrunk = apiResult.rtcUrl;
  1298. if (rtcTrunk.indexOf("ws") === -1) {
  1299. rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
  1300. }
  1301. _this.opt.rtcUrl = rtcTrunk;
  1302. _this.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
  1303. var talk = "talk://" + _this.opt.deviceSerial + ":0:" + _this.opt.channelNo + ":cas.ys7.com:6500";
  1304. _this.opt.talkLink = _this.opt.ttsUrl + "/" + talk;
  1305. _this.opt.stream = apiResult.stream;
  1306. window.startTalk();
  1307. }
  1308. }
  1309. }
  1310. var apiError = function() {
  1311. layer.msg("获取对讲token失败")
  1312. }
  1313. request(_this.opt.apiDomain, 'POST', {
  1314. accessToken: _this.opt.accessToken,
  1315. deviceSerial: _this.opt.deviceSerial,
  1316. channelNo: _this.opt.channelNo
  1317. }, '', apiSuccess, apiError);
  1318. };
  1319. EZUIKitPlayer.prototype.stopTalk = function () {
  1320. console.log("执行结束对讲");
  1321. window.stopTalk();
  1322. };
  1323. /**
  1324. * 视频播放器-结束
  1325. */
  1326. EZUIKit.EZUIKitPlayer = EZUIKitPlayer;
  1327. window.EZUIKit = EZUIKit;
  1328. if (!noGlobal) {
  1329. window.EZUIKit = EZUIKit;
  1330. }
  1331. return EZUIKit;
  1332. });