Stripped js from index.html

MAX31855-EH
chrono 2013-11-28 23:21:00 +01:00
rodzic b8429275d2
commit 43bcd00445
4 zmienionych plików z 252 dodań i 236 usunięć

Wyświetl plik

@ -109,3 +109,14 @@ background: #3F3E3A;
margin-top: 4px;
}
.alert {
background-image: -webkit-gradient(linear,left 0,left 100%,from(#d9534f),to(#c12e2a));
background-image: -webkit-linear-gradient(top,#d9534f 0,#c12e2a 100%);
background-image: -moz-linear-gradient(top,#d9534f 0,#c12e2a 100%);
background-image: linear-gradient(to bottom,#d9534f 0,#c12e2a 100%);
background-repeat: repeat-x;
border-color: #b92c28;
}

Wyświetl plik

@ -0,0 +1 @@
(function(){var t;t=jQuery,t.bootstrapGrowl=function(e,s){var a,o,l;switch(s=t.extend({},t.bootstrapGrowl.default_options,s),a=t("<div>"),a.attr("class","bootstrap-growl alert"),s.type&&a.addClass("alert-"+s.type),s.allow_dismiss&&a.append('<a class="close" data-dismiss="alert" href="#">&times;</a>'),a.append(e),s.top_offset&&(s.offset={from:"top",amount:s.top_offset}),l=s.offset.amount,t(".bootstrap-growl").each(function(){return l=Math.max(l,parseInt(t(this).css(s.offset.from))+t(this).outerHeight()+s.stackup_spacing)}),o={position:"body"===s.ele?"fixed":"absolute",margin:0,"z-index":"9999",display:"none"},o[s.offset.from]=l+"px",a.css(o),"auto"!==s.width&&a.css("width",s.width+"px"),t(s.ele).append(a),s.align){case"center":a.css({left:"50%","margin-left":"-"+a.outerWidth()/2+"px"});break;case"left":a.css("left","20px");break;default:a.css("right","20px")}return a.fadeIn(),s.delay>0&&a.delay(s.delay).fadeOut(function(){return t(this).alert("close")}),a},t.bootstrapGrowl.default_options={ele:"body",type:"info",offset:{from:"top",amount:20},align:"right",width:250,delay:4e3,allow_dismiss:!0,stackup_spacing:10}}).call(this);

Wyświetl plik

@ -1,10 +1,19 @@
var state = "IDLE";
var graph;
var profiles = [];
var selected_profile = 0;
var selected_profile_name = "leadfree";
var host = "ws://" + window.location.hostname + ":8080";
var ws_status = new WebSocket(host+"/status");
var ws_control = new WebSocket(host+"/control");
var ws_storage = new WebSocket(host+"/storage");
function updateProgress(percentage){
function updateProgress(percentage, eta){
if(state=="RUNNING") {
if(percentage > 100) percentage = 100;
$('#progressBar').css('width', percentage+'%');
if(percentage>=5) $('#progressBar').html(parseInt(percentage)+'%');
if(percentage>9) $('#progressBar').html(parseInt(percentage)+'% - '+ eta);
} else {
$('#progressBar').css('width', 0+'%');
$('#progressBar').html('');
@ -18,7 +27,7 @@ function runTask() {
"profile": profiles[selected_profile]
}
console.log(JSON.stringify(test));
//console.log(JSON.stringify(test));
ws_control.send(JSON.stringify(test));
graph.series[1].setData([]);
@ -27,7 +36,7 @@ function runTask() {
function abortTask() {
var test = {"cmd": "STOP"};
console.log(JSON.stringify(test));
//console.log(JSON.stringify(test));
ws_control.send(JSON.stringify(test));
}
@ -63,13 +72,34 @@ function leaveEditMode() {
function saveProfile() {
name = $('#form_profile_name').val();
console.log('Trying to save profile: ' + name);
//console.log('Trying to save profile: ' + name);
var rawdata = graph.series[0].data;
var data = [];
var last = -1;
for(var i=0; i<rawdata.length;i++)
{
data.push([rawdata[i].x, rawdata[i].y]);
if(rawdata[i].x > last)
{
data.push([rawdata[i].x, rawdata[i].y]);
}
else
{
$.bootstrapGrowl("<span class=\"glyphicon glyphicon-exclamation-sign\"></span> <b>ERROR 88:</b><br/>An oven is not a time-machine", {
ele: 'body', // which element to append to
type: 'alert', // (null, 'info', 'error', 'success')
offset: {from: 'top', amount: 250}, // 'top', or 'bottom'
align: 'center', // ('left', 'right', or 'center')
width: 385, // (integer, or 'auto')
delay: 5000,
allow_dismiss: true,
stackup_spacing: 10 // spacing between consecutively stacked growls.
});
return false;
}
last = rawdata[i].x;
}
var profile = { "type": "profile", "data": data, "name": name }
@ -79,7 +109,7 @@ function saveProfile() {
ws_storage.send(put_cmd);
console.log('came to this: ' + put_cmd);
//console.log('came to this: ' + put_cmd);
selected_profile_name = name;
@ -89,10 +119,10 @@ function saveProfile() {
function update_profile(id) {
console.log('Profile selected:' + profiles[id].name);
//console.log('Profile selected:' + profiles[id].name);
selected_profile = id;
$('#sel_prof').html(profiles[id].name);
console.log(graph.series);
//console.log(graph.series);
graph.series[0].setData(profiles[id].data);
}
@ -376,12 +406,13 @@ function getHCOptions() {
type: 'line',
renderTo: 'graph_container',
animation: true,
zoomType: 'x',
//zoomType: 'x',
marginTop: 30,
marginRight: 30,
events: {
load: function() {
var series = this.series[1];
eta=0;
ws_status.onmessage = function(e)
@ -390,12 +421,31 @@ function getHCOptions() {
if(state!="EDIT")
{
state = x.state;
state = x.state;
if(state=="RUNNING")
{
$("#nav_start").hide();
$("#nav_stop").show();
series.addPoint([x.runtime, x.temperature], true, false);
left = parseInt(x.totaltime-x.runtime);
var minutes = Math.floor(left / 60);
var seconds = left - minutes * 60;
eta = minutes+':'+ (seconds < 10 ? "0" : "") + seconds;
}
else
{
$("#nav_start").show();
$("#nav_stop").hide();
}
}
$('#state').html(state);
updateProgress(parseFloat(x.runtime)/parseFloat(x.totaltime)*100);
updateProgress(parseFloat(x.runtime)/parseFloat(x.totaltime)*100,eta);
$('#act_temp').html(Highcharts.numberFormat(x.temperature, 0) + ' \xB0C');
$('#power').css("background-color", (x.power > 0.5 ? "#75890c" : "#1F1E1A") );
@ -408,66 +458,8 @@ function getHCOptions() {
else
{
$('#target_temp').html(Highcharts.numberFormat(x.target, 0) + ' \xB0C');
}
//console.log (e.data);
//console.log('Percent finished:' + perc);
if(state!="EDIT")
{
if(state=="RUNNING")
{
$("#nav_start").hide();
$("#nav_stop").show();
series.addPoint([x.runtime, x.temperature], true, false);
left = parseInt(x.totaltime-x.runtime);
var minutes = Math.floor(left / 60);
var seconds = left - minutes * 60;
$('#eta').html(minutes+':'+ (seconds < 10 ? "0" : "") + seconds);
}
else
{
$("#nav_start").show();
$("#nav_stop").hide();
}
}
}
/*
var socket = io.connect('http://10.1.1.110:8080');
socket.on('sample', function (sample) {
// when a sample arrives we plot it
series.addPoint([sample.x, sample.y], true, false);
$('#act_temp').html(Highcharts.numberFormat(sample.y, 0) + ' \xB0C');
});
socket.on('error', function () {
$(document).trigger("add-alerts", [
{
'message': "No communication to control server",
'priority': 'error'
}
]);
})
// Called when the connection to the server is opened.
socket.onopen = function () {
alert("Connection with server open.");
};
// Called when the connection to the server is closed.
socket.onclose = function () {
alert("Connection with server closed; Maybe the server wasn't found, it shut down or you're behind a firewall/proxy.");
};
*/
}
},
resetZoomButton: {
@ -480,7 +472,7 @@ function getHCOptions() {
plotOptions: {
series: {
cursor: 'all-scroll',
cursor: 'move',
point: {
events: {
/*
@ -534,3 +526,152 @@ function getHCOptions() {
return (options);
}
$(document).ready(function() {
if(!("WebSocket" in window)){
$('#chatLog, input, button, #examples').fadeOut("fast");
$('<p>Oh no, you need a browser that supports WebSockets. How about <a href="http://www.google.com/chrome">Google Chrome</a>?</p>').appendTo('#container');
}else{
// Status Socket ////////////////////////////////
ws_status.onopen = function()
{
console.log("Status Socket has been opened");
};
ws_status.onclose = function()
{
$.bootstrapGrowl("<span class=\"glyphicon glyphicon-exclamation-sign\"></span> <b>ERROR 1:</b><br/>Status Websocket not available", {
ele: 'body', // which element to append to
type: 'alert', // (null, 'info', 'error', 'success')
offset: {from: 'top', amount: 250}, // 'top', or 'bottom'
align: 'center', // ('left', 'right', or 'center')
width: 385, // (integer, or 'auto')
delay: 5000,
allow_dismiss: true,
stackup_spacing: 10 // spacing between consecutively stacked growls.
});
};
// Control Socket ////////////////////////////////
ws_control.onopen = function()
{
ws_control.onmessage = function(e)
{
console.log (e.data);
}
console.log("Control Socket has been opened");
}
// Storage Socket ///////////////////////////////
ws_storage.onopen = function()
{
console.log("Storage Socket has been opened");
ws_storage.onmessage = function(e)
{
console.log('Storage MSG:' + e.data);
message = JSON.parse(e.data);
console.log("Parsed message:" + message);
if(message.resp)
{
console.log("RESP");
if(message.resp == "FAIL")
{
console.log("FAIL");
if (confirm('Overwrite?')) {
//message.cmd="PUT";
message.force=true;
console.log("Sending: " + JSON.stringify(message));
ws_storage.send(JSON.stringify(message));
} else {
//do nothing
}
}
return;
}
//the message is an array of profiles
//FIXME: this should be better, maybe a {"profiles": ...} container?
profiles = message;
//delete old options in select
$('#e2')
.find('option')
.remove()
.end();
// fill select with new options from websocket
for (var i=0; i<profiles.length; i++)
{
var profile = profiles[i];
console.log(profile.name);
$('#e2').append('<option value="'+i+'">'+profile.name+'</option>');
if (profile.name == selected_profile_name)
{
console.log('Matchiemazvhie');
selected_profile = i;
$('#e2').select2('val', i);
update_profile(i);
}
}
graph.render();
}
console.log('Requesting stored profiles');
ws_storage.send('GET');
}
$("#e2").select2({
placeholder: "Select Profile",
allowClear: false
});
$("#e2").on("change", function(e) {
update_profile(e.val);
});
// Apply the theme
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);
$(function() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
graph = new Highcharts.Chart(getHCOptions());
});
}
});

Wyświetl plik

@ -4,14 +4,15 @@
<title>PicoReflow</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="assets/js/jquery-1.10.2.min.js"></script>
<script src="assets/js/highcharts.js"></script>
<script src="assets/js/draggable-points.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/jquery.bootstrap-growl.min.js"></script>
<script src="assets/js/select2.min.js"></script>
<script src="assets/js/picoreflow.js"></script>
<link rel="stylesheet" href="assets/css/bootstrap.min.css"/>
<link rel="stylesheet" href="assets/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="assets/css/select2.css"/>
@ -27,8 +28,9 @@
<span id="act_temp" class="display" style="color: #75890c">25 &deg;C</span>
<span id="target_temp" class="display">OFF</span>
<span id="state" class="display" style="font-size: 14px; text-align: center; padding-right:0">Idle</span>
<span id="eta" class="display" style="width: 60px">-</span>
<span id="power" class="display" style="width: 35px;">&nbsp;</span>
<span id="cyclic" class="display" style="width: 35px;">&nbsp;</span>
<span id="cool" class="display" style="width: 35px;">&nbsp;</span>
</div>
<div class="clearfix"></div>
@ -53,10 +55,9 @@
<button class="btn btn-success" type="button" onclick="saveProfile();">Save</button>
<button id="btn_exit" type="button" class="btn btn-danger" onclick="leaveEditMode()" style="display:none"><span class="glyphicon glyphicon-remove"></span></button>
</span>
</div><!-- /input-group -->
</div>
<div class="btn-group btn-group-sm">
<!--<button type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span></button>-->
<button id="btn_edit" type="button" class="btn btn-default" onclick="enterEditMode()"><span class="glyphicon glyphicon-pencil"></span></button>
</div>
@ -71,169 +72,31 @@
</div>
</div>
</div><!-- /container -->
</div>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3 class="modal-title" id="myModalLabel">Task Overview</h3>
</div>
<div class="modal-body">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3 class="modal-title" id="myModalLabel">Task Overview</h3>
</div>
<div class="modal-body">
<table class="table table-bordered">
<tr><td>Selected Profile</td><td><b><span id="sel_prof"></span></b></td></tr>
<tr><td>Estimated Runtime</td><td><b>5 Minutes</b></td></tr>
<tr><td>Estimated Power consumption</td><td><b>0.320 kWh (EUR 0.08)</b></td></tr>
</table>
</div>
<div class="modal-footer">
<div class="btn-group" style="width: 100%">
<button type="button" class="btn btn-danger" data-dismiss="modal">No, take me back</button>
<button type="button" class="btn btn-success" data-dismiss="modal" onclick="runTask()">Yes, start the Run</button>
</div>
</div>
</div>
</div>
</div>
<table class="table table-bordered">
<tr><td>Selected Profile</td><td><b><span id="sel_prof"></span></b></td></tr>
<tr><td>Estimated Runtime</td><td><b>5 Minutes</b></td></tr>
<tr><td>Estimated Power consumption</td><td><b>0.320 kWh (EUR 0.08)</b></td></tr>
</table>
</div>
<div class="modal-footer">
<div class="btn-group" style="width: 100%">
<button type="button" class="btn btn-danger" data-dismiss="modal">No, take me back</button>
<button type="button" class="btn btn-success" data-dismiss="modal" onclick="runTask()">Yes, start the Run</button>
</div>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script>
var state = "IDLE";
var graph;
var profiles = [];
var selected_profile = 0;
var selected_profile_name = "leadfree";
var host = "ws://" + window.location.hostname + ":8080";
// Status Socket ////////////////////////////////
var ws_status = new WebSocket(host+"/status");
ws_status.onopen = function()
{
console.log("Status Socket has been opened");
}
// Control Socket ////////////////////////////////
var ws_control = new WebSocket(host+"/control");
ws_control.onopen = function()
{
ws_control.onmessage = function(e)
{
console.log (e.data);
}
console.log("Control Socket has been opened");
}
// Storage Socket ///////////////////////////////
var ws_storage = new WebSocket(host+"/storage");
ws_storage.onopen = function()
{
console.log("Storage Socket has been opened");
ws_storage.onmessage = function(e)
{
console.log('Storage MSG:' + e.data);
message = JSON.parse(e.data);
console.log("Parsed message:" + message);
if(message.resp)
{
console.log("RESP");
if(message.resp == "FAIL")
{
console.log("FAIL");
if (confirm('Overwrite?')) {
//message.cmd="PUT";
message.force=true;
console.log("Sending: " + JSON.stringify(message));
ws_storage.send(JSON.stringify(message));
} else {
//do nothing
}
}
return;
}
//the message is an array of profiles
//FIXME: this should be better, maybe a {"profiles": ...} container?
profiles = message;
//delete old options in select
$('#e2')
.find('option')
.remove()
.end();
// fill select with new options from websocket
for (var i=0; i<profiles.length; i++)
{
var profile = profiles[i];
console.log(profile.name);
$('#e2').append('<option value="'+i+'">'+profile.name+'</option>');
if (profile.name == selected_profile_name)
{
console.log('Matchiemazvhie');
selected_profile = i;
$('#e2').select2('val', i);
update_profile(i);
}
}
graph.render();
}
console.log('Requesting stored profiles');
ws_storage.send('GET');
}
$("#e2").select2({
placeholder: "Temperature Curve",
allowClear: false
});
$("#e2").on("change", function(e) {
update_profile(e.val);
});
// Apply the theme
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);
$(function() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
graph = new Highcharts.Chart(getHCOptions());
});
</script>
</body>
</html>