From a5befbe1530592f97fef64341bbc48f80261b66e Mon Sep 17 00:00:00 2001 From: Paulus Schoutsen Date: Thu, 19 Jul 2018 17:00:18 +0200 Subject: [PATCH] Add more demos (#1476) --- gallery/src/demos/demo-hui-glance-card.js | 78 +++++++++++++++++++ .../src/demos/demo-hui-picture-entity-card.js | 61 +++++++++++++++ .../src/demos/demo-hui-picture-glance-card.js | 16 ++++ 3 files changed, 155 insertions(+) create mode 100644 gallery/src/demos/demo-hui-glance-card.js create mode 100644 gallery/src/demos/demo-hui-picture-entity-card.js diff --git a/gallery/src/demos/demo-hui-glance-card.js b/gallery/src/demos/demo-hui-glance-card.js new file mode 100644 index 0000000000..4cf77d876d --- /dev/null +++ b/gallery/src/demos/demo-hui-glance-card.js @@ -0,0 +1,78 @@ +import { html } from '@polymer/polymer/lib/utils/html-tag.js'; +import { PolymerElement } from '@polymer/polymer/polymer-element.js'; + +import '../../../src/panels/lovelace/cards/hui-glance-card.js'; + +import HomeAssistant from '../data/hass.js'; +import demoStates from '../data/demo_dump.js'; + +const CONFIGS = [ + { + entities: [ + 'binary_sensor.movement_backyard', + 'light.bed_light', + 'binary_sensor.basement_floor_wet', + 'sensor.outside_temperature', + 'light.ceiling_lights', + 'switch.ac', + 'lock.kitchen_door' + ], + type: 'glance', + title: 'Glance card sample' + }, + { + entities: [ + 'binary_sensor.movement_backyard', + 'light.bed_light', + 'binary_sensor.basement_floor_wet', + 'sensor.outside_temperature', + 'light.ceiling_lights', + 'switch.ac', + 'lock.kitchen_door' + ], + type: 'glance', + }, + { + entities: [ + 'lock.kitchen_door' + ], + type: 'glance', + }, + +]; + +class DemoPicEntity extends PolymerElement { + static get template() { + return html` + +
+
+ `; + } + + ready() { + super.ready(); + + const root = this.$.root; + const hass = new HomeAssistant(); + hass.states = demoStates; + console.log(demoStates); + CONFIGS.forEach((config) => { + const el = document.createElement('hui-glance-card'); + el.setConfig(config); + el.hass = hass; + root.appendChild(el); + }); + } +} + +customElements.define('demo-hui-glance-card', DemoPicEntity); diff --git a/gallery/src/demos/demo-hui-picture-entity-card.js b/gallery/src/demos/demo-hui-picture-entity-card.js new file mode 100644 index 0000000000..fa75cca207 --- /dev/null +++ b/gallery/src/demos/demo-hui-picture-entity-card.js @@ -0,0 +1,61 @@ +import { html } from '@polymer/polymer/lib/utils/html-tag.js'; +import { PolymerElement } from '@polymer/polymer/polymer-element.js'; + +import '../../../src/panels/lovelace/cards/hui-picture-entity-card.js'; + +import HomeAssistant from '../data/hass.js'; +import demoStates from '../data/demo_dump.js'; + +const CONFIGS = [ + { + type: 'picture-entity', + image: 'https://images.pexels.com/photos/775219/pexels-photo-775219.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=295&w=490', + entity: 'light.bed_light', + }, + { + type: 'picture-entity', + image: 'https://images.pexels.com/photos/775219/pexels-photo-775219.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=295&w=490', + entity: 'light.kitchen_lights', + }, + { + type: 'picture-glance', + image: 'https://images.pexels.com/photos/276724/pexels-photo-276724.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=240&w=495', + entity: 'light.non_existing' + }, +]; + +class DemoPicEntity extends PolymerElement { + static get template() { + return html` + +
+
+ `; + } + + ready() { + super.ready(); + + const root = this.$.root; + const hass = new HomeAssistant(); + hass.states = demoStates; + console.log(demoStates); + CONFIGS.forEach((config) => { + const el = document.createElement('hui-picture-entity-card'); + el.setConfig(config); + el.hass = hass; + root.appendChild(el); + }); + } +} + +customElements.define('demo-hui-picture-entity-card', DemoPicEntity); diff --git a/gallery/src/demos/demo-hui-picture-glance-card.js b/gallery/src/demos/demo-hui-picture-glance-card.js index 42e6100e8a..4831481879 100644 --- a/gallery/src/demos/demo-hui-picture-glance-card.js +++ b/gallery/src/demos/demo-hui-picture-glance-card.js @@ -37,6 +37,22 @@ const CONFIGS = [ 'light.ceiling_lights', ] }, + { + type: 'picture-glance', + image: 'https://images.pexels.com/photos/276724/pexels-photo-276724.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=240&w=495', + entities: [ + 'switch.decorative_lights', + 'light.ceiling_lights', + ] + }, + { + type: 'picture-glance', + image: 'https://images.pexels.com/photos/276724/pexels-photo-276724.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=240&w=495', + entities: [ + 'binary_sensor.movement_backyard', + 'binary_sensor.basement_floor_wet', + ] + }, ]; class DemoPicGlance extends PolymerElement {