Mercurial > code > home > repos > homeauto
view lib/homeauto_anynode/static/index.html @ 1754:92999dfbf321 default tip
add shelly support
author | drewp@bigasterisk.com |
---|---|
date | Tue, 04 Jun 2024 13:03:43 -0700 |
parents | e3af8cc7235d |
children |
line wrap: on
line source
<!doctype html> <html> <head> <title>ha - </title> <meta charset="utf-8"> <script src="/lib/polymer/1.0.9/webcomponentsjs/webcomponents.min.js"></script> <script src="/lib/require/require-2.3.3.js"></script> <script src="/rdf/common_paths_and_ns.js"></script> <link rel="stylesheet" href="/rdf/browse/style.css"> <link rel="import" href="/lib/polymer/1.0.9/polymer/polymer.html"> <link rel="import" href="/lib/polymer/1.0.9/iron-ajax/iron-ajax.html"> <link rel="import" href="/lib/polymer/1.0.9/iron-flex-layout/iron-flex-layout.html"> <link rel="import" href="/lib/polymer/1.0.9/paper-button/paper-button.html"> <link rel="import" href="/rdf/rdf-oneshot.html"> <link rel="import" href="/rdf/rdf-uri.html"> <link rel="import" href="/rdf/streamed-graph.html"> <link rel="import" href="output-widgets.html"> </head> <body class="rdfBrowsePage"> <dom-module id="linked-uri"> <template> <a href$="{{href}}">{{compactUri(href)}}</a> </template> <script> HTMLImports.whenReady(function () { Polymer({ is: 'linked-uri', properties: { href: { notify: true } }, behaviors: [BigastUri] }); }); </script> </dom-module> <dom-module id="watched-subgraph"> <style> .read { font-weight: bold; } </style> <template> <div><span>{{compactUri(subj)}}</span>, <span>{{compactUri(pred)}}</span>, <span class="read">{{formatted(out)}}</span> </div> </template> <script> HTMLImports.whenReady(function () { Polymer({ is: 'watched-subgraph', properties: { streamedGraph: { notify: true, observer: 'onGraphChange' }, // streamed-graph output out: { notify: true }, pred: { notify: true }, // uri subj: { notify: true } // uri }, behaviors: [BigastUri], onGraphChange: function(streamedGraph) { if (!streamedGraph.graph) { return; } var env = streamedGraph.graph.store.rdf; streamedGraph.graph.quadStore.quads({subject: env.createNamedNode(this.subj), predicate: env.createNamedNode(this.pred)}, function(quad) { this.out = quad.object.valueOf(); }.bind(this)); }, formatted: function (obj) { if (typeof(obj) == 'string') { return this.compactUri(obj); } else { return obj; } } }); }); </script> </dom-module> <dom-module id="arduinonode-boards"> <style> h1 { margin: 0; font-size: 130%; } ul { padding-left: 5px; } .board, .device { border: 1px solid gray; border-radius: 10px; margin: 13px; padding: 7px; box-shadow: 2px 5px 5px rgba(0, 0, 0, 0.14); } </style> <template> <streamed-graph url="graph/events" graph="{{graph}}" expanded="true"></streamed-graph> <iron-ajax url="boards" auto="true" handle-as="json" last-response="{{ret}}"></iron-ajax> <template is="dom-repeat" items="{{ret.boards}}" as="board"> <div class="board"> <h1>Board <linked-uri href$="{{board.uri}}"></linked-uri></h1> <h2>Devices</h2> <ul class="devs"> <template is="dom-repeat" items="{{board.devices}}" as="dev"> <div class="device"> <h1> <span>{{dev.className}}</span> <linked-uri href$="{{dev.uri}}"></linked-uri> </h1> <template is="dom-if" if="{{dev.watchPrefixes.length}}"> <div>watching:</div> <ul> <template is="dom-repeat" items="{{dev.watchPrefixes}}" as="prefix"> <watched-subgraph streamed-graph="{{graph}}" subj="{{prefix.0}}" pred="{{prefix.1}}"></watched-subgraph> </template> </ul> </template> <template is="dom-if" if="{{dev.outputWidgets.length}}"> <div>send output:</div> <ul> <template is="dom-repeat" items="{{dev.outputWidgets}}" as="out"> <div> <output-widget-any streamed-graph="{{graph}}" desc="{{out}}"></output-widget-any> </div> </template> </ul> </template> </div> </template> </ul> </div> </template> </template> <script> HTMLImports.whenReady(function () { Polymer({ is: 'arduinonode-boards', properties: { ret: { type: Object, notify: true, observer: 'onBoards' } }, onBoards: function() { document.title = document.title + ' ' + this.ret.host; }, behaviors: [BigastUri] }); }); </script> </dom-module> <arduinonode-boards></arduinonode-boards> </body> </html>