commit 696d24b016a83424b62dd489e9e5e0f99d12b2e9
Author: jkocon <39369166+jkocon@users.noreply.github.com>
Date: Mon Jul 8 15:34:02 2019 +0200
Create tv-card-kicur.js
diff --git a/tv-card-kicur.js b/tv-card-kicur.js
new file mode 100644
index 0000000..198e423
--- /dev/null
+++ b/tv-card-kicur.js
@@ -0,0 +1,338 @@
+const LitElement = Object.getPrototypeOf(
+ customElements.get("ha-panel-lovelace")
+);
+const html = LitElement.prototype.html;
+
+class TVCardServices extends LitElement {
+ static get properties() {
+ return {
+ hass: {},
+ _config: {},
+ _apps: {}
+ };
+ }
+
+ static async getConfigElement() {
+ await import("./tv-card-editor.js");
+ return document.createElement("tv-card-editor");
+ }
+
+ static getStubConfig() {
+ return {};
+ }
+
+ getCardSize() {
+ return 7;
+ }
+
+ setConfig(config) {
+ if (!config.entity) {
+ console.log("Invalid configuration");
+ return;
+ }
+
+ this._config = { theme: "default", ...config };
+ }
+
+ render() {
+ if (!this._config || !this.hass) {
+ return html``;
+ }
+
+ const stateObj = this.hass.states[this._config.entity];
+ return html`
+ ${this.renderStyle()}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ${
+ this._config.tv ||
+ this._config.volume_up ||
+ this._config.volume_down ||
+ this._config.volume_mute
+ ? html`
+
+ `
+ : ""
+ }
+
+
+ `;
+ }
+
+ updated(changedProps) {
+ if (!this._config) {
+ return;
+ }
+
+ const oldHass = changedProps.get("hass");
+ if (!oldHass || oldHass.themes !== this.hass.themes) {
+ this.applyThemesOnElement(this, this.hass.themes, this._config.theme);
+ }
+ }
+
+ renderStyle() {
+ return html`
+
+ `;
+ }
+
+ launchApp(e) {
+ this.hass.callService("media_player", "select_source", {
+ entity_id: this._config.entity,
+ source: e.currentTarget.value
+ });
+ }
+
+ handleActionClick(e) {
+ const custom_services = [
+ "power_tv",
+ "power_avr",
+ "volume_up",
+ "volume_down",
+ "volume_mute",
+ "back",
+ "source",
+ "info",
+ "home",
+ "channelup",
+ "channeldown",
+ "up",
+ "left",
+ "select",
+ "right",
+ "down",
+ "reverse",
+ "play",
+ "forward"
+ ];
+
+ if (
+ custom_services.indexOf(e.currentTarget.action) >= 0 &&
+ this._config[e.currentTarget.action]
+ ) {
+ const [domain, service] = this._config[
+ e.currentTarget.action
+ ].service.split(".", 2);
+ this.hass.callService(
+ domain,
+ service,
+ this._config[e.currentTarget.action].service_data
+ ? this._config[e.currentTarget.action].service_data
+ : null
+ );
+ } else {
+ let remote = this._config.remote
+ ? this._config.remote
+ : "remote." + this._config.entity.split(".")[1];
+ this.hass.callService("remote", "send_command", {
+ entity_id: remote,
+ command: e.currentTarget.action
+ });
+ }
+ }
+
+ applyThemesOnElement(element, themes, localTheme) {
+ if (!element._themes) {
+ element._themes = {};
+ }
+ let themeName = themes.default_theme;
+ if (localTheme === "default" || (localTheme && themes.themes[localTheme])) {
+ themeName = localTheme;
+ }
+ const styles = Object.assign({}, element._themes);
+ if (themeName !== "default") {
+ var theme = themes.themes[themeName];
+ Object.keys(theme).forEach(key => {
+ var prefixedKey = "--" + key;
+ element._themes[prefixedKey] = "";
+ styles[prefixedKey] = theme[key];
+ });
+ }
+ if (element.updateStyles) {
+ element.updateStyles(styles);
+ } else if (window.ShadyCSS) {
+ // implement updateStyles() method of Polemer elements
+ window.ShadyCSS.styleSubtree(
+ /** @type {!HTMLElement} */ (element),
+ styles
+ );
+ }
+
+ const meta = document.querySelector("meta[name=theme-color]");
+ if (meta) {
+ if (!meta.hasAttribute("default-content")) {
+ meta.setAttribute("default-content", meta.getAttribute("content"));
+ }
+ const themeColor =
+ styles["--primary-color"] || meta.getAttribute("default-content");
+ meta.setAttribute("content", themeColor);
+ }
+ }
+}
+
+customElements.define("tv-card", TVCardServices);