diff --git a/README.md b/README.md index f42e1bb..1027475 100644 --- a/README.md +++ b/README.md @@ -52,14 +52,14 @@ media_control_row: - fast_forward ``` -The available rows are `power_row`, `channel_row`, `apps_row`, `source_row` and `media_control_row` -There also `volume_row` and `navigation_row`, but these requires a string as value. +The available rows are `power_row`, `channel_row`, `apps_row`, `source_row`, `media_control_row`, `first_digits_row`, `second_digits_row`, `third_digits_row`, `fourth_digits_row`,`buttons_row` +There also `volume_row`, `navigation_row` and `digits_row`, but these requires a string as value. | Name | Type | Description | ---- | ---- | ------- | volume_row | string | Can be either `slider` or `buttons`. This defines the mode you want for setting the volume (you'll see them soon below). You need to have [slider-card](https://github.com/AnthonMS/my-cards) installed in order to use `slider`. | navigation_row | string | Can be either `touchpad` or `buttons`. This defines the mode you want for navigating around your tv (you'll also see them soon below). - +| navigation_row | string | Can only be `buttons`. ## **Notice** This card uses `media_player.play_media` to send keys to the TV. @@ -313,6 +313,31 @@ Result: less example +### Example 4 + +Digits and color buttons added + +```yaml +type: custom:tv-card +entity: media_player.tv +title: Example 4 +channel_row: + - channel_up + - channel_down +volume_row: buttons +navigation_row: buttons +buttons_row: + - redbutton + - greenbutton + - yellowbutton + - bluebutton +digits_row: buttons +``` + +Result: + +digits and color buttons example + ### Extra In any row, if you add an ampty item, there will be an empty/invisible button filling the space: diff --git a/assets/digits_color_buttons.png b/assets/digits_color_buttons.png new file mode 100644 index 0000000..ae0a7db Binary files /dev/null and b/assets/digits_color_buttons.png differ diff --git a/tv-card.js b/tv-card.js index ec0e755..2bc1312 100644 --- a/tv-card.js +++ b/tv-card.js @@ -23,6 +23,20 @@ const keys = { "play": {"key": "KEY_PLAY", "icon": "mdi:play"}, "pause": {"key": "KEY_PAUSE", "icon": "mdi:pause"}, "fast_forward": {"key": "KEY_FF", "icon": "mdi:fast-forward"}, + "digit1": {"key": "KEY_1", "icon": "mdi:numeric-1"}, + "digit2": {"key": "KEY_2", "icon": "mdi:numeric-2"}, + "digit3": {"key": "KEY_3", "icon": "mdi:numeric-3"}, + "digit4": {"key": "KEY_4", "icon": "mdi:numeric-4"}, + "digit5": {"key": "KEY_5", "icon": "mdi:numeric-5"}, + "digit6": {"key": "KEY_6", "icon": "mdi:numeric-6"}, + "digit7": {"key": "KEY_7", "icon": "mdi:numeric-1"}, + "digit8": {"key": "KEY_8", "icon": "mdi:numeric-8"}, + "digit9": {"key": "KEY_9", "icon": "mdi:numeric-9"}, + "digit0": {"key": "KEY_0", "icon": "mdi:numeric-0"}, + "redbutton": {"key": "KEY_RED", "icon": "mdi:alpha-r-box"}, + "greenbutton": {"key": "KEY_GREEN", "icon": "mdi:alpha-g-box"}, + "yellowbutton": {"key": "KEY_YELLOW", "icon": "mdi:alpha-y-box"}, + "bluebutton": {"key": "KEY_BLUE", "icon": "mdi:alpha-b-box"}, }; const sources = { @@ -302,7 +316,7 @@ class TVCardServices extends LitElement { return html ``; } - const row_names = ["power_row", "channel_row", "apps_row", "source_row", "volume_row", "media_control_row", "navigation_row"]; + const row_names = ["power_row", "channel_row", "apps_row", "source_row", "volume_row", "media_control_row", "navigation_row", "digits_row", "first_digits_row", "second_digits_row", "third_digits_row", "fourth_digits_row","buttons_row"]; var content = []; Object.keys(this._config).forEach((row_name) => { @@ -343,6 +357,14 @@ class TVCardServices extends LitElement { navigation_row = [touchpad]; } content.push(...navigation_row); + } else if (row_name === "digits_row") { + let digits_row = []; + let first_row = [this.buildIconButton("digit1"), this.buildIconButton("digit2"), this.buildIconButton("digit3")]; + let second_row = [this.buildIconButton("digit4"), this.buildIconButton("digit5"), this.buildIconButton("digit6")]; + let third_row = [this.buildIconButton("digit7"), this.buildIconButton("digit8"), this.buildIconButton("digit9")]; + let fourth_row = [this.buildIconButton("digit0")]; + digits_row = [first_row, second_row, third_row, fourth_row]; + content.push(...digits_row); } else { let row_content = this.buildButtonsFromActions(row_actions); content.push(row_content);