add LG webos keyboard support (no search), add play_pause, play, and pause commands to all platforms using media player actions

Nerwyn · Nerwyn · commit b104f1f4cfdc · 2024-12-06T16:05:56.000-05:00
diff --git a/README.md b/README.md
@@ -23,10 +23,10 @@ A super customizable universal remote card iterating on the work of several othe
   - Sony BRAVIA (with keyboard via ADB)
   - Fire TV (with keyboard)
   - Roku (with keyboard)
+  - LG webOS (with keyboard)
   - Kodi (with keyboard)
   - Apple TV
   - Samsung TV
-  - LG webOS
   - Jellyfin
 - Support for multiple buttons, touchpads, and sliders using default or user defined custom actions.
 - Complete [Home Assistant actions](https://www.home-assistant.io/dashboards/actions/) support.
@@ -62,10 +62,10 @@ This card supports several media platforms with default key and source lists. Fo
 | [Sony BRAVIA](https://www.home-assistant.io/integrations/braviatv/)        | Default keys             | Default sources and slider                                                                                                             | [ADB](https://www.home-assistant.io/integrations/androidtv/) remote (preferred) or media player           |
 | [Fire TV](https://www.home-assistant.io/integrations/androidtv/)           | Default keys             | Default sources and slider                                                                                                             | Remote (preferred) or media player                                                                        |
 | [Roku](https://www.home-assistant.io/integrations/roku/)                   | Default keys             | Default sources and slider                                                                                                             | Remote for keyboard, media player for search (provide one for keyboard ID and the others in their fields) |
+| [LG webOS](https://www.home-assistant.io/integrations/webostv/)            | NA                       | Default keys, sources, and slider                                                                                                      | Media Player                                                                                              |
 | [Kodi](https://www.home-assistant.io/integrations/kodi/)                   | NA                       | Default keys, sources, and slider                                                                                                      | Media player                                                                                              |
 | [Apple TV](https://www.home-assistant.io/integrations/apple_tv)            | Default keys             | Default sources and slider                                                                                                             | NA                                                                                                        |
 | [Samsung TV](https://www.home-assistant.io/integrations/samsungtv/)        | Default keys             | Default sources (requires the [SamsungTV Smart Component custom integration](https://github.com/ollo69/ha-samsungtv-smart)) and slider | NA                                                                                                        |
-| [LG webOS](https://www.home-assistant.io/integrations/webostv/)            | NA                       | Default keys, sources, and slider                                                                                                      | NA                                                                                                        |
 | [Jellyfin](https://www.home-assistant.io/integrations/jellyfin/)           | Default keys             | Play/Pause and slider                                                                                                                  | NA                                                                                                        |
 
 ## Action Timings
@@ -371,7 +371,7 @@ For Roku make sure to include both the remote and media player IDs at the genera
 
 Send text to your supported media platform seamlessly using the action or default key `keyboard`. The dialog has several listeners which will send anything you type to your media platform immediately. You can also paste by holding or typing CTRL + V into the dialog.
 
-Because we do not have a way to retrieve the currently on screen text of most media platforms, the dialog and platform text may become out of sync if a message gets dropped due to a network issue, you attempt to erase more than one character at a time, you try to modify the middle of the entered text, or if you prematurely close the dialog window. The keyboard dialog will attempt to prevent you from doing things that would cause this, but please remember that if you make a mistake you have to backspace all the way to the incorrect character from the end of your input text one character at at a time. In my testing the dialog always kept in sync with the platform text unless I attempted to delete more than one character. This does not apply to Kodi, which sets the text field to the entire dialog text every time it's action is called.
+Because we do not have a way to retrieve the currently on screen text of most media platforms, the dialog and platform text may become out of sync if a message gets dropped due to a network issue, you attempt to erase more than one character at a time, you try to modify the middle of the entered text, or if you prematurely close the dialog window. The keyboard dialog will attempt to prevent you from doing things that would cause this, but please remember that if you make a mistake you have to backspace all the way to the incorrect character from the end of your input text one character at at a time. In my testing the dialog always kept in sync with the platform text unless I attempted to delete more than one character. This does not apply to Kodi or LG webOS, which sets the text field to the entire dialog text every time it's action is called.
 
 ADB can be slow and you may notice some delay in what you type and what appears on your Android TV, Sony BRAVIA, or Fire TV device. Make sure to use the newer ADB integration remote entity for a faster typing experience.
 
diff --git a/dist/universal-remote-card.min.js b/dist/universal-remote-card.min.js
diff --git a/src/classes/keyboard-dialog.ts b/src/classes/keyboard-dialog.ts
@@ -63,6 +63,36 @@ export class KeyboardDialog extends LitElement {
 		});
 	}
 
+	webosOnKeyDown(e: KeyboardEvent) {
+		e.stopImmediatePropagation();
+
+		if (['Backspace', 'Enter'].includes(e.key)) {
+			const text = this.textarea?.value ?? '';
+			this.hass.callService('webostv', 'command', {
+				entity_id: this.config?.keyboard_id,
+				command: 'com.webos.service.ime/insertText',
+				payload: {
+					text: text,
+					replace: true,
+				},
+			});
+		}
+	}
+
+	webosOnInput(e: InputEvent) {
+		e.stopImmediatePropagation();
+
+		const text = this.textarea?.value ?? '';
+		this.hass.callService('webostv', 'command', {
+			entity_id: this.config?.keyboard_id,
+			command: 'com.webos.service.ime/insertText',
+			payload: {
+				text: text,
+				replace: true,
+			},
+		});
+	}
+
 	rokuOnKeyDown(e: KeyboardEvent) {
 		e.stopImmediatePropagation();
 		this.forceCursorToEnd();
@@ -147,14 +177,13 @@ export class KeyboardDialog extends LitElement {
 		const inputType = e.inputType ?? '';
 		const text = e.data ?? '';
 		if (text && inputType == 'insertText') {
-			this.androidTvSendText(text);
+			this.adbSendText(text);
 		} else if (!this.onKeyDownFired) {
 			const inputTypeToKey: Record<string, string> = {
 				deleteContentBackward: '67',
 				insertLineBreak: '66',
 			};
 			const key = inputTypeToKey[inputType ?? ''];
-
 			if (key) {
 				this.hass.callService(
 					this.domain ?? 'remote',
@@ -169,6 +198,17 @@ export class KeyboardDialog extends LitElement {
 		this.onKeyDownFired = false;
 	}
 
+	adbSendText(text: string) {
+		this.hass.callService(
+			this.domain ?? 'remote',
+			this.service ?? 'send_command',
+			{
+				entity_id: this.config?.keyboard_id,
+				command: `input text "${text}"`,
+			},
+		);
+	}
+
 	androidTvOnKeyDown(e: KeyboardEvent) {
 		e.stopImmediatePropagation();
 		this.forceCursorToEnd();
@@ -198,7 +238,7 @@ export class KeyboardDialog extends LitElement {
 		const inputType = e.inputType ?? '';
 		const text = e.data ?? '';
 		if (text && inputType == 'insertText') {
-			this.androidTvSendText(text);
+			this.adbSendText(text);
 		} else if (!this.onKeyDownFired) {
 			const inputTypeToKey: Record<string, string> = {
 				deleteContentBackward: 'DEL',
@@ -218,17 +258,6 @@ export class KeyboardDialog extends LitElement {
 		this.onKeyDownFired = false;
 	}
 
-	androidTvSendText(text: string) {
-		this.hass.callService(
-			this.domain ?? 'remote',
-			this.service ?? 'send_command',
-			{
-				entity_id: this.config?.keyboard_id,
-				command: `input text "${text}"`,
-			},
-		);
-	}
-
 	keyboardOnPaste(e: ClipboardEvent) {
 		e.stopImmediatePropagation();
 		if (this.config?.platform != 'Kodi') {
@@ -246,6 +275,14 @@ export class KeyboardDialog extends LitElement {
 						done: false,
 					});
 					break;
+				case 'LG webOS':
+					this.hass.callService('webostv', 'command', {
+						entity_id: this.config?.keyboard_id,
+						command: 'com.webos.service.ime/insertText',
+						text: this.textarea?.value ?? '',
+						replace: true,
+					});
+					break;
 				case 'Roku':
 					this.hass.callService('remote', 'send_command', {
 						entity_id: this.config?.keyboard_id,
@@ -281,6 +318,8 @@ export class KeyboardDialog extends LitElement {
 						done: true,
 					});
 					break;
+				case 'LG webOS':
+					break;
 				case 'Roku':
 					this.hass.callService('roku', 'search', {
 						entity_id: this.getRokuId('media_player'),
@@ -317,6 +356,16 @@ export class KeyboardDialog extends LitElement {
 						done: false,
 					});
 					break;
+				case 'LG webOS':
+					this.hass.callService('webostv', 'command', {
+						entity_id: this.config?.keyboard_id,
+						command: 'com.webos.service.ime/insertText',
+						payload: {
+							text: text,
+							replace: true,
+						},
+					});
+					break;
 				case 'Roku':
 					this.hass.callService('remote', 'send_command', {
 						entity_id: this.getRokuId('remote'),
@@ -351,6 +400,12 @@ export class KeyboardDialog extends LitElement {
 					done: true,
 				});
 				break;
+			case 'LG webOS':
+				this.hass.callService('webostv', 'command', {
+					entity_id: this.config?.keyboard_id,
+					command: 'com.webos.service.ime/sendEnterKey',
+				});
+				break;
 			case 'Roku':
 				this.hass.callService('remote', 'send_command', {
 					entity_id: this.getRokuId('remote'),
@@ -492,6 +547,11 @@ export class KeyboardDialog extends LitElement {
 						keyDownHandler = this.kodiOnKeyDown;
 						antiCursorMoveHandler = undefined;
 						break;
+					case 'LG webOS':
+						inputHandler = this.webosOnInput;
+						keyDownHandler = this.webosOnKeyDown;
+						antiCursorMoveHandler = undefined;
+						break;
 					case 'Roku':
 						inputHandler = this.rokuOnInput;
 						keyDownHandler = this.rokuOnKeyDown;
diff --git a/src/models/interfaces/IActions.ts b/src/models/interfaces/IActions.ts
@@ -3,14 +3,14 @@ export const KeyboardPlatforms = [
 	'Sony BRAVIA',
 	'Fire TV',
 	'Roku',
+	'LG webOS',
 	'Kodi',
 ] as const;
 export type KeyboardPlatform = (typeof KeyboardPlatforms)[number];
 export const Platforms = [
 	...KeyboardPlatforms,
 	'Apple TV',
 	'Samsung TV',
-	'LG webOS',
 	'Jellyfin',
 ] as const;
 export type Platform = (typeof Platforms)[number];
diff --git a/src/models/maps/apple_tv/defaultKeys.ts b/src/models/maps/apple_tv/defaultKeys.ts
@@ -166,6 +166,15 @@ export const appleTVDefaultKeys: IElementConfig[] = [
 			hold_action: { action: 'repeat' },
 		},
 	},
+	{
+		type: 'button',
+		name: 'play_pause',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_play_pause',
+		},
+		icon: 'mdi:play-pause',
+	},
 	{
 		type: 'button',
 		name: 'play',
diff --git a/src/models/maps/bravia/defaultKeys.ts b/src/models/maps/bravia/defaultKeys.ts
@@ -138,6 +138,15 @@ export const braviaTVDefaultKeys: IElementConfig[] = [
 			hold_action: { action: 'repeat' },
 		},
 	},
+	{
+		type: 'button',
+		name: 'play_pause',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_play_pause',
+		},
+		icon: 'mdi:play-pause',
+	},
 	{
 		type: 'button',
 		name: 'play',
diff --git a/src/models/maps/fire_tv/defaultKeys.ts b/src/models/maps/fire_tv/defaultKeys.ts
@@ -171,6 +171,33 @@ export const fireTVDefaultKeys: IElementConfig[] = [
 			hold_action: { action: 'repeat' },
 		},
 	},
+	{
+		type: 'button',
+		name: 'play_pause',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_play_pause',
+		},
+		icon: 'mdi:play-pause',
+	},
+	{
+		type: 'button',
+		name: 'play',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_play',
+		},
+		icon: 'mdi:play',
+	},
+	{
+		type: 'button',
+		name: 'pause',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_pause',
+		},
+		icon: 'mdi:pause',
+	},
 	{
 		type: 'button',
 		name: 'fast_forward',
diff --git a/src/models/maps/roku/defaultKeys.ts b/src/models/maps/roku/defaultKeys.ts
@@ -131,21 +131,21 @@ export const rokuDefaultKeys: IElementConfig[] = [
 	},
 	{
 		type: 'button',
-		name: 'play',
+		name: 'play_pause',
 		tap_action: { action: 'key', key: 'play' },
-		icon: 'mdi:play',
+		icon: 'mdi:play-pause',
 	},
 	{
 		type: 'button',
-		name: 'pause',
+		name: 'play',
 		tap_action: { action: 'key', key: 'play' },
-		icon: 'mdi:pause',
+		icon: 'mdi:play',
 	},
 	{
 		type: 'button',
-		name: 'play_pause',
+		name: 'pause',
 		tap_action: { action: 'key', key: 'play' },
-		icon: 'mdi:play-pause',
+		icon: 'mdi:pause',
 	},
 	{
 		type: 'button',
diff --git a/src/models/maps/samsung_tv/defaultKeys.ts b/src/models/maps/samsung_tv/defaultKeys.ts
@@ -153,6 +153,15 @@ export const samsungTVDefaultKeys: IElementConfig[] = [
 			hold_action: { action: 'repeat' },
 		},
 	},
+	{
+		type: 'button',
+		name: 'play_pause',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_play_pause',
+		},
+		icon: 'mdi:play-pause',
+	},
 	{
 		type: 'button',
 		name: 'play',
diff --git a/src/models/maps/webos/defaultKeys.ts b/src/models/maps/webos/defaultKeys.ts
@@ -192,6 +192,15 @@ export const webosDefaultKeys: IElementConfig[] = [
 			hold_action: { action: 'repeat' },
 		},
 	},
+	{
+		type: 'button',
+		name: 'play_pause',
+		tap_action: {
+			action: 'perform-action',
+			perform_action: 'media_player.media_play_pause',
+		},
+		icon: 'mdi:play-pause',
+	},
 	{
 		type: 'button',
 		name: 'play',
@@ -210,6 +219,18 @@ export const webosDefaultKeys: IElementConfig[] = [
 		},
 		icon: 'mdi:pause',
 	},
+	{
+		type: 'button',
+		name: 'keyboard',
+		tap_action: { action: 'keyboard' },
+		icon: 'mdi:keyboard',
+	},
+	{
+		type: 'button',
+		name: 'textbox',
+		tap_action: { action: 'textbox' },
+		icon: 'mdi:text-box',
+	},
 	{
 		type: 'button',
 		name: 'channel_up',
