123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384 |
- <!DOCTYPE html>
- <html>
- <head>
- <link rel="stylesheet" type="text/css" href="garage_door_control.css">
- <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
- <meta charset="UTF-8">
- <title>Garage Remote</title>
- </head>
- <script>
- var xmlHttp = null;
- function pushTheButton(door)
- {
- var url = "/garage_door.lua?action=toggle&door=" + door;
- xmlHttp = new XMLHttpRequest();
- xmlHttp.onreadystatechange = processRequest;
- xmlHttp.open("GET", url, true);
- xmlHttp.send( null );
- }
- function processRequest()
- {
- if(xmlHttp.readyState == 0)
- {
- document.getElementById("label").innerHTML = 'Initalizing...';
- document.getElementById("label").className = "initalizing";
- }
- else if(xmlHttp.readyState == 1)
- {
- document.getElementById("label").innerHTML = 'Server connection established.';
- document.getElementById("label").className = "connection";
- }
- else if(xmlHttp.readyState == 2)
- {
- document.getElementById("label").innerHTML = 'Request received.';
- document.getElementById("label").className = "received";
- }
- else if(xmlHttp.readyState == 3)
- {
- document.getElementById("label").innerHTML = 'Processing request.';
- document.getElementById("label").className = "processing";
- }
- else if(xmlHttp.readyState == 4)
- {
- if(xmlHttp.status == 200)
- {
- document.getElementById("label").innerHTML = xmlHttp.responseText;
- document.getElementById("label").className = "ok";
- sleep(300);
- document.getElementById("label").className = "start";
- }
- else if(xmlHttp.status == 400)
- {
- document.getElementById("label").innerHTML = 'Bad request.';
- document.getElementById("label").className = "bad";
- }
- }
- }
- function sleep(milliseconds){
- var start = new Date().getTime();
- for (var i = 0; i < 1e7; i++)
- {
- if ((new Date().getTime() - start) > milliseconds)
- {
- break;
- }
- }
- }
- </script>
- <body bgcolor="#777777">
- <div id="remote">
- <div id="label" class="start"></div>
- <a href="#" onclick="pushTheButton(1);" class="button button-1">
- <span>I</span>
- </a>
- <a href="#" onclick="pushTheButton(2); " class="button button-2">
- <span>II</span>
- </a>
- <div id="spacer"></div>
- </div>
- </body>
- </html>
|