diogo/spark-art-dashboard
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update Ingestion Rate Controller protocol

Browse Source
This commit is contained in:
Diogo Cordeiro 2018-10-03 03:48:27 +01:00
parent 838cc1d950
commit fe4906d21a
2 changed files with 34 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
index.html
View File

@ -17,6 +17,19 @@
#chart-container > canvas { #chart-container > canvas {
height: 400px; height: 400px;
} }
#ingestion-rate-box {
float: right;
height: 76px;
left: 0;
position: absolute;
top: 7em;
z-index: 50;
padding: 20px;
}
@media screen and (max-width: 1200px) {
position:static;
float:none;
}
</style> </style>
</head> </head>
<body> <body>
@ -30,8 +43,13 @@
</nav> </nav>
<h1>ART Dashboard</h1> <h1>ART Dashboard</h1>
<div id="ingestion-rate-box"> <div id="ingestion-rate-box">
<label for="ingestion-rate-controller">Ingestion Rate</label> <p>Ingestion Rate</p>
<input id="ingestion-rate" type="number"> <label for="ingestion-rate-min">Minimum (Kbps)</label>
<input id="ingestion-rate-min" type="number">
<label for="ingestion-rate-max">Maximum (Kbps)</label>
<input id="ingestion-rate-max" type="number">
<label for="ingestion-rate-per">Period (ms)</label>
<input id="ingestion-rate-per" type="number"><br>
<input id="ingestion-rate-update" type="submit" value="Update"> <input id="ingestion-rate-update" type="submit" value="Update">
</div> </div>
</header> </header>

18
ingestion-rate.js
View File

@ -1,4 +1,6 @@
var current_ingestion_rate = document.getElementById("ingestion-rate").value; var current_ingestion_rate_min = document.getElementById("ingestion-rate-min").value;
var current_ingestion_rate_max = document.getElementById("ingestion-rate-max").value;
var current_ingestion_rate_per = document.getElementById("ingestion-rate-per").value;
var ws = new WebSocket('ws://localhost:3030/'); var ws = new WebSocket('ws://localhost:3030/');
ws.addEventListener('open', function open() { ws.addEventListener('open', function open() {
@ -15,8 +17,16 @@ ws.addEventListener('message', function message(data, flags) {
}); });
document.getElementById("ingestion-rate-update").addEventListener('click', function() { document.getElementById("ingestion-rate-update").addEventListener('click', function() {
if (document.getElementById("ingestion-rate").value != current_ingestion_rate) { if (document.getElementById("ingestion-rate-min").value != current_ingestion_rate) {
ws.send(document.getElementById("ingestion-rate").value, {mask: true}); ws.send(document.getElementById("ingestion-rate-min").value, {mask: true});
current_ingestion_rate = "set::" + document.getElementById("ingestion-rate").value; current_ingestion_rate_min = "set-min::" + document.getElementById("ingestion-rate-min").value;
}
if (document.getElementById("ingestion-rate-max").value != current_ingestion_rate) {
ws.send(document.getElementById("ingestion-rate-max").value, {mask: true});
current_ingestion_rate_max = "set-max::" + document.getElementById("ingestion-rate-max").value;
}
if (document.getElementById("ingestion-rate-per").value != current_ingestion_rate) {
ws.send(document.getElementById("ingestion-rate-per").value, {mask: true});
current_ingestion_rate_per = "set-period::" + document.getElementById("ingestion-rate-per").value;
} }
}); });