API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jul 21st, 2016
407
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 97.91 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <title></title>
  6. <meta charset="UTF-8"/>
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  8. <script src="jsCore/m.js?version=2.400"></script>
  9. <script src="jsCore/more.js?version=2.400"></script>
  10.  
  11. <script type="text/javascript">
  12. // 强行加入参数，保证FF图片加载不失败
  13. var cssList = ['css/reset.css','css/ui.css','css/custom.css','css/skin.css','css/main.css','css/alarm.css','css/set.css','css/resize.css','css/playback.css','css/fn.css'];
  14.  
  15. for(var i = 0 ; i < cssList.length ; i ++){
  16.  
  17. var lt = "";
  18. //解决ie7 8下手动引入css加载不来的问题
  19. if(!(Browser.ie7 || Browser.ie8)){
  20. lt = "?"+location.href.split('?')[1];
  21. }
  22. var cssNode = document.createElement("link");
  23. cssNode.rel = 'stylesheet';
  24. cssNode.type = "text/css";
  25. cssNode.media = 'screen';
  26. cssNode.href = cssList[i]+lt;
  27.  
  28. document.head.appendChild(cssNode);
  29. }
  30. </script>
  31. </head>
  32. <body>
  33. <!--登录界面-->
  34. <div id="l" class="login">
  35. <div class="login-container">
  36. <div class="login-content">
  37. <div class="login-logo" id="index_logo"></div>
  38. <div class="login-inputbox fn-clear" id="login_style">
  39. <form>
  40. <div class="login-input-item">
  41. <label id="t_username" class="login-input-title">Username:</label>
  42. <input type="text" id="username" class="ui-input fn-width163"/>
  43. </div>
  44. <div class="login-input-item">
  45. <label class="login-input-title" id="t_pwd">Password:</label>
  46. <input id="password" type="password" class="ui-input fn-width163"/>
  47. </div>
  48. <div class="login-input-item" id="userType" style="display:;">
  49. <label class="login-input-title" id="t_UserType">User Type:</label>
  50. <select class="fn-width169" id="slct_userType">
  51. <option value="0">Local User</option>
  52. <option value="1">AD User</option>
  53. <option value="2">LDAP User</option>
  54. </select>
  55. </div>
  56. <div class="ui-button-box login-btnbox">
  57. <a id="b_login" class="ui-button fn-width80" href="javascript:;">Login</a>
  58. <a id="b_cancel_l" class="ui-button fn-width80" href="javascript:;">Cancel</a>
  59. </div>
  60. </form>
  61. </div>
  62. </div>
  63. </div>
  64. </div>
  65. <!--此处各页面-->
  66. <div id="m" class="main-container">
  67. <div class="main-head" id="nav_head">
  68. <div class="main-logo" id="sub_logo"></div>
  69. <ul class="main-nav" id="nav">
  70. <li id="b_a">
  71. <a id="b_preview" href="javascript:;" data-pagename="Preview" class="main-nav-item">Live</a>
  72. </li>
  73. <li id="b_b" style="display:none;">
  74. <a id="b_ptzctrl" href="javascript:;" data-pagename="PTZ" class="main-nav-item">PTZ</a>
  75. </li>
  76. <li id="b_ab" style="display:none;">
  77. <a id="b_playback" href="javascript:;" data-pagename="PlayBack" class="main-nav-item">Playback</a>
  78. </li>
  79. <li id="b_c">
  80. <a id="b_config" href="javascript:;" data-pagename="Setup" class="main-nav-item">Setup</a>
  81. </li>
  82. <li id="b_d" class="fn-relative">
  83. <a id="b_alarm" href="javascript:;" data-pagename="Alarm" class="main-nav-item">Alarm</a>
  84. <div class="main-nav-alarm" id="d_alarmtip" style="display:none;"></div>
  85. </li>
  86. <li id="b_e">
  87. <a id="b_quit" href="javascript:;" class="main-nav-item">Logout</a>
  88. </li>
  89. </ul>
  90. </div>
  91. <div class="main-content">
  92. <div id="mb0" class="main-content-box" style="display:none;"></div>
  93. <!-- 预览和回放页面 -->
  94. <div id="mb" class="main-content-box">
  95. <div class="main-content-boxcon">
  96. <div class="main-top">
  97. <!-- 主辅码流和头部ICONS -->
  98. <div id="button_bar" class="main-top-iconbar">
  99. <a id="b_Stream1" class="ui-button fn-left" href="javascript:;" onclick="connectMain()">Main Stream</a>
  100. <a id="b_Stream2" class="ui-button fn-left" href="javascript:;" onclick="connectExtra()">Sub Stream</a>
  101. <a id="b_Stream3" class="ui-button fn-left" href="javascript:;" onclick="connectExtra2()" style="display:none;">Sub Stream 2</a>
  102. <a id="b_Stream4" class="ui-button fn-left" href="javascript:;" onclick="connectExtra3()" style="display:none;">辅码流3</a>
  103. <a href="javascript:;" class="fn-left" style="display:none;" id="chkExtraBtn"></a>
  104. <div id="sp_stream" class="fn-left">
  105. <span id="w_streamprol">Protocol</span>
  106. <select class="fn-width100" id="s_logintype" onchange="setTimeout('onVideoStreamProtocolChange()', 0)">
  107. <option value="0">TCP</option>
  108. <option value="4">UDP</option>
  109. <option id="o_muticast" value="3">Multicast</option>
  110. </select>
  111. </div>
  112. <a id="b_help" class="main-top-icon-help" href="javascript:;" hidefocus="true" onclick="showHelpDoc('preview.htm')" title="Help"></a>
  113. <a id="b_talk" class="main-top-icon-speak" href="javascript:;" onclick="startTalk()" hidefocus="true" title="Talk"></a>
  114. <a id="b_voiceDouble" class="main-top-icon-doubleVoice2" href="javascript:;" title="Audio" onclick="turnOnVoiceDouble()" style="display:none;" hidefocus="true"></a>
  115. <a id="b_voice" class="main-top-icon-voice" href="javascript:;" onclick="turnOnVoice()" hidefocus="true" title="Audio"></a>
  116. <a id="b_locate" class="main-top-icon-locate" href="javascript:;" onclick="trackObject()" hidefocus="true" style="display:none;" title="Manual Track"></a>
  117. <a id="b_focus" class="main-top-icon-afocus" href="javascript:;" onclick="setfocus()" hidefocus="true" style="display:none;" title="Easy Focus"></a>
  118. <a id="b_record" class="main-top-icon-vedio" href="javascript:;" onclick="beginRecord()" hidefocus="true" title="Record"></a>
  119. <a id="b_3snap" class="main-top-icon-picturethree" href="javascript:;" hidefocus="true" title="Triple Snapshot"></a>
  120. <a id="b_snap" class="main-top-icon-picture" href="javascript:;" hidefocus="true" title="Snapshot"></a>
  121. <a id="b_range" class="main-top-icon-big" href="javascript:;" hidefocus="true" title="Digital Zoom"></a>
  122. <a id="b_almout0" class="main-top-icon-alarm" href="javascript:;" onclick="setAlarmOut(0)" hidefocus="true" title="Relay-out"></a>
  123. <a id="b_figure" style="display:none;" class="main-top-icon-figure" href="javascript:;" onclick="figureCtrl()" hidefocus="true" title="Gesture Control"></a>
  124. <a id="b_rocker" class="main-top-icon-rocker" onclick="turnOnRocker()" hidefocus="true" href="javascript:;"></a>
  125. <!--信息标注-->
  126. <div class="duckbackground" id="duck_wrap" style="display:;">
  127. <a id="b_duck_red" class="main-top-icon-icon-duck-red main-top-duckcheck" href="javascript:;" onclick="onDuckColorClick(1)" hidefocus="true" title="Red"></a>
  128. <a id="b_duck_blue" class="main-top-icon-icon-duck-blue" href="javascript:;" onclick="onDuckColorClick(2)" hidefocus="true" title="Blue"></a>
  129. <a id="b_duck_green" class="main-top-icon-icon-duck-green" href="javascript:;" onclick="onDuckColorClick(3)" hidefocus="true" title="Green"></a>
  130. </div>
  131. <a id="b_duckdrawn" style="display:none;" class="main-top-duck-draw" href="javascript:;" onclick="onDuckDrawnClick()" hidefocus="true"></a>
  132. <a id="b_duck" style="display:none;" class="main-top-icon-icon-duck" href="javascript:;" onclick="onDuckClick()" hidefocus="true" title="Remark"></a>
  133. <a id="b_reginFocus" class="main-top-icon-reginFoucs fn-hide" href="javascript:;" onclick="reginFocus(this)" hidefocus="true" title="Regional Focus"></a>
  134. </div>
  135. <!--此处是PTZ帮助按钮-->
  136. <div id="helpDIV" style="display:none;">
  137. <a id="ptz_help" class="main-top-icon-help" href="javascript:;" hidefocus="true" onclick="showHelpDoc('ptz')" title="Help"></a>
  138. <a id="playback_help" class="main-top-icon-help" href="javascript:;" hidefocus="true" onclick="showHelpDoc('playback')" title="Help"></a>
  139. <a id="playback_snap" class="main-top-icon-picture playback-not-for-jpg" href="javascript:;" hidefocus="true" title="Snapshot"></a>
  140. <a id="playback_zoom" class="main-top-icon-big playback-not-for-jpg" href="javascript:;" hidefocus="true" title="Digital Zoom"></a>
  141. </div>
  142. </div>
  143. <!--预览&&云台内容-->
  144. <div class="main-bottom" id="videoH">
  145. <div id="videoCon" class="fn-relative">
  146. <div class="main-video-container playback-video-container" id="main_videobox">
  147. <div id="video1" class="main-video"></div>
  148. <div class="ui-video-bar" id="videobar">
  149. <div class="ui-video-iconbar">
  150. <a id="video_image_adjust" href="javascript:;" class="ui-video-icon" title="Image Adjustment"> <i class="ui-video-icon-image"></i>
  151. </a>
  152. </div>
  153. <div class="ui-video-iconbar">
  154. <a id="video_WH_origianl_size" href="javascript:;" class="ui-video-icon" title="Original Size"> <i class="ui-video-icon-per"></i>
  155. </a>
  156. </div>
  157. <div class="ui-video-iconbar">
  158. <a id="video_fullscreen" href="javascript:;" class="ui-video-icon" title="Full Screen">
  159. <i class="ui-video-icon-full"></i>
  160. </a>
  161. </div>
  162. <div class="ui-video-iconbar" id="video_WH_con">
  163. <a id="video_WH" href="javascript:;" class="ui-video-icon" title="W:H">
  164. <i class="ui-video-icon-wh"></i>
  165. </a>
  166. <div id="video_WH_wrap" class="ui-video-wrap" style="display:none;">
  167. <a id="video_WH_original_rate" class="ui-video-wrap-item">
  168. <i class="ui-video-wrap-icon"></i>
  169. <label id="video_WH_original_rate_label">Original</label>
  170. </a>
  171. <a id="video_WH_adaptive_window" class="ui-video-wrap-item ui-video-wrap-current">
  172. <i class="ui-video-wrap-icon"></i>
  173. <label id="video_WH_adaptive_window_label">Adaptive</label>
  174. </a>
  175. </div>
  176. </div>
  177. <div class="ui-video-iconbar">
  178. <a id="video_quality" href="javascript:;" class="ui-video-icon" title="Fluency">
  179. <i class="ui-video-icon-quality"></i>
  180. </a>
  181. <div id="video_quality_wrap" class="ui-video-wrap" style="display:none;">
  182. <a id="video_quality_realtime" data-level="5" class="ui-video-wrap-item">
  183. <i class="ui-video-wrap-icon"></i>
  184. <label id="video_quality_realtime_label">Realtime</label>
  185. </a>
  186. <a id="video_quality_normal" data-level="4" class="ui-video-wrap-item ui-video-wrap-current">
  187. <i class="ui-video-wrap-icon"></i>
  188. <label id="video_quality_normal_label">Normal</label>
  189. </a>
  190. <a id="video_quality_fluency" data-level="1" class="ui-video-wrap-item">
  191. <i class="ui-video-wrap-icon"></i>
  192. <label id="video_quality_fluency_label">Fluency</label>
  193. </a>
  194. </div>
  195. </div>
  196. <div class="ui-video-iconbar">
  197. <a id="video_ptz" href="javascript:;" class="ui-video-icon" title="PTZ">
  198. <i class="ui-video-icon-ptz"></i>
  199. </a>
  200. </div>
  201. <div class="ui-video-iconbar">
  202. <a id="" href="javascript:;" class="ui-video-icon" style="display:none">
  203. <i class="ui-video-icon-eye"></i>
  204. </a>
  205. </div>
  206. <div class="ui-video-iconbar">
  207. <a id="video_focus_adjust" href="javascript:;" class="ui-video-icon" style="display:" title="Zoom and Focus">
  208. <i class="ui-video-icon-adjust"></i>
  209. </a>
  210. </div>
  211. <div class="ui-video-iconbar">
  212. <a id="" href="javascript:;" class="ui-video-icon" style="display:none">
  213. <i class="ui-video-icon-hc"></i>
  214. </a>
  215. </div>
  216. </div>
  217. </div>
  218. <div id="video_control_bar" class="main-right-container">
  219. <!--云台调节-->
  220. <div id="ptz_control" class="main-ptz fn-clear" style="display:none;">
  221. <div id="pev_cot" class="main-ptz-container">
  222. <div class="main-ptz-top fn-border-radius">
  223. <ul id="dir_control_nav" class="main-ptz-advance-nav fn-border-top-radius fn-marb10">
  224. <li id="p_visualPtz" class="fn-border-top-radius main-ptz-advance-nav-current" data-tab-nav="vPtz">PTZ Control</li>
  225. <li id="p_visualRock" class="fn-border-top-radius " data-tab-nav="vRock">Joystick</li>
  226. </ul>
  227. <div id="yt" class="ui-ptz-iconbox fn-padt10" data-tab-content="vPtz">
  228. <a id="yt1" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="LeftUp">
  229. <i class="ui-ptz-icon-leftup"></i>
  230. </a>
  231. <a id="yt2" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="Up">
  232. <i class="ui-ptz-icon-up"></i>
  233. </a>
  234. <a id="yt3" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="RightUp">
  235. <i class="ui-ptz-icon-rightup"></i>
  236. </a>
  237. <a id="yt4" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="Left">
  238. <i class="ui-ptz-icon-left"></i>
  239. </a>
  240. <a id="yt5" class="ui-ptz-specail-icon" href="javascript:;" title="Position">
  241. <i class="ui-ptz-icon-center"></i>
  242. </a>
  243. <a id="yt6" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="Right">
  244. <i class="ui-ptz-icon-right"></i>
  245. </a>
  246. <a id="yt7" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="LeftDown">
  247. <i class="ui-ptz-icon-leftdown"></i>
  248. </a>
  249. <a id="yt8" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="Down">
  250. <i class="ui-ptz-icon-down"></i>
  251. </a>
  252. <a id="yt9" class="ui-ptz-icon ptzControl" href="javascript:;" data-direction="RightDown">
  253. <i class="ui-ptz-icon-rightdown"></i>
  254. </a>
  255. </div>
  256. <div id="visualRock" class="fn-hide vR-wrap" data-tab-content="vRock">
  257. <div id="vR_area" class="vR-area">
  258. <div id="vR_contorl" class="vR-control"></div>
  259. </div>
  260. </div>
  261. <div id="bc" class="main-ptz-step" data-tab-content="vPtz">
  262. <span id="t_bc">Speed(1-8):</span>
  263. <select id="ps" class="fn-width40">
  264. <option value="1">1</option>
  265. <option value="2">2</option>
  266. <option value="3">3</option>
  267. <option value="4">4</option>
  268. <option value="5" selected="">5</option>
  269. <option value="6">6</option>
  270. <option value="7">7</option>
  271. <option value="8">8</option>
  272. </select>
  273. </div>
  274. <div id="tiaojie" class="main-ptz-adjust">
  275. <div id="ptz_bb_wrap" class="ui-ptz-adjust-item fn-clear">
  276. <a id="b_bb2" class="ui-ptz-icon" href="javascript:;" data-direction="ZoomWide">
  277. <i class="ui-ptz-icon-less"></i>
  278. </a>
  279. <label id="t_bb" class="ui-ptz-adjust-text">Zoom</label>
  280. <a id="b_bb1" class="ui-ptz-icon" href="javascript:;" data-direction="ZoomTele">
  281. <i class="ui-ptz-icon-more"></i>
  282. </a>
  283. </div>
  284. <div id="ptz_bj_wrap" class="ui-ptz-adjust-item fn-clear">
  285. <a id="b_bj2" class="ui-ptz-icon" href="javascript:;" data-direction="FocusFar">
  286. <i class="ui-ptz-icon-less"></i>
  287. </a>
  288. <label id="t_bj" class="ui-ptz-adjust-text">Focus</label>
  289. <a id="b_bj1" class="ui-ptz-icon" href="javascript:;" data-direction="FocusNear">
  290. <i class="ui-ptz-icon-more"></i>
  291. </a>
  292. </div>
  293. <div id="ptz_gq_wrap" class="ui-ptz-adjust-item fn-clear">
  294. <a id="b_gq2" class="ui-ptz-icon" href="javascript:;" data-direction="IrisSmall">
  295. <i class="ui-ptz-icon-less"></i>
  296. </a>
  297. <label id="t_gq" class="ui-ptz-adjust-text">Iris</label>
  298. <a id="b_gq1" class="ui-ptz-icon" href="javascript:;" data-direction="IrisLarge">
  299. <i class="ui-ptz-icon-more"></i>
  300. </a>
  301. </div>
  302. </div>
  303.  
  304. <div class="fn-clear "></div>
  305. </div>
  306.  
  307. <!--2.2的PTZ高级设置-->
  308. <div id="ytzcfg" class="main-ptz-advance fn-border-radius">
  309. <ul class="main-ptz-advance-nav fn-border-top-radius">
  310. <li id="p_ptzset" class="fn-border-top-radius main-ptz-advance-nav-current">PTZ Settings</li>
  311. <li id="p_ptzmenu" class="fn-border-top-radius">Menu</li>
  312. </ul>
  313. <!--此处开始是云台设置内容-->
  314. <div id="cfgPTZ" class="main-ptz-advance-container">
  315. <div id="ytszSelect_wrap">
  316. <select id="ytszSelect" class="fn-width140" onchange="changePtzSetup(this.value)">
  317. <option value="xxsmCon" selected="">Scan</option>
  318. <option value="yzdCon">Scan</option>
  319. <option value="xhzCon">Tour</option>
  320. <option value="xjCon">Pattern</option>
  321. <option value="fzCon">Assistant</option>
  322. <option value="dgCon">Light Wiper</option>
  323. </select>
  324. </div>
  325. <div id="xxsmCon" style="display:block;">
  326. <div class="main-ptz-advance-item">
  327. <input type="text" id="i_xs" class="ui-input fn-width136" style="display:none;"/>
  328. <div class="ui-button-box">
  329. <a href="javascript:;" id="b_xxsm1" class="ui-button-special fn-width68">
  330. <i class="ui-button-icon-start">&nbsp;</i>
  331. <label id="b_xxsm1_label">Start</label>
  332. </a>
  333. <a href="javascript:;" id="b_xxsm2" class="ui-button-special fn-width68">
  334. <i class="ui-button-icon-stop">&nbsp;</i>
  335. <label id="b_xxsm2_label">Stop</label>
  336. </a>
  337. <a href="javascript:;" id="b_xsset" class="ui-button-special fn-width68" style="display:;">
  338. <i class="ui-button-icon-set">&nbsp;</i>
  339. <label id="b_xsset_label">Set</label>
  340. </a>
  341. </div>
  342. </div>
  343. <div class="ui-button-box main-ptz-advance-subitem" style="display:none;" id="d_ptzset0">
  344. <a href="javascript:;" id="b_setleft" class="ui-button fn-width68">Set Left Limit</a>
  345. <a href="javascript:;" id="b_setright" class="ui-button fn-width68">Set Right Limit</a>
  346. </div>
  347. </div>
  348. <div id="yzdCon" style="display:none;">
  349. <div class="main-ptz-advance-item">
  350. <input type="text" id="i_yzd" class="ui-input fn-width80"/>
  351. <span id="title_minPreset">1</span>
  352. <span>~</span>
  353. <span id="title_maxPreset">255</span>
  354. <div class="ui-button-box ptz-button-group">
  355. <a href="javascript:;" id="b_yzd1" class="ui-button-special fn-width139">
  356. <i class="ui-button-icon-view">&nbsp;</i>
  357. <label id="b_yzd1_label">Go to</label>
  358. </a>
  359. <a href="javascript:;" id="b_yzdset" class="ui-button-special fn-width139" style="display:none">
  360. <i class="ui-button-icon-set">&nbsp;</i>
  361. <label id="b_yzdset_label">Set Preset</label>
  362. </a>
  363. <a href="javascript:;" id="b_addyzd" class="ui-button-special fn-width68">
  364. <i class="ui-button-icon-add">&nbsp;</i>
  365. <label id="b_addyzd_label">Add</label>
  366. </a>
  367. <a href="javascript:;" id="b_delyzd" class="ui-button-special fn-width68">
  368. <i class="ui-button-icon-del">&nbsp;</i>
  369. <label id="b_delyzd_label">Del</label>
  370. </a>
  371. </div>
  372. </div>
  373. </div>
  374. <div id="xhzCon" style="display:none">
  375. <div class="main-ptz-advance-item">
  376. <input type="text" id="i_xhz" class="ui-input fn-width80"/>
  377. <span id="title_TourMin" class="main-ptz-advance-item-tip">1</span>
  378. <span class="main-ptz-advance-item-tip">~</span>
  379. <span id="title_TourMax" class="main-ptz-advance-item-tip">255</span>
  380. <div class="ui-button-box ptz-button-group">
  381. <a href="javascript:;" id="b_xhz1" class="ui-button-special fn-width68">
  382. <i class="ui-button-icon-start">&nbsp;</i>
  383. <label id="b_xhz1_label">Start</label>
  384. </a>
  385. <a href="javascript:;" id="b_xhz2" class="ui-button-special fn-width68">
  386. <i class="ui-button-icon-stop">&nbsp;</i>
  387. <label id="b_xhz2_label">Stop</label>
  388. </a>
  389. <a href="javascript:;" id="b_xhset" class="ui-button-special fn-width68">
  390. <i class="ui-button-icon-add">&nbsp;</i>
  391. <label id="b_xhset_label">Add</label>
  392. </a>
  393. <a href="javascript:;" id="b_delxhz" class="ui-button-special fn-width68">
  394. <i class="ui-button-icon-del">&nbsp;</i>
  395. <label id="b_delxhz_label">Del</label>
  396. </a>
  397. </div>
  398. </div>
  399. <div style="display:none;" id="d_ptzset2">
  400. <input type="text" id="i_pnt" class="ui-input fn-width80"/>
  401. <span class="ui-text" id="title_minPnt">0</span>
  402. <span class="ui-text">~</span>
  403. <span class="ui-text" id="title_maxPnt">255</span>
  404. <div class="ui-button-box main-ptz-advance-item">
  405. <a href="javascript:;" id="b_addpnt" class="ui-button fn-width68">Add Preset</a>
  406. <a href="javascript:;" id="b_delpnt" class="ui-button fn-width68">Del Preset</a>
  407. </div>
  408. </div>
  409. </div>
  410. <div id="xjCon" class="main-ptz-advance-item ptz-button-group" style="display:none;">
  411. <input type="text" id="i_xj" class="ui-input fn-width80"/>
  412. <span id="title_PatternMin">1</span>
  413. <span>~</span>
  414. <span id="title_PatternMax">255</span>
  415. <div class="ui-button-box ptz-button-group">
  416. <a href="javascript:;" id="b_xj1" class="ui-button-special fn-width68">
  417. <i class="ui-button-icon-start">&nbsp;</i>
  418. <label id="b_xj1_label">Start</label>
  419. </a>
  420. <a href="javascript:;" id="b_xj2" class="ui-button-special fn-width68">
  421. <i class="ui-button-icon-stop">&nbsp;</i>
  422. <label id="b_xj2_label">Stop</label>
  423. </a>
  424. <a href="javascript:;" id="b_xjset" class="ui-button-special fn-width68">
  425. <i class="ui-button-icon-add">&nbsp;</i>
  426. <label id="b_xjset_label">Add</label>
  427. </a>
  428. <a href="javascript:;" id="b_delxj" class="ui-button-special fn-width68">
  429. <i class="ui-button-icon-del">&nbsp;</i>
  430. <label id="b_delxj_label">Del</label>
  431. </a>
  432. </div>
  433. <div class="ui-button-box fn-mart0" style="display:none;" id="d_ptzset3">
  434. <p>
  435. <a href="javascript:;" id="b_startjl" class="ui-button fn-width68">Start Rec</a>
  436. <a href="javascript:;" id="b_stopjl" class="ui-button fn-width68">Stop Rec</a>
  437. </p>
  438. </div>
  439. </div>
  440. <div id="fzCon" style="display:;">
  441. <div class="main-ptz-advance-item">
  442. <input type="text" id="i_fzz" class="ui-input fn-width80"/>
  443. <span id="title_AuxMin">1</span>
  444. <span>~</span>
  445. <span id="title_AuxMax">255</span>
  446. <div class="ui-button-box ptz-button-group">
  447. <a href="javascript:;" id="b_fzk1" class="ui-button fn-width68">Aux On</a>
  448. <a href="javascript:;" id="b_fzk2" class="ui-button fn-width68">Aux Off</a>
  449. <a href="javascript:;" id="b_fzset" class="ui-button fn-width68" style="display:none;">辅助设置</a>
  450. </div>
  451. </div>
  452. <div class="main-ptz-advance-item" style="display:none;" id="d_ptzset4">
  453. <p class="main-ptz-advance-item-aid">
  454. <input type="checkbox"/>
  455. 背光补偿
  456. </p>
  457. <p class="main-ptz-advance-item-aid">
  458. <input type="checkbox"/>
  459. 夜视功能
  460. </p>
  461. <p class="main-ptz-advance-item-aid">
  462. <input type="checkbox"/>
  463. 数字变倍
  464. </p>
  465. <p class="main-ptz-advance-item-aid">
  466. <input type="checkbox"/>
  467. 摄像机亮度
  468. </p>
  469. <p class="main-ptz-advance-item-aid">
  470. <input type="checkbox"/>
  471. 翻转
  472. </p>
  473. </div>
  474. </div>
  475. <div id="dgCon" style="display:none;">
  476. <div class="ui-button-box main-ptz-advance-item">
  477. <a href="javascript:;" id="b_lighton" class="ui-button fn-width68">Enable</a>
  478. <a href="javascript:;" id="b_lightoff" class="ui-button fn-width68">Disable</a>
  479. </div>
  480. </div>
  481. <div id="AutoPanCon" style="display:none;">
  482. <div class="ui-button-box main-ptz-advance-item">
  483. <a href="javascript:;" id="btn_AutoPanOn" class="ui-button-special fn-width68">
  484. <i class="ui-button-icon-start">&nbsp;</i>
  485. <label id="btn_AutoPanOn_label">Start</label>
  486. </a>
  487. <a href="javascript:;" id="btn_AutoPanOff" class="ui-button-special fn-width68">
  488. <i class="ui-button-icon-stop">&nbsp;</i>
  489. <label id="btn_AutoPanOff_label">Stop</label>
  490. </a>
  491. </div>
  492. </div>
  493. <div id="positionCon" style="display:none;">
  494. <div class="main-ptz-advance-item">
  495. <p>
  496. <span class="fn-lineh24" id="title_xValue">Horizontal Angle</span>(<span id="title_xValueMin">0</span>~<span id="title_xValueMax">3600</span>)
  497. </p>
  498. <input type="text" id="input_xValue" class="ui-input fn-width136"/>
  499. <p class="fn-clear">
  500. <span class="fn-lineh24" id="title_yValue">Vertical Angle</span>(<span id="title_yValueMin">0</span>~<span id="title_yValueMax">900</span>)
  501. </p>
  502. <input type="text" id="input_yValue" class="ui-input fn-width136"/>
  503. <p class="fn-clear">
  504. <span class="fn-lineh24" id="title_doubleValue">Zoom</span>(1~128)
  505. </p>
  506. <input type="text" id="input_doubleValue" class="ui-input fn-width136" value="1"/>
  507. <a href="javascript:;" id="btn_position" class="ui-button fn-width68">Go to</a>
  508. </div>
  509. </div>
  510. <div id="zbShow" style="display:none;">
  511. <div class="main-ptz-advance-item">
  512. <p>
  513. <span class="fn-lineh24" trans-id="title_xValue">Horizontal Angle</span>
  514. </p>
  515. <input type="text" id="show_azimuth_x" trans-id="input_xValue" class="ui-input-disabled fn-width136" value="0" disabled="disabled"/>
  516. <p class="fn-clear">
  517. <span class="fn-lineh24" trans-id="title_yValue">Vertical Angle</span>
  518. </p>
  519. <input type="text" id="show_azimuth_y" trans-id="input_yValue" class="ui-input-disabled fn-width136" value="0" disabled="disabled"/>
  520. <p class="fn-clear fn-hide">
  521. <span class="fn-lineh24" trans-id="title_doubleValue">Zoom</span>
  522. </p>
  523. <input type="text" trans-id="input_doubleValue" class="fn-hide ui-input-disabled fn-width136" value="1" disabled="disabled"/>
  524. <a href="javascript:;" id="btn_show_position" class="ui-button fn-width68">Show Azimuth</a>
  525. </div>
  526. </div>
  527. </div>
  528. <!--此处开始是菜单内容球机-->
  529. <!--此处是IPC球机-->
  530. <div style="display:none;">
  531. <div class="ui-boat" id="boatX">
  532. <div class="ui-boat-current" id="boat_current">
  533. <div id="boat1" class="ui-boat-box-up" onmouseover="changeBg('up')" onmouseout="moveBg('up')"></div>
  534. <div id="boat2" class="ui-boat-box-left" onmouseover="changeBg('left')" onmouseout="moveBg('left')"></div>
  535. <div id="boat3" class="ui-boat-box-center"></div>
  536. <div id="boat4" class="ui-boat-box-right" onmouseover="changeBg('right')" onmouseout="moveBg('right')"></div>
  537. <div id="boat5" class="ui-boat-box-down" onmouseover="changeBg('down')" onmouseout="moveBg('down')"></div>
  538. </div>
  539. </div>
  540. <div class="main-ptz-advance-item ui-button-box">
  541. <a href="javascript:;" id="" class="ui-button fn-width45">打开</a>
  542. <a href="javascript:;" id="" class="ui-button fn-width45">关闭</a>
  543. <a href="javascript:;" id="b_enter" class="ui-button fn-width45">Ok</a>
  544. </div>
  545. </div>
  546. <!--此处是智能球球机-->
  547. <div id="menuPTZ" style="display:none;">
  548. <div class="ui-boat-intel">
  549. <div class="ui-boat-intel-current" id="boat_intellent_current">
  550. <div id="boat1x" class="ui-boat-intel-box-up" onmouseover="changeBg('up')" onmouseout="moveBg('up')"></div>
  551. <div id="boat2x" class="ui-boat-intel-box-left" onmouseover="changeBg('left')" onmouseout="moveBg('left')"></div>
  552. <div id="boat3x" class="ui-boat-intel-box-center" onmouseover="changeBg('center')" onmouseout="moveBg('center')">
  553. <span>OK</span>
  554. </div>
  555. <div id="boat4x" class="ui-boat-intel-box-right" onmouseover="changeBg('right')" onmouseout="moveBg('right')"></div>
  556. <div id="boat5x" class="ui-boat-intel-box-down" onmouseover="changeBg('down')" onmouseout="moveBg('down')"></div>
  557. </div>
  558. </div>
  559. <div class="main-ptz-advance-item ui-button-box">
  560. <a href="javascript:;" id="b_ctrlmenu" class="ui-button fn-width68 fn-marl2 fn-marr4">Open</a>
  561. <a href="javascript:;" id="b_ctrlmenu1" class="ui-button fn-width68 fn-marr0">Close</a>
  562. </div>
  563. </div>
  564. </div>
  565. </div>
  566. </div>
  567. <!--图像调节-->
  568. <div id="image_adjust" class="main-img fn-clear">
  569. <div id="tx" class="main-img-title fn-border-top-radius fn-linear">
  570. <span id="b_txtj">Image Adjustment</span>
  571. </div>
  572. <div id="tj" class="main-img-container fn-border-bottom-radius">
  573. <div class="ui-form-item">
  574. <div class="ui-slider fn-left">
  575. <span class="ui-slider-icon-light" id="img_ld" title="Brightness"></span>
  576. <a class="ui-slider-less" href="javascript:;" id="sk1_less"></a>
  577. <div id="sa1" class="ui-slider-container fn-width60">
  578. <div id="sk1" class="ui-slider-sax"></div>
  579. </div>
  580. <a class="ui-slider-more" href="javascript:;" id="sk1_add"></a>
  581. <span class="ui-slider-text " id="t_sld1">50</span>
  582. </div>
  583. </div>
  584. <div class="ui-form-item">
  585. <div class="ui-slider fn-left">
  586. <span class="ui-slider-icon-contrast" id="img_db" title="Contrast"></span>
  587. <a class="ui-slider-less" href="javascript:;" id="sk2_less"></a>
  588. <div id="sa2" class="ui-slider-container fn-width60">
  589. <div id="sk2" class="ui-slider-sax"></div>
  590. </div>
  591. <a class="ui-slider-more" href="javascript:;" id="sk2_add"></a>
  592. <span class="ui-slider-text " id="t_sld2">50</span>
  593. </div>
  594. </div>
  595. <div class="ui-form-item">
  596. <div class="ui-slider fn-left">
  597. <span class="ui-slider-icon-chroma" id="img_tm" title="Hue"></span>
  598. <a class="ui-slider-less" href="javascript:;" id="sk3_less"></a>
  599. <div id="sa3" class="ui-slider-container fn-width60">
  600. <div id="sk3" class="ui-slider-sax"></div>
  601. </div>
  602. <a class="ui-slider-more" href="javascript:;" id="sk3_add"></a>
  603. <span class="ui-slider-text " id="t_sld3">50</span>
  604. </div>
  605. </div>
  606. <div class="ui-form-item">
  607. <div class="ui-slider fn-left">
  608. <span class="ui-slider-icon-saturation" id="img_sc" title="Saturation"></span>
  609. <a class="ui-slider-less" href="javascript:;" id="sk4_less"></a>
  610. <div id="sa4" class="ui-slider-container fn-width60">
  611. <div id="sk4" class="ui-slider-sax"></div>
  612. </div>
  613. <a class="ui-slider-more" href="javascript:;" id="sk4_add"></a>
  614. <span class="ui-slider-text " id="t_sld4">50</span>
  615. </div>
  616. </div>
  617. <div id="cz" class="main-img-buttonbox">
  618. <a id="b_reset" class="ui-button fn-width68" href="javascript:;">Reset</a>
  619. </div>
  620. </div>
  621. </div>
  622. <!--聚焦缩放-->
  623. <div id="focus_adjust" class="main-focus fn-clear">
  624. <div class="main-focus-title fn-border-top-radius fn-linear">
  625. <span id="t_zoomFocus">Zoom and Focus</span>
  626. </div>
  627. <div class="main-focus-container fn-border-bottom-radius">
  628. <div class="main-focus-item fn-clear">
  629. <span id="t_zoom" class="fn-left fn-lineh20">Zoom</span>
  630. <div class="fn-right">
  631. <label id="t_step1">Speed</label>
  632. <select class="fn-width60" id="g_zoomStep">
  633. <option value="1">1</option>
  634. <option value="5">5</option>
  635. <option value="20">20</option>
  636. <option value="100">100</option>
  637. </select>
  638. </div>
  639. </div>
  640. <div class="main-focus-item fn-clear">
  641. <a class="ui-slider-less" href="javascript:;" id="zoomLess"></a>
  642. <div id="zoomL" class="ui-slider-container">
  643. <div id="zoomS" class="ui-slider-sax"></div>
  644. </div>
  645. <a class="ui-slider-more" href="javascript:;" id="zoomMore"></a>
  646. </div>
  647. <div class="main-focus-text fn-clear">
  648. <span id="t_wide" class="fn-left">WIDE</span>
  649. <span id="t_tele" class="fn-right">TELE</span>
  650. </div>
  651. <div id="main-focus-setting" class="main-focus-item fn-clear">
  652. <span id="t_focus" class="fn-left fn-lineh20">Focus</span>
  653. <div class="fn-right">
  654. <label id="t_step2">Speed</label>
  655. <select class="fn-width60" id="g_focusStep">
  656. <option value="1">1</option>
  657. <option value="5">5</option>
  658. <option value="20">20</option>
  659. <option value="100">100</option>
  660. </select>
  661. </div>
  662. </div>
  663. <div id="main-focus-silder" class="main-focus-item fn-clear">
  664. <a class="ui-slider-less" href="javascript:;" id="focusLess"></a>
  665. <div id="focusL" class="ui-slider-container">
  666. <div id="focusS" class="ui-slider-sax"></div>
  667. </div>
  668. <a class="ui-slider-more" href="javascript:;" id="focusMore"></a>
  669. </div>
  670. <div id="main-focus-text" class="main-focus-text fn-clear">
  671. <span id="t_near" class="fn-left">NEAR</span>
  672. <span id="t_far" class="fn-right">FAR</span>
  673. </div>
  674. <div id="prev_autoFocus" class="fn-marl20 fn-marb5">
  675. <a href="javascript:;" id="autoFocus" class="ui-button-special">
  676. <i class="ui-button-icon-fouse">&nbsp;</i>
  677. <label id="t_autoFocus">Auto Focus</label>
  678. </a>
  679. </div>
  680. <div class="fn-marb5 fn-marl20" style="display:none;">
  681. <a href="javascript:;" id="btn_AutoPanOff" class="ui-button">
  682. <i class="ui-button-icon-stop">&nbsp;</i>
  683. <label id="t_autoFocus">Auto Focus</label>
  684. </a>
  685. </div>
  686. <div class="fn-marb5 fn-marl20">
  687. <a href="javascript:;" id="restoryAll" class="ui-button">Restore All</a>
  688. </div>
  689. <div class="fn-marb5 fn-marl20">
  690. <a href="javascript:;" id="restartAll" class="ui-button">Refresh</a>
  691. </div>
  692. </div>
  693. </div>
  694. <!--回放-->
  695. <div id="playback_left_bar" class="playback-right fn-relative" style="display:none;">
  696. <!--此处开始Page1-->
  697. <div class="playback-right-container fn-border-radius">
  698. <!--此处开始Page1-->
  699. <div id="page_calendarsearch">
  700. <div class="ui-form-item fn-clear fn-padt10">
  701. <label class="ui-label fn-width60 fn-padr10 fn-padl10" id="span_filetypeselect">File Type</label>
  702. <select class="ui-select fn-width120" name="filetype" id="filetypeselect"></select>
  703. </div>
  704. <div class="ui-form-item fn-clear">
  705. <label class="ui-label fn-width60 fn-padr10 fn-padl10" id="span_filesrcselect">Data Src</label>
  706. <select class="ui-select fn-width120" name="filesrc" id="filesrcselect"></select>
  707. </div>
  708. <div class="ui-special-calendar fn-clear" id="div_calendar">
  709. <!--日期选择-->
  710. <div class="ui-special-calendar-date" style="overflow:visible;">
  711. <select id="inputMonth" class="ui-select fn-width80 fn-mart0 fn-marr10">
  712. <option value="1">Jan</option>
  713. <option value="2">Feb</option>
  714. <option value="3">Mar</option>
  715. <option value="4">Apr</option>
  716. <option value="5">May</option>
  717. <option value="6">Jun</option>
  718. <option value="7">Jul</option>
  719. <option value="8">Aug</option>
  720. <option value="9">Sep</option>
  721. <option value="10">Oct</option>
  722. <option value="11">Nov</option>
  723. <option value="12">Dec</option>
  724. </select>
  725. <a href="javascript:;" class="ui-special-calendar-date-btn" id="reduceValue">
  726. <i class="ui-special-calendar-icon-last"></i>
  727. </a>
  728. <input type="text" class="ui-playback-input fn-width60" value="2013" id="inputYear"/>
  729. <a href="javascript:;" class="ui-special-calendar-date-btn" id="increaseValue">
  730. <i class="ui-special-calendar-icon-next"></i>
  731. </a>
  732. </div>
  733. <div class="ui-special-calendar-box fn-clear">
  734. <ul class="ui-special-calendar-title">
  735. <li id="li_7day">Sun</li>
  736. <li id="li_1day">Mon</li>
  737. <li id="li_2day">Tue</li>
  738. <li id="li_3day">Wed</li>
  739. <li id="li_4day">Thu</li>
  740. <li id="li_5day">Fri</li>
  741. <li id="li_6day">Sat</li>
  742. </ul>
  743. <ul class="ui-special-calendar-day">
  744. <li>
  745. <a href="javascript:;" id="day0">1</a>
  746. </li>
  747. <li>
  748. <a href="javascript:;" id="day1">1</a>
  749. </li>
  750. <li>
  751. <a href="javascript:;" id="day2">1</a>
  752. </li>
  753. <li>
  754. <a href="javascript:;" id="day3">1</a>
  755. </li>
  756. <li>
  757. <a href="javascript:;" id="day4">1</a>
  758. </li>
  759. <li>
  760. <a href="javascript:;" id="day5">1</a>
  761. </li>
  762. <li>
  763. <a href="javascript:;" id="day6">1</a>
  764. </li>
  765. </ul>
  766. <ul class="ui-special-calendar-day">
  767. <li>
  768. <a href="javascript:;" id="day7">2</a>
  769. </li>
  770. <li>
  771. <a href="javascript:;" id="day8">2</a>
  772. </li>
  773. <li>
  774. <a href="javascript:;" id="day9">2</a>
  775. </li>
  776. <li>
  777. <a href="javascript:;" id="day10">2</a>
  778. </li>
  779. <li>
  780. <a href="javascript:;" id="day11">2</a>
  781. </li>
  782. <li>
  783. <a href="javascript:;" id="day12">2</a>
  784. </li>
  785. <li>
  786. <a href="javascript:;" id="day13">2</a>
  787. </li>
  788. </ul>
  789. <ul class="ui-special-calendar-day">
  790. <li>
  791. <a href="javascript:;" id="day14">9</a>
  792. </li>
  793. <li>
  794. <a href="javascript:;" id="day15">10</a>
  795. </li>
  796. <li>
  797. <a href="javascript:;" id="day16">11</a>
  798. </li>
  799. <li>
  800. <a href="javascript:;" id="day17">12</a>
  801. </li>
  802. <li>
  803. <a href="javascript:;" id="day18">13</a>
  804. </li>
  805. <li>
  806. <a href="javascript:;" id="day19">14</a>
  807. </li>
  808. <li>
  809. <a href="javascript:;" id="day20">15</a>
  810. </li>
  811. </ul>
  812. <ul class="ui-special-calendar-day">
  813. <li>
  814. <a href="javascript:;" id="day21">16</a>
  815. </li>
  816. <li>
  817. <a href="javascript:;" id="day22">17</a>
  818. </li>
  819. <li>
  820. <a href="javascript:;" id="day23">18</a>
  821. </li>
  822. <li>
  823. <a href="javascript:;" id="day24">19</a>
  824. </li>
  825. <li>
  826. <a href="javascript:;" id="day25">20</a>
  827. </li>
  828. <li>
  829. <a href="javascript:;" id="day26">21</a>
  830. </li>
  831. <li>
  832. <a href="javascript:;" id="day27">22</a>
  833. </li>
  834. </ul>
  835. <ul class="ui-special-calendar-day">
  836. <li>
  837. <a href="javascript:;" id="day28">22</a>
  838. </li>
  839. <li>
  840. <a href="javascript:;" id="day29">23</a>
  841. </li>
  842. <li>
  843. <a href="javascript:;" id="day30">24</a>
  844. </li>
  845. <li>
  846. <a href="javascript:;" id="day31">25</a>
  847. </li>
  848. <li>
  849. <a href="javascript:;" id="day32">26</a>
  850. </li>
  851. <li>
  852. <a href="javascript:;" id="day33">27</a>
  853. </li>
  854. <li>
  855. <a href="javascript:;" id="day34">28</a>
  856. </li>
  857. </ul>
  858. <ul class="ui-special-calendar-day">
  859. <li>
  860. <a href="javascript:;" id="day35">29</a>
  861. </li>
  862. <li>
  863. <a href="javascript:;" id="day36">30</a>
  864. </li>
  865. <li>
  866. <a href="javascript:;" id="day37">29</a>
  867. </li>
  868. <li>
  869. <a href="javascript:;" id="day38">30</a>
  870. </li>
  871. <li>
  872. <a href="javascript:;" id="day39">29</a>
  873. </li>
  874. <li>
  875. <a href="javascript:;" id="day40">30</a>
  876. </li>
  877. <li>
  878. <a href="javascript:;" id="day41">30</a>
  879. </li>
  880. </ul>
  881. </div>
  882. </div>
  883. <div class="playback-tip" style="display:none;">
  884. <p class="playback-tip-color">
  885. <i class="playback-tip-color-selected"></i>
  886. <span class="ui-text" id="playBack_color2">Selected</span>
  887. </p>
  888. <p class="playback-tip-color">
  889. <i class="playback-tip-color-havevideo"></i>
  890. <span class="ui-text" id="playBack_color3">Have Video</span>
  891. </p>
  892. <p class="playback-tip-color fn-wid100p">
  893. <i class="playback-tip-color-both"></i>
  894. <span class="ui-text" id="playBack_color1">Selected And Have Video</span>
  895. </p>
  896. </div>
  897. </div>
  898. <!--此处开始Page2-->
  899. <div id="page_filelist" style="display:none;">
  900. <div class="ui-form-item fn-clear fn-padt10">
  901. <div class="ui-input-box palyback-starttime">
  902. <input type="text" maxlength="2" id="begintime0" class="fn-width20" value="00"/>
  903. <span>:</span>
  904. <input type="text" maxlength="2" id="begintime1" class="fn-width20" value="00"/>
  905. <span>:</span>
  906. <input type="text" maxlength="2" id="begintime2" class="fn-width20" value="00"/>
  907. <span>-</span>
  908. <input type="text" maxlength="2" id="endtime0" class="fn-width20" value="23"/>
  909. <span>:</span>
  910. <input type="text" maxlength="2" id="endtime1" class="fn-width20" value="59"/>
  911. <span>:</span>
  912. <input type="text" maxlength="2" id="endtime2" class="fn-width20" value="59"/>
  913. </div>
  914. <a href="javascript:;" class="playback-button" id="btnsearchfile">
  915. <i class="playback-button-icon-search"></i>
  916. </a>
  917. </div>
  918. <div class="ui-form-item fn-clear playback-not-for-jpg" id="playBack_mp4DownLoad" style="display:none;">
  919. <label class="ui-label-sub fn-padl5 fn-marr4" id="playBack_downloadFormat">Download Format</label>
  920. <div class="ui-checkbox fn-marr4">
  921. <input type="radio" id="playBack_vedioDav" name="vedioFormat" checked/>
  922. </div>
  923. <label class="ui-label-sub fn-minwid20 fn-marr4" for="playBack_vedioDav">dav</label>
  924. <div class="ui-checkbox fn-marr4">
  925. <input type="radio" id="playBack_vedioMP4" name="vedioFormat" checked/>
  926. </div>
  927. <label class="ui-label-sub fn-minwid20" for="playBack_vedioMP4">mp4</label>
  928. </div>
  929. <div class="playback-download" id="playBack_filelist">
  930. <div class="playback-dates-title" id="showfilelist_title"></div>
  931. <div class="playback-dates" id="playback_dates">
  932. <div class="playback-filelist" id="showfilelist" onselectstart="javascript:return false;" unselectable="on"></div>
  933. </div>
  934. <div class="ui-page playback-pageview fn-clear">
  935. <div class="ui-autobox">
  936. <div class="ui-autobox-content">
  937. <a class="ui-page-icon-first" id="beginPage" title="Home"></a>
  938. <a class="ui-page-icon-pre" id="prePage" title="PgUp"></a>
  939. <div class="ui-page-view">
  940. <span id="curPage">1</span>
  941. <span>/</span>
  942. <span id="totalPage">10</span>
  943. </div>
  944. <a class="ui-page-icon-next" id="nextPage" title="PgDn"></a>
  945. <a class="ui-page-icon-last" id="endPage" title="End"></a>
  946. <span class="ui-text" id="t_goto" style="display:none">Go To</span>
  947. <input type="text" class="ui-input ui-page-input" id="goPage"/>
  948. <a class="ui-page-icon-confirm" id="confirmPage" title="Go To"></a>
  949. </div>
  950. </div>
  951. </div>
  952. <div class="playback-detail fn-clear playback-not-for-jpg">
  953. <div class="ui-detail-item fn-clear">
  954. <span class="ui-text fn-width70" id="span_fileBeginTime">Begin Time:</span>
  955. <span class="ui-text" id="fileBeginTime"></span>
  956. </div>
  957. <div class="ui-detail-item fn-clear">
  958. <span class="ui-text fn-width70" id="span_fileEndTime">End Time:</span>
  959. <span class="ui-text" id="fileEndTime"></span>
  960. </div>
  961. <div class="ui-detail-item fn-clear">
  962. <span class="ui-text fn-width70" id="span_fileSize">File Size:</span>
  963. <span class="ui-text" id="fileSize"></span>
  964. </div>
  965. </div>
  966. </div>
  967. </div>
  968. <div class="ui-autobox playback-down-icons">
  969. <div class="ui-autobox-content ui-button-box fn-padt10">
  970. <a href="javascript:;" class="ui-button fn-width94" id="go_page_fileList">
  971. <i class="ui-button-playback-icon-list"></i>
  972. </a>
  973. <a href="javascript:;" class="ui-button fn-width94" id="go_page_calendarsearch" style="display:none;">
  974. <i class="ui-button-playback-icon-back"></i>
  975. </a>
  976. </div>
  977. </div>
  978. </div>
  979. </div>
  980. </div>
  981. <!--回放底部-->
  982. <div id="playback_bottom_bar" class="playback-bottom fn-relative" style="display:none;">
  983. <div class="playback-iconbar">
  984. <div class="playback-iconbox fn-relative">
  985. <div class="playback-iconbg"></div>
  986. <div class="playback-icons">
  987. <a class="play-bottom-iconbg" id="playControl">
  988. <i class="play-bottom-icon-play"></i>
  989. </a>
  990. <a class="play-bottom-iconbg" id="pauseControl" style="display:none;">
  991. <i class="play-bottom-icon-pause"></i>
  992. </a>
  993. <a class="play-bottom-iconbg playback-not-for-jpg" id="stopControl">
  994. <i class="play-bottom-icon-stop"></i>
  995. </a>
  996. <a class="play-bottom-iconbg playback-not-for-jpg" id="nextFrameControl">
  997. <i class="play-bottom-icon-next"></i>
  998. </a>
  999. <a class="play-bottom-iconbg playback-not-for-jpg" id="slowPlayControl">
  1000. <i class="play-bottom-icon-slow"></i>
  1001. </a>
  1002. <a class="play-bottom-iconbg playback-not-for-jpg" id="fastPlayControl">
  1003. <i class="play-bottom-icon-fast"></i>
  1004. </a>
  1005. <div class="ui-playback-slider" style="display:none">
  1006. <span class="ui-slider-text">16X</span>
  1007. <div class="ui-slider-container">
  1008. <div class="ui-slider-container-current"></div>
  1009. <a class="ui-playback-slider-sax"></a>
  1010. </div>
  1011. </div>
  1012. </div>
  1013. </div>
  1014. <div class="playback-iconbox fn-relative playback-not-for-jpg">
  1015. <div class="playback-iconbg"></div>
  1016. <div class="playback-icons">
  1017. <a class="play-bottom-iconbg" id="closeSoundControl">
  1018. <i class="play-bottom-icon-sound"></i>
  1019. </a>
  1020. <div class="ui-voice-slider" id="volumeBg">
  1021. <a class="ui-playback-slider-sax" id="setVolumeControl"></a>
  1022. </div>
  1023. </div>
  1024. </div>
  1025. <div class="playback-cut fn-right fn-relative playback-not-for-jpg">
  1026. <a id="playback_cut_time_region" href="javascript:;" class="playback-cut-begin-time fn-left"></a>
  1027. <div id="playback_cut_download_precent" class="playback-cut-download-precent"></div>
  1028. <div class="playback-cut-time fn-left fn-relative">
  1029. <div id="playback_cut_time_wrap">
  1030. <span id="playback_cut_begin_time_text" class="fn-marl20">00:00:00</span>
  1031. <span>-</span>
  1032. <span id="playback_cut_end_time_text">00:00:00</span>
  1033. </div>
  1034. <div id="playback_cut_status_wrap" style="text-align:center;">
  1035. <span id="playback_cut_status"></span>
  1036. </div>
  1037. </div>
  1038. <a id="playback_cut_down" href="javascript:;" class="playback-cut-download fn-left"></a>
  1039. </div>
  1040. </div>
  1041.  
  1042. <div class="playback-progress playback-not-for-jpg" id="div_gridBox">
  1043. <div id="div_timeTitle" class="playback-progress-title"></div>
  1044. <div id="div_showGrid" class="playback-progress-grid">
  1045. <div id="btn_dragSlider" class="playback-on-play"></div>
  1046. </div>
  1047. <div class="playback-time">
  1048. <div id="div_timeShow" style="display:none;" class="playback-timetip">12312312312</div>
  1049. </div>
  1050.  
  1051. </div>
  1052. <div class="playback-tipbar">
  1053. <span class="ui-text fn-color-white playback-not-for-jpg" id="li_Playstate">stop</span>
  1054. <div class="fn-left fn-padl100">
  1055. <label class="ui-label-sub fn-bold fn-color-white" id="li_recordType">Record Type:</label>
  1056. <div class="ui-checkbox">
  1057. <input type="checkbox" checked id="input_allType"/>
  1058. </div>
  1059. <label class="ui-label-sub fn-minwid20 fn-color-white" id="lab_all" for="input_allType">All</label>
  1060. <div class="ui-checkbox">
  1061. <input type="checkbox" checked id="input_Normal"/>
  1062. </div>
  1063. <label class="ui-label-sub fn-minwid20 fn-color-white fn-marr4" id="lab_normal" for="input_Normal">Normal</label>
  1064. <i class="playback-dates-type-green fn-left"></i>
  1065. <div class="ui-checkbox">
  1066. <input type="checkbox" checked id="input_Motion"/>
  1067. </div>
  1068. <label class="ui-label-sub fn-minwid20 fn-color-white fn-marr4" id="lab_motion" for="input_Motion">Motion</label>
  1069. <i class="playback-dates-type-yellow fn-left"></i>
  1070. <div class="ui-checkbox">
  1071. <input type="checkbox" checked id="input_Alarm"/>
  1072. </div>
  1073. <label class="ui-label-sub fn-minwid20 fn-color-white fn-marr4" id="lab_alarm" for="input_Alarm">Alarm</label>
  1074. <i class="playback-dates-type-red fn-left"></i>
  1075. <div class="ui-checkbox playback-not-for-jpg">
  1076. <input type="checkbox" checked id="input_Manual"/>
  1077. </div>
  1078. <label class="ui-label-sub fn-minwid20 fn-color-white fn-marr4 playback-not-for-jpg" id="lab_manual" for="input_Manual">Manual</label>
  1079. <i class="playback-dates-type-blue fn-left playback-not-for-jpg"></i>
  1080. </div>
  1081. <div class="fn-fontsize0 fn-right playback-not-for-jpg">
  1082. <a href="javascript:;" class="ui-button-special ui-smart-button" id="btn_time1">
  1083. <i class="ui-button-icon-time">&nbsp;</i>
  1084. <label>24hr</label>
  1085. </a>
  1086. <a href="javascript:;" class="ui-button-special ui-smart-button" id="btn_time2">
  1087. <i class="ui-button-icon-time">&nbsp;</i>
  1088. <label>2hr</label>
  1089. </a>
  1090. <a href="javascript:;" class="ui-button-special ui-smart-button" id="btn_time3">
  1091. <i class="ui-button-icon-time">&nbsp;</i>
  1092. <label>1hr</label>
  1093. </a>
  1094. <a href="javascript:;" class="ui-button-special ui-smart-button" id="btn_time4">
  1095. <i class="ui-button-icon-time">&nbsp;</i>
  1096. <label>30min</label>
  1097. </a>
  1098. </div>
  1099. </div>
  1100. </div>
  1101. </div>
  1102. </div>
  1103. </div>
  1104. </div>
  1105.  
  1106. <!--报警页面-->
  1107. <div id="mb2" style="display:none;" class="main-content-box">
  1108. <div class="J_alarm">
  1109. <div id="alarmDIV" class="main-top">
  1110. <a id="alarm_help" class="main-top-icon-help" href="javascript:;" hidefocus="true" onclick="showHelpDoc('alarm')" title="Help"></a>
  1111. </div>
  1112. <div class="main-bottom alarm-content">
  1113. <div class="alarm-left">
  1114. <h1 id="alarmType">Alarm Type</h1>
  1115. <ul id="alarmTypelist" class="alarm-left-con fn-clear">
  1116. <li style="display:none;">
  1117. <input type="checkbox" id="alarmType_0" onclick="chkAlarmType(0)"/>
  1118. <label id="Type_0" for="alarmType_0">Video Loss</label>
  1119. </li>
  1120. <li>
  1121. <input type="checkbox" id="alarmType_1" onclick="chkAlarmType(1)"/>
  1122. <label id="Type_1" for="alarmType_1">Motion Detect</label>
  1123. </li>
  1124. <li id="showAlarmType_2">
  1125. <input type="checkbox" id="alarmType_2" onclick="chkAlarmType(2)"/>
  1126. <label id="Type_2" for="alarmType_2">Disk Full</label>
  1127. </li>
  1128. <li id="showAlarmType_3">
  1129. <input type="checkbox" id="alarmType_3" onclick="chkAlarmType(3)"/>
  1130. <label id="Type_3" for="alarmType_3">Disk Error</label>
  1131. </li>
  1132. <li>
  1133. <input type="checkbox" id="alarmType_4" onclick="chkAlarmType(4)"/>
  1134. <label id="Type_4" for="alarmType_4">Video Tamper</label>
  1135. </li>
  1136. <li id="showAlarmType_5">
  1137. <input type="checkbox" id="alarmType_5" onclick="chkAlarmType(5)"/>
  1138. <label id="Type_5" for="alarmType_5">External Alarm</label>
  1139. </li>
  1140. <li>
  1141. <input type="checkbox" id="alarmType_6" onclick="chkAlarmType(6)"/>
  1142. <label id="Type_6" for="alarmType_6">Illegal Access</label>
  1143. </li>
  1144. </ul>
  1145. <h1 id="oprator_0">Operation</h1>
  1146. <ul id="alarmWorklist" class="alarm-left-con fn-clear">
  1147. <li>
  1148. <input type="checkbox" id="workType_3"/>
  1149. <label id="info_0" for="workType_3">Prompt</label>
  1150. </li>
  1151. </ul>
  1152. <h1 id="alarm_sound">Alarm Tone</h1>
  1153. <div id="u_sound" class="alarm-left-item fn-clear">
  1154. <input type="checkbox" id="c_sound" onclick="chkAlarmSound()"/>
  1155. <label id="play_alarm_sound" for="c_sound">Play Alarm Tone</label>
  1156. </div>
  1157. <div class="alarm-left-item fn-clear">
  1158. <label class="ui-label-sub" id="sound_path">Tone Path</label>
  1159. <input type="text" id="i_chosepth" disabled="" onclick="getPath()" size="25" class="ui-input"/>
  1160. <a disabled="" class="ui-button ui-button-disabled fn-width80" id="b_almpth" onclick="getPath()" href="javascript:;">Browse...</a>
  1161. </div>
  1162. </div>
  1163. <div class="alarm-right">
  1164. <div class="ui-table">
  1165. <div class="ui-table-header">
  1166. <table>
  1167. <tbody><tr>
  1168. <th id="inedx_0" class="fn-widp20">No.</th>
  1169. <th id="time_0" class="fn-widp30">Time</th>
  1170. <th id="alarmTypeCGI" class="fn-widp30">Alarm Type</th>
  1171. <th id="alarmChannel">Alarm Channel</th>
  1172. </tr>
  1173. </tbody></table>
  1174. </div>
  1175. <iframe src="" width="100%" class="alarm-frame" id="alarm_frame" frameborder="0" scrolling="yes"></iframe>
  1176. </div>
  1177. </div>
  1178. </div>
  1179. </div>
  1180. <div class="footer"></div>
  1181. </div>
  1182. </div>
  1183. <div id="estopAll" style="display:none;" class="J_estop_all"></div>
  1184. <iframe id="_download" src="" style="display:none;"></iframe>
  1185. <script src="jsCore/md5.js?version=2.400"></script>
  1186. <script src="jsCore/base64.js?version=2.400"></script>
  1187. <script src="jsCore/rpcCore.js?version=2.400"></script>
  1188. <script src="jsCore/rpcLogin.js?version=2.400"></script>
  1189. <script src="jsCore/common.js?version=2.400"></script>
  1190. <script src="jsCore/publicLibrary.js?version=2.400"></script>
  1191. <script src="js/publicFunc.js?version=2.400"></script>
  1192. <script src="js/loginEx.js?version=2.400"></script>
  1193. <script src="js/ptzCtrl.js?version=2.400"></script>
  1194. <script src="js/alarm.js?version=2.400"></script>
  1195. <script src="js/set.js?version=2.400"></script>
  1196. <script src="js/PlayBack.js?version=2.400"></script>
  1197. <script src="js/ui-schedule.js?version=2.400"></script>
  1198. <script src="js/index.js?version=2.400"></script>
  1199.  
  1200. <script language="javascript">
  1201. function changeBg(i){
  1202. $('boat_current').addClass('ui-boat-current-' + i);
  1203. $('boat_intellent_current').addClass('ui-boat-intel-current-' + i);
  1204. }
  1205.  
  1206. function moveBg(i){
  1207. $('boat_current').removeClass('ui-boat-current-' + i);
  1208. $('boat_intellent_current').removeClass('ui-boat-intel-current-' + i);
  1209. }
  1210. </script>
  1211.  
  1212. </div>
  1213. <div id="markframe" class="fn-opacity" style="position:absolute;width:100%;;height:100%;;top:0;left:0;background:red;display:none;z-index:10000;">1</div>
  1214. </body>
  1215. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!