mirror of
https://github.com/hyperion-project/hyperion.ng.git
synced 2023-10-10 13:36:59 +02:00
817dabae8c
* add --sourceOff to hyperion-remote - this will select "off" source and set all leds to black refactor new json stuff make schema checker not so strict, do not require values that have defaults (not finished yet) initialEffect config: effect is always an array, regardless if it is a color or an effect name * make off source visible in active priority list * transform initialeffect to qjson (except part of effect-args, this needs effectengine transformed to qjson) * remove unneeded comment * add web ui for source selection. call http://hyperion_host:8099/select/index.html current example needed json server on port 19444
99 lines
3.5 KiB
HTML
99 lines
3.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title>Hyperion web control</title>
|
|
|
|
<!-- bootstrap -->
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
|
|
|
|
<!-- Optional theme -->
|
|
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> -->
|
|
<link href="starter-template.css" rel="stylesheet">
|
|
|
|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
|
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<nav class="navbar navbar-inverse navbar-fixed-top">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<!-- <span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>-->
|
|
</button>
|
|
<a class="navbar-brand" href="#">Hyperion</a>
|
|
</div>
|
|
<div id="navbar" class="collapse navbar-collapse">
|
|
<ul class="nav navbar-nav">
|
|
<li class="active"><a href="#">Source Selection</a></li>
|
|
<!-- <li><a href="#about">About</a></li> -->
|
|
</ul>
|
|
</div><!--/.nav-collapse -->
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container">
|
|
<div class="starter-template">
|
|
<div id="inputs"></div>
|
|
</div>
|
|
</div><!-- /.container -->
|
|
|
|
|
|
<!-- ====================================================================== -->
|
|
<script>
|
|
var webSocket = new WebSocket('ws://'+document.location.hostname+':19444');
|
|
var serverInfo;
|
|
|
|
function setSource( prio )
|
|
{
|
|
if ( prio == "auto" )
|
|
webSocket.send('{"command":"sourceselect", "auto" : true}');
|
|
else
|
|
webSocket.send('{"command":"sourceselect", "priority" : '+prio+'}');
|
|
updateButtons();
|
|
}
|
|
|
|
function updateButtons()
|
|
{
|
|
webSocket.send('{"command":"serverinfo"}');
|
|
}
|
|
|
|
webSocket.onerror = function(event) {
|
|
alert(event.data);
|
|
};
|
|
|
|
webSocket.onopen = function(event) {
|
|
updateButtons();
|
|
setInterval(function() {updateButtons();}, 3000);
|
|
};
|
|
|
|
webSocket.onmessage = function(event) {
|
|
serverInfo = JSON.parse( event.data );
|
|
var data = "";
|
|
var i;
|
|
for(i = 0; i < serverInfo.info.priorities.length; i++) {
|
|
var owner = serverInfo.info.priorities[i].owner;
|
|
var active = serverInfo.info.priorities[i].active;
|
|
var visible = serverInfo.info.priorities[i].visible;
|
|
var priority = serverInfo.info.priorities[i].priority;
|
|
var btn_type = "default";
|
|
if (active) btn_type = "warning";
|
|
if (visible) btn_type = "success";
|
|
|
|
data += '<button id="srcBtn'+i+'" type="button" class="btn btn-lg btn-'+btn_type+'" style="margin:10px;min-width:200px" title="prio '+priority+'" onclick="setSource('+priority+');">'+owner+'</button><br/>';
|
|
}
|
|
data += '<button id="srcBtn'+i+'" type="button" class="btn btn-lg btn-info" style="margin:10px;min-width:200px" onclick="setSource(\'auto\');">auto select</button><br/>';
|
|
$('#inputs').html(data);
|
|
};
|
|
</script>
|
|
</body>
|
|
</html>
|