Trying to make my own HTML dashboard.
Not because it is easy, but i have a lot of fun doing it. But i can't get it to work propperly.
Hopefully somebody can say me what i am doing wrong, i just don't see it where it goes wrong
I added a picture Lamp_off.png which is my start picture.
When putting my cursor on it, the javascript is empty, which it needs to run.
Can somebody help me?
This is the IDX i am using for testing
Code: Select all
<html>
<head>
<head>
<title>Home Control</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="shortcut icon" href="favicon.ico" />
<link rel="apple-touch-icon" href="iphone-icon.png"/>
<link rel="icon" sizes="196x196" href="logo.png">
<link rel="icon" sizes="192x192" href="logo192.png">
<link rel="stylesheet" media="(orientation: portrait)" href="portrait.css">
<link rel="stylesheet" media="(orientation: landscape)" href="landscape.css">
<link href="https://fonts.googleapis.com/css?family=Baloo|Comfortaa" rel="stylesheet">
<script language="JavaScript" type="text/JavaScript">
<!--
<!--
// var devicestodisplay =[90];
// var nod=0;
var domoticzurl="192.168.178.29";
var domoticzport="8080";
function toggle(devicecode){
execute('PUT', 'http://192.168.178.29:8080/json.htm?type=command¶m=switchlight&idx='+devicecode+'&switchcmd=Toggle', '');
}
function execute($method,$url,$message){
xmlhttp=new XMLHttpRequest();
xmlhttp.open($method,$url,true)
xmlhttp.send($message);
// xmlhttp.open("GET", url, true);
// xmlhttp.send();
}
function updatedevice(idx,location,onimage,offimage){
console.log("checking status of idx "+idx)
var xmlhttp = new XMLHttpRequest();
var url = "http://192.168.178.29:8080/json.htm?type=devices&rid="+idx;
var onoff
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var myArr = JSON.parse(xmlhttp.responseText);
onoff = myArr.result[0].Status;
devicename = myArr.result[0].Name;
// myFunction(myArr);
}
if (onoff == "On") {
document.getElementById(location).src = onimage;
}
if (onoff == "Off") {
document.getElementById(location).src = offimage;
}
if (onoff == "Open") {
document.getElementById(location).src = onimage;
}
if (onoff == "Closed") {
document.getElementById(location).src = offimage;
}
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
//-->
</script>
<body>
<a href="javascript:;" onClick="toggle(90);"><img src="Lamp_off.png" width="125" height="125" hspace="5" vspace="5" border="0" id="000140AA"></a>
<audio id="scene" src="assets/sounds/beep2.mp3" preload="auto"></audio>
<div align="left" class="toplinks">
<a href="index.htm"><img border="0" src="home_off.png" width="100" height="100"></a>
<a href="lights.htm"><img border="0" src="lights_on.png" width="100" height="100"></a>
<a href="devices.htm"><span class="menutext">Devices</span></a>
<a href="audiotrial.htm"><span class="menutext">Audio</span></a>
<a href="climate.htm"><span class="menutext">Environment</span></a>
<a href="security.htm"><span class="menutext">Security</span></a>
<a href="activities.htm"><span class="menutext">Other screens</span></a></div>
<div id="notification" align="center" class="notificationpane" onClick="clearnotification(11);"></div>
<div id="devicesdiv"></div>
</body>
</html>Uncaught ReferenceError: url is not defined
at execute (lights.htm:38)
at toggle (lights.htm:33)
at HTMLAnchorElement.onclick (lights.htm:79)
At execute (lights.htm:38) = the bold text in the next part
function execute($method,$url,$message){
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET", url, true);
xmlhttp.send();
At toggle (ligths.htm:33) = the bold text in the next part
function toggle(devicecode){
execute('PUT', 'http://192.168.178.29:8080/json.htm?typ ... cmd=Toggle', '');
At HTMLAnchorElement.onclick (lights.htm:79) = the bold text in the next part
<a href="javascript:;" onClick="toggle(90);"><img src="Lamp_off.png" width="125" height="125" hspace="5" vspace="5" border="0" id="000140AA"></a>
