From 60551168a21f941870438e127777d30ac7d3d04f Mon Sep 17 00:00:00 2001 From: Paulus Schoutsen Date: Thu, 20 Jun 2019 23:40:56 -0700 Subject: [PATCH] Update demo (#3292) * Update demo * Kill homebridge hidden * Add missing air translation * Hide demo card with localStorage.hide_demo_card * adjust size of demo card if hidden * disable lint rule --- build-scripts/gulp/translations.js | 1 + demo/src/configs/arsaboo/entities.ts | 172 +++---- demo/src/configs/arsaboo/lovelace.ts | 47 +- demo/src/configs/demo-configs.ts | 4 +- demo/src/configs/jimpower/entities.ts | 5 +- demo/src/configs/jimpower/lovelace.ts | 4 +- demo/src/configs/kernehed/entities.ts | 5 +- demo/src/configs/kernehed/lovelace.ts | 4 +- demo/src/configs/teachingbirds/entities.ts | 5 +- demo/src/configs/teachingbirds/lovelace.ts | 505 +-------------------- demo/src/configs/types.ts | 5 +- demo/src/custom-cards/ha-demo-card.ts | 33 +- demo/src/ha-demo.ts | 22 +- demo/src/stubs/lovelace.ts | 12 +- src/state/translations-mixin.ts | 17 +- src/translations/en.json | 43 ++ 16 files changed, 208 insertions(+), 676 deletions(-) diff --git a/build-scripts/gulp/translations.js b/build-scripts/gulp/translations.js index 138f8b324c..a393f71479 100755 --- a/build-scripts/gulp/translations.js +++ b/build-scripts/gulp/translations.js @@ -34,6 +34,7 @@ const TRANSLATION_FRAGMENTS = [ "profile", "shopping-list", "page-authorize", + "page-demo", "page-onboarding", ]; diff --git a/demo/src/configs/arsaboo/entities.ts b/demo/src/configs/arsaboo/entities.ts index ba8302b34a..a7787debec 100644 --- a/demo/src/configs/arsaboo/entities.ts +++ b/demo/src/configs/arsaboo/entities.ts @@ -1,6 +1,7 @@ -import { Entity, convertEntities } from "../../../../src/fake_data/entity"; +import { convertEntities } from "../../../../src/fake_data/entity"; +import { DemoConfig } from "../types"; -export const demoEntitiesArsaboo: () => Entity[] = () => +export const demoEntitiesArsaboo: DemoConfig["entities"] = (localize) => convertEntities({ "zone.home": { entity_id: "zone.home", @@ -43,10 +44,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => }, "sensor.livingroom_temp_rounded": { entity_id: "sensor.livingroom_temp_rounded", - state: "66", + state: "21", attributes: { friendly_name: "Living room temperature", - homebridge_hidden: true, }, last_changed: "2019-01-22T18:23:58.615703+00:00", last_updated: "2019-01-22T18:23:58.615703+00:00", @@ -54,33 +54,19 @@ export const demoEntitiesArsaboo: () => Entity[] = () => }, "sensor.study_temp_rounded": { entity_id: "sensor.study_temp_rounded", - state: "67", + state: "23", attributes: { friendly_name: "Study temperature", - homebridge_hidden: true, }, last_changed: "2019-01-22T19:17:17.881894+00:00", last_updated: "2019-01-22T19:17:17.881894+00:00", context: { id: "9e25fd2c4032461f83df3ed778fc031e", user_id: null }, }, - "sensor.sonos_audio_in": { - entity_id: "sensor.sonos_audio_in", - state: "Paused", - attributes: { - friendly_name: "Sonos Audio-in", - icon: "hademo:volume-high", - homebridge_hidden: true, - }, - last_changed: "2019-01-22T17:00:14.678332+00:00", - last_updated: "2019-01-22T17:00:14.678332+00:00", - context: { id: "072d120e6d584e4d88e3222196b27e4d", user_id: null }, - }, "sensor.living_room": { entity_id: "sensor.living_room", - state: "PowerOff", + state: "YouTube", attributes: { - friendly_name: "Harmony Activity", - homebridge_hidden: true, + friendly_name: "Harmony", entity_picture: "/assets/arsaboo/icons/Harmony.png", }, last_changed: "2019-01-22T17:00:14.722625+00:00", @@ -93,9 +79,10 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { value: "25m", unit_of_measurement: "h", - friendly_name: "Total TV Time", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.total_tv_time" + ), icon: "hademo:chart-line", - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:14.938049+00:00", last_updated: "2019-01-22T17:00:14.938049+00:00", @@ -124,10 +111,10 @@ export const demoEntitiesArsaboo: () => Entity[] = () => operation: "fan", climate_list: ["Away", "Sleep", "Day", "Home"], fan_min_on_time: 10, - friendly_name: "Upstairs", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.upstairs" + ), supported_features: 3575, - homebridge_hidden: true, - entity_picture: "/assets/arsaboo/icons/Ecobee.png", }, last_changed: "2019-01-22T16:59:56.810867+00:00", last_updated: "2019-01-22T19:33:14.146114+00:00", @@ -139,7 +126,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { friendly_name: "Abode Updates", icon: "hademo:security", - homebridge_hidden: true, templates: { icon_color: "if (state === 'on') return 'rgb(251, 210, 41)'; return 'rgb(54, 95, 140)';\n", @@ -156,7 +142,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { friendly_name: "TV", icon: "hademo:television", - homebridge_hidden: false, templates: { icon_color: "if (state === 'on') return 'rgb(251, 210, 41)'; return 'rgb(54, 95, 140)';\n", @@ -172,7 +157,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { friendly_name: "Home Automation", icon: "hass:home-automation", - homebridge_hidden: true, templates: { icon_color: "if (state === 'on') return 'rgb(251, 210, 41)'; return 'rgb(54, 95, 140)';\n", @@ -188,7 +172,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { friendly_name: "TV Time", icon: "hademo:television-guide", - homebridge_hidden: true, templates: { icon: "if (state === 'on') return 'hademo:television-classic'; return 'hademo:television-classic-off';\n", @@ -202,16 +185,18 @@ export const demoEntitiesArsaboo: () => Entity[] = () => }, "input_select.livingroomharmony": { entity_id: "input_select.livingroomharmony", - state: "PowerOff", + state: "YouTube", attributes: { options: [ "PowerOff", "Watch Fire TV", - "Youtube", + "YouTube", "SATV", "Watch Apple TV", ], - friendly_name: "Harmony Activity", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.activity" + ), icon: "hademo:remote", }, last_changed: "2019-01-22T16:59:56.884366+00:00", @@ -223,7 +208,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => state: "Shield", attributes: { options: ["AppleTV", "FireTV", "Shield"], - friendly_name: "HDMI Switcher", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.hdmi_switcher" + ), icon: "hademo:remote", }, last_changed: "2019-01-22T16:59:56.884597+00:00", @@ -235,7 +222,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => state: "InputHdmi4", attributes: { options: ["InputHdmi1", "InputHdmi2", "InputHDMI3", "InputHdmi4"], - friendly_name: "HDMI Input", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.hdmi_input" + ), icon: "hademo:remote", }, last_changed: "2019-01-22T16:59:56.884850+00:00", @@ -251,7 +240,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => max: 100, step: 1, mode: "slider", - friendly_name: "Volume", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.volume" + ), icon: "hademo:volume-high", }, last_changed: "2019-01-22T17:00:16.104666+00:00", @@ -263,7 +254,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => state: "off", attributes: { last_triggered: null, - friendly_name: "Turn Television off", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.turn_tv_off" + ), }, last_changed: "2019-01-22T16:59:57.074073+00:00", last_updated: "2019-01-22T16:59:57.074073+00:00", @@ -279,7 +272,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => unit_of_measurement: "INR", friendly_name: "USDINR", icon: "hademo:currency-usd", - homebridge_hidden: true, }, last_changed: "2019-01-22T18:25:11.582558+00:00", last_updated: "2019-01-22T18:25:11.582558+00:00", @@ -292,7 +284,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => friendly_name: "Garage Door", icon: "hademo:garage", supported_features: 11, - homebridge_hidden: false, homebridge_cover_type: "garage_door", }, last_changed: "2019-01-22T19:31:05.399638+00:00", @@ -307,7 +298,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => max_mireds: 500, friendly_name: "Master Lights", supported_features: 63, - homebridge_hidden: true, }, last_changed: "2019-01-22T16:59:57.423884+00:00", last_updated: "2019-01-22T16:59:57.423884+00:00", @@ -321,7 +311,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => max_mireds: 400, friendly_name: "Living Room Lights", supported_features: 55, - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:05.573457+00:00", last_updated: "2019-01-22T17:00:05.573457+00:00", @@ -332,7 +321,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => state: "off", attributes: { friendly_name: "Home Security Arm", - homebridge_hidden: true, }, last_changed: "2019-01-22T19:29:19.871240+00:00", last_updated: "2019-01-22T19:29:19.871240+00:00", @@ -344,7 +332,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { friendly_name: "Kitchen lights", supported_features: 1, - homebridge_hidden: false, emulated_hue_hidden: false, emulated_hue_name: "Kitchen lights", }, @@ -354,13 +341,12 @@ export const demoEntitiesArsaboo: () => Entity[] = () => }, "light.hue_color_lamp_1": { entity_id: "light.hue_color_lamp_1", - state: "off", + state: "on", attributes: { min_mireds: 153, max_mireds: 500, - friendly_name: "Master 1", + friendly_name: localize("ui.panel.page-demo.config.arsaboo.names.left"), supported_features: 63, - homebridge_hidden: true, }, last_changed: "2019-01-22T16:59:57.421788+00:00", last_updated: "2019-01-22T16:59:57.421788+00:00", @@ -372,9 +358,10 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { min_mireds: 153, max_mireds: 500, - friendly_name: "Master 2", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.right" + ), supported_features: 63, - homebridge_hidden: true, }, last_changed: "2019-01-22T16:59:57.422442+00:00", last_updated: "2019-01-22T16:59:57.422442+00:00", @@ -382,13 +369,14 @@ export const demoEntitiesArsaboo: () => Entity[] = () => }, "light.hue_color_lamp_3": { entity_id: "light.hue_color_lamp_3", - state: "off", + state: "on", attributes: { min_mireds: 153, max_mireds: 500, - friendly_name: "Master 3", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.mirror" + ), supported_features: 63, - homebridge_hidden: true, }, last_changed: "2019-01-22T16:59:57.423068+00:00", last_updated: "2019-01-22T16:59:57.423068+00:00", @@ -400,7 +388,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { unit_of_measurement: "Watching", friendly_name: "PlexSpy", - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:00.185247+00:00", last_updated: "2019-01-22T17:00:00.185247+00:00", @@ -416,7 +403,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => timezone: "America/New_York", friendly_name: "Front Door Ding", device_class: "occupancy", - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:03.255653+00:00", last_updated: "2019-01-22T18:24:03.677589+00:00", @@ -439,7 +425,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => category: "motion", friendly_name: "Front Door Last Motion", icon: "hademo:history", - homebridge_hidden: true, }, last_changed: "2019-01-22T18:22:33.829681+00:00", last_updated: "2019-01-22T18:23:04.162733+00:00", @@ -513,9 +498,10 @@ export const demoEntitiesArsaboo: () => Entity[] = () => entity_id: "light.gateway_light_34ce00813670", state: "off", attributes: { - friendly_name: "Gateway light", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.hallway" + ), supported_features: 17, - homebridge_hidden: true, emulated_hue_hidden: false, }, last_changed: "2019-01-22T17:00:03.343398+00:00", @@ -534,7 +520,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => cellular_backup: false, friendly_name: "Abode Alarm", icon: "hademo:security", - homebridge_hidden: false, entity_picture: "/assets/arsaboo/icons/Abode.jpg", }, last_changed: "2019-01-22T19:29:19.864324+00:00", @@ -551,7 +536,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => timezone: "America/New_York", friendly_name: "Front Door Motion", device_class: "motion", - homebridge_hidden: true, }, last_changed: "2019-01-22T18:24:14.683620+00:00", last_updated: "2019-01-22T18:24:14.683620+00:00", @@ -565,7 +549,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => battery_level: 43, friendly_name: "Living Room Occupancy", device_class: "motion", - homebridge_hidden: false, }, last_changed: "2019-01-22T19:36:42.441431+00:00", last_updated: "2019-01-22T19:36:42.441431+00:00", @@ -579,7 +562,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => battery_level: 45, friendly_name: "Garage Entry Door", device_class: "door", - homebridge_hidden: true, }, last_changed: "2019-01-22T19:31:03.412180+00:00", last_updated: "2019-01-22T19:31:03.412180+00:00", @@ -593,7 +575,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => battery_level: 49, friendly_name: "Guest Room Occupancy", device_class: "motion", - homebridge_hidden: false, }, last_changed: "2019-01-22T17:00:03.630369+00:00", last_updated: "2019-01-22T17:00:03.630369+00:00", @@ -606,7 +587,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => battery_level: 41, friendly_name: "Laundry Water Leak", device_class: "moisture", - homebridge_hidden: false, }, last_changed: "2019-01-22T17:00:03.632708+00:00", last_updated: "2019-01-22T17:00:03.632708+00:00", @@ -620,7 +600,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => battery_level: 43, friendly_name: "Master Occupancy", device_class: "motion", - homebridge_hidden: false, }, last_changed: "2019-01-22T17:00:03.635223+00:00", last_updated: "2019-01-22T17:00:03.635223+00:00", @@ -634,7 +613,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => battery_level: 41, friendly_name: "Upstairs Occupancy", device_class: "motion", - homebridge_hidden: false, }, last_changed: "2019-01-22T17:00:03.636514+00:00", last_updated: "2019-01-22T17:00:03.636514+00:00", @@ -651,7 +629,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => device_type: "Door Contact", friendly_name: "Front Door", device_class: "door", - homebridge_hidden: true, }, last_changed: "2019-01-22T19:31:27.023892+00:00", last_updated: "2019-01-22T19:31:27.023892+00:00", @@ -668,7 +645,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => device_type: "Door Contact", friendly_name: "Back Door", device_class: "door", - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:03.642051+00:00", last_updated: "2019-01-22T17:00:03.642051+00:00", @@ -681,12 +657,15 @@ export const demoEntitiesArsaboo: () => Entity[] = () => volume_level: 0.18, is_volume_muted: false, media_content_type: "music", - media_duration: 155, + media_duration: 300, media_position: 0, - media_position_updated_at: "2019-05-09T16:21:57.112Z", - media_title: "Ek Ladki Ko Dekha Toh Aisa Laga - Title Track", - media_artist: "Rochak Kohli", - media_album_name: "Ek Ladki Ko Dekha Toh Aisa Laga", + media_position_updated_at: new Date( + // 23 seconds in + new Date().getTime() - 23000 + ).toISOString(), + media_title: "I Wasn't Born To Follow", + media_artist: "The Byrds", + media_album_name: "The Notorious Byrd Brothers", source_list: [ "Bollywood Hindi Hits", "Bollywood Radio and Beyond", @@ -704,11 +683,12 @@ export const demoEntitiesArsaboo: () => Entity[] = () => sonos_group: ["media_player.family_room_2"], night_sound: false, speech_enhance: false, - friendly_name: "Family Room", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.family_room" + ), entity_picture: "/api/media_player_proxy/media_player.family_room_2?token=be41a86e2a360761d67c36a010b09654b730deec092016ee92aafef79b1978ff&cache=e03d22fb103202e7", supported_features: 64063, - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:04.802095+00:00", last_updated: "2019-01-22T17:00:04.802095+00:00", @@ -731,7 +711,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => category: "ding", friendly_name: "Front Door Last Ding", icon: "hademo:history", - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:04.444969+00:00", last_updated: "2019-01-22T17:00:04.444969+00:00", @@ -745,7 +724,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => max_mireds: 400, friendly_name: "LifxnrKitchen", supported_features: 55, - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:05.570989+00:00", last_updated: "2019-01-22T17:00:05.570989+00:00", @@ -759,7 +737,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => max_mireds: 400, friendly_name: "Garage lights", supported_features: 55, - homebridge_hidden: false, emulated_hue_hidden: false, emulated_hue_name: "Garage Lights", }, @@ -773,9 +750,10 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { min_mireds: 111, max_mireds: 400, - friendly_name: "LifxnrGuest", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.patio" + ), supported_features: 55, - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:05.587119+00:00", last_updated: "2019-01-22T17:00:05.587119+00:00", @@ -787,9 +765,10 @@ export const demoEntitiesArsaboo: () => Entity[] = () => attributes: { min_mireds: 111, max_mireds: 400, - friendly_name: "Lifx3", + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.names.kitchen" + ), supported_features: 55, - homebridge_hidden: true, }, last_changed: "2019-01-22T17:00:05.587973+00:00", last_updated: "2019-01-22T17:00:05.587973+00:00", @@ -803,7 +782,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => unit_of_measurement: "lx", friendly_name: "Master Brightness", device_class: "illuminance", - homebridge_hidden: true, icon: "hademo:brightness-7", }, last_changed: "2019-01-22T19:34:01.373772+00:00", @@ -823,8 +801,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => duration: "44 mins", distance: "34.3 mi", unit_of_measurement: "min", - friendly_name: "Commute to Home", - homebridge_hidden: true, + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.commute_home" + ), icon: "hademo:car", }, last_changed: "2019-01-22T17:00:15.963892+00:00", @@ -844,8 +823,9 @@ export const demoEntitiesArsaboo: () => Entity[] = () => duration: "37 mins", distance: "30.2 mi", unit_of_measurement: "min", - friendly_name: "Morning Commute", - homebridge_hidden: true, + friendly_name: localize( + "ui.panel.page-demo.config.arsaboo.labels.morning_commute" + ), icon: "hademo:car", }, last_changed: "2019-01-22T17:00:16.142799+00:00", @@ -855,33 +835,18 @@ export const demoEntitiesArsaboo: () => Entity[] = () => "switch.wemoswitch": { entity_id: "switch.wemoswitch", state: "on", - attributes: { friendly_name: "WeMoSwitch", homebridge_hidden: true }, + attributes: { + friendly_name: localize("ui.panel.page-demo.config.arsaboo.labels.air"), + }, last_changed: "2019-01-22T17:00:22.455617+00:00", last_updated: "2019-01-22T17:00:22.455617+00:00", context: { id: "d5ddc6e4c88f436ab372934934c8675e", user_id: null }, }, - "switch.wemoinsight": { - entity_id: "switch.wemoinsight", - state: "off", - attributes: { - state_detail: "off", - on_latest_time: "00d 00h 00m 17s", - on_today_time: "00d 00h 00m 00s", - on_total_time: "00d 21h 49m 35s", - power_threshold_w: 2, - friendly_name: "WeMoInsight", - homebridge_hidden: true, - }, - last_changed: "2019-01-22T17:00:22.397783+00:00", - last_updated: "2019-01-22T17:00:22.492778+00:00", - context: { id: "1ff8d42d21084350acbdb6002551fc61", user_id: null }, - }, "switch.driveway": { entity_id: "switch.driveway", state: "off", attributes: { friendly_name: "Driveway Light", - homebridge_hidden: false, templates: { icon_color: "if (state === 'on') return 'rgb(251, 210, 41)'; return 'rgb(54, 95, 140)';\n", @@ -900,7 +865,6 @@ export const demoEntitiesArsaboo: () => Entity[] = () => state: "off", attributes: { friendly_name: "Porch Lights", - homebridge_hidden: false, templates: { icon_color: "if (state === 'on') return 'rgb(251, 210, 41)'; return 'rgb(54, 95, 140)';\n", diff --git a/demo/src/configs/arsaboo/lovelace.ts b/demo/src/configs/arsaboo/lovelace.ts index fa387e600e..7039f4bdbb 100644 --- a/demo/src/configs/arsaboo/lovelace.ts +++ b/demo/src/configs/arsaboo/lovelace.ts @@ -1,6 +1,6 @@ -import { LovelaceConfig } from "../../../../src/data/lovelace"; +import { DemoConfig } from "../types"; -export const demoLovelaceArsaboo: () => LovelaceConfig = () => ({ +export const demoLovelaceArsaboo: DemoConfig["lovelace"] = (localize) => ({ title: "Home Assistant", views: [ { @@ -483,15 +483,11 @@ export const demoLovelaceArsaboo: () => LovelaceConfig = () => ({ type: "media-control", entity: "media_player.family_room_2", }, - { - type: "iframe", - aspect_ratio: "90%", - url: - "https://embed.windy.com/embed2.html?zoom=5&level=surface&overlay=rain&menu=&message=&marker=&calendar=&pressure=&type=map&location=coordinates&detail=&detailLat=32.487&detailLon=--84.023&metricWind=default&metricTemp=default&radarRange=-1", - }, { type: "entities", - title: "Information", + title: localize( + "ui.panel.page-demo.config.arsaboo.labels.information" + ), show_header_toggle: false, entities: [ "sensor.morning_commute", @@ -502,52 +498,34 @@ export const demoLovelaceArsaboo: () => LovelaceConfig = () => ({ }, { type: "entities", - title: "Lights", + title: localize("ui.panel.page-demo.config.arsaboo.labels.lights"), entities: [ { entity: "light.gateway_light_34ce00813670", - // type: "custom:slider-entity-row", }, { entity: "light.lifx3", - // type: "custom:slider-entity-row", }, { entity: "light.lifxnrguest", - // type: "custom:slider-entity-row", }, { - entity: "light.lifxnrkitchen", - // type: "custom:slider-entity-row", - }, - { - type: "divider", + type: "section", + label: localize( + "ui.panel.page-demo.config.arsaboo.names.master_bedroom" + ), }, { entity: "light.hue_color_lamp_1", - // type: "custom:slider-entity-row", }, { entity: "light.hue_color_lamp_2", - // type: "custom:slider-entity-row", }, { entity: "light.hue_color_lamp_3", - // type: "custom:slider-entity-row", }, - ], - }, - { - type: "entities", - title: "Switches", - entities: [ { entity: "switch.wemoswitch", - secondary_info: "last-changed", - }, - { - entity: "switch.wemoinsight", - secondary_info: "last-changed", }, ], }, @@ -560,7 +538,9 @@ export const demoLovelaceArsaboo: () => LovelaceConfig = () => ({ }, { type: "entities", - title: "Entertainment", + title: localize( + "ui.panel.page-demo.config.arsaboo.labels.entertainment" + ), show_header_toggle: false, entities: [ "sensor.living_room", @@ -569,7 +549,6 @@ export const demoLovelaceArsaboo: () => LovelaceConfig = () => ({ "input_select.hdmiinput", "input_number.harmonyvolume", "sensor.total_tv_time", - "sensor.sonos_audio_in", "script.tv_off", ], }, diff --git a/demo/src/configs/demo-configs.ts b/demo/src/configs/demo-configs.ts index 868ae24a8f..9fd2c0cf79 100644 --- a/demo/src/configs/demo-configs.ts +++ b/demo/src/configs/demo-configs.ts @@ -25,7 +25,7 @@ export const setDemoConfig = async ( selectedDemoConfigIndex = index; selectedDemoConfig = confProm; - hass.addEntities(config.entities(), true); - lovelace.saveConfig(config.lovelace()); + hass.addEntities(config.entities(hass.localize), true); + lovelace.saveConfig(config.lovelace(hass.localize)); hass.mockTheme(config.theme()); }; diff --git a/demo/src/configs/jimpower/entities.ts b/demo/src/configs/jimpower/entities.ts index f5945c8659..46f1f7152c 100644 --- a/demo/src/configs/jimpower/entities.ts +++ b/demo/src/configs/jimpower/entities.ts @@ -1,6 +1,7 @@ -import { Entity, convertEntities } from "../../../../src/fake_data/entity"; +import { convertEntities } from "../../../../src/fake_data/entity"; +import { DemoConfig } from "../types"; -export const demoEntitiesJimpower: () => Entity[] = () => +export const demoEntitiesJimpower: DemoConfig["entities"] = () => convertEntities({ "zone.powertec": { entity_id: "zone.powertec", diff --git a/demo/src/configs/jimpower/lovelace.ts b/demo/src/configs/jimpower/lovelace.ts index da1f710cf1..1ff466fced 100644 --- a/demo/src/configs/jimpower/lovelace.ts +++ b/demo/src/configs/jimpower/lovelace.ts @@ -1,7 +1,7 @@ -import { LovelaceConfig } from "../../../../src/data/lovelace"; import "../../custom-cards/card-modder"; +import { DemoConfig } from "../types"; -export const demoLovelaceJimpower: () => LovelaceConfig = () => ({ +export const demoLovelaceJimpower: DemoConfig["lovelace"] = () => ({ name: "Kingia Castle", resources: [ // { diff --git a/demo/src/configs/kernehed/entities.ts b/demo/src/configs/kernehed/entities.ts index 1b030246ea..caba6c297d 100644 --- a/demo/src/configs/kernehed/entities.ts +++ b/demo/src/configs/kernehed/entities.ts @@ -1,6 +1,7 @@ -import { Entity, convertEntities } from "../../../../src/fake_data/entity"; +import { convertEntities } from "../../../../src/fake_data/entity"; +import { DemoConfig } from "../types"; -export const demoEntitiesKernehed: () => Entity[] = () => +export const demoEntitiesKernehed: DemoConfig["entities"] = () => convertEntities({ "zone.anna": { entity_id: "zone.anna", diff --git a/demo/src/configs/kernehed/lovelace.ts b/demo/src/configs/kernehed/lovelace.ts index e9c87e1966..e679b711e4 100644 --- a/demo/src/configs/kernehed/lovelace.ts +++ b/demo/src/configs/kernehed/lovelace.ts @@ -1,6 +1,6 @@ -import { LovelaceConfig } from "../../../../src/data/lovelace"; +import { DemoConfig } from "../types"; -export const demoLovelaceKernehed: () => LovelaceConfig = () => ({ +export const demoLovelaceKernehed: DemoConfig["lovelace"] = () => ({ name: "Hem", resources: [ // { diff --git a/demo/src/configs/teachingbirds/entities.ts b/demo/src/configs/teachingbirds/entities.ts index d4cd8b97de..5260aec10b 100644 --- a/demo/src/configs/teachingbirds/entities.ts +++ b/demo/src/configs/teachingbirds/entities.ts @@ -1,6 +1,7 @@ -import { Entity, convertEntities } from "../../../../src/fake_data/entity"; +import { convertEntities } from "../../../../src/fake_data/entity"; +import { DemoConfig } from "../types"; -export const demoEntitiesTeachingbirds: () => Entity[] = () => +export const demoEntitiesTeachingbirds: DemoConfig["entities"] = () => convertEntities({ "sensor.pollen_grabo": { entity_id: "sensor.pollen_grabo", diff --git a/demo/src/configs/teachingbirds/lovelace.ts b/demo/src/configs/teachingbirds/lovelace.ts index bac242cc50..45443fddcc 100644 --- a/demo/src/configs/teachingbirds/lovelace.ts +++ b/demo/src/configs/teachingbirds/lovelace.ts @@ -1,29 +1,7 @@ -import { LovelaceConfig } from "../../../../src/data/lovelace"; +import { DemoConfig } from "../types"; -export const demoLovelaceTeachingbirds: () => LovelaceConfig = () => ({ +export const demoLovelaceTeachingbirds: DemoConfig["lovelace"] = () => ({ title: "Home", - resources: [ - // { - // url: "/local/lovelace/mini-media-player.js?v=0.6", - // type: "module", - // }, - // { - // url: "/local/lovelace/slider-entity-row.js?v=d6da75", - // type: "js", - // }, - // { - // url: "/local/lovelace/monster-card.js?v=0.2.3", - // type: "js", - // }, - // { - // url: "/local/lovelace/tracker-card.js?v=0.1.5", - // type: "js", - // }, - // { - // url: "/local/lovelace/home-setter.js?v=0.0.1", - // type: "js", - // }, - ], views: [ { cards: [ @@ -1201,484 +1179,5 @@ export const demoLovelaceTeachingbirds: () => LovelaceConfig = () => ({ title: "Info", icon: "mdi:lan", }, - // { - // cards: [ - // { - // cards: [ - // { - // entities: [ - // "switch.dafang_night_mode", - // "light.isa_ceiling_light", - // "switch.dafang_h264_rtsp_server", - // ], - // camera_image: "camera.upstairs", - // type: "picture-glance", - // title: "Upstairs", - // }, - // { - // entities: [ - // { - // tap_action: { - // action: "call-service", - // service: "script.dafang_down", - // }, - // entity: "script.dafang_down", - // }, - // { - // tap_action: { - // action: "toggle", - // }, - // entity: "script.dafang_up", - // }, - // { - // tap_action: { - // action: "toggle", - // }, - // entity: "script.dafang_left", - // }, - // { - // tap_action: { - // action: "toggle", - // }, - // entity: "script.dafang_right", - // }, - // { - // entity: "script.dafang_calibrate", - // hold_action: { - // action: "toggle", - // }, - // tap_action: { - // action: "none", - // }, - // icon: "mdi:reload", - // }, - // ], - // show_name: false, - // type: "glance", - // show_state: false, - // }, - // { - // type: "picture-entity", - // entity: "camera.motion_dafang", - // }, - // ], - // type: "vertical-stack", - // }, - // { - // cards: [ - // { - // entities: [ - // "light.living_room_ceiling_light_level", - // "light.living_room_spotlights_level", - // ], - // camera_image: "camera.back_door", - // type: "picture-glance", - // title: "Back door", - // }, - // { - // entities: [ - // { - // entity: "script.sannce_down", - // tap_action: { - // action: "toggle", - // }, - // icon: "mdi:chevron-down", - // }, - // { - // entity: "script.sannce_up", - // tap_action: { - // action: "toggle", - // }, - // icon: "mdi:chevron-up", - // }, - // { - // entity: "script.sannce_left", - // tap_action: { - // action: "toggle", - // }, - // icon: "mdi:chevron-left", - // }, - // { - // entity: "script.sannce_right", - // tap_action: { - // action: "toggle", - // }, - // icon: "mdi:chevron-right", - // }, - // { - // entity: "script.sannce_calibrate", - // hold_action: { - // action: "toggle", - // }, - // tap_action: { - // action: "none", - // }, - // icon: "mdi:reload", - // }, - // ], - // show_name: false, - // type: "glance", - // show_state: false, - // }, - // { - // type: "picture-entity", - // entity: "camera.motion_sannce", - // }, - // ], - // type: "vertical-stack", - // }, - // { - // cards: [ - // { - // entities: ["sensor.ring_front_door_battery"], - // camera_image: "camera.front_door", - // title: "Latest Motion Front Door", - // show_state: false, - // type: "picture-glance", - // entity: "camera.front_door", - // }, - // ], - // type: "vertical-stack", - // }, - // ], - // path: "cameras", - // title: "Cameras", - // icon: "mdi:cctv", - // }, - // { - // cards: [ - // { - // cards: [ - // { - // entities: [ - // { - // name: "Road temp", - // entity: "sensor.trafikverket_alta_road_temperature", - // }, - // { - // entity: "sensor.homesolna_travel_time", - // name: "Solna", - // icon: "mdi:car", - // }, - // { - // entity: "sensor.homec9_travel_time", - // name: "C9", - // icon: "mdi:car", - // }, - // ], - // type: "glance", - // }, - // { - // cards: [ - // { - // entity: "camera.tpl_skvaltan", - // type: "picture-entity", - // show_state: false, - // }, - // { - // entity: "camera.tpl_nacka", - // type: "picture-entity", - // show_state: false, - // }, - // ], - // type: "horizontal-stack", - // }, - // { - // cards: [ - // { - // entity: "camera.vikdalen", - // type: "picture-entity", - // show_state: false, - // }, - // { - // entity: "camera.tpl_kvarnholmen", - // type: "picture-entity", - // show_state: false, - // }, - // ], - // type: "horizontal-stack", - // }, - // { - // cards: [ - // { - // entity: "camera.marinstaden", - // type: "picture-entity", - // show_state: false, - // }, - // { - // entity: "camera.svindersvik", - // type: "picture-entity", - // show_state: false, - // }, - // ], - // type: "horizontal-stack", - // }, - // { - // cards: [ - // { - // entity: "camera.sicklatunneln", - // type: "picture-entity", - // show_state: false, - // }, - // { - // entity: "camera.tpl_grondal", - // type: "picture-entity", - // show_state: false, - // }, - // ], - // type: "horizontal-stack", - // }, - // ], - // type: "vertical-stack", - // }, - // ], - // path: "traffic", - // title: "Traffic info", - // icon: "mdi:car", - // }, - // { - // cards: [ - // { - // filter: { - // include: [ - // { - // entity_id: "input_boolean.ad_*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Appdaemon Apps", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.cats*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Cats", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.house*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "House", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.lights*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Lights", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.presence*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Presence", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.security*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Security", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.system*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "System", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.temperature*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Temperature", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "automation.tts*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "TTS", - // }, - // show_empty: false, - // }, - // { - // filter: { - // include: [ - // { - // entity_id: "alert.*", - // }, - // ], - // }, - // type: "custom:monster-card", - // card: { - // show_header_toggle: false, - // type: "entities", - // title: "Alerts", - // }, - // show_empty: false, - // }, - // ], - // path: "automations", - // title: "Automations", - // icon: "mdi:flash-auto", - // }, - { - cards: [ - { - cards: [ - { - entities: [ - { - url: "https://www.home-assistant.io/", - type: "weblink", - name: "Home Assistant", - icon: "mdi:home-assistant", - }, - { - url: "https://rc--home-assistant-docs.netlify.com/", - type: "weblink", - name: "Home Assistant Beta", - icon: "mdi:home-assistant", - }, - { - url: - "https://github.com/home-assistant/home-assistant-polymer/releases", - type: "weblink", - name: "Lovelace release notes", - icon: "mdi:home-heart", - }, - { - url: "https://s3.amazonaws.com/hassio-version/stable.json", - type: "weblink", - name: "Hassio build", - icon: "mdi:home-assistant", - }, - { - url: - "https://github.com/dresden-elektronik/deconz-rest-plugin/releases", - type: "weblink", - name: "Deconz release notes", - icon: "mdi:home-assistant", - }, - ], - show_header_toggle: false, - type: "entities", - title: "Links", - }, - ], - type: "vertical-stack", - }, - // { - // cards: [ - // { - // type: "custom:home-setter", - // pages: [ - // { - // path: "lovelace/home", - // name: "Default", - // }, - // { - // path: "lovelace/dashboard", - // name: "Dashboard", - // }, - // ], - // }, - // { - // title: null, - // type: "custom:tracker-card", - // trackers: [ - // "sensor.custom_card_tracker", - // "sensor.custom_component_tracker", - // ], - // }, - // ], - // type: "vertical-stack", - // }, - ], - path: "settings", - title: "Settings", - icon: "mdi:cogs", - }, ], }); diff --git a/demo/src/configs/types.ts b/demo/src/configs/types.ts index e637c00e01..34ffd8afa7 100644 --- a/demo/src/configs/types.ts +++ b/demo/src/configs/types.ts @@ -1,12 +1,13 @@ import { LovelaceConfig } from "../../../src/data/lovelace"; import { Entity } from "../../../src/fake_data/entity"; +import { LocalizeFunc } from "../../../src/common/translations/localize"; export interface DemoConfig { index?: number; name: string; authorName: string; authorUrl: string; - lovelace: () => LovelaceConfig; - entities: () => Entity[]; + lovelace: (localize: LocalizeFunc) => LovelaceConfig; + entities: (localize: LocalizeFunc) => Entity[]; theme: () => { [key: string]: string } | null; } diff --git a/demo/src/custom-cards/ha-demo-card.ts b/demo/src/custom-cards/ha-demo-card.ts index fe5b67bc6e..c9b4f1d060 100644 --- a/demo/src/custom-cards/ha-demo-card.ts +++ b/demo/src/custom-cards/ha-demo-card.ts @@ -21,8 +21,9 @@ import { export class HADemoCard extends LitElement implements LovelaceCard { public lovelace?: Lovelace; - public hass?: MockHomeAssistant; + public hass!: MockHomeAssistant; private _switching?: boolean; + private _hidden = localStorage.hide_demo_card; static get properties(): PropertyDeclarations { return { @@ -33,7 +34,7 @@ export class HADemoCard extends LitElement implements LovelaceCard { } public getCardSize() { - return 2; + return this._hidden ? 0 : 2; } public setConfig( @@ -43,6 +44,9 @@ export class HADemoCard extends LitElement implements LovelaceCard { ) {} protected render() { + if (this._hidden) { + return; + } return html`
@@ -56,9 +60,12 @@ export class HADemoCard extends LitElement implements LovelaceCard { (conf) => html` ${conf.name} - by - ${conf.authorName} + ${this.hass.localize( + "ui.panel.page-demo.cards.demo.demo_by", + "name", + conf.authorName + )} ` @@ -67,22 +74,30 @@ export class HADemoCard extends LitElement implements LovelaceCard { )}
- Next demo + ${this.hass.localize("ui.panel.page-demo.cards.demo.next_demo")}
- Welcome home! You've reached the Home Assistant demo where we showcase - the best UIs created by our community. + ${this.hass.localize("ui.panel.page-demo.cards.demo.introduction")}
- Learn more about Home Assistant + + ${this.hass.localize("ui.panel.page-demo.cards.demo.learn_more")} +
`; } + protected firstUpdated(changedProps) { + super.firstUpdated(changedProps); + if (this._hidden) { + this.style.display = "none"; + } + } + private _nextConfig() { this._updateConfig( selectedDemoConfigIndex < demoConfigs.length - 1 @@ -94,7 +109,7 @@ export class HADemoCard extends LitElement implements LovelaceCard { private async _updateConfig(index: number) { this._switching = true; try { - await setDemoConfig(this.hass!, this.lovelace!, index); + await setDemoConfig(this.hass, this.lovelace!, index); } catch (err) { alert("Failed to switch config :-("); } finally { diff --git a/demo/src/ha-demo.ts b/demo/src/ha-demo.ts index 2a14459de0..0391b4df6d 100644 --- a/demo/src/ha-demo.ts +++ b/demo/src/ha-demo.ts @@ -27,7 +27,13 @@ class HaDemo extends HomeAssistantAppEl { }; const hass = (this.hass = provideHass(this, initial)); - mockLovelace(hass); + const localizePromise = + // @ts-ignore + this._loadFragmentTranslations(hass.language, "page-demo").then( + () => this.hass!.localize + ); + + mockLovelace(hass, localizePromise); mockAuth(hass); mockTranslations(hass); mockHistory(hass); @@ -37,12 +43,16 @@ class HaDemo extends HomeAssistantAppEl { mockEvents(hass); mockMediaPlayer(hass); mockFrontend(hass); - selectedDemoConfig.then((conf) => { - hass.addEntities(conf.entities()); - if (conf.theme) { - hass.mockTheme(conf.theme()); + + // Once config is loaded AND localize, set entities and apply theme. + Promise.all([selectedDemoConfig, localizePromise]).then( + ([conf, localize]) => { + hass.addEntities(conf.entities(localize)); + if (conf.theme) { + hass.mockTheme(conf.theme()); + } } - }); + ); // Taken from polymer/pwa-helpers. BSD-3 licensed document.body.addEventListener( diff --git a/demo/src/stubs/lovelace.ts b/demo/src/stubs/lovelace.ts index d1d6c2296b..777d9bce86 100644 --- a/demo/src/stubs/lovelace.ts +++ b/demo/src/stubs/lovelace.ts @@ -4,12 +4,16 @@ import "../custom-cards/ha-demo-card"; import { HADemoCard } from "../custom-cards/ha-demo-card"; import { MockHomeAssistant } from "../../../src/fake_data/provide_hass"; import { selectedDemoConfig } from "../configs/demo-configs"; +import { LocalizeFunc } from "../../../src/common/translations/localize"; -export const mockLovelace = (hass: MockHomeAssistant) => { - selectedDemoConfig.then((config) => hass.addEntities(config.entities())); - +export const mockLovelace = ( + hass: MockHomeAssistant, + localizePromise: Promise +) => { hass.mockWS("lovelace/config", () => - selectedDemoConfig.then((config) => config.lovelace()) + Promise.all([selectedDemoConfig, localizePromise]).then( + ([config, localize]) => config.lovelace(localize) + ) ); hass.mockWS("lovelace/config/save", () => Promise.resolve()); diff --git a/src/state/translations-mixin.ts b/src/state/translations-mixin.ts index bbe3dde4c9..cb3113ffdb 100644 --- a/src/state/translations-mixin.ts +++ b/src/state/translations-mixin.ts @@ -19,6 +19,9 @@ import { getHassTranslations } from "../data/translation"; export default (superClass: Constructor) => class extends superClass { + // tslint:disable-next-line: variable-name + private __coreProgress?: string; + protected firstUpdated(changedProps) { super.firstUpdated(changedProps); this.addEventListener("hass-language-select", (e) => @@ -97,8 +100,18 @@ export default (superClass: Constructor) => } private async _loadCoreTranslations(language: string) { - const result = await getTranslation(null, language); - this._updateResources(result.language, result.data); + // Check if already in progress + // Necessary as we call this in firstUpdated and hassConnected + if (this.__coreProgress === language) { + return; + } + this.__coreProgress = language; + try { + const result = await getTranslation(null, language); + this._updateResources(result.language, result.data); + } finally { + this.__coreProgress = undefined; + } } private _updateResources(language: string, data: any) { diff --git a/src/translations/en.json b/src/translations/en.json index 1c160b0482..ba7f174d28 100644 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -1184,6 +1184,49 @@ } } }, + "page-demo": { + "cards": { + "demo": { + "demo_by": "by {name}", + "next_demo": "Next demo", + "introduction": "Welcome home! You've reached the Home Assistant demo where we showcase the best UIs created by our community.", + "learn_more": "Learn more about Home Assistant" + } + }, + "config": { + "arsaboo": { + "names": { + "upstairs": "Upstairs", + "family_room": "Family Room", + "kitchen": "Kitchen", + "patio": "Patio", + "hallway": "Hallway", + "master_bedroom": "Master Bedroom", + "left": "Left", + "right": "Right", + "mirror": "Mirror" + }, + "labels": { + "lights": "Lights", + "information": "Information", + "morning_commute": "Morning Commute", + "commute_home": "Commute to Home", + "entertainment": "Entertainment", + "activity": "Activity", + "hdmi_input": "HDMI Input", + "hdmi_switcher": "HDMI Switcher", + "volume": "Volume", + "total_tv_time": "Total TV Time", + "turn_tv_off": "Turn Television off", + "air": "Air" + }, + "unit": { + "watching": "watching", + "minutes_abbr": "min" + } + } + } + }, "page-onboarding": { "intro": "Are you ready to awaken your home, reclaim your privacy and join a worldwide community of tinkerers?", "user": {