image/w/js/webui.js

document.getElementById("test").innerHTML = "WebSocket is not connected";

var websocket = new WebSocket('ws://'+location.hostname+'/ws');
//var slider = document.getElementById("myRange");


var BBScreen={

    Screen: -1,
    setScreen: function(s){
	Screen = parseInt(s,10);
	console.log("Screen:"+Screen);
	switch (Screen) {
            case 0:	$("#mltline").show();
			$("#mlt_table").show();
			$("#but00").text('Hand');
			$("#but20").text('Auto');
			$("#mlt00").show();
                	$("#mlt20").show();
			$("#mlt01").hide();
			$("#mlt21").hide();
			$("#midline").show();
			$("#mid00").hide();
                        $("#mid20").hide();
			$("#hltline").show();
			$("#hlt_table").show();
			$("#hlt00").hide();
                        $("#hlt20").hide();
			$("#hlt01").show();
                	$("#hlt21").show();
			$("#hlt01").css("background-color", "#e7e7e7");
                        $("#hlt01").css("color", "black");
			$("#but04").text('Info');
                        $("#but24").text('Tools');
			$("#row_info").hide();
			$("#prompt").hide();
			break;
	    case 2:     $("#mltline").hide();
                        $("#midline").hide();
                        $("#hltline").hide();
                        $("#row_info").show();
			$("#prompt").hide();
                        break;
//	    case 21:	Automaat show recipe and Stop / Start
//			Prompt
//			Prompt
	    case 100:
            case 101:
            case 102:
            case 103:
            case 104:
            case 105:
            case 106:
            case 107:	$("#mltline").show();
			$("#but00").text('+sp');
			$("#but20").text('-sp');
                        $("#midline").show();
                        $("#hltline").show();
			$("#hlt01").hide();
                        $("#hlt21").hide();
                        $("#row_info").hide();
			$("#prompt").hide();
                        break;
	    case 108:	$("#mltline").show();	// to boil
			$("#midline").hide();
                        $("#hltline").hide();
			$("#prompt").hide();
			break;
            case 109:	$("#mltline").show();	// boil
			$("#midline").show();
			$("#hltline").hide();
			$("#prompt").hide();
			break;
	    case 200:	$("#mltline").hide();
                        $("#midline").hide();
                        $("#hltline").hide();
			$("#row_info").hide();
			$("#prompt").show();
			break;
	    case 201:	$("#mltline").show();
			$("#mlt00").hide();
                	$("#mlt20").hide();
			$("#mlt01").hide();
                        $("#mlt21").hide();
			$("#mlt_table").hide();
			$("#but00").text('+sp');
			$("#but20").text('-sp');
			$("#but01").text('Pomp');
			$("#but21").text('Aan');
			$("#midline").show();
                        $("#mid00").hide();
                        $("#mid20").hide();
			$("#hltline").show();
			$("#hlt00").hide();
                	$("#hlt20").hide();
                	$("#hlt21").hide();
			$("#hlt_table").hide();
			$("#but03").text('+sp');
                        $("#but23").text('-sp');
                        $("#but04").text('Stop');
                        $("#but24").text('Aan');
			$("#hlt01").css("background-color", "#575757");
			$("#hlt01").css("color", "white");
                        $("#row_info").hide();
			$("#prompt").hide();
			break;
            default:    $("#mltline").hide();
			$("#midline").hide();
                        $("#hltline").hide();
			$("#prompt").hide();
                        console.log("this is default screen "+Screen);
                        break;
	}
    },
    MLT_pv: function(s) {
	$("#mlt_pv").text(s);
    },
    MLT_sp: function(s) {
	$("#mlt_sp").text(s);
	if (Screen == 201) {
	    if (s != "") {
		$("#mlt00").show();
                $("#mlt20").show();
		$("#mlt01").show();
                $("#mlt21").show();
		$("#mlt_table").show();
	    }
	}
    },
    MLT_power: function(s) {
	$("#mlt_power").text(s);
    },
    MLT_led: function(s) {
	if (s == 0)
	    $("#mlt_led").css("background-color", "#270");
	else
	    $("#mlt_led").css("background-color", "#5E0");
    },
    Pump_led: function(s) {
	if (s == 0)
	    $("#pump_led").css("background-color", "#820");
	else
	    $("#pump_led").css("background-color", "#F40");
    },
    HLT_pv: function(s) {
	$("#hlt_pv").text(s);
    },
    HLT_sp: function(s) {
	$("#hlt_sp").text(s);
	if (Screen == 201) {
            if (s != "") {
                $("#hlt00").show();
                $("#hlt20").show();
                $("#hlt21").show();
		$("#hlt_table").show();
            }
        }
    },
    HLT_power: function(s) {
	$("#hlt_power").text(s);
    },
    HLT_led: function(s) {
	if (s == 0)
	    $("#hlt_led").css("background-color", "#270");
	else
	    $("#hlt_led").css("background-color", "#5E0");
    },
    Topmessage: function(s) {
	$("#top_msg").text(s);
    },
    Timer: function(s) {
	$("#timer").text(s);
    },
};

