152 lines
5.1 KiB
HTML
152 lines
5.1 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
|
<meta name="renderer" content="webkit">
|
||
|
|
<title>LinkPi</title>
|
||
|
|
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
|
||
|
|
<!-- Bootstrap -->
|
||
|
|
<link href="/css/bootstrap.css" rel="stylesheet">
|
||
|
|
<link href="/css/font-awesome.min.css" rel="stylesheet">
|
||
|
|
<link href="/vendor/switch/bootstrap-switch.css" rel="stylesheet">
|
||
|
|
<link href="/js/confirm/jquery-confirm.min.css" rel="stylesheet"/>
|
||
|
|
<link href="/vendor/slider/css/bootstrap-slider.min.css" rel="stylesheet" />
|
||
|
|
<link href="/vendor/colorpicker/css/bootstrap-colorpicker.min.css" rel="stylesheet" />
|
||
|
|
<link rel="stylesheet" type="text/css" href="/webuploader/webuploader.css">
|
||
|
|
<link href="/css/my.css" rel="stylesheet">
|
||
|
|
<link rel="stylesheet" id="langcss">
|
||
|
|
|
||
|
|
<!--[if lt IE 9]>
|
||
|
|
<script src="js/html5shiv.js"></script>
|
||
|
|
<script src="js/respond.min.js"></script>
|
||
|
|
<![endif]-->
|
||
|
|
<script src="/js/jquery-1.11.3.min.js"></script>
|
||
|
|
<script src="/js/jquery.jsonrpcclient.js"></script>
|
||
|
|
<script src="/js/jquery.cookie.js"></script>
|
||
|
|
<script src="/js/bootstrap.js"></script>
|
||
|
|
<script src="/js/global.js"></script>
|
||
|
|
<style>
|
||
|
|
.thumbnail {
|
||
|
|
margin-bottom: 0px;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container-fluid main">
|
||
|
|
<div class="row" id="preview">
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xs-4">
|
||
|
|
<div class="thumbnail"> <img src="...">
|
||
|
|
<div id="L" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
<div id="R" style="width:0; background-color:#88BB4A; height:5px;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<button id="reset" type="button" class="btn btn-warning">
|
||
|
|
<cn>恢复出厂设置</cn>
|
||
|
|
<en>Reset default</en>
|
||
|
|
</button>
|
||
|
|
<script>
|
||
|
|
$( function () {
|
||
|
|
navIndex( 0 );
|
||
|
|
|
||
|
|
var first = true;
|
||
|
|
function getVolume() {
|
||
|
|
rpc( "enc.getVolume", null, function ( data ) {
|
||
|
|
setTimeout(getVolume,200);
|
||
|
|
for ( var i = 0; i < data.length && i<9; i++ ) {
|
||
|
|
$( "#preview #L" ).eq( i ).css( "width", (data[i].L*100/96)+"%" );
|
||
|
|
$( "#preview #R" ).eq( i ).css( "width", (data[i].R*100/96)+"%" );
|
||
|
|
}
|
||
|
|
} );
|
||
|
|
}
|
||
|
|
|
||
|
|
function show() {
|
||
|
|
rpc( "enc.snap", null, function ( ret ) {
|
||
|
|
setTimeout(show,500);
|
||
|
|
|
||
|
|
|
||
|
|
for ( var i = 0; i < 9; i++ ) {
|
||
|
|
|
||
|
|
$( "#preview img" ).eq( i ).attr( "src", "/snap/snap" + i + ".jpg?rnd=" + Math.random() );
|
||
|
|
|
||
|
|
}
|
||
|
|
} );
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
var config;
|
||
|
|
$.getJSON( "config/config.json", function ( data ) {
|
||
|
|
config = data;
|
||
|
|
} );
|
||
|
|
|
||
|
|
$(".thumbnail").each(function(index,obj){
|
||
|
|
$(obj).click(function(){
|
||
|
|
config[config.length-1].output.src=index;
|
||
|
|
config[config.length-1].srcA=[index];
|
||
|
|
rpc( "enc.update", [ JSON.stringify( config, null, 2 ) ]);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
getVolume();
|
||
|
|
show();
|
||
|
|
|
||
|
|
$( "#reset" ).click( function ( e ) {
|
||
|
|
func( "resetCfg" );
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
} );
|
||
|
|
</script>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|