Mercurial > code > home > repos > homeauto
comparison service/arduinoNode/static/output-widgets.html @ 975:f3023410d875
polymer board debug page with working output widgets
Ignore-this: 3157d0c47a91afe47b30a5f182629d93
darcs-hash:20150414063012-312f9-69ac15a9c7bab2b3b5ca00142fe4435ded7d6d0f
author | drewp <drewp@bigasterisk.com> |
---|---|
date | Mon, 13 Apr 2015 23:30:12 -0700 |
parents | |
children | 4d2df276baae |
comparison
equal
deleted
inserted
replaced
974:f707210c13bd | 975:f3023410d875 |
---|---|
1 <link rel="import" href="/lib/polymer/0.5.2/core-ajax/core-ajax.html"> | |
2 | |
3 <polymer-element name="output-widget" attributes="subj pred"> | |
4 <template> | |
5 <core-ajax id="output" url="../output" method="POST"></core-ajax> | |
6 {{subj}} set {{pred}} to | |
7 </template> | |
8 <script> | |
9 function ntriple(s, p, o) { | |
10 // incomplete | |
11 o = o.replace('\n', '\\n'); | |
12 return '<'+s+'> <'+p+'> "'+o+'".'; | |
13 } | |
14 Polymer({ | |
15 valueChanged: function() { | |
16 this.$.output.body = ntriple(this.subj, this.pred, this.value); | |
17 this.$.output.go(); | |
18 } | |
19 }); | |
20 </script> | |
21 </polymer-element> | |
22 | |
23 <polymer-element name="output-slider" extends="output-widget" | |
24 attributes="min max step" | |
25 noscript> | |
26 <template> | |
27 <shadow></shadow> | |
28 <input type="range" | |
29 min="{{min}}" max="{{max}}" step="{{step}}" | |
30 value="{{value}}"> {{value}} | |
31 </template> | |
32 </polymer-element> | |
33 | |
34 <polymer-element name="output-fixed-text" extends="output-widget" | |
35 attributes="rows cols" | |
36 noscript> | |
37 <template> | |
38 <textarea rows="{{rows}}" cols="{{cols}}" value="{{value}}"></textarea> | |
39 </template> | |
40 </polymer-element> | |
41 | |
42 <polymer-element name="output-switch" extends="output-widget"> | |
43 <template> | |
44 <shadow></shadow> | |
45 <input type="checkbox" checked="{{check}}"> {{value}} | |
46 </template> | |
47 <script> | |
48 Polymer({ | |
49 check: false, | |
50 checkChanged: function() { | |
51 this.value = this.check ? "high" : "low"; | |
52 } | |
53 }); | |
54 </script> | |
55 </polymer-element> | |
56 | |
57 <polymer-element name="output-widget-any" attributes="desc"> | |
58 <template></template> | |
59 <script> | |
60 Polymer({ | |
61 domReady: function() { | |
62 var elem = document.createElement(this.desc.element); | |
63 this.shadowRoot.appendChild(elem); | |
64 for (var k of Object.keys(this.desc)) { | |
65 elem.setAttribute(k, this.desc[k]); | |
66 } | |
67 } | |
68 }); | |
69 </script> | |
70 </polymer-element> |