2024-02-15 22:07:30 +01:00
< ? php
include ( " head.php " );
?>
< style >
. modal . modal - body {
- ms - overflow - style : none ;
scrollbar - width : none ;
}
. modal . modal - body ::- webkit - scrollbar {
display : none ; /* Safari and Chrome */
}
. spinBox {
width : 57 px ;
height : 20 px ;
font - size : 20 px ;
color : white ;
transition : . 3 s color , . 3 s border ;
display : flex ;
align - items : center ;
justify - content : center ;
border - radius : 10 px ;
font - weight : bold ;
}
. spin {
display : inline - block ;
width : 1 em ;
height : 1 em ;
color : inherit ;
vertical - align : middle ;
pointer - events : none ;
border - top : . 1 em solid currentcolor ;
border - right : . 1 em solid transparent ;
- webkit - animation : spin 1 s linear infinite ;
animation : spin 1 s linear infinite ;
border - radius : 100 % ;
position : relative ;
}
@- webkit - keyframes spin {
to {
- webkit - transform : rotate ( 360 deg );
transform : rotate ( 360 deg );
}
}
@ keyframes spin {
to {
- webkit - transform : rotate ( 360 deg );
transform : rotate ( 360 deg );
}
}
. front {
backface - visibility : hidden ;
transform - style : preserve - 3 d ;
transition : transform 1 s ;
- webkit - backface - visibility : hidden ;
- webkit - transform - style : preserve - 3 d ;
- webkit - transition : transform 1 s ;
}
. rear {
position : absolute ;
top : 0 ;
backface - visibility : hidden ;
transform - style : preserve - 3 d ;
transition : transform 1 s ;
- webkit - backface - visibility : hidden ;
- webkit - transform - style : preserve - 3 d ;
- webkit - transition : transform 1 s ;
}
. front180 {
transform : rotateY ( 180 deg );
- webkit - transform : rotateY ( 180 deg );
}
. rear0 {
transform : rotateY ( 0 deg );
- webkit - transform : rotateY ( 0 deg );
}
. front0 {
transform : rotateY ( 0 deg );
- webkit - transform : rotateY ( 0 deg );
}
. rear180 {
transform : rotateY ( - 180 deg );
- webkit - transform : rotateY ( - 180 deg );
}
</ style >
< link href = " vendor/table/bootstrap-table.min.css " rel = " stylesheet " >
< div id = " alert " ></ div >
< div class = " row " >
< div class = " col-md-6 " >
< div id = " alertnet " ></ div >
< ul class = " nav nav-tabs " role = " tablist " >
< li role = " presentation " class = " active " >< a href = " #tab1 " aria - controls = " tab1 " role = " tab " data - toggle = " tab " > < cn > 网口1 </ cn >< en > LAN1 </ en ></ a >
</ li >
< ? php
if ( isset ( $ETH1 ) && $ETH1 ) {
?>
< li role = " presentation " >< a href = " #tab2 " aria - controls = " tab2 " role = " tab " data - toggle = " tab " > < cn > 网口2 </ cn >< en > LAN2 </ en ></ a >
</ li >
< ? php
}
if ( ! isset ( $wifi ) || $wifi ) {
?>
< li role = " presentation " >< a href = " #tab3 " aria - controls = " tab3 " role = " tab " data - toggle = " tab " > < cn > 无线网 </ cn >< en > WIFI </ en ></ a >
</ li >
< ? php
}
?>
</ ul >
< div class = " tab-content " >
< div role = " tabpanel " class = " tab-pane fade in active " id = " tab1 " >
< form class = " form-horizontal " id = " net " role = " form " style = " margin-top: 20px; " >
< ? php
if ( ! isset ( $DHCP ) || $DHCP ) {
?>
< div class = " form-group " >
< label class = " col-sm-3 control-label " > DHCP </ label >
< div class = " col-sm-6 " >
< input type = " checkbox " zcfg = " dhcp " class = " switch form-control " >
</ div >
</ div >
< ? php
}
?>
< div class = " form-group " >
< label class = " col-sm-3 control-label " > IP </ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " ip " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 掩码 </ cn >
< en > Mask </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " mask " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 网关 </ cn >
< en > Gateway </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " gateway " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
DNS
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " dns " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
MAC
</ label >
< div class = " col-sm-6 " >
< input type = " text " readonly id = " mac " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< div class = " col-sm-6 col-sm-offset-3 " >
< button type = " button " id = " saveNet " class = " save btn btn-warning " >
< cn > 保存 </ cn >
< en > Save </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
< div role = " tabpanel " class = " tab-pane fade in " id = " tab2 " >
< form class = " form-horizontal " id = " net2 " role = " form " style = " margin-top: 20px; " >
< ? php
if ( ! isset ( $DHCP ) || $DHCP ) {
?>
< div class = " form-group " >
< label class = " col-sm-3 control-label " > DHCP </ label >
< div class = " col-sm-6 " >
< input type = " checkbox " zcfg = " dhcp " class = " switch form-control " >
</ div >
</ div >
< ? php
}
?>
< div class = " form-group " >
< label class = " col-sm-3 control-label " > IP </ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " ip " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 掩码 </ cn >
< en > Mask </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " mask " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 网关 </ cn >
< en > Gateway </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " gateway " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
DNS
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " dns " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
MAC
</ label >
< div class = " col-sm-6 " >
< input type = " text " readonly id = " mac2 " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< div class = " col-sm-6 col-sm-offset-3 " >
< button type = " button " id = " saveNet2 " class = " save btn btn-warning " >
< cn > 保存 </ cn >
< en > Save </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
< div role = " tabpanel " class = " tab-pane fade in " id = " tab3 " >
< form class = " form-horizontal " id = " wifi " role = " form " >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " > SSID </ label >
< div class = " col-sm-6 " >
< input type = " text " id = " ssid " readonly class = " form-control " />
</ div >
</ div >
< div class = " form-group row " >
< div class = " col-sm-3 " ></ div >
< div class = " col-sm-6 " >
< button type = " button " class = " btn btn-warning " id = " addWifi " >
< cn > 添加Wifi </ cn >
< en > Add </ en >
</ button >
< button type = " button " class = " btn btn-warning " id = " setWifi " >
< cn > 管理Wifi </ cn >
< en > Manage </ en >
</ button >
</ div >
</ div >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " >
< cn > 启用 </ cn >
< en > Enable </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " checkbox " zcfg = " enable " class = " switch form-control " />
</ div >
</ div >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " > DHCP </ label >
< div class = " col-sm-6 " >
< input type = " checkbox " zcfg = " dhcp " class = " switch form-control " />
</ div >
</ div >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " > IP </ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " ip " class = " form-control " />
</ div >
</ div >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " >
< cn > 掩码 </ cn >
< en > Mask </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " mask " class = " form-control " />
</ div >
</ div >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " >
< cn > 网关 </ cn >
< en > Gateway </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " gateway " class = " form-control " />
</ div >
</ div >
< div class = " form-group row " >
< label class = " col-sm-3 col-form-label text-right " >
DNS
</ label >
< div class = " col-sm-6 " >
< input type = " text " zcfg = " dns " class = " form-control " />
</ div >
</ div >
< div class = " form-group row " >
< div class = " col text-center " >
< button type = " button " id = " saveWifi " class = " save btn btn-warning " >
< cn > 保存 </ cn >
< en > Save </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
</ div >
</ div >
< div class = " col-md-6 " >
< div class = " panel panel-default " >
< div class = " title " >
< h3 class = " panel-title " >
< cn > 密码设置 </ cn >
< en > Password </ en >
</ h3 >
</ div >
< div class = " panel-body " >
< div id = " alertpw " ></ div >
< form class = " form-horizontal " role = " form " id = " passwd " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 旧密码 </ cn >
< en > Current </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " password " name = " old " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 新密码 </ cn >
< en > New </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " password " name = " new1 " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 确认密码 </ cn >
< en > Confirm </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " password " name = " new2 " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< div class = " col-sm-6 col-sm-offset-3 " >
< button type = " button " id = " savePasswd " class = " save btn btn-warning " >
< cn > 保存 </ cn >
< en > Save </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
</ div >
2024-02-15 22:07:33 +01:00
< div class = " panel panel-default " style = " margin-top: 34px; " >
2024-02-15 22:07:30 +01:00
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn > 应用场景 </ cn >
< en > Application scenario </ en >
</ h3 >
</ div >
< div class = " panel-body " >
< div id = " alertvb " ></ div >
< form class = " form-horizontal " role = " form " id = " vb " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 场景 </ cn >
< en > Scene </ en >
</ label >
2024-02-15 22:07:33 +01:00
< div class = " col-sm-6 scene " >
< select name = " scene " id = " scene " zcfg = " used " class = " form-control " >
2024-02-15 22:07:30 +01:00
</ select >
</ div >
< div class = " col-sm-2 " >
< button type = " button " id = " change " class = " btn btn-warning " >
< cn > 切换 </ cn >
< en > Change </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
</ div >
</ div >
</ div >
< div class = " row " >
< div class = " col-md-6 " >
< div class = " panel panel-default " >
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn > 定时维护 </ cn >
< en > Auto reboot </ en >
</ h3 >
</ div >
< div class = " panel-body " >
< div id = " alerttm " ></ div >
< form class = " form-horizontal " role = " form " id = " time " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 系统时间 </ cn >
< en > system time </ en >
</ label >
< div class = " col-sm-6 " >
< input type = " text " name = " time " class = " form-control " />
</ div >
< div class = " col-sm-2 " >
< button type = " button " id = " sync " class = " btn btn-warning " >
< cn > 本地同步 </ cn >
< en > Sync to PC </ en >
</ button >
</ div >
</ div >
</ form >
2024-02-15 22:07:33 +01:00
< form class = " form-horizontal " role = " form " id = " ntp " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
NTP < cn > 同步 </ cn >
< en > sync </ en >
</ label >
2024-02-15 22:07:30 +01:00
2024-02-15 22:07:33 +01:00
< div class = " col-sm-6 " >
< input type = " text " zcfg = " server " class = " form-control " />
</ div >
< div class = " col-sm-2 " >
< input type = " checkbox " zcfg = " enable " class = " switch form-control " >
</ div >
</ div >
</ form >
< form class = " form-horizontal " role = " form " id = " timeZone " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 时区设置 </ cn >
< en > time zone </ en >
</ label >
< div class = " col-sm-3 " >
< select id = " timeArea " zcfg = " timeArea " class = " selectpicker form-control " >
< option value = " Africa " > Africa </ option >
< option value = " America " > Americas </ option >
< option value = " Antarctica " > Antarctica </ option >
< option value = " Asia " > Asia </ option >
< option value = " Atlantic " > Atlantic Ocean </ option >
< option value = " Australia " > Australia </ option >
< option value = " Europe " > Europe </ option >
< option value = " Indian " > Indian Ocean </ option >
< option value = " Pacific " > Pacific Ocean </ option >
</ select >
</ div >
< div class = " col-sm-3 " >
< select id = " timeCity " zcfg = " timeCity " class = " selectpicker form-control " style = " padding: 0 " ></ select >
</ div >
</ div >
</ form >
2024-02-15 22:07:30 +01:00
< form class = " form-horizontal " role = " form " id = " cron " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >
< cn > 维护时间 </ cn >
< en > reboot time </ en >
</ label >
< div class = " col-sm-3 " >
< select id = " cron_day " name = " day " class = " selectpicker form-control " >
< option cn = " 从不 " en = " never " value = " x " ></ option >
< option cn = " 每天 " en = " everyday " value = " * " ></ option >
< option cn = " 每周一 " en = " monday " value = " 1 " ></ option >
< option cn = " 每周二 " en = " tuesday " value = " 2 " ></ option >
< option cn = " 每周三 " en = " wednesday " value = " 3 " ></ option >
< option cn = " 每周四 " en = " thursday " value = " 4 " ></ option >
< option cn = " 每周五 " en = " friday " value = " 5 " ></ option >
< option cn = " 每周六 " en = " saturday " value = " 6 " ></ option >
< option cn = " 每周日 " en = " sunday " value = " 0 " ></ option >
</ select >
</ div >
< div class = " col-sm-3 " >
2024-02-15 22:07:33 +01:00
< select id = " cron_time " name = " time " class = " selectpicker form-control " style = " padding: 0 " >
2024-02-15 22:07:30 +01:00
< option value = " 0 " > 0 : 00 </ option >
< option value = " 1 " > 1 : 00 </ option >
< option value = " 2 " > 2 : 00 </ option >
< option value = " 3 " > 3 : 00 </ option >
< option value = " 4 " > 4 : 00 </ option >
< option value = " 5 " > 5 : 00 </ option >
< option value = " 6 " > 6 : 00 </ option >
< option value = " 7 " > 7 : 00 </ option >
< option value = " 8 " > 8 : 00 </ option >
< option value = " 9 " > 9 : 00 </ option >
< option value = " 10 " > 10 : 00 </ option >
< option value = " 11 " > 11 : 00 </ option >
< option value = " 12 " > 12 : 00 </ option >
< option value = " 13 " > 13 : 00 </ option >
< option value = " 14 " > 14 : 00 </ option >
< option value = " 15 " > 15 : 00 </ option >
< option value = " 16 " > 16 : 00 </ option >
< option value = " 17 " > 17 : 00 </ option >
< option value = " 18 " > 18 : 00 </ option >
< option value = " 19 " > 19 : 00 </ option >
< option value = " 20 " > 20 : 00 </ option >
< option value = " 21 " > 21 : 00 </ option >
< option value = " 22 " > 22 : 00 </ option >
< option value = " 23 " > 23 : 00 </ option >
</ select >
</ div >
</ div >
< div class = " form-group " >
< div class = " col-sm-8 col-sm-offset-3 " >
< button id = " save " type = " button " class = " btn btn-warning " style = " margin-right:20px; " >
< cn > 保存 </ cn >
< en > Save </ en >
</ button >
< button id = " reboot " type = " button " class = " btn btn-warning " style = " margin-right:20px; " >
< cn > 立即重启 </ cn >
< en > Reboot </ en >
</ button >
< button id = " reset " type = " button " class = " btn btn-warning " >
< cn > 恢复出厂设置 </ cn >
< en > Reset default </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
</ div >
</ div >
< div class = " col-md-6 " >
2024-02-15 22:07:33 +01:00
< div class = " panel panel-default " >
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn >
配置文件
< small style = " color: #bbb " > 按需导出配置文件 </ small >
</ cn >
< en >
Config file
< small style = " color: #bbb " > Export the required configuration file as required </ small >
</ en >
</ h3 >
</ div >
< div class = " panel-body " id = " upConfig " >
< div class = " text-center " >
< div id = " alertUpcfg " ></ div >
< div class = " row " style = " margin-top: 20px; " >
< div class = " col-md-10 col-md-offset-1 " >
< div class = " row " >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 编解码配置 </ cn >< en > Default Config </ en ></ div >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > OLED配置 </ cn >< en > OLED Config </ en ></ div >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 布局配置 </ cn >< en > Layout Config </ en ></ div >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 推流配置 </ cn >< en > Push Config </ en ></ div >
</ div >
</ div >
</ div >
< hr style = " margin-top:5px; margin-bottom: 10px; " />
< div class = " row " style = " margin-bottom: 20px; " >
< div class = " col-md-10 col-md-offset-1 " >
< div class = " row " >
< div class = " col-md-3 " >
< input type = " checkbox " checked conf = " config.json " class = " switch form-control " >
</ div >
< div class = " col-md-3 " >
< input type = " checkbox " checked conf = " oled " class = " switch form-control " >
</ div >
< div class = " col-md-3 " >
< input type = " checkbox " conf = " defLays.json " class = " switch form-control " >
</ div >
< div class = " col-md-3 " >
< input type = " checkbox " conf = " push.json " class = " switch form-control " >
</ div >
</ div >
</ div >
</ div >
2024-02-15 22:07:30 +01:00
< div class = " row " >
2024-02-15 22:07:33 +01:00
< div class = " col-md-10 col-md-offset-1 " >
2024-02-15 22:07:30 +01:00
< div class = " row " >
2024-02-15 22:07:33 +01:00
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 端口配置 </ cn >< en > Port Config </ en ></ div >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 密码配置 </ cn >< en > Password Config </ en ></ div >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 维护配置 </ cn >< en > NTP Config </ en ></ div >
< div class = " col-md-3 text-center " style = " padding: 0 " >< cn > 场景配置 </ cn >< en > Scene Config </ en ></ div >
</ div >
</ div >
</ div >
< hr style = " margin-top:5px; margin-bottom: 10px; " />
< div class = " row " style = " margin-bottom: 40px; " >
< div class = " col-md-10 col-md-offset-1 " >
< div class = " row " >
< div class = " col-md-3 " >
< input type = " checkbox " conf = " port.json " class = " switch form-control " >
2024-02-15 22:07:30 +01:00
</ div >
2024-02-15 22:07:33 +01:00
< div class = " col-md-3 " >
< input type = " checkbox " conf = " passwd.json " class = " switch form-control " >
2024-02-15 22:07:30 +01:00
</ div >
2024-02-15 22:07:33 +01:00
< div class = " col-md-3 " >
< input type = " checkbox " checked conf = " cron " class = " switch form-control " >
</ div >
< div class = " col-md-3 " >
< input type = " checkbox " checked conf = " videoBuffer.json " class = " switch form-control " >
2024-02-15 22:07:30 +01:00
</ div >
</ div >
</ div >
</ div >
2024-02-15 22:07:33 +01:00
< input type = " file " accept = " .zip " name = " cfg_file " id = " cfg_file " style = " display:none; " />
< button id = " packageConfs " type = " button " class = " btn btn-warning " style = " width: 82px;margin-right: 10px; " >
< cn > 导出 </ cn >
< en > Export </ en >
</ button >
< button id = " import_cfg " type = " button " class = " btn btn-warning " style = " width: 82px; " >
< cn > 导入 </ cn >
< en > Import </ en >
</ button >
</ div >
</ div >
</ div >
2024-02-15 22:07:30 +01:00
</ div >
</ div >
< ? php
if ( isset ( $PortCtrl ) && $PortCtrl == true )
{
?>
< div class = " row " >
< div class = " col-md-12 " >
2024-02-15 22:07:33 +01:00
< div class = " panel panel-default " >
2024-02-15 22:07:30 +01:00
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn > 端口配置 </ cn >
< en > Port config </ en >
</ h3 >
</ div >
< div class = " panel-body " >
< div id = " alertPort " ></ div >
< div class = " row text-center " style = " margin-top: 5px; " >
< div class = " col-md-2 col-xs-4 " ></ div >
< div class = " col-md-1 col-xs-2 " > HTTP </ div >
< div class = " col-md-1 col-xs-2 " > RTSP </ div >
< div class = " col-md-1 col-xs-2 " > RTMP </ div >
< div class = " col-md-1 col-xs-2 " > HTTPTS </ div >
< div class = " col-md-1 col-xs-2 " > Telnet </ div >
< div class = " col-md-1 col-xs-2 " > SSH </ div >
</ div >
< hr style = " margin-top:5px; margin-bottom: 10px; " />
< div id = " port " >
< div class = " row " >
< div class = " col-md-2 col-xs-4 text-right " >
< p class = " form-control-static " >< cn > 固定端口 </ cn >< en > Static port </ en ></ p >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " http[0] " type = " text " readonly class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " rtsp[0] " type = " text " readonly class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " rtmp[0] " type = " text " readonly class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " httpts[0] " type = " text " readonly class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " telnet[0] " type = " text " readonly class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " ssh[0] " type = " text " readonly class = " form-control " >
</ div >
</ div >
< div class = " row " style = " margin-top:15px; " >
< div class = " col-md-2 col-xs-4 text-right " >
< p class = " form-control-static " >< cn > 备用端口 </ cn >< en > Reserve port </ en ></ p >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " http[1] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " rtsp[1] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " rtmp[1] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " httpts[1] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " telnet[1] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " ssh[1] " type = " text " class = " form-control " >
</ div >
</ div >
< div class = " row " style = " margin-top:15px; " >
< div class = " col-md-2 col-xs-4 text-right " >
< p class = " form-control-static " >< cn > 映射 ( 外网 ) 端口 </ cn >< en > NAT port </ en ></ p >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " http[2] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " rtsp[2] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " rtmp[2] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " httpts[2] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " telnet[2] " type = " text " class = " form-control " >
</ div >
< div class = " col-md-1 col-xs-2 " >
< input zcfg = " ssh[2] " type = " text " class = " form-control " >
</ div >
</ div >
</ div >
2024-02-15 22:07:33 +01:00
< div class = " row " style = " margin-top: 20px; " >
2024-02-15 22:07:30 +01:00
< div class = " col-md-12 text-center " >
< button id = " savePort " type = " button " class = " btn btn-warning col-xs-4 col-xs-offset-4 col-md-2 col-md-offset-5 " >
< cn > 保存 </ cn >
< en > Save </ en >
</ button >
</ div >
</ div >
</ div >
</ div >
</ div >
</ div >
< ? php
}
if ( isset ( $help ) && $help != " " )
{
?>
2024-02-15 22:07:33 +01:00
< div class = " row " >
< div class = " col-md-6 " >
< div class = " row " >
< div class = " col-md-12 " >
< div class = " panel panel-default " >
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn > 远程协助 </ cn >
< en > Remote Assistance </ en >
</ h3 >
</ div >
< div class = " panel-body " style = " padding: 28px 15px; " >
< div id = " alertHelp " ></ div >
< form class = " form-horizontal " role = " form " >
< div class = " form-group " >
< label class = " col-sm-3 control-label " >< cn > 授权码 </ cn >< en > Auth code </ en ></ label >
< div class = " col-sm-3 " >
< input type = " text " id = " authCode " readonly class = " form-control " />
</ div >
< div class = " col-sm-6 " >
< button id = " startHelp " type = " button " class = " btn btn-warning " >
< cn > 开始协助 </ cn >
< en > Start </ en >
</ button >
< button id = " stopHelp " type = " button " class = " btn btn-warning " >
< cn > 停止协助 </ cn >
< en > Stop </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
</ div >
</ div >
</ div >
< div class = " row " >
< div class = " col-md-12 " >
< div class = " panel panel-default " " >
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn > 网络测试 </ cn >
< en > Network Test </ en >
</ h3 >
</ div >
< div class = " panel-body " style = " padding: 27px 15px " >
< div id = " alertNetTest " ></ div >
< div class = " text-center " >
< button id = " netTest " type = " button " class = " btn btn-warning " >
< cn > 开始测试 </ cn >
< en > Start Test </ en >
</ button >
</ div >
</ div >
</ div >
</ div >
</ div >
</ div >
2024-02-15 22:07:30 +01:00
< div class = " col-md-6 " >
2024-02-15 22:07:33 +01:00
< div class = " panel panel-default " >
< div class = " panel-heading " >
< h3 class = " panel-title " >
< cn > 系统升级 </ cn >
< en > Upgrade </ en >
</ h3 >
</ div >
< div class = " panel-body " >
< div id = " alertup " ></ div >
< div class = " col-md-12 " style = " padding-top: 10px; " >
< div class = " row " style = " margin-bottom: 15px; " >
< div class = " col-xs-3 text-right " >
< strong >
< cn > 应用版本 </ cn >
< en > App version </ en >:</ strong >
</ div >
< div class = " col-xs-9 " id = " ver_app " >---</ div >
</ div >
< div class = " row " style = " margin-bottom: 15px; " >
< div class = " col-xs-3 text-right " >
< strong >
< cn > SDK版本 </ cn >
< en > SDK version </ en >:</ strong >
</ div >
< div class = " col-xs-9 " id = " ver_sdk " >---</ div >
</ div >
< div class = " row " style = " margin-bottom: 15px; " >
< div class = " col-xs-3 text-right " >
< strong >
< cn > 系统版本 </ cn >
< en > Sys version </ en >:</ strong >
</ div >
< div class = " col-xs-9 " id = " ver_sys " >---</ div >
</ div >
< hr >
< div class = " row " >
< div id = " update " >
< form class = " form-horizontal " role = " form " id = " ff " enctype = " multipart/form-data " >
< label class = " col-sm-3 control-label " >
< cn > 上传升级包 </ cn >
< en > upload packet </ en >
</ label >
< div class = " col-sm-6 " >
< div id = " uploader " class = " wu-example " >
<!-- 用来存放文件信息 -->
< div id = " thelist " class = " uploader-list " ></ div >
< div class = " row " >
< div class = " col-sm-5 " style = " padding-right: 0 " >
< div id = " picker " >
< cn > 选择文件 </ cn >
< en > Select file </ en >
</ div >
</ div >
< div class = " col-sm-6 " style = " padding-left: 0 " >
< button id = " ctlBtn " role = " button " type = " button " class = " btn btn-default " >
< cn > 开始上传 </ cn >
< en > Upload </ en >
</ button >
</ div >
</ div >
</ div >
</ div >
</ form >
</ div >
</ div >
2024-02-15 22:07:30 +01:00
2024-02-15 22:07:33 +01:00
< div class = " row " >
< label class = " col-sm-3 text-center " style = " font-size: 14px;line-height: 34px;padding: 0;margin-bottom: 15px; " >
< cn >& nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; & nbsp ; 在线升级 </ cn >
< en style = " font-size: 12px " > online update </ en >
</ label >
< div class = " col-sm-6 " >
< div class = " row " >
< div class = " col-sm-5 " style = " padding-right: 0px " >
< button id = " checkUpdate " type = " button " class = " btn btn-warning " >
< div class = " fa " >
< cn > 检测更新 </ cn >
< en > Search </ en >
</ div >
< div class = " sp spinBox hide " >
< div class = " spin " ></ div >
</ div >
</ button >
</ div >
< div class = " col-sm-4 " style = " padding-left: 0px; " >
< button type = " button " id = " verLog " class = " btn btn-warning " >
< cn > 版本日志 </ cn >
< en style = " font-size: 12px; " > Version Log </ en >
</ button >
</ div >
< div class = " col-sm-2 " style = " padding: 0 7px; " >
< button id = " patchSearch " type = " button " class = " btn btn-warning " >
< i class = " fa fa-search " aria - hidden = " true " ></ i >
</ button >
</ div >
</ div >
</ div >
</ div >
</ div >
</ div >
</ div >
2024-02-15 22:07:30 +01:00
</ div >
</ div >
< ? php
}
?>
< div class = " modal fade " id = " modalAdd " tabindex = " -1 " role = " dialog " aria - labelledby = " myModalLabel " >
< div class = " modal-dialog " role = " document " >
< div class = " modal-content " >
< div class = " modal-header " >
< button type = " button " class = " close " data - dismiss = " modal " aria - label = " Close " >< span aria - hidden = " true " >& times ; </ span ></ button >
</ div >
< div class = " modal-body " >
< form class = " form-horizontal " role = " form " id = " add " >
< div class = " form-group " >
< label class = " col-sm-2 control-label " > SSID </ label >
< div class = " col-sm-8 " >
2024-02-15 22:07:33 +01:00
< select name = " ssid " class = " form-control " ></ select >
2024-02-15 22:07:30 +01:00
</ div >
< div class = " col-sm-2 " >
< button id = " scanWifi " type = " button " class = " btn btn-warning " >
< cn > 刷新 </ cn >
< en > Refresh </ en >
</ button >
</ div >
</ div >
< div class = " form-group " >
< label class = " col-sm-2 control-label " >
< cn > 密码 </ cn >
< en > Passwd </ en >
</ label >
< div class = " col-sm-8 " >
< input type = " text " name = " passwd " class = " form-control " />
</ div >
</ div >
< div class = " form-group " >
< div class = " col-sm-8 col-sm-offset-2 " >
< button id = " connectWifi " type = " button " class = " btn btn-warning " >
< cn > 连接 </ cn >
< en > Connect </ en >
</ button >
</ div >
</ div >
</ form >
</ div >
</ div >
</ div >
</ div >
< div class = " modal fade " id = " modalSet " tabindex = " -1 " role = " dialog " aria - labelledby = " myModalLabel " >
< div class = " modal-dialog " role = " document " >
< div class = " modal-content " >
< div class = " modal-header " >
< button type = " button " class = " close " data - dismiss = " modal " aria - label = " Close " >< span aria - hidden = " true " >& times ; </ span ></ button >
</ div >
< div class = " modal-body " id = " set " >
</ div >
</ div >
</ div >
</ div >
< div class = " modal fade " id = " modalPatch " tabindex = " -1 " role = " dialog " aria - labelledby = " modalPatchLabel " >
< div class = " modal-dialog " role = " document " >
< div class = " modal-content front front0 " style = " width: 650px " >
< div class = " modal-header " >
< button type = " button " onclick = " closeModalPatch() " class = " close " data - dismiss = " modal " aria - label = " Close " >< span aria - hidden = " true " >& times ; </ span ></ button >
< h5 class = " modal-title " >< cn > 升级包 </ cn >< en > Upgrade </ en ></ h5 >
</ div >
< div class = " modal-body " style = " padding: 15px; " >
< table id = " patch " ></ table >
</ div >
< div class = " modal-footer " >
< div class = " row " >
< div class = " col-md-12 col-sm-12 text-left " >
< cn > PS: 级别标记为 < cn style = " color: red " > 重要 </ cn > 的升级包不能跳过,更新之后才能继续更新。 </ cn >
< en > PS: Upgrade packages marked as < en style = " color: red " > impact </ en > cannot be skipped and can only be updated after they have been updated </ en >
</ div >
</ div >
</ div >
</ div >
< div class = " modal-content rear rear180 " >
< div class = " modal-header " >
< button type = " button " style = " position: absolute;top: 9px;right: 10px;background: none;border: none;font-size: 21px;color: #ccc; " onclick = " showModalPatch() " >< span aria - hidden = " true " >& times ; </ span ></ button >
< h5 class = " modal-title " ></ h5 >
</ div >
< div class = " modal-body " style = " padding: 0; " >
< ul style = " color:#40485B;font-size: 16px;margin: 15px; " ></ ul >
< hr />
</ div >
</ div >
</ div >
</ div >
< div class = " modal fade " id = " modalLog " tabindex = " -1 " role = " dialog " aria - labelledby = " modalPatchLabel " >
< div class = " modal-dialog " role = " document " >
< div class = " modal-content " >
< div class = " modal-body " style = " overflow: auto;max-height: 700px " ></ div >
</ div >
</ div >
</ div >
< div class = " modal fade " id = " modalSN " tabindex = " -1 " role = " dialog " aria - labelledby = " modalPatchLabel " >
< div class = " modal-dialog " role = " document " style = " width: 350px " >
< div class = " modal-content " >
< div class = " modal-header " >
< button type = " button " class = " close " data - dismiss = " modal " aria - label = " Close " >< span aria - hidden = " true " >& times ; </ span ></ button >
< h4 class = " modal-title " >< cn > 固件搜索 </ cn >< en > Search </ en ></ h4 >
</ div >
< div class = " modal-body " style = " padding: 0; " >
< div id = " patchAlert " ></ div >
< div class = " row " style = " display:flex; align-items:center;justify-content: center;height: 70px " >
< div class = " col-sm-3 col-sm-offset-1 " >
< div style = " font-size: 14px;line-height: 20px;color: #666 " >
< cn > 固件编号 :</ cn >
< en > Patch Serial :</ en >
</ div >
</ div >
< div class = " col-sm-6 " >
< div >
< input id = " patchSN " style = " width: 100%;border: none;border-bottom: 1px solid #ccc;outline: none; " />
</ div >
</ div >
</ div >
</ div >
< div class = " modal-footer " >
< button type = " button " class = " btn btn-default " data - dismiss = " modal " >< cn > 取消 </ cn >< en > Cancel </ en ></ button >
< button id = " search " type = " button " class = " btn btn-warning " >< cn > 搜索 </ cn >< en > Search </ en ></ button >
</ div >
</ div >
</ div >
</ div >
< script src = " js/zcfg.js " ></ script >
< script src = " vendor/switch/bootstrap-switch.min.js " ></ script >
< script type = " text/javascript " language = " javascript " src = " js/confirm/jquery-confirm.min.js " ></ script >
< script type = " text/javascript " src = " webuploader/webuploader.js " ></ script >
< script src = " js/fontawesome-iconpicker.min.js " ></ script >
< script src = " vendor/table/bootstrap-table.min.js " ></ script >
2024-02-15 22:07:33 +01:00
< script src = " js/handlebars-v4.7.6.js " ></ script >
< script src = " js/jszip.js " ></ script >
< script src = " js/filesaver.min.js " ></ script >
2024-02-15 22:07:30 +01:00
< script id = " tpl " type = " text/x-handlebars-template " >
{{ #each this}}
< div class = " row " >
< div class = " col-md-11 col-md-offset-1 " >
< h3 > {{ version }} </ h3 >
</ div >
</ div >
< div class = " row " >
< div class = " col-md-11 col-md-offset-1 " >
< ul >
{{ #each logs}}
2024-02-15 22:07:33 +01:00
< li style = " font-size: 14px;white-space:pre-wrap; " > {{ this }} </ li >
2024-02-15 22:07:30 +01:00
{{ / each }}
</ ul >
</ div >
</ div >
< hr >
{{ / each }}
</ script >
< script >
var updatePatchs = " " ;
var facAliase = " " ;
var hadUpdate = false ;
$ ( " #modalPatch,#modalLog,#modalSN " ) . on ( 'show.bs.modal' , function (){
var $this = $ ( this );
var $modal_dialog = $this . find ( '.modal-dialog' );
$this . css ( 'display' , 'block' );
$modal_dialog . css ({ 'margin-top' : Math . max ( 0 , ( $ ( window ) . height () - $modal_dialog . height ()) / 2 ) });
$ ( " body " ) . css ( " overflow " , " hidden " );
});
$ ( " #modalPatch,#modalLog,#modalSN " ) . on ( 'hide.bs.modal' , function (){
$ ( " body " ) . css ( " overflow " , " auto " );
});
function setWifi ( func , id ) {
rpc2 ( " wifi.setWifi " , [ func , id . toString () ], function ( data ) {
if ( typeof ( data . error ) != " undefined " ) {
$ ( " #tab2 " ) . myAlert ( " danger " , " <cn>通信错误</cn><en>Connect faild</en>: " , data . error );
return ;
}
wifiList ();
} );
}
function wifiList () {
rpc2 ( " wifi.wifiList " , null , function ( data ) {
if ( typeof ( data . error ) != " undefined " ) {
$ ( " #tab2 " ) . myAlert ( " danger " , " <cn>通信错误</cn><en>Connect faild</en>: " , data . error );
return ;
}
var str = " " ;
for ( var i = 0 ; i < data . length ; i ++ ) {
str += '<form class="form-horizontal" role="form">' +
'<div class="row">' +
'<div class="col-sm-6 text-center"><label class="control-label" id="ssid">' +
data [ i ] . ssid + '<small style="font-weight: normal;">' ;
if ( data [ i ] . flags == " [CURRENT] " )
str += '[<cn>当前连接</cn><en>Current</en>]' ;
else if ( data [ i ] . flags == " [DISABLED] " )
str += '[<cn>禁用</cn><en>Disable</en>]' ;
str += '</small></label>' +
'</div>' +
'<div class="col-sm-6 text-center">' +
'<button onClick="setWifi(\'enable_network\',' + data [ i ] . id + ');" type="button" class="btn btn-warning"><cn>启用</cn><en>Enable</en></button> ' +
'<button onClick="setWifi(\'disable_network\',' + data [ i ] . id + ');" type="button" class="btn btn-warning"><cn>禁用<cn><en>Disable</en></button> ' +
'<button onClick="setWifi(\'remove_network\',' + data [ i ] . id + ');" type="button" class="btn btn-warning"><cn>删除</cn><en>Delete</en></button> ' +
'</div></div></form><hr/>' ;
}
$ ( " #set " ) . html ( str );
} );
}
function checkLoading ( show ) {
if ( show ) {
$ ( " #checkUpdate " ) . find ( " .fa " ) . addClass ( " hide " );
$ ( " #checkUpdate " ) . find ( " .sp " ) . removeClass ( " hide " );
} else {
$ ( " #checkUpdate " ) . find ( " .sp " ) . addClass ( " hide " );
$ ( " #checkUpdate " ) . find ( " .fa " ) . removeClass ( " hide " );
}
}
function setModalPatch ( patchs ) {
updatePatchs = patchs ;
$ ( " #patch " ) . bootstrapTable ( 'load' , patchs );
}
function showUpdateLogs ( idx ) {
var patch = updatePatchs [ idx ];
var desc = patch . description ;
$ ( " .rear " ) . find ( " .modal-title " ) . html ( patch . name );
$ ( " .rear " ) . find ( " ul " ) . html ( " " );
if ( desc . indexOf ( " ; " ) > - 1 ) {
var reg = new RegExp ( '\r' , " g " )
desc = desc . replace ( reg , " " );
reg = new RegExp ( '\n' , " g " )
desc = desc . replace ( reg , " " );
reg = new RegExp ( '\t' , " g " )
desc = desc . replace ( reg , " " );
var desclist = desc . split ( " ; " );
for ( var i = 0 ; i < desclist . length ; i ++ ) {
if ( desclist [ i ] == " " )
continue ;
$ ( " .rear " ) . find ( " ul " ) . append ( '<li style="margin-bottom: 5px;">' + desclist [ i ] + '</li>' );
}
} else {
$ ( " .rear " ) . find ( " ul " ) . append ( '<li style="margin-bottom: 5px">' + desc + '</li>' );
}
$ ( " .front " ) . removeClass ( " front0 " ) . addClass ( " front180 " );
$ ( " .rear " ) . removeClass ( " rear180 " ) . addClass ( " rear0 " );
}
function closeModalPatch () {
$ ( " .rear " ) . find ( " ul " ) . html ( " " );
checkLoading ( false );
}
function showModalPatch () {
$ ( " .front " ) . removeClass ( " front180 " ) . addClass ( " front0 " );
$ ( " .rear " ) . removeClass ( " rear0 " ) . addClass ( " rear180 " );
}
function getUpdateFileSize ( name ) {
var params = {
" action " : " get_file_size " ,
" name " : name
}
var size = 0 ;
$ . ajaxSettings . async = false ;
$ . post ( " upgrade.php " , params , function ( dfile ) {
dfile = JSON . parse ( dfile );
size = dfile . size ;
})
$ . ajaxSettings . async = true ;
return size ;
}
function onUprade ( idx , ele ) {
if ( hadUpdate )
return ;
hadUpdate = true ;
var patch = updatePatchs [ idx ];
var name = patch . name ;
var chip = patch . chip ;
var type = " update " ;
if ( name . indexOf ( " _sn_ " ) > 0 ) {
name = name . replace ( " _sn_ " , " _ " + facAliase + " _ " );
type = " sn " ;
} else {
name = name . replace ( " _ " , " _ " + facAliase + " _ " );
type = " update " ;
}
var params = {
" action " : " download " ,
" name " : name ,
" chip " : chip ,
" type " : type
}
$ . post ( " upgrade.php " , params , function ( rfile ){
rfile = JSON . parse ( rfile );
var total = rfile . size ;
var size = getUpdateFileSize ( name );
$ ( ele ) . html ( parseInt ( size / total * 100 ) + " % " )
var timerId = setInterval ( function (){
size = getUpdateFileSize ( name );
$ ( ele ) . html ( parseInt ( size / total * 100 ) + " % " )
if ( size >= total ) {
clearInterval ( timerId );
$ ( " #modalPatch " ) . modal ( " hide " );
checkLoading ( false );
hadUpdate = false ;
$ . confirm ( {
title : '<cn>重启</cn><en>Reboot</en>' ,
content : '<cn>下载完成,是否立即重启系统完成更新?</cn><en>Reboot immediately?</en>' ,
buttons : {
ok : {
text : " <cn>确认重启</cn><en>Confirm</en> " ,
btnClass : 'btn-warning' ,
keys : [ 'enter' ],
action : function () {
func ( " reboot " );
}
},
cancel : {
text : " <cn>取消</cn><en>Cancel</en> " ,
action : function () {
console . log ( 'the user clicked cancel' );
}
}
}
} );
}
}, 1000 )
});
}
function onDownload ( idx ) {
var patch = updatePatchs [ idx ];
var name = patch . name ;
var chip = patch . chip ;
var type = " update " ;
if ( name . indexOf ( " _sn_ " ) > 0 ) {
name = name . replace ( " _sn_ " , " _ " + facAliase + " _ " );
type = " sn " ;
} else {
name = name . replace ( " _ " , " _ " + facAliase + " _ " );
type = " update " ;
}
var url = " http://help.linkpi.cn:5735/upgrade/ " + chip + " / " + type + " / " + name ;
var downName = " " ;
var a = document . createElement ( 'a' );
var e = document . createEvent ( 'MouseEvents' );
e . initEvent ( 'click' , false , false );
a . href = url ;
a . download = downName ;
a . dispatchEvent ( e );
}
$ ( function () {
navIndex ( 5 );
$ . fn . bootstrapSwitch . defaults . size = 'small' ;
$ . fn . bootstrapSwitch . defaults . onColor = 'warning' ;
$ ( " .switch " ) . bootstrapSwitch ();
$ . ajax ( {
url : " config/mac " ,
success : function ( data ) {
var mac = data . replace ( / [ \r\n ] / g , " " ) . toUpperCase ();
var macStr = " " ;
for ( var i = 0 ; i < mac . length ; i += 2 ){
macStr += mac . substr ( i , 2 );
if ( i + 2 < mac . length )
macStr += " : " ;
}
$ ( " #mac " ) . val ( macStr );
}
} ) . responseText ;
$ . ajax ( {
url : " config/mac2 " ,
success : function ( data ) {
var mac = data . replace ( / [ \r\n ] / g , " " ) . toUpperCase ();
var macStr = " " ;
for ( var i = 0 ; i < mac . length ; i += 2 ){
macStr += mac . substr ( i , 2 );
if ( i + 2 < mac . length )
macStr += " : " ;
}
$ ( " #mac2 " ) . val ( macStr );
}
} ) . responseText ;
var ntpCfg ;
$ . getJSON ( " config/ntp.json " , function ( result ) {
ntpCfg = result ;
zcfg ( " #ntp " , ntpCfg );
} );
< ? php
if ( isset ( $PortCtrl ) && $PortCtrl == true )
{
?>
var portCfg ;
$ . getJSON ( " config/port.json " , function ( result ) {
portCfg = result ;
zcfg ( " #port " , portCfg );
} );
$ ( " #savePort " ) . click ( function ( e ) {
rpc3 ( " update " , [ JSON . stringify ( portCfg , null , 2 ) ], function ( data ) {
if ( typeof ( data . error ) != " undefined " ) {
htmlAlert ( " #alertPort " , " danger " , " <cn>保存设置失败!</cn><en>Save config failed!</en> " , " " , 2000 );
} else {
htmlAlert ( " #alertPort " , " success " , " <cn>保存设置成功!</cn><en>Save config success!</en> " , " " , 2000 );
}
} );
} );
< ?
}
?>
var netConfig ;
$ . getJSON ( " config/net.json " , function ( result ) {
netConfig = result ;
zcfg ( " #net " , netConfig );
} );
var netConfig2 ;
$ . getJSON ( " config/net2.json " , function ( result ) {
netConfig2 = result ;
zcfg ( " #net2 " , netConfig2 );
} );
var wifiConfig ;
$ . getJSON ( " config/wifi.json " , function ( result ) {
wifiConfig = result ;
zcfg ( " #wifi " , wifiConfig );
} );
$ . getJSON ( " config/ssid.json " , function ( ssid ) {
$ ( " #wifi #ssid " ) . val ( ssid . ssid );
} );
var videoBuffer ;
$ . getJSON ( " config/version.json " , function ( ver ) {
$ ( " #ver_app " ) . text ( ver . app );
$ ( " #ver_sdk " ) . text ( ver . sdk );
$ ( " #ver_sys " ) . text ( ver . sys );
} );
2024-02-15 22:07:33 +01:00
var timeZone ;
$ . getJSON ( " /timezone/tzselect.json " , function ( result ) {
timeZone = result ;
$ . getJSON ( " /timezone/zoneinfo/ " + result . timeArea + " / " , function ( res ) {
$ ( " #timeCity " ) . html ( " " );
for ( var i = 0 ; i < res . length ; i ++ )
$ ( " #timeCity " ) . append ( '<option value="' + res [ i ] . name + '">' + res [ i ] . name + '</option>' );
zcfg ( " #timeZone " , result );
})
})
2024-02-15 22:07:30 +01:00
2024-02-15 22:07:33 +01:00
$ . getJSON ( " config/videoBuffer.json " , function ( vb ) {
videoBuffer = vb ;
for ( var key in vb ) {
if ( key == " used " )
continue ;
$ ( " #scene " ) . append ( '<option value="' + key + '">' + key + '</option>' );
}
zcfg ( " .scene " , vb );
} );
function ajax ( url , options , callback ) {
window . URL = window . URL || window . webkitURL
var xhr = new XMLHttpRequest ()
if ( options . responseType ) {
xhr . responseType = options . responseType
}
xhr . open ( 'get' , 'http://' + location . hostname + '/config/' + url , true )
xhr . onreadystatechange = function () {
if ( xhr . readyState === 4 && xhr . status === 200 ) {
callback ( xhr , url );
}
}
xhr . send ()
}
2024-02-15 22:07:30 +01:00
2024-02-15 22:07:33 +01:00
$ ( " #packageConfs " ) . click ( function ( e ) {
var confs = [ " lang.json " ];
$ ( " #upConfig " ) . find ( " input " ) . each ( function ( index , ele ) {
if ( $ ( ele )[ 0 ] . checked ) {
var cfg_path = $ ( ele ) . attr ( " conf " );
if ( cfg_path == " oled " ) {
confs . push ( " oled/oled.json " );
confs . push ( " oled/oledMods.json " );
confs . push ( " oled/remfea.json " );
confs . push ( " oled/remods.json " );
confs . push ( " oled/remote.json " );
} else if ( cfg_path == " cron " ) {
confs . push ( " ntp.json " );
confs . push ( " auto/root.cron " );
confs . push ( " misc/timezone/tzselect.json " );
} else if ( cfg_path == " videoBuffer.json " ) {
confs . push ( " board.json " );
confs . push ( " videoBuffer.json " );
} else {
confs . push ( cfg_path );
}
}
});
var zip = new JSZip ();
for ( var i = 0 ; i < confs . length ; i ++ ){
ajax ( confs [ i ],{ responseType : 'blob' }, function ( xhr , fileName ) {
zip . file ( fileName , xhr . response ,{ binary : true });
})
}
setTimeout ( function (){
if ( Object . keys ( zip . files ) . length > 0 ) {
zip . generateAsync ({ type : 'blob' }) . then (( blob ) => {
saveAs ( blob , 'configs.zip' );
});
} else {
console . log ( '下载全部失败' )
}
}, 300 );
});
$ ( " #change " ) . click ( function ( e ) {
func ( " setVideoBuffer " , videoBuffer , function ( res ) {
2024-02-15 22:07:30 +01:00
if ( res . error != " " ) {
htmlAlert ( " #alertvb " , " danger " , " <cn>保存设置失败</cn><en>Save config failed</en>! " , " " , 2000 );
} else {
htmlAlert ( " #alertvb " , " success " , " <cn>保存设置成功</cn><en>Save config success</en>! " , " " , 2000 );
}
} );
} );
function isValidIP ( ip ) {
var reg = /^ ( \d { 1 , 2 } | 1 \d\d | 2 [ 0 - 4 ] \d | 25 [ 0 - 5 ]) \ . ( \d { 1 , 2 } | 1 \d\d | 2 [ 0 - 4 ] \d | 25 [ 0 - 5 ]) \ . ( \d { 1 , 2 } | 1 \d\d | 2 [ 0 - 4 ] \d | 25 [ 0 - 5 ]) \ . ( \d { 1 , 2 } | 1 \d\d | 2 [ 0 - 4 ] \d | 25 [ 0 - 5 ]) $ /
return reg . test ( ip );
}
function isValidNet ( cfg ) {
return isValidIP ( cfg . ip ) && isValidIP ( cfg . mask ) && isValidIP ( cfg . gateway ) && isValidIP ( cfg . dns );
}
$ ( " #saveNet " ) . click ( function ( e ) {
if ( isValidNet ( netConfig ))
{
func ( " setNetwork " , netConfig , function ( res ) {
if ( res . error != " " ) {
htmlAlert ( " #alertnet " , " danger " , " <cn>保存设置失败</cn><en>Save config failed</en>! " , " " , 2000 );
} else {
htmlAlert ( " #alertnet " , " success " , " <cn>保存设置成功</cn><en>Save config success</en>! " , " " , 2000 );
}
} );
setTimeout ( 'window.location.href="http://' + netConfig . ip + '/sys.php";' , 1000 );
}
else
htmlAlert ( " #alertnet " , " danger " , " <cn>不正确的输入格式</cn><en>Invalid ip address</en>! " , " " , 2000 );
} );
$ ( " #saveNet2 " ) . click ( function ( e ) {
if ( isValidNet ( netConfig2 ))
{
func ( " setNetwork2 " , netConfig2 , function ( res ) {
if ( res . error != " " ) {
htmlAlert ( " #alertnet " , " danger " , " <cn>保存设置失败</cn><en>Save config failed</en>! " , " " , 2000 );
} else {
htmlAlert ( " #alertnet " , " success " , " <cn>保存设置成功</cn><en>Save config success</en>! " , " " , 2000 );
}
} );
}
else
htmlAlert ( " #alertnet " , " danger " , " <cn>不正确的输入格式</cn><en>Invalid ip address</en>! " , " " , 2000 );
} );
$ ( " #saveWifi " ) . click ( function ( e ) {
rpc2 ( " wifi.update " , [ wifiConfig ], function ( data ) {
if ( typeof ( data . error ) != " undefined " ) {
htmlAlert ( " #alertnet " , " danger " , " <cn>保存设置失败</cn><en>Save config failed</en>! " , " " , 2000 );
} else {
htmlAlert ( " #alertnet " , " success " , " <cn>保存设置成功</cn><en>Save config success</en>! " , " " , 2000 );
}
} );
//setTimeout( 'window.location.href="http://' + wifiConfig.ip + '/sys.php";', 1000 );
} );
$ ( " #addWifi " ) . click ( function () {
$ ( '#modalAdd' ) . modal ( 'show' );
scanWifi ();
} );
$ ( " #setWifi " ) . click ( function () {
$ ( '#modalSet' ) . modal ( 'show' );
wifiList ();
} );
$ ( " #scanWifi " ) . click ( function () {
scanWifi ();
} );
$ ( " #connectWifi " ) . click ( function () {
connectWifi ();
} );
function connectWifi () {
rpc2 ( " wifi.addWifi " , [ $ ( " #add select[name='ssid'] " ) . val (), $ ( " #add input[name='passwd'] " ) . val () ], function ( data ) {
if ( typeof ( data . error ) != " undefined " ) {
$ ( " #tab2 " ) . myAlert ( " danger " , " <cn>通信错误</cn><en>Connect faild</en>: " , data . error );
return ;
}
$ ( " #add " ) . myAlert ( " success " , " <cn>添加成功</cn><en>Add success</en>: " , " <cn>若未连接,请确认密码,删除后重新添加。</cn><en>If didn't connect, confirm password, delete and add again.</en> " );
} );
}
function scanWifi () {
rpc2 ( " wifi.scanWifi " , null , function ( data ) {
if ( typeof ( data . error ) != " undefined " ) {
$ ( " #tab2 " ) . myAlert ( " danger " , " <cn>通信错误</cn><en>Connect faild</en>: " , data . error );
return ;
}
$ ( " #add select[name='ssid'] " ) . html ( '' );
$ . each ( data , function ( i , d ) {
var text = d . ssid ;
if ( d . flags == " open " )
text += '[open]' ;
$ ( " #add select[name='ssid'] " ) . append ( $ ( '<option>' , {
value : d . ssid ,
text : text
} ) );
} );
} );
}
$ ( " #savePasswd " ) . click ( function () {
func ( " setPasswd " , $ ( " #passwd " ) . serialize (), function ( res ) {
if ( res . error != " " )
htmlAlert ( " #alertpw " , " danger " , res . error , " " , 2000 );
else
htmlAlert ( " #alertpw " , " success " , " <cn>修改密码成功</cn><en>Save password success</en>! " , " " , 2000 );
} );
} );
2024-02-15 22:07:33 +01:00
$ ( " #timeArea " ) . change ( function () {
$ . getJSON ( " /timezone/zoneinfo/ " + $ ( this ) . val () + " / " , function ( res ) {
$ ( " #timeCity " ) . html ( " " );
for ( var i = 0 ; i < res . length ; i ++ ) {
if ( i == 0 )
timeZone . timeCity = res [ 0 ] . name ;
$ ( " #timeCity " ) . append ( '<option value="' + res [ i ] . name + '">' + res [ i ] . name + '</option>' )
}
})
});
2024-02-15 22:07:30 +01:00
$ ( " #save " ) . click ( function ( e ) {
func ( " setNTP " , ntpCfg );
2024-02-15 22:07:33 +01:00
func ( " setTimeZone " , timeZone );
2024-02-15 22:07:30 +01:00
func ( " setCron " , $ ( " #cron " ) . serialize (), function ( res ) {
if ( res . result == " OK " ) {
htmlAlert ( " #alerttm " , " success " , " <cn>保存设置成功</cn><en>Save config success</en>! " , " " , 2000 );
} else {
htmlAlert ( " #alerttm " , " danger " , " <cn>保存设置失败</cn><en>Save config failed</en>! " , " " , 2000 );
}
} );
} );
$ ( " #startHelp " ) . click ( function ( e ) {
var authCode = Math . floor ( Math . random () * 1000 );
$ ( " #authCode " ) . val ( authCode );
func ( " startHelp " , { authCode : authCode }, function ( res ) {
if ( res . result == " OK " ) {
htmlAlert ( " #alertHelp " , " success " , " <cn>连接成功,请向客服提供授权码以便控制您的编码器。</cn><en>Connect success, please provide auth code to customer service to control your encoder</en>! " , " " , 3000 );
}
} );
} );
$ ( " #stopHelp " ) . click ( function ( e ) {
func ( " stopHelp " , null , function ( res ) {
if ( res . result == " OK " ) {
htmlAlert ( " #alertHelp " , " success " , " <cn>已断开连接</cn><en>Disconnect success</en>! " , " " , 2000 );
}
} );
} );
func ( " setCron " , null , function ( result ) {
if ( result . result == null || result . result . split ( " " ) . length != 6 ) {
$ ( '#cron_time' ) . val ( '0' );
$ ( '#cron_day' ) . val ( 'x' );
} else {
$ ( '#cron_time' ) . val ( result . result . split ( " " )[ 1 ] );
$ ( '#cron_day' ) . val ( result . result . split ( " " )[ 4 ] );
}
} );
Date . prototype . Format = function ( fmt ) { //author: meizz
var o = {
" M+ " : this . getMonth () + 1 , //月份
" d+ " : this . getDate (), //日
" h+ " : this . getHours (), //小时
" m+ " : this . getMinutes (), //分
" s+ " : this . getSeconds (), //秒
" q+ " : Math . floor ( ( this . getMonth () + 3 ) / 3 ), //季度
" S " : this . getMilliseconds () //毫秒
};
if ( / ( y + ) /. test ( fmt ) ) fmt = fmt . replace ( RegExp . $ 1 , ( this . getFullYear () + " " ) . substr ( 4 - RegExp . $ 1. length ) );
for ( var k in o )
if ( new RegExp ( " ( " + k + " ) " ) . test ( fmt ) ) fmt = fmt . replace ( RegExp . $ 1 , ( RegExp . $ 1. length == 1 ) ? ( o [ k ] ) : ( ( " 00 " + o [ k ] ) . substr ( ( " " + o [ k ] ) . length ) ) );
return fmt ;
}
func ( " getTime " , null , function ( res ) {
if ( res . error == " " )
$ ( 'input[name="time"]' ) . val ( res . result );
} );
$ ( " #sync " ) . click ( function ( e ) {
var now = new Date ();
var tm = now . Format ( " yyyy-MM-dd hh:mm:ss " );
var tm2 = now . Format ( " yyyy/MM/dd/hh/mm/ss " );
$ ( 'input[name="time"]' ) . val ( tm );
func ( " setTime " , {
time : tm2 ,
time2 : tm
}, function ( res ) {
htmlAlert ( " #alerttm " , " success " , " <cn>保存设置成功</cn><en>Save config success</en>! " , " " , 2000 );
} );
} );
$ ( " #netTest " ) . click ( function ( e ) {
func ( " testNet " , netConfig , function ( res ) {
var str = res . result . join ();
if ( str == " " ){
htmlAlert ( " #alertNetTest " , " danger " , " <cn>域名解析超时</cn><en>DNS timeout</en>! " , " " , 2000 );
}
else if ( str . indexOf ( " 0% " ) > 0 ){
htmlAlert ( " #alertNetTest " , " success " , " <cn>网络可用</cn><en>Network available</en>! " , " " , 2000 );
}
else
htmlAlert ( " #alertNetTest " , " danger " , " <cn>网络不可用</cn><en>Network Unavailable</en>! " , " " , 2000 );
} );
} );
$ ( " #reboot " ) . click ( function ( e ) {
$ . confirm ( {
title : '<cn>重启</cn><en>Reboot</en>' ,
content : '<cn>是否立即重启系统?</cn><en>Reboot immediately?</en>' ,
buttons : {
ok : {
text : " <cn>确认重启</cn><en>Confirm</en> " ,
btnClass : 'btn-warning' ,
keys : [ 'enter' ],
action : function () {
func ( " reboot " );
}
},
cancel : {
text : " <cn>取消</cn><en>Cancel</en> " ,
action : function () {
console . log ( 'the user clicked cancel' );
}
}
}
} );
} );
$ ( " #reset " ) . click ( function ( e ) {
$ . confirm ( {
title : '<cn>还原</cn><en>Reset</en>' ,
content : '<cn>是否还原全部设置?</cn><en>Reset all config to default and reboot immediately?</en>' ,
buttons : {
ok : {
text : " <cn>确认</cn><en>Confirm</en> " ,
btnClass : 'btn-warning' ,
keys : [ 'enter' ],
action : function () {
func ( " resetCfg " );
}
},
cancel : {
text : " <cn>取消</cn><en>Cancel</en> " ,
action : function () {
console . log ( 'the user clicked cancel' );
}
}
}
} );
} );
$ ( " #checkUpdate " ) . click ( function (){
if ( $ ( this ) . find ( " .fa " ) . hasClass ( " hide " )) {
checkLoading ( false );
return ;
}
checkLoading ( true );
setTimeout ( function (){
func ( " checkHelpNet " ,[], function ( res ){
if ( res . error != " " ) {
$ ( " #update " ) . myAlert ( " danger " , res . error , " " , 3000 );
return ;
}
func ( " getAliase " ,[], function ( res ) {
if ( res . error != " " ) {
$ ( " #update " ) . myAlert ( " danger " , res . error , " " , 3000 );
return ;
}
if ( res . result . length == 0 ) {
$ ( " #update " ) . myAlert ( " success " , " <cn>已经是最新版本</cn><en>It is the latest version</en> " , " " , 3000 );
checkLoading ( false );
return ;
}
facAliase = res . result [ 0 ] . aliase ;
func ( " checkUpdate " , [], function ( res ) {
if ( res . error != " " ) {
$ ( " #update " ) . myAlert ( " danger " , res . error , " " , 3000 );
checkLoading ( false );
return ;
}
if ( parseInt ( res . result ) <= 0 ) {
checkLoading ( false );
$ . confirm ({
title : '<cn>注意</cn><en>Tip</en>' ,
content : '<cn>设备可能升级过其他固件,如果继续升级,功能可能会被覆盖,是否继续?</cn><en>The device may have been upgraded with custom firmware, and the upgrade function may be overwritten. Do you want to continue?</en>' ,
buttons : {
ok : {
text : " <cn>继续</cn><en>Continue</en> " ,
btnClass : 'btn-warning' ,
keys : [ 'enter' ],
action : function () {
checkLoading ( true );
setTimeout ( function () {
func ( " getPatch " , [], function ( res ) {
if ( res . error != " " ) {
$ ( " #update " ) . myAlert ( " danger " , res . error , " " , 3000 );
checkLoading ( false );
return ;
}
if ( res . result . length == 0 ) {
$ ( " #update " ) . myAlert ( " success " , " <cn>已经是最新版本</cn><en>It is the latest version</en> " , " " , 3000 );
checkLoading ( false );
return ;
}
console . log ( res . result );
setModalPatch ( res . result );
$ ( '#modalPatch' ) . modal ({ backdrop : 'static' , keyboard : false });
});
}, 1000 );
}
},
cancel : {
text : " <cn>取消</cn><en>Cancel</en> " ,
action : function () {
//$("body").css("overflow","auto");
}
}
}
});
} else {
func ( " getPatch " , [], function ( res ) {
if ( res . error != " " ) {
$ ( " #update " ) . myAlert ( " danger " , res . error , " " , 3000 );
checkLoading ( false );
return ;
}
if ( res . result . length == 0 ) {
$ ( " #update " ) . myAlert ( " success " , " <cn>已经是最新版本</cn><en>It is the latest version</en> " , " " , 3000 );
checkLoading ( false );
return ;
}
setModalPatch ( res . result );
$ ( '#modalPatch' ) . modal ({ backdrop : 'static' , keyboard : false });
});
}
});
});
});
}, 1000 )
});
$ ( " #verLog " ) . click ( function () {
$ . getJSON ( " config/version.json " , function ( ver ) {
var versys = ver . sys ;
$ ( " #modalLog " ) . find ( " .modal-title " ) . html ( versys );
$ . get ( " config/verLogs.json " , function ( logs ){
var tpl = $ ( " #tpl " ) . html ();
var temple = Handlebars . compile ( tpl );
$ ( " #modalLog " ) . find ( " .modal-body " ) . html ( temple ( logs ));
$ ( " #modalLog " ) . modal ( " show " );
});
} );
});
$ ( " #patchSearch " ) . click ( function () {
func ( " checkHelpNet " ,[], function ( res ) {
if ( res . error != " " ) {
$ ( " #update " ) . myAlert ( " danger " , res . error , " " , 3000 );
return ;
}
$ ( " #modalSN " ) . modal ( " show " );
});
});
$ ( " #search " ) . click ( function () {
var sn = $ ( " #patchSN " ) . val ();
if ( sn == " " )
{
$ ( " #patchAlert " ) . myAlert ( " danger " , " <cn>请输入固件编号</cn><en>Please enter the patch sn.</en> " , " " , 2000 );
return ;
}
func ( " getAliase " ,[], function ( res ) {
if ( res . error != " " ) {
$ ( " #patchAlert " ) . myAlert ( " danger " , res . error , " " , 2000 );
return ;
}
if ( res . result . length == 0 ) {
$ ( " #patchAlert " ) . myAlert ( " danger " , " <cn>无效固件编号</cn><en>Invalid patch sn</en> " , " " , 2000 );
checkLoading ( false );
return ;
}
facAliase = res . result [ 0 ] . aliase ;
var params = { " sn " : sn };
func ( " getPatchBySn " , params , function ( res ){
if ( res . error != " " ) {
$ ( " #patchAlert " ) . myAlert ( " danger " , res . error , " " , 2000 );
return ;
}
if ( res . result . length == 0 ) {
$ ( " #patchAlert " ) . myAlert ( " danger " , " <cn>无效固件编号</cn><en>Invalid patch sn</en> " , " " , 2000 );
checkLoading ( false );
return ;
}
$ ( " #modalSN " ) . modal ( " hide " );
setModalPatch ( res . result );
$ ( '#modalPatch' ) . modal ({ backdrop : 'static' , keyboard : false });
})
})
});
2024-02-15 22:07:33 +01:00
var number = " 序号 " , name = " 名称 " , build = " 版本 " , sys_ver = " 日期 " , impact = " 级别 " , desc = " 日志 " , option = " 操作 " , download = " 下载 " ;
var lang = $ . cookie ( " lang " );
if ( lang == " en " )
number = " Serial " , name = " Name " , build = " Version " , sys_ver = " Date " , impact = " Impact " , desc = " Log " , option = " Option " , download = " Download " ;
2024-02-15 22:07:30 +01:00
$ ( " #patch " ) . bootstrapTable ({
mobileResponsive : true ,
columns : [
{
2024-02-15 22:07:33 +01:00
title : number ,
2024-02-15 22:07:30 +01:00
align : 'center' ,
formatter : function ( value , row , index ) {
return index + 1 ;
}
},
{
field : 'name' ,
2024-02-15 22:07:33 +01:00
title : name ,
2024-02-15 22:07:30 +01:00
align : 'center' ,
},
{
field : 'build' ,
2024-02-15 22:07:33 +01:00
title : build ,
2024-02-15 22:07:30 +01:00
align : 'center' ,
},
{
field : 'sys_ver' ,
2024-02-15 22:07:33 +01:00
title : sys_ver ,
2024-02-15 22:07:30 +01:00
align : 'center' ,
},
{
field : 'impact' ,
2024-02-15 22:07:33 +01:00
title : impact ,
2024-02-15 22:07:30 +01:00
align : 'center' ,
formatter : function ( value , row ) {
var cn = " <cn>普通</cn> " , en = " <en>normal</en> " ;
if ( value != null && value != " " ) {
cn = '<cn style="color:red">重要</cn>' ;
en = '<en style="color:red">impact</en>' ;
}
return '<div><cn>' + cn + '</cn><en>' + en + '</en></div>' ;
}
},
{
field : 'description' ,
2024-02-15 22:07:33 +01:00
title : desc ,
2024-02-15 22:07:30 +01:00
align : 'center' ,
formatter : function ( value , row , index ) {
return '<a onclick="showUpdateLogs(' + index + ')" style="cursor: pointer"><cn>查看更新日志</cn><en>update Logs</en></a>' ;
}
},
{
field : 'option' ,
2024-02-15 22:07:33 +01:00
title : option ,
2024-02-15 22:07:30 +01:00
width : '10%' ,
align : 'center' ,
formatter : function ( value , row , index ) {
var mark = false ;
for ( var i = 0 ; i < index ; i ++ ) {
if ( updatePatchs [ i ] . impact == null || updatePatchs [ i ] . impact == " " )
continue ;
mark = true ;
}
if ( ! mark )
return '<a style="cursor: pointer" onclick="onUprade(' + index + ',this)" ><cn>更新</cn><en>update</en></a>' ;
else
return '<div>/</div>' ;
}
},
{
field : 'download' ,
2024-02-15 22:07:33 +01:00
title : download ,
2024-02-15 22:07:30 +01:00
width : '10%' ,
align : 'center' ,
formatter : function ( value , row , index ) {
return '<a style="cursor: pointer" onclick="onDownload(' + index + ')"><cn>下载</cn><en>download</en></a>' ;
}
}
]
});
$ ( " #import_cfg " ) . click ( function ( e ) {
$ ( " #cfg_file " ) . trigger ( " click " );
$ ( " #cfg_file " ) . change ( function (){
var data = new FormData ();
var file = $ ( this )[ 0 ] . files [ 0 ];
var name = file . name ;
data . append ( " file " , file );
data . append ( " name " , name );
$ . ajax ({
url : 'upcfg.php' ,
type : 'POST' ,
data : data ,
dataType : 'JSON' ,
cache : false ,
processData : false ,
contentType : false
}) . done ( function ( ret ){
if ( ret [ 'isSuccess' ]){
htmlAlert ( " #alertUpcfg " , " success " , " <cn>导入成功</cn><en>Import success</en>! " , " " , 2000 );
} else {
htmlAlert ( " #alertUpcfg " , " danger " , " <cn>导入失败</cn><en>Import faild</en>! " , " " , 2000 );
}
});
});
} );
var $list = $ ( " #thelist " ); //这几个初始化全局的百度文档上没说明,好蛋疼。
var $btn = $ ( " #ctlBtn " ); //开始上传
var uploader = WebUploader . create ( {
// swf文件路径
swf : 'webuploader/Uploader.swf' ,
// 文件接收服务端。
server : 'upload.php' ,
// 选择文件的按钮。可选。
// 内部根据当前运行是创建, 可能是input元素, 也可能是flash.
pick : '#picker' ,
// 不压缩image, 默认如果是jpeg, 文件上传前会压缩一把再上传!
resize : false ,
accept : {
title : 'Update' ,
extensions : 'bin' ,
mimeTypes : 'Data/*'
}
} );
uploader . on ( 'fileQueued' , function ( file ) {
$list . append ( '<div id="' + file . id + '" class="item">' +
'<h4 class="info">' + file . name + '</h4>' +
'<p class="state"><cn>等待上传</cn><en>Waiting for upload</en>...</p>' +
'</div>' );
} );
uploader . on ( 'uploadProgress' , function ( file , percentage ) {
var $li = $ ( '#' + file . id ),
$percent = $li . find ( '.progress .progress-bar' );
// 避免重复创建
if ( ! $percent . length ) {
$percent = $ ( '<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>' ) . appendTo ( $li ) . find ( '.progress-bar' );
}
$li . find ( 'p.state' ) . html ( '<cn>上传中</cn><en>Uploading</en>' );
$percent . css ( 'width' , percentage * 100 + '%' );
} );
uploader . on ( 'uploadSuccess' , function ( file ) {
$ ( '#' + file . id ) . find ( 'p.state' ) . html ( '<cn>已上传</cn><en>Upload done</en>' );
$ ( " #update " ) . myAlert ( " success " , " <cn>上传成功</cn><en>Upload success</en>! " , " <cn>重启后生效</cn><en>effect after reboot</en> " );
} );
uploader . on ( 'uploadError' , function ( file ) {
$ ( '#' + file . id ) . find ( 'p.state' ) . html ( '<cn>上传出错</cn><en>Upload faild</en>' );
} );
uploader . on ( 'uploadComplete' , function ( file ) {
$ ( '#' + file . id ) . find ( '.progress' ) . fadeOut ();
} );
$btn . on ( 'click' , function () {
console . log ( " <cn>上传</cn><en>Uploading</en>... " );
uploader . upload ();
console . log ( " <cn>上传成功</cn><en>Upload success</en> " );
} );
$ ( " .webuploader-pick " ) . css ( " height " , " 34px " );
$ ( " .webuploader-pick " ) . css ( " padding-top " , " 8px " );
} );
</ script >
< ? php
include ( " foot.php " );
?>