server side script - pop up controls for a light
Page 1 of 1
server side script - pop up controls for a light
Helloooo,
You might have seen the pop up style controls i have for the lights.
This is achieved by the use of 2 server side scripts and in the case of Z-Wave (2 Way): -
a). the actual light graphic is linked to the status device for the light.
b). the controls (which are usually hidden) are linked to the control device.
The 2 scripts themselves are linked by the id parameter and they should be identical.
Server side scripts
Status
if (value<1) pic='0.png'; else pic='1.png';
lib='graphics/misc/Lamp/';
id='zone03light';
msg='click for\ncontrols';
var s ="";
s+="<img title='"+msg+"' style='cursor:pointer' src='"+lib+pic+"' ";
s+="onclick='tog_ctrl(\""+id+"\")'/>";
s+="<div style='position:absolute; top: 0px; right: 18px'>";
s+="<span style='font-size:8px'>"+value+"%</span>";
s+="</div>";
return s;
Control
lib='graphics/switch/StopStart/';
id='zone03light';
on='50';
off='0';
var s ="";
s+="<div id=\""+id+"\" style='display:none'>";
s+=" <div style='width:16px;height:16px;border:1px solid black;'>";
s+=" <img style='cursor:pointer' title='on' src='"+lib+"1.png'";
s+=" onclick='mango.view.setPoint("+point.id+","+pointComponent.id+","+on+");tog_ctrl(\""+id+"\")'/>";
s+=" <div style='position:absolute; top: 17px; left: 0px'>";
s+=" <div style='width:16px;height:16px;border:1px solid black;'/>";
s+=" <img style='cursor:pointer' title='off' src='"+lib+"0.png'";
s+=" onclick='mango.view.setPoint("+point.id+","+pointComponent.id+","+off+");tog_ctrl(\""+id+"\")'/>";
s+=" </div>";
s+=" <div style='position:absolute; top: -11px; left: 18px'>";
s+=" <input title='level' type='text' size='2' maxlength='3' placeholder=' %'";
s+=" onchange='mango.view.setPoint("+point.id+","+pointComponent.id+",this.value)'/>";
s+="</div>";
return s;
In operation, you'd click click on the status graphic and this would toggle the visibility of the control graphic.
I believe i've also made it so that if you click 'off' or 'on', the controls automatically disappear.
If you wanted to change this behaviour, that's easily changed by amending the script.
Neil
You might have seen the pop up style controls i have for the lights.
This is achieved by the use of 2 server side scripts and in the case of Z-Wave (2 Way): -
a). the actual light graphic is linked to the status device for the light.
b). the controls (which are usually hidden) are linked to the control device.
The 2 scripts themselves are linked by the id parameter and they should be identical.
Server side scripts
Status
if (value<1) pic='0.png'; else pic='1.png';
lib='graphics/misc/Lamp/';
id='zone03light';
msg='click for\ncontrols';
var s ="";
s+="<img title='"+msg+"' style='cursor:pointer' src='"+lib+pic+"' ";
s+="onclick='tog_ctrl(\""+id+"\")'/>";
s+="<div style='position:absolute; top: 0px; right: 18px'>";
s+="<span style='font-size:8px'>"+value+"%</span>";
s+="</div>";
return s;
Control
lib='graphics/switch/StopStart/';
id='zone03light';
on='50';
off='0';
var s ="";
s+="<div id=\""+id+"\" style='display:none'>";
s+=" <div style='width:16px;height:16px;border:1px solid black;'>";
s+=" <img style='cursor:pointer' title='on' src='"+lib+"1.png'";
s+=" onclick='mango.view.setPoint("+point.id+","+pointComponent.id+","+on+");tog_ctrl(\""+id+"\")'/>";
s+=" <div style='position:absolute; top: 17px; left: 0px'>";
s+=" <div style='width:16px;height:16px;border:1px solid black;'/>";
s+=" <img style='cursor:pointer' title='off' src='"+lib+"0.png'";
s+=" onclick='mango.view.setPoint("+point.id+","+pointComponent.id+","+off+");tog_ctrl(\""+id+"\")'/>";
s+=" </div>";
s+=" <div style='position:absolute; top: -11px; left: 18px'>";
s+=" <input title='level' type='text' size='2' maxlength='3' placeholder=' %'";
s+=" onchange='mango.view.setPoint("+point.id+","+pointComponent.id+",this.value)'/>";
s+="</div>";
return s;
In operation, you'd click click on the status graphic and this would toggle the visibility of the control graphic.
I believe i've also made it so that if you click 'off' or 'on', the controls automatically disappear.
If you wanted to change this behaviour, that's easily changed by amending the script.
Neil
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum
|
|