var BrewBoard = {

    p_msg:function(e){
	var b=this;
	var a=JSON.parse(e);
	var c={
	    main: function(v){
		BBScreen.setScreen(v)
	    },
	    mlt_pv:function(v){
		BBScreen.MLT_pv(v)
	    },
	    mlt_sp:function(v){
		BBScreen.MLT_sp(v)
	    },
	    mlt_power:function(v){
		BBScreen.MLT_power(v)
	    },
	    mlt_led:function(v){
		BBScreen.MLT_led(v)
	    },
	    pump_led:function(v){
		BBScreen.Pump_led(v)
	    },
	    hlt_pv:function(v){
		BBScreen.HLT_pv(v)
	    },
	    hlt_sp:function(v){
		BBScreen.HLT_sp(v)
	    },
	    hlt_power:function(v){
		BBScreen.HLT_power(v)
	    },
	    hlt_led:function(v){
		BBScreen.HLT_led(v)
	    },
	    top_msg:function(v){
		BBScreen.Topmessage(v)
	    },
	    timer:function(v){
		BBScreen.Timer(v)
	    },
	};
	console.log(e);
	$.each(a,function(k,v){
	    if (typeof(c[k])!="undefined"){
		c[k](v)
	    }
	});
    }
};


function sendTouch(x, y) {
	websocket.send('{"touch":{"x":'+x+',"y":'+y+'}}');
	console.log('Sent {"touch":{"x":'+x+',"y":'+y+'}}');
}


/* Define keys in the screens and their actions. */
$("#ok_info").click( function() { sendTouch(160,220); });
$("#mlt00").click( function()   { sendTouch( 35, 46); });
$("#mlt20").click( function()   { sendTouch(285, 46); });
$("#mlt01").click( function()   { sendTouch( 35, 96); });
$("#mlt21").click( function()   { sendTouch(285, 96); });
$("#mid00").click( function()   { sendTouch( 35,140); });
$("#mid20").click( function()   { sendTouch(285,140); });
$("#hlt00").click( function()   { sendTouch( 35,170); });
$("#hlt20").click( function()   { sendTouch(285,170); });
$("#hlt01").click( function()   { sendTouch( 35,220); });
$("#hlt21").click( function()   { sendTouch(285,220); });
$("#button_ja").click( function()  { sendTouch( 80,120); });
$("#button_nee").click( function() { sendTouch(240,120); });


websocket.onopen = function(evt) {
	console.log('WebSocket connection opened');
	document.getElementById("test").innerHTML = "WebSocket is connected!";
}

/*
 * Process received websocket messages.
 */
websocket.onmessage = function(evt) {
    var msg = evt.data;
    var value;
    switch (msg.charAt(0)) {
	case '{':
		BrewBoard.p_msg(evt.data);
		break;
	default:
		document.getElementById("output").innerHTML = evt.data;
		break;
    }
}

websocket.onclose = function(evt) {
	console.log('Websocket connection closed');
	document.getElementById("test").innerHTML = "WebSocket closed";
}

websocket.onerror = function(evt) {
	console.log('Websocket error: ' + evt);
	document.getElementById("test").innerHTML = "WebSocket error????!!!1!!";
}