function testme() { alert("here I am ! "); } // peekaboo controls the 'hover' behavior on the graph function peekaboo(myelement, value) { //alert(myelement); myelement.style.fill= myelement.style.fill=="none"?"green":"none"; if (value == "none") { document.getElementById("graph-value").innerHTML = ""; } else { value = Math.round(value*10000)/10000; document.getElementById("graph-value").innerHTML = value; } } // this provides an initial dataset... not sure how we're going to do this with the real thing ? function populate() { for (x=1; x < 200; x++) { mynumber = Math.floor((Math.random() * 100) + 1); //document.write(x + ":" + mynumber + ": mon" + x + "
"); document.getElementById("mon" + x).defaultValue = mynumber; } } function restorepanel() { document.getElementById("panel").style.display="inline-block"; } function flicker() { document.getElementById("panel").style.display="none"; setTimeout(restorepanel, 1000) } // this function used to populate the iframe page. Int the final version this would be replaced by a server call to the PLC in the plc.htm page. function bpopulate() { for (x=1; x < 200; x++) { mynumber = Math.floor((Math.random() * 100) + 1); //document.write(x + ":" + mynumber + ": mon" + x + "
"); document.getElementById("bmon" + x).defaultValue = mynumber; } } // this function assumes that the iframe has loaded, and reads its values and uses them to draw the graph. function parseframe() { document.getElementById("linkcheck").innerHTML = "Link DOWN
Unable to establish contact with host"; document.getElementById("linkcheck").style.color="red"; var myIFrame = document.getElementById('updateframe').contentWindow; // now lets try SVG. angleseed = Math.random()*3.141*2; SVGheight = 180; mySVG = "" //OK, lets first use an SVG polyline to draw a graph..... mypolyline = " "; // All well and good. Now lets try the polygon series to allow hover behavior mypolygons = ""; for (x=2; x < 200; x++) { mypolygon = ""; mypolygons = mypolygons + mypolygon; } // end of polygon section. Now lets put it all together. mySVG = mySVG + mypolyline + mypolygons + ""; document.getElementById("svg").innerHTML = mySVG ; // end of SVG section. document.getElementById("linkcheck").innerHTML = "Link Up"; document.getElementById("linkcheck").style.color="green"; } function iframerefresh() { document.getElementById("linkcheck").innerHTML = "refreshing.."; document.getElementById("linkcheck").style.color="red"; var refreshframe = document.getElementById('updateframe').contentWindow; try { refreshframe.location.reload(); document.getElementById("linkcheck").innerHTML = "Link Restored !"; document.getElementById("linkcheck").style.color="green" parseframe(); } catch(error) { document.getElementById("linkcheck").innterHTML = "Error:" + error; } loadDoc(); } // this really just tests wether the plc.htm file is available... needs some work... function loadDoc() { document.getElementById("linkcheck").innerHTML = "Link Failed"; var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("linkcheck").innerHTML = "Link Up"; document.getElementById("linkcheck").style.color="green"; } else { //linkmessage = document.getElementById("linkcheck").innerHTML; document.getElementById("linkcheck").innerHTML = "Link Up ....Refreshing Data"; //document.getElementById("linkcheck").style.color="red"; } } xhttp.open("GET", "plc.htm", true); xhttp.send(); } function cycle() { cycleme = setInterval(iframerefresh, 3000); document.getElementById('current-status').innerHTML='Status: Cycling'; }