Mercurial > code > home > repos > homeauto
annotate service/arduinoNode/static/output-widgets.html @ 1023:3e6fac8569cd
multi-boards on one service, new devices, devices return their current
Ignore-this: e214852bca67519e79f9ddb3644576e1
values in the graph, jsonld support, multiple temp sensors on OW bus
darcs-hash:bc0f86023166e9b1d37c99506f6bc389309db327
author | drewp <drewp@bigasterisk.com> |
---|---|
date | Sun, 03 Jan 2016 02:29:14 -0800 |
parents | ecb12305d5ca |
children | 4ebb5cc30002 |
rev | line source |
---|---|
998 | 1 <link rel="import" href="/lib/polymer/1.0.9/iron-ajax/iron-ajax.html"> |
2 <link rel="import" href="/lib/polymer/1.0.9/polymer/polymer.html"> | |
3 <link rel="import" href="/lib/polymer/1.0.9/color-picker-element/dist/color-picker.html"> | |
4 <link rel="import" href="/room/ari/static/rdf-uri.html"> | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
5 |
998 | 6 <dom-module id="output-sender"> |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
7 <template> |
1023
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
8 <iron-ajax id="graphGet" url="../graph" method="GET" headers='{"Accept": "application/ld+json"}'></iron-ajax> |
998 | 9 <iron-ajax id="output" url="../output" method="PUT"></iron-ajax> |
10 Set <a href$="{{subj}}">{{compactUri(subj)}}</a>'s | |
11 <span>{{compactUri(pred)}}</span> to | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
12 </template> |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
13 <script> |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
14 Polymer({ |
998 | 15 is: 'output-sender', |
16 behaviors: [BigastUri], | |
17 properties: { | |
18 subj: { notify: true }, | |
19 pred: { notify: true }, | |
1023
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
20 value: { notify: true, observer: 'valueChanged' } |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
21 }, |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
22 ready: function() { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
23 this.waitOnChangeMs = 100; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
24 this.smallestRequestPeriodMs = 200; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
25 this.synced = false; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
26 |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
27 this.newRequestNeedsSending = false; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
28 this.lastSendMs = 0; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
29 this.$.output.addEventListener('response', this.onResponse.bind(this)); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
30 |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
31 this.loadInitialValue(); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
32 }, |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
33 loadInitialValue: function() { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
34 this.$.graphGet.addEventListener('response', function(ev) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
35 ev.target.removeEventListener(ev.type, arguments.callee); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
36 |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
37 ev.detail.response.forEach(function(row) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
38 var subj = row['@id']; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
39 if (subj == this.subj) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
40 Object.keys(row).forEach(function(pred) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
41 if (pred == this.pred) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
42 row[pred].forEach(function(obj) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
43 this.value = obj['@value']; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
44 this.synced = true; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
45 }.bind(this)); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
46 } |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
47 }.bind(this)); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
48 } |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
49 }.bind(this)); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
50 |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
51 }.bind(this)); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
52 this.$.graphGet.generateRequest(); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
53 }, |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
54 onResponse: function() { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
55 if (!this.newRequestNeedsSending) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
56 return; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
57 } |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
58 if (this.$.output.activeRequests.length > 0) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
59 return; // 'response' event will call us back |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
60 } |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
61 |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
62 var now = Date.now(), dt = now - this.lastSendMs; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
63 if (dt < this.smallestRequestPeriodMs) { |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
64 setTimeout(this.onResponse.bind(this), |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
65 this.smallestRequestPeriodMs - dt); |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
66 return; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
67 } |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
68 this.newRequestNeedsSending = false; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
69 this.lastSendMs = now; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
70 this.$.output.generateRequest(); |
998 | 71 }, |
72 valueChanged: function () { | |
73 if (!this.subj || !this.pred) { | |
74 return; | |
75 } | |
992
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
76 //this.$.output.headers = {'content-type': ...} |
998 | 77 this.$.output.params = {s: this.subj, p: this.pred}; |
992
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
78 this.$.output.body = this.value; |
1023
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
79 this.newRequestNeedsSending = true; |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
80 setTimeout(this.onResponse.bind(this), this.waitOnChangeMs); |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
81 } |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
82 }); |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
83 </script> |
998 | 84 </dom-module> |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
85 |
998 | 86 <dom-module id="output-rgb"> |
992
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
87 <template> |
1023
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
88 <div style="display: flex"> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
89 <div> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
90 <output-sender subj="{{subj}}" pred="{{pred}}" value="{{value}}"></output-sender> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
91 <div>color pick <span>{{value}}</span> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
92 <button on-click="black">Black</button> |
998 | 93 <button on-click="white">White</button> |
1023
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
94 </div> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
95 </div> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
96 <div> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
97 <color-picker id="pick" width="200" height="100" color="{{value}}"></color-picker> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
98 </div> |
3e6fac8569cd
multi-boards on one service, new devices, devices return their current
drewp <drewp@bigasterisk.com>
parents:
998
diff
changeset
|
99 </div> |
998 | 100 </template> |
101 <script> | |
102 Polymer({ | |
103 is: 'output-rgb', | |
104 properties: { | |
105 value: { notify: true }, | |
106 }, | |
107 ready: function () { | |
108 this.$.pick.addEventListener('colorselected', function (ev) { | |
109 this.value = ev.detail.hex; | |
110 }.bind(this)); | |
111 }, | |
112 black: function() {this.value = "#000000";}, | |
113 white: function() {this.value = "#ffffff";} | |
114 }); | |
115 </script> | |
116 </dom-module> | |
117 | |
118 <dom-module id="output-slider"> | |
119 <template> | |
120 <output-sender subj="{{subj}}" pred="{{pred}}" value="{{value}}"></output-sender> | |
121 <input type="range" min="{{min}}" max="{{max}}" step="{{step}}" value="{{value::input}}"> <span>{{value}}</span> | |
992
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
122 </template> |
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
123 <script> |
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
124 Polymer({ |
998 | 125 is: 'output-slider', |
126 properties: { | |
127 max: { notify: true }, | |
128 min: { notify: true }, | |
129 step: { notify: true } | |
130 }, | |
992
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
131 }); |
ed1f54d81fc9
board control ui: output-rgb, fix ajax protocol, display output uris
drewp <drewp@bigasterisk.com>
parents:
978
diff
changeset
|
132 </script> |
998 | 133 </dom-module> |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
134 |
998 | 135 <!-- |
136 TODO(polyup): Inheriting from other custom elements is not yet supported. | |
137 See: https://www.polymer-project.org/1.0/docs/migration.html#inheritance | |
138 --> | |
139 <dom-module id="output-fixed-text"> | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
140 <template> |
998 | 141 <output-sender subj="{{subj}}" pred="{{pred}}" value="{{value}}"></output-sender> |
142 <textarea rows="{{rows}}" cols="{{cols}}" value="{{value::input}}"></textarea> | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
143 </template> |
998 | 144 <script> |
145 Polymer({ | |
146 is: 'output-fixed-text', | |
147 properties: { | |
148 cols: { notify: true }, | |
149 rows: { notify: true } | |
150 }, | |
151 }); | |
152 </script> | |
153 </dom-module> | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
154 |
998 | 155 <dom-module id="output-switch"> |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
156 <template> |
998 | 157 <output-sender subj="{{subj}}" pred="{{pred}}" value="{{value}}"></output-sender> |
158 <input type="checkbox" checked="{{check::change}}"> <span>{{value}}</span> | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
159 </template> |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
160 <script> |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
161 Polymer({ |
998 | 162 is: 'output-switch', |
163 properties: { | |
164 check: { | |
165 type: Boolean, | |
166 value: false, | |
167 observer: 'checkChanged' | |
168 }, | |
169 value: { notify: true } | |
170 }, | |
171 checkChanged: function () { | |
172 this.value = this.check ? 'high' : 'low'; | |
173 }, | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
174 }); |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
175 </script> |
998 | 176 </dom-module> |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
177 |
998 | 178 <dom-module id="output-widget-any"> |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
179 <template></template> |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
180 <script> |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
181 Polymer({ |
998 | 182 is: 'output-widget-any', |
183 properties: { | |
184 desc: { type: Object, notify: true } | |
185 }, | |
186 ready: function () { | |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
187 var elem = document.createElement(this.desc.element); |
998 | 188 this.appendChild(elem); |
975
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
189 for (var k of Object.keys(this.desc)) { |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
190 elem.setAttribute(k, this.desc[k]); |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
191 } |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
192 } |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
193 }); |
f3023410d875
polymer board debug page with working output widgets
drewp <drewp@bigasterisk.com>
parents:
diff
changeset
|
194 </script> |
998 | 195 </dom-module> |