a4afc2e37a
* Version bump to 20180510.1 * Fix hass util * Fix translations * Bye paper-time-input * Add webpack config * Add webpack to package.json * Fix translation import * Disable web animations polyfill bad import * Disable importHref import * Update webpack config to build authorize.js * Build translations json * Build frontend correctly * Run eslint --fix * Load markdown JS on demand (#1155) * Add HTML imports (#1160) * Fix localize (#1161) * Fix Roboto in build (#1162) * Load web animations polyfill (#1163) * P3: Fix chart js (#1164) * P3: Fix Chart JS * Update timeline package * P3: panel resolver (#1165) * WIP * Initial importing of panels * Fix panel resolver * Fix automation and script editor (#1166) * Expose Polymer and Polymer.Element on window (#1167) * Remove unused import * eslint --fix * Es5 build (#1168) * Build for ES5 * Fix build_frontend * Remove stale comment * Migrate to use paper-material-styles (#1170) * Send parsed date to history/logbook (#1171) * Fork app storage behavior (#1172) * Add paper input with type time (#1173) * Fix authorize * Lint * Sort imports * Lint * Remove eslint-html * Do not lint authorize.html * Fix polymer lint * Try chrome 62 for wct * P3: Add patched iconset (#1175) * Add patched iconset * Lint * Test with latest Chrome again * Use less window.hassUtil * Teporarily use my fecha fork * Import correct intl.messageFormat * Update wct-browser-legacy to 1.0.0 * Include polyfill in right place * Fix IntlMessageFormat * Fix test not having a global scope * Rollup <_< * Fork app-localize-behavior * Disable wct tests * Lint
81 lines
1.8 KiB
JavaScript
81 lines
1.8 KiB
JavaScript
import '@polymer/iron-icon/iron-icon.js';
|
|
import '@polymer/iron-image/iron-image.js';
|
|
import { html } from '@polymer/polymer/lib/utils/html-tag.js';
|
|
import { PolymerElement } from '@polymer/polymer/polymer-element.js';
|
|
|
|
import '../../src/util/hass-mixins.js';
|
|
|
|
class HaEntityMarker extends window.hassMixins.EventsMixin(PolymerElement) {
|
|
static get template() {
|
|
return html`
|
|
<style is="custom-style" include="iron-positioning"></style>
|
|
<style>
|
|
.marker {
|
|
vertical-align: top;
|
|
position: relative;
|
|
display: block;
|
|
margin: 0 auto;
|
|
width: 2.5em;
|
|
text-align: center;
|
|
height: 2.5em;
|
|
line-height: 2.5em;
|
|
font-size: 1.5em;
|
|
border-radius: 50%;
|
|
border: 0.1em solid var(--ha-marker-color, var(--default-primary-color));
|
|
color: rgb(76, 76, 76);
|
|
background-color: white;
|
|
}
|
|
iron-image {
|
|
border-radius: 50%;
|
|
}
|
|
</style>
|
|
|
|
<div class="marker">
|
|
<template is="dom-if" if="[[entityName]]">[[entityName]]</template>
|
|
<template is="dom-if" if="[[entityPicture]]">
|
|
<iron-image sizing="cover" class="fit" src="[[entityPicture]]"></iron-image>
|
|
</template>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
static get is() { return 'ha-entity-marker'; }
|
|
|
|
static get properties() {
|
|
return {
|
|
hass: {
|
|
type: Object,
|
|
},
|
|
|
|
entityId: {
|
|
type: String,
|
|
value: '',
|
|
},
|
|
|
|
entityName: {
|
|
type: String,
|
|
value: null,
|
|
},
|
|
|
|
entityPicture: {
|
|
type: String,
|
|
value: null,
|
|
}
|
|
};
|
|
}
|
|
|
|
ready() {
|
|
super.ready();
|
|
this.addEventListener('click', ev => this.badgeTap(ev));
|
|
}
|
|
|
|
badgeTap(ev) {
|
|
ev.stopPropagation();
|
|
if (this.entityId) {
|
|
this.fire('hass-more-info', { entityId: this.entityId });
|
|
}
|
|
}
|
|
}
|
|
|
|
customElements.define(HaEntityMarker.is, HaEntityMarker);
|