equipmanage_ctrl_jk.html 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819
  1. {% load staticfiles %}
  2. <!DOCTYPE html>
  3. <html lang="zh-CN">
  4. <head>
  5. <meta charset="UTF-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <link href="{% static '/lib/bootstrap-3.3.7/css/bootstrap.css' %}" rel="stylesheet">
  8. <link rel="stylesheet" href="{% static '/lib/font-awesome/4.5.0/css/font-awesome.css' %}">
  9. <link rel="stylesheet" href="{% static '/lib/css/ace.min.css' %}" />
  10. <link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}">
  11. <meta name="renderer" content="webkit">
  12. <title>测试页面</title>
  13. <style>
  14. body {
  15. background: #fff;
  16. }
  17. .flashDownDiv,
  18. .nullData {
  19. text-align: center;
  20. font-size: 14px;
  21. height: 630px;
  22. }
  23. .flashDownDiv p:first-child,
  24. .nullData p:first-child {
  25. padding-top: 10%;
  26. }
  27. .flashShowDiv,
  28. .flashDownDiv,
  29. .nullData {
  30. display: none;
  31. }
  32. /* 视频框 */
  33. .equipname {
  34. position: absolute;
  35. display: none;
  36. }
  37. #divMain .a1 {
  38. width: 100%;
  39. height: 100%;
  40. }
  41. #divMain .a4 {
  42. width: 50%;
  43. height: 50%;
  44. }
  45. #divMain .a9 {
  46. width: 33.33%;
  47. height: 33.33%;
  48. }
  49. #divMain .a16 {
  50. width: 25%;
  51. height: 25%;
  52. }
  53. #divMain a,
  54. a:visited {
  55. float: left;
  56. border: 1px solid #000;
  57. margin: 0 -1px -1px 0;
  58. position: relative;
  59. text-decoration: none;
  60. }
  61. #divMain .aSelected {
  62. z-index: 9;
  63. border: 1px solid #dbffc9;
  64. }
  65. /* 多屏选择 */
  66. .v1 {
  67. cursor: pointer;
  68. width: 23px;
  69. height: 23px;
  70. display: inline-table;
  71. }
  72. .v1,
  73. .v4,
  74. .v9 {
  75. color: #fff;
  76. font-size: 24px;
  77. }
  78. .v1.active,
  79. .v1:hover {
  80. color: #37CAB9;
  81. }
  82. .v4 {
  83. cursor: pointer;
  84. width: 23px;
  85. height: 23px;
  86. display: inline-table;
  87. }
  88. .v4.active,
  89. .v4:hover {
  90. color: #37CAB9;
  91. }
  92. .v9 {
  93. cursor: pointer;
  94. width: 23px;
  95. height: 23px;
  96. display: inline-table;
  97. }
  98. .v9.active,
  99. .v9:hover {
  100. color: #37CAB9;
  101. }
  102. .v16 {
  103. cursor: pointer;
  104. width: 23px;
  105. height: 23px;
  106. display: inline-table;
  107. }
  108. /* 列表 */
  109. .scrollDiv {
  110. overflow-x: hidden;
  111. line-height: 40px;
  112. height: 100%;
  113. width: 220px;
  114. }
  115. #jkList {
  116. width: 220px;
  117. }
  118. #jkList>div {
  119. color: #fff;
  120. vertical-align: middle;
  121. line-height: 40px;
  122. padding: 0px 15px;
  123. white-space: nowrap;
  124. width: 220px;
  125. text-overflow: ellipsis;
  126. overflow: hidden;
  127. cursor: pointer;
  128. }
  129. #jkList>div.active,
  130. #jkList>div:hover {
  131. color: rgb(255, 255, 0);
  132. background-color: #36404D;
  133. }
  134. /* 控制 */
  135. .ctrlBox {
  136. /* display: none; */
  137. position: absolute;
  138. /* background: #685f5f; */
  139. z-index: 99999;
  140. padding: 0 20px;
  141. width: 220px;
  142. height: 225px;
  143. left: 0;
  144. bottom: 20px;
  145. /* border: 1px solid #000; */
  146. border-radius: 30px 30px 50px 50px;
  147. }
  148. .addCtrl,
  149. .cutCtrl,
  150. .minusCtrl,
  151. .directionCtrl>div {
  152. position: absolute;
  153. width: 50px;
  154. height: 50px;
  155. cursor: pointer;
  156. }
  157. .addCtrl {
  158. top: 0;
  159. background: url(../static/img/jkbtn/jkadd.png) no-repeat center;
  160. background-size: 100% 100%;
  161. }
  162. .cutCtrl {
  163. top: 0;
  164. left: 50%;
  165. margin-left: -18px;
  166. background: url(../static/img/jkbtn/cut.png) no-repeat center;
  167. background-size: 100% 100%;
  168. }
  169. .minusCtrl {
  170. top: 0;
  171. right: 11px;
  172. background: url(../static/img/jkbtn/jkminus.png) no-repeat center;
  173. background-size: 100% 100%;
  174. }
  175. .directionCtrl {
  176. position: absolute;
  177. width: 200px;
  178. height: 200px;
  179. bottom: -20px;
  180. background: url(../static/img/jkbtn/jkctrl.png) no-repeat center;
  181. background-size: 90% 90%;
  182. }
  183. .upCtrl {
  184. top: 20px;
  185. left: 50%;
  186. margin-left: -25px;
  187. }
  188. .leftCtrl {
  189. left: 20px;
  190. top: 50%;
  191. margin-top: -25px;
  192. }
  193. .bottomCtrl {
  194. bottom: 20px;
  195. left: 50%;
  196. margin-left: -25px;
  197. }
  198. .rightCtrl {
  199. right: 20px;
  200. top: 50%;
  201. margin-top: -25px;
  202. }
  203. /* fenpei */
  204. .fenpei {
  205. color: #fff;
  206. text-align: center;
  207. }
  208. .fenpei span {
  209. padding: 3px 5px;
  210. }
  211. .fenpei .jianbtn,
  212. .fenpei .jiabtn {
  213. cursor: pointer;
  214. }
  215. #downpath {
  216. width: 100%;
  217. height: 80px;
  218. resize: none;
  219. margin-top: 10px;
  220. }
  221. video {
  222. width: 100%;
  223. height: 100%;
  224. }
  225. .page-header {
  226. margin: 0 0 12px;
  227. border-bottom: 1px dotted #E2E2E2;
  228. padding-right: 35px;
  229. padding-top: 7px;
  230. text-align: right;
  231. }
  232. .page-header a {
  233. color: #31b4ff;
  234. font-size: 16px;
  235. }
  236. .page-header a:hover{
  237. color: #0074b6;
  238. }
  239. /* 查看图片按钮 */
  240. .lookjkPhoto{
  241. color: #cfa301;
  242. margin: 0 5px;
  243. line-height: 25px;
  244. }
  245. .lookjkPhoto:hover{
  246. color: rgb(255, 255, 0);
  247. }
  248. .lookjkPhoto:active,.lookjkPhoto:focus{
  249. color: #cfa301;
  250. }
  251. .jkNameSpan{
  252. vertical-align: middle;
  253. display: inline-block;
  254. width: 51%;
  255. text-overflow: ellipsis;
  256. overflow: hidden;
  257. cursor: pointer;
  258. }
  259. /* 监控在线图标 */
  260. .onLine{
  261. display: inline-block;
  262. width: 10px;
  263. height: 10px;
  264. border-radius: 50%;
  265. background: #2ff235;
  266. vertical-align: middle;
  267. margin-right: 10px;
  268. }
  269. .offLine{
  270. display: inline-block;
  271. width: 10px;
  272. height: 10px;
  273. border-radius: 50%;
  274. background: #8b8a8a;
  275. vertical-align: middle;
  276. margin-right: 10px;
  277. }
  278. </style>
  279. </head>
  280. <script>
  281. </script>
  282. <body>
  283. <script src="{% static '/lib/js/ezuikit.js' %}"></script>
  284. <div class="content">
  285. <div class="searchCover page-header">
  286. <a href="equipmanage_jk" target="BoardRight">
  287. 切换成视频直播
  288. <i class="fa fa-share" aria-hidden="true"></i>
  289. </a>
  290. </div>
  291. <div class="innerTable">
  292. <div class="nullData">
  293. <p>暂无设备</p>
  294. <p>请先添加设备</p>
  295. </div>
  296. <div class="flashDownDiv">
  297. <p>您没有安装flash插件,无法播放视频</p>
  298. <p>请先下载安装最新的flash插件</p>
  299. <a href="https://get.adobe.com/cn/flashplayer/" class="btn btn-primary">
  300. <i class="fa fa-download" aria-hidden="true"></i>
  301. 下载视频控件
  302. </a>
  303. </div>
  304. <div class="flashShowDiv">
  305. <div style="display: table; width: 100%;" id="jk_main">
  306. <!-- 视频框 -->
  307. <div style="display: table-cell;">
  308. <div id="divMain" style="width: 100%; height:870px; background: rgb(49, 58, 71); margin: auto; padding: 15px; position: relative; z-index: 9999;">
  309. </div>
  310. <div style="clear: both; width: 100%; height: 45px; line-height: 45px; background: rgb(49, 58, 71); padding-left: 13px;">
  311. </div>
  312. </div>
  313. <!-- 控制 -->
  314. <div id="div_ControlPanel" style="position:relative;display: table-cell; width: 220px; height: 778px; overflow: hidden; background: rgb(70, 78, 96); vertical-align: top;">
  315. <table style="width: 100%; height: 100%">
  316. <tr>
  317. <td>
  318. <div class="scrollDiv">
  319. <div id="jkList">
  320. <div>
  321. <img src="{% static 'img/sxtIcon.png' %}" width="26px" alt=""> 祥泰
  322. </div>
  323. <div class="active">
  324. <img src="{% static 'img/sxtIcon.png' %}" width="26px" alt=""> 祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰祥泰
  325. </div>
  326. <div>
  327. <img src="{% static 'img/sxtIcon.png' %}" width="26px" alt=""> 祥泰
  328. </div>
  329. </div>
  330. <div class="fenpei">
  331. <span class="jianbtn" onclick="getjklistFun('jian')">
  332. <img src="{% static 'img/jkupicon.png' %}" width="26px" alt="">
  333. </span>
  334. <span id="currPageNum">1</span>
  335. <span>/</span>
  336. <span id="totalPageNum">9</span>
  337. <span class="jiabtn" onclick="getjklistFun('jia')">
  338. <img src="{% static 'img/jkdownicon.png' %}" width="26px" alt="">
  339. </span>
  340. </div>
  341. </div>
  342. </td>
  343. </tr>
  344. <tr>
  345. <td>
  346. <div class="ctrlBox">
  347. <div class="addCtrl" onmousedown="configCamera(this,'move',8)" onmouseup="configCamera(this,'stop')"></div>
  348. <div class="cutCtrl" onclick="configCamera(this,'takephoto','')"></div>
  349. <div class="minusCtrl" onmousedown="configCamera(this,'move',9)" onmouseup="configCamera(this,'stop')"></div>
  350. <div class="directionCtrl">
  351. <div class="upCtrl" onmousedown="configCamera(this,'move',0)" onmouseup="configCamera(this,'stop')"></div>
  352. <div class="leftCtrl" onmousedown="configCamera(this,'move',2)" onmouseup="configCamera(this,'stop')"></div>
  353. <div class="bottomCtrl" onmousedown="configCamera(this,'move',1)" onmouseup="configCamera(this,'stop')"></div>
  354. <div class="rightCtrl" onmousedown="configCamera(this,'move',3)" onmouseup="configCamera(this,'stop')"></div>
  355. </div>
  356. </div>
  357. </td>
  358. </tr>
  359. </table>
  360. </div>
  361. </div>
  362. <!-- <div class="fenpei-bottom">
  363. <input type="hidden" id="totalPage" value={{ nums }}>
  364. <div id="page" style="text-align: center;"></div>
  365. </div> -->
  366. </div>
  367. </div>
  368. </div>
  369. <script src="{% static '/lib/js/jquery-2.1.4.min.js' %}"></script>
  370. <script src="{% static '/lib/bootstrap-3.3.7/js/bootstrap.js' %}"></script>
  371. <script src="{% static '/lib/layui/layui.all.js' %}"></script>
  372. <script src="{% static '/js/common.js' %}?versions=0.5.0"></script>
  373. <script>
  374. $.ajaxSetup({
  375. data: { csrfmiddlewaretoken: '{{ csrf_token }}' },
  376. });
  377. function CreateVidewDiv(n) {
  378. divNum = n;
  379. AutoNext = true;
  380. var width = "100%";
  381. var height = "100%";
  382. var html = "";
  383. for (var i = 1; i <= n; i++) {
  384. if (i == 1)
  385. html += "<a id=\"a_" + i + "\" class=\"a" + n + " aSelected\">";
  386. else
  387. html += "<a id=\"a_" + i + "\" class=\"a" + n + "\">";
  388. html += "<span id='span_deviceSerial_" + i + "' class='equipname' style=''></span>";
  389. html += "<span id='span_cameraNo_" + i + "' style='display:none'></span>";
  390. html += "<table id=\"table_" + i + "\" style=\"width: " + width + "; height: " + height + "; margin:0 auto\">";
  391. html += "<tr style='display:none;'>";
  392. html += "<td id=\"title_" + i + "\" class=\"Video_Title\" onclick=\"setCurIndex(" + i + ")\" onmouseover=\"setMouseOver(" + i + ")\" onmouseout=\"setMouseOut(" + i + ")\"><span style='color:#999'>点此选择</span></td>";
  393. html += "</tr>";
  394. html += "<tr><td id='video_" + i + "' onclick=\"setCurIndex(" + i + ");\" onmouseover=\"setMouseOver(" + i + ")\" onmouseout=\"setMouseOut(" + i + ")\">";
  395. html += "</td></tr>";
  396. html += "</table> ";
  397. html += "</a> ";
  398. }
  399. curIndex = 1;
  400. $("#divMain").html(html);
  401. $("#span_V1").removeClass("active");
  402. $("#span_V4").removeClass("active");
  403. $("#span_V9").removeClass("active");
  404. $("#span_V16").removeClass("active");
  405. $("#span_V" + n).addClass("active");
  406. scrollBar();
  407. }
  408. function setMouseOut(idx) {
  409. if (curIndex != idx && $("#a_" + idx).length > 0)
  410. $("#a_" + idx).removeClass("aSelected");
  411. }
  412. function setMouseOver(idx) {
  413. if ($("#a_" + idx).length > 0)
  414. $("#a_" + idx).addClass("aSelected");
  415. }
  416. // 点击获取当前监控
  417. function setCurIndex(idx) {
  418. AutoNext = false;
  419. if (curIndex > 0 && $("#a_" + curIndex).length > 0)
  420. $("#a_" + curIndex).removeClass("aSelected");
  421. curIndex = idx;
  422. console.log($("#a_" + idx).find('.equipname').html());
  423. if ($("#a_" + idx).length > 0)
  424. $("#a_" + idx).addClass("aSelected");
  425. }
  426. var winHeight = 0;
  427. function windowResize() { //函数:获取尺寸
  428. var divMainWidth = $('#divMain').css('width').replace("px", "");
  429. var divMainHeight = divMainWidth * 9 / 16;
  430. $('#divMain').css('height', divMainHeight + 22 + "px");
  431. var EZUIKitHeight = divMainHeight / Math.sqrt(divNum) - 10;
  432. $('.videoNum' + divNum).css('height', EZUIKitHeight + "px");
  433. $('#div_ControlPanel').css('height', divMainHeight + "px");
  434. if ($("#tr_ptz").is(':visible'))
  435. $('#div_CamerList').css('height', divMainHeight - 215 + "px");
  436. else
  437. $('#div_CamerList').css('height', divMainHeight - 20 + "px");
  438. scrollBar();
  439. }
  440. window.onresize = function () {
  441. windowResize();
  442. }
  443. var spanIdx = "";
  444. </script>
  445. <script>
  446. // 判断是否启用flash
  447. function flashChecker() {
  448. var hasFlash = 0;     //是否安装了flash
  449. var flashVersion = 0;   //flash版本
  450. if (document.all) {
  451. var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
  452. if (swf) {
  453. hasFlash = 1;
  454. VSwf = swf.GetVariable("$version");
  455. flashVersion = parseInt(VSwf.split(" ")[1].split(",")[0]);
  456. }
  457. } else {
  458. if (navigator.plugins && navigator.plugins.length > 0) {
  459. var swf = navigator.plugins["Shockwave Flash"];
  460. if (swf) {
  461. hasFlash = 1;
  462. var words = swf.description.split(" ");
  463. for (var i = 0; i < words.length; ++i) {
  464. if (isNaN(parseInt(words[i]))) {
  465. continue;
  466. }
  467. flashVersion = parseInt(words[i]);
  468. }
  469. }
  470. }
  471. }
  472. return {
  473. f: hasFlash,
  474. v: flashVersion
  475. };
  476. }
  477. var fls = flashChecker();
  478. // 控制
  479. function configCamera(deviceSerial, ctrl, movenum) {
  480. var id = $("#a_" + curIndex).find('.equipname').html();
  481. if (!id) {
  482. layer.msg('暂无设备!')
  483. return;
  484. }
  485. $.ajax({
  486. url: 'jk_view',
  487. type: 'post',
  488. dataType: 'json',
  489. data: {
  490. id: id,
  491. ctrl: ctrl,
  492. movenum: movenum
  493. },
  494. beforeSend: function () {
  495. if (ctrl == 'takephoto') {
  496. loadFlage = layer.load();
  497. }
  498. },
  499. complete: function () {
  500. layer.close(loadFlage);
  501. },
  502. success: function (data) {
  503. if (ctrl == 'takephoto') {
  504. layui.use('layer', function () {
  505. var layer = layui.layer;
  506. layer.open({
  507. title: '手动下载'
  508. , content: '<textarea readonly id="downpath">' + data.data.picUrl + '</textarea>'
  509. , btn: ['复制', '取消']
  510. , area: ['400px', '230px']
  511. , yes: function (index, layero) {
  512. //按钮【按钮一】的回调
  513. document.getElementById('downpath').select();
  514. layer.tips('手动复制,在浏览器打开,另存为', '#downpath', {
  515. tips: 2
  516. });
  517. return false;
  518. }
  519. , btn2: function (index, layero) {
  520. //按钮【按钮二】的回调
  521. //return false 开启该代码可禁止点击该按钮关闭
  522. }
  523. , btn3: function (index, layero) {
  524. }
  525. , cancel: function () {
  526. //右上角关闭回调
  527. //return false 开启该代码可禁止点击该按钮关闭
  528. }
  529. });
  530. });
  531. // window.open(data.data.picUrl)
  532. }
  533. }
  534. })
  535. }
  536. if (fls.f) { //安装了flash
  537. CreateVidewDiv(1)
  538. $('.flashShowDiv').show();
  539. $('.flashDownDiv').hide();
  540. getJkList(1, '')
  541. } else {
  542. $('.flashShowDiv').hide();
  543. $('.flashDownDiv').show();
  544. }
  545. // 获取视频列表
  546. function getJkList(page, searchId) {
  547. $.ajax({
  548. url: 'jk_page',
  549. type: 'get',
  550. data: {
  551. page: page,
  552. f_id: searchId
  553. },
  554. dataType: 'json',
  555. beforeSend: function () {
  556. loadFlage = layer.load();
  557. },
  558. success: function (data) {
  559. fillmenu(data)
  560. $('#currPageNum').html(currPage);
  561. totalPageNum = Math.ceil(data.nums / 10);
  562. $('#totalPageNum').html(totalPageNum);
  563. layer.close(loadFlage);
  564. }
  565. })
  566. }
  567. function fillmenu(data) {
  568. var dat = data.ids;
  569. var html = '';
  570. for (i = 0; i < dat.length; i++) {
  571. var name = dat[i].equip_name ? dat[i].equip_name : dat[i].equip_id;
  572. if(dat[i].status == 1){
  573. var icon = '<span class="onLine"></span>'
  574. }else{
  575. var icon = '<span class="offLine"></span>'
  576. }
  577. if (i == 0) {
  578. html += '<div class="active jkItem" data-jktype="' + dat[i].jktype +'" data-id=' + dat[i].equip_id + '>'+icon+'<span title="'+name+'" class="jkNameSpan">' + name + '</span>';
  579. if(dat[i].photo_num >0){
  580. html += '<a href="javascript:;" class="lookjkPhoto">查看图片</a></div>';
  581. }else{
  582. html += '</div>';
  583. }
  584. } else {
  585. html += '<div class="jkItem" data-jktype="' + dat[i].jktype +'" data-id=' + dat[i].equip_id + '>'+icon+'<span title="'+name+'" class="jkNameSpan">' + name + '</span>';
  586. if(dat[i].photo_num >0){
  587. html += '<a href="javascript:;" class="lookjkPhoto">查看图片</a></div>';
  588. }else{
  589. html += '</div>';
  590. }
  591. }
  592. if (i == dat.length - 1) {
  593. $('#jkList').html(html);
  594. getPath(dat[0].equip_id,dat[0].jktype)
  595. }
  596. }
  597. }
  598. // 菜单点击事件
  599. $('#jkList').on('click', '.jkItem', function () {
  600. getPath($(this).data('id'))
  601. $('#jkList .jkItem').removeClass('active');
  602. $(this).addClass('active');
  603. })
  604. $('#jkList').on('click', '.lookjkPhoto', function (event) {
  605. // alert($(this).parent().data('id'));
  606. var imei = $(this).parent().data('id');
  607. // document.getElementById("iframe-main").src="home_map.html";
  608. $("body", parent.document).find('iframe').attr('src','jk_image?imei='+imei);
  609. event.stopPropagation();//阻止事件冒泡即可
  610. })
  611. //预览函数
  612. // function StartPlay(id, connectionType, liveStatus, rtmp, hls, deviceSerial, cameraNo, title, obj) {
  613. // if (obj == null) {
  614. // $("#div_CamerList>div").eq(0).addClass("select-c");
  615. // }
  616. // else {
  617. // $("#div_CamerList").children("div").removeClass("select-c");
  618. // $(obj).addClass("select-c");
  619. // }
  620. // $("#span_ConnectionType_" + curIndex).html(connectionType);
  621. // $("#span_deviceSerial_" + curIndex).html(deviceSerial);
  622. // $("#span_cameraNo_" + curIndex).html(cameraNo);
  623. // $("#span_playTime_" + curIndex).html(new Date().getTime()); //开始播放,时间为0
  624. // if (spanIdx != "")
  625. // $("#Span_" + spanIdx).css("color", "white");
  626. // spanIdx = id;
  627. // $("#Span_" + id).css("color", "#FFFF00");
  628. // $("#a_" + curIndex).addClass("noborder");
  629. // if (curIndex == 0 || $("#a_" + curIndex).length == 0)
  630. // return;
  631. // $("#title_" + curIndex).html(title);
  632. // var playHtml = "<video id='myPlayer" + curIndex + "' style='width: 100%; height: 100%' class='videoNum" + divNum + "' poster='' controls playsinline webkit-playsinline autoplay>";
  633. // playHtml += "<source src='" + hls + "' type='' />";
  634. // playHtml += "</video>";
  635. // var script = document.createElement("script");
  636. // script.type = "text/javascript";
  637. // script.appendChild(document.createTextNode(" new EZUIPlayer('myPlayer" + curIndex + "');"));
  638. // $("#video_" + curIndex).html(playHtml);
  639. // $("#video_" + curIndex).append(script);
  640. // if ($("#a_" + (curIndex + 1)).length > 0)
  641. // SetAutoNext(curIndex + 1);
  642. // //SetPtzControl();
  643. // windowResize();
  644. // }
  645. //预览函数
  646. function StartPlay(id, connectionType, liveStatus, rtmp, hls, deviceSerial, cameraNo, title, obj) {
  647. $("#span_deviceSerial_" + curIndex).html(deviceSerial);
  648. var playHtml = "<video id='myPlayer" + curIndex + "' class='videoNum" + curIndex + "' poster='' controls playsinline webkit-playsinline autoplay>";
  649. playHtml += "<source src='" + rtmp + "' type='' />";
  650. playHtml += "</video>";
  651. var script = document.createElement("script");
  652. script.type = "text/javascript";
  653. script.appendChild(document.createTextNode(" new EZUIPlayer('myPlayer" + curIndex + "');"));
  654. $("#video_" + curIndex).html(playHtml);
  655. $("#video_" + curIndex).append(script);
  656. windowResize();
  657. }
  658. function getPath(imei) {
  659. $.ajax({
  660. url: 'jk_view',
  661. type: 'get',
  662. data: {
  663. imei: imei
  664. },
  665. dataType: 'json',
  666. beforeSend: function () {
  667. loadFlage = layer.load();
  668. },
  669. success: function (data) {
  670. console.log(data)
  671. var dat = data[0].data[0];
  672. if (data[0].code == 200) {
  673. StartPlay(dat.deviceSerial, '', '', dat.rtmpHd, dat.hlsHd, dat.deviceSerial, '', '', null)
  674. }
  675. layer.close(loadFlage);
  676. }
  677. })
  678. }
  679. function SetAutoNext(idx) {
  680. if (AutoNext) {
  681. if (curIndex > 0 && $("#a_" + curIndex).length > 0)
  682. $("#a_" + curIndex).removeClass("aSelected");
  683. curIndex = idx;
  684. if ($("#a_" + idx).length > 0)
  685. $("#a_" + idx).addClass("aSelected");
  686. }
  687. }
  688. // 分页点击
  689. var currPage = 1;
  690. var totalPageNum;
  691. function getjklistFun(str) {
  692. if (str == 'jian') {
  693. if (currPage > 1) {
  694. currPage--;
  695. }
  696. } else {
  697. if (currPage < totalPageNum) {
  698. currPage++;
  699. }
  700. }
  701. getJkList(currPage, '')
  702. }
  703. // StartPlay('363','1', '2', 'rtmp://rtmp.open.ys7.com/openlive/8702368f321341deb9fb5edb9d72faec', 'http://hls.open.ys7.com/openlive/8702368f321341deb9fb5edb9d72faec.m3u8', '719458092', '1','阳台',null);
  704. </script>
  705. </body>
  706. </html>