|
1 | 1 | <html> |
2 | | -<!-- To try locally, run: `yarn build` and then `npx http-server -o` --> |
| 2 | + <!-- To try locally, run: `yarn build` and then `npx http-server -o` --> |
3 | 3 |
|
4 | | -<body> |
5 | | - <table> |
6 | | - <tbody> |
| 4 | + <body> |
| 5 | + <table> |
| 6 | + <tbody></tbody> |
| 7 | + </table> |
| 8 | + <script type="module"> |
| 9 | + import { |
| 10 | + getAuth, |
| 11 | + getUser, |
| 12 | + callService, |
| 13 | + createConnection, |
| 14 | + subscribeEntities, |
| 15 | + ERR_HASS_HOST_REQUIRED |
| 16 | + } from "./dist/haws.es.js"; |
7 | 17 |
|
8 | | - </tbody> |
9 | | - </table> |
10 | | - <script type='module'> |
11 | | - import { |
12 | | - getAuth, |
13 | | - getUser, |
14 | | - callService, |
15 | | - createConnection, |
16 | | - subscribeEntities, |
17 | | - ERR_HASS_HOST_REQUIRED, |
18 | | - } from './dist/haws.es.js'; |
19 | | - |
20 | | - (async () => { |
21 | | - let auth; |
22 | | - try { |
23 | | - auth = await getAuth(); |
24 | | - } catch (err) { |
25 | | - if (err === ERR_HASS_HOST_REQUIRED) { |
26 | | - const hassUrl = prompt("What host to connect to?", "http://localhost:8123"); |
27 | | - if (!hassUrl) return; |
28 | | - auth = await getAuth({ hassUrl }); |
29 | | - } else { |
30 | | - alert(`Unknown error: ${err}`); |
31 | | - return; |
| 18 | + (async () => { |
| 19 | + let auth; |
| 20 | + try { |
| 21 | + auth = await getAuth(); |
| 22 | + } catch (err) { |
| 23 | + if (err === ERR_HASS_HOST_REQUIRED) { |
| 24 | + const hassUrl = prompt( |
| 25 | + "What host to connect to?", |
| 26 | + "http://localhost:8123" |
| 27 | + ); |
| 28 | + if (!hassUrl) return; |
| 29 | + auth = await getAuth({ hassUrl }); |
| 30 | + } else { |
| 31 | + alert(`Unknown error: ${err}`); |
| 32 | + return; |
| 33 | + } |
32 | 34 | } |
33 | | - } |
34 | | - const connection = await createConnection({ auth }); |
35 | | - subscribeEntities(connection, entities => renderEntities(connection, entities)); |
| 35 | + const connection = await createConnection({ auth }); |
| 36 | + subscribeEntities(connection, entities => |
| 37 | + renderEntities(connection, entities) |
| 38 | + ); |
36 | 39 |
|
37 | | - // To play from the console |
38 | | - window.auth = auth; |
39 | | - window.connection = connection; |
40 | | - getUser(connection).then(user => console.log("Logged in as", user)); |
41 | | - })(); |
| 40 | + // To play from the console |
| 41 | + window.auth = auth; |
| 42 | + window.connection = connection; |
| 43 | + getUser(connection).then(user => console.log("Logged in as", user)); |
| 44 | + })(); |
42 | 45 |
|
43 | | - function renderEntities(connection, entities) { |
44 | | - const root = document.querySelector('tbody'); |
45 | | - while (root.lastChild) root.removeChild(root.lastChild); |
| 46 | + function renderEntities(connection, entities) { |
| 47 | + const root = document.querySelector("tbody"); |
| 48 | + while (root.lastChild) root.removeChild(root.lastChild); |
46 | 49 |
|
47 | | - Object.keys(entities).sort().forEach((entId) => { |
48 | | - const tr = document.createElement('tr'); |
| 50 | + Object.keys(entities) |
| 51 | + .sort() |
| 52 | + .forEach(entId => { |
| 53 | + const tr = document.createElement("tr"); |
49 | 54 |
|
50 | | - const tdName = document.createElement('td'); |
51 | | - tdName.innerHTML = entId; |
52 | | - tr.appendChild(tdName); |
| 55 | + const tdName = document.createElement("td"); |
| 56 | + tdName.innerHTML = entId; |
| 57 | + tr.appendChild(tdName); |
53 | 58 |
|
54 | | - const tdState = document.createElement('td'); |
55 | | - const text = document.createTextNode(entities[entId].state); |
56 | | - tdState.appendChild(text); |
| 59 | + const tdState = document.createElement("td"); |
| 60 | + const text = document.createTextNode(entities[entId].state); |
| 61 | + tdState.appendChild(text); |
57 | 62 |
|
58 | | - if (['switch', 'light', 'input_boolean'].includes(entId.split('.', 1)[0])) { |
59 | | - const button = document.createElement('button'); |
60 | | - button.innerHTML = 'toggle'; |
61 | | - button.onclick = () => callService(connection, 'homeassistant', 'toggle', { entity_id: entId }); |
62 | | - tdState.appendChild(button); |
63 | | - } |
64 | | - tr.appendChild(tdState); |
65 | | - |
66 | | - root.appendChild(tr); |
67 | | - }); |
68 | | - } |
69 | | - </script> |
70 | | -</body> |
| 63 | + if ( |
| 64 | + ["switch", "light", "input_boolean"].includes( |
| 65 | + entId.split(".", 1)[0] |
| 66 | + ) |
| 67 | + ) { |
| 68 | + const button = document.createElement("button"); |
| 69 | + button.innerHTML = "toggle"; |
| 70 | + button.onclick = () => |
| 71 | + callService(connection, "homeassistant", "toggle", { |
| 72 | + entity_id: entId |
| 73 | + }); |
| 74 | + tdState.appendChild(button); |
| 75 | + } |
| 76 | + tr.appendChild(tdState); |
71 | 77 |
|
| 78 | + root.appendChild(tr); |
| 79 | + }); |
| 80 | + } |
| 81 | + </script> |
| 82 | + </body> |
72 | 83 | </html> |
0 commit comments