Mercurial > code > home > repos > homeauto

diff service/theaterArduino/index.html @ 809:bebb8f7c5a3e

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
move a bunch of services into this tree, give them all web status pages Ignore-this: a11e90f9d2cd9470565c743f54943c4b darcs-hash:20110808073131-312f9-a7f420d66388cedae458276d672a27a9249f1e2f.gz
author drewp <drewp@bigasterisk.com>
date Mon, 08 Aug 2011 00:31:31 -0700
parents
children
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/service/theaterArduino/index.html	Mon Aug 08 00:31:31 2011 -0700
@@ -0,0 +1,160 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
+"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title></title>
+  </head>
+  <body>
+
+    <h1>pyduino web interface</h1>
+
+    <p>Use GET or PUT on the resources below. The value is a "0" or "1"
+    string. PUT "output" to /pin/d2/mode (etc) to make it writable.</p>
+
+    <div>
+      pin/d2 : <input type="checkbox" name="d2" value="set" id="d2"/> 
+      <span class="mode"> <input type="radio" name="d2-mode" value="input" id="d2-input"/> <label for="d2-input">input</label> 
+      <input type="radio" name="d2-mode" value="output" id="d2-output"/> <label for="d2-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d3 : <input type="checkbox" name="d3" value="set" id="d3"/> 
+      <span class="mode"> <input type="radio" name="d3-mode" value="input" id="d3-input"/> <label for="d3-input">input</label> 
+      <input type="radio" name="d3-mode" value="output" id="d3-output"/> <label for="d3-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d4 : <input type="checkbox" name="d4" value="set" id="d4"/> 
+      <span class="mode"> <input type="radio" name="d4-mode" value="input" id="d4-input"/> <label for="d4-input">input</label> 
+      <input type="radio" name="d4-mode" value="output" id="d4-output"/> <label for="d4-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d5 : <input type="checkbox" name="d5" value="set" id="d5"/> 
+      <span class="mode"> <input type="radio" name="d5-mode" value="input" id="d5-input"/> <label for="d5-input">input</label> 
+      <input type="radio" name="d5-mode" value="output" id="d5-output"/> <label for="d5-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d6 : <input type="checkbox" name="d6" value="set" id="d6"/> 
+      <span class="mode"> <input type="radio" name="d6-mode" value="input" id="d6-input"/> <label for="d6-input">input</label> 
+      <input type="radio" name="d6-mode" value="output" id="d6-output"/> <label for="d6-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d7 : <input type="checkbox" name="d7" value="set" id="d7"/> 
+      <span class="mode"> <input type="radio" name="d7-mode" value="input" id="d7-input"/> <label for="d7-input">input</label> 
+      <input type="radio" name="d7-mode" value="output" id="d7-output"/> <label for="d7-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d8 : <input type="checkbox" name="d8" value="set" id="d8"/> 
+      <span class="mode"> <input type="radio" name="d8-mode" value="input" id="d8-input"/> <label for="d8-input">input</label> 
+      <input type="radio" name="d8-mode" value="output" id="d8-output"/> <label for="d8-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d9 : <input type="checkbox" name="d9" value="set" id="d9"/> 
+      <span class="mode"> <input type="radio" name="d9-mode" value="input" id="d9-input"/> <label for="d9-input">input</label> 
+      <input type="radio" name="d9-mode" value="output" id="d9-output"/> <label for="d9-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d10 : <input type="checkbox" name="d10" value="set" id="d10"/> 
+      <span class="mode"> <input type="radio" name="d10-mode" value="input" id="d10-input"/> <label for="d10-input">input</label> 
+      <input type="radio" name="d10-mode" value="output" id="d10-output"/> <label for="d10-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d11 : <input type="checkbox" name="d11" value="set" id="d11"/> 
+      <span class="mode"> <input type="radio" name="d11-mode" value="input" id="d11-input"/> <label for="d11-input">input</label> 
+      <input type="radio" name="d11-mode" value="output" id="d11-output"/> <label for="d11-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d12 : <input type="checkbox" name="d12" value="set" id="d12"/> 
+      <span class="mode"> <input type="radio" name="d12-mode" value="input" id="d12-input"/> <label for="d12-input">input</label> 
+      <input type="radio" name="d12-mode" value="output" id="d12-output"/> <label for="d12-output">output</label> </span>
+    </div>
+
+    <div>
+      pin/d13 : <input type="checkbox" name="d13" value="set" id="d13"/> 
+      <span class="mode"> <input type="radio" name="d13-mode" value="input" id="d13-input"/> <label for="d13-input">input</label> 
+      <input type="radio" name="d13-mode" value="output" id="d13-output"/> <label for="d13-output">output</label> </span>
+    </div>
+
+    <div><button id="refresh">Refresh</button> <input type="checkbox" name="autoRefresh" id="autoRefresh"/> <label for="autoRefresh">Auto refresh</label></div>
+
+
+    <div id="ajaxError"/>
+
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
+    <script type="text/javascript">
+    // <![CDATA[
+    $(function() { 
+	$("#ajaxError").ajaxError(function (ev, xhr) {
+	    $(this).text("Error: " + xhr.responseText);
+	});
+
+	function refresh() {
+	    $(".mode input").css('opacity', .2);
+	    $("input[value=set]").css('opacity', .2)
+		.each(function (i, inp) {
+		    var id = $(inp).attr('name');
+		    $.ajax({
+			url: "pin/" + id,
+			type: "GET",
+			success: function (data, textStatus, xhr) {
+			    $(inp).css('opacity', 1).val(data == "1" ? ["set"] : []);
+			},
+		    });
+		    $.ajax({
+			url: "pin/" + id + "/mode",
+			type: "GET",
+			success: function (data, textStatus, xhr) {
+			    var match = $("#" + id + "-" + data);
+			    match.parent().find("input").css('opacity', 1);
+			    match.click();
+			}
+		    });
+		});
+	}
+
+	function refreshLoop() {
+  	    if ($("#autoRefresh").is(":checked")) {
+	        refresh();
+	        setTimeout(function() { refreshLoop(); }, 
+                  500); // refresh is async, so these could pile up
+	    }
+	}
+
+	$("#autoRefresh").click(refreshLoop);
+	$("#refresh").click(refresh);
+
+	$(".mode input").removeAttr('disabled').change(function () {
+	    var id = $(this).attr('id').replace(/-.*/, "");
+	    $.ajax({
+		type: "PUT",
+		contentType: "text/plain",
+		url: "pin/" + id + "/mode",
+		data: $(this).val(),
+	    });
+	});
+
+	$("input[value=set]").change(function () {
+	    var id = $(this).attr('id');
+	    $.ajax({
+		type: "PUT",
+		contentType: "text/plain",
+		url: "pin/"+id,
+		data: $("#"+id+":checked").val() ? "1" : "0",
+	    });
+	});
+	refresh();
+    });
+    // ]]>
+</script>
+
+  </body>
+</html>