diff service/pilight/static/index.html @ 138:cc04b6af0477

start pilight server in go Ignore-this: f10b5ce373b929bcedbe18b315f0abb9
author drewp@bigasterisk.com
date Sat, 12 Jul 2014 11:31:40 -0700
parents
children 7233fdb6b30a
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/service/pilight/static/index.html	Sat Jul 12 11:31:40 2014 -0700
@@ -0,0 +1,81 @@
+<!doctype html>
+<html>
+  <head>
+    <title>pilight</title>
+    <meta charset="utf-8" />
+    <script src="//bigasterisk.com/lib/jquery-2.0.3.js"></script>
+    <script src="//bigasterisk.com/lib/platform/0.2.3/platform.js"></script>
+    <link rel="import" href="static/input-rgb/input-rgb.html">
+    <style>
+      input-rgb {
+       border: 1px solid gray;
+       width: 300px;
+     }
+    </style>
+  </head>
+  <body>
+
+    <polymer-element name="led-output" attributes="url color">
+    <!-- calls PUT <url> with color string as the body, but also
+         avoids sending many repeated calls to url while the first one
+         is still in progress -->
+      <template>
+        {{status}}
+      </template>
+      <script>Polymer('led-output', {
+          created: function() {
+              this.pending = {}; // url: data
+              this.inflight = false;
+          },
+          colorChanged: function() {
+              this.pending["led"] = this.color;
+              this.sendMore();
+          },
+          sendMore: function() {
+              if (this.inflight) {
+                  return;
+              }
+              var urls = Object.keys(this.pending);
+              if (!urls.length) {
+                  return;
+              }
+              var url = urls.pop();
+              var data = this.pending[url];
+              delete this.pending[url];
+
+              this.status = "Sending...";
+              this.inflight = true;
+              $.ajax({
+                  type: "PUT",
+                  url: url,
+                  data: data,
+                  success: function() {
+                      this.status = "";
+                  }.bind(this),
+                  error: function() {
+                      this.status = "Send failed";
+                  }.bind(this),
+                  complete: function() {
+                      this.inflight = false;
+                      this.sendMore();
+                  }.bind(this)
+              });
+        }
+      });
+      </script>
+
+    </polymer-element>
+      
+    <polymer-element name="pilight-page" noscript>
+      <template>
+        LED0 color:
+        <input-rgb editable="true" hex="{{c1}}"></input-rgb>
+        <led-output which="led" color="{{c1}}"></led-output>
+      </template>
+    </polymer-element>
+
+    <pilight-page></pilight-page>
+
+
+  </body>
+</html>