fix placeholders for custom action fields when autofill is disabled

Nerwyn · Sep 4, 2024 · aa37e78 · aa37e78
1 parent 037990f
commit aa37e78
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 29 deletions.
diff --git a/README.md b/README.md
@@ -15,7 +15,7 @@ _Formerly called Android TV Card_
 
 <img src="https://raw.githubusercontent.com/Nerwyn/android-tv-card/main/assets/screenshot.png" alt="example" width="300"/>
 
-A super customizable universal remote card iterating on the work of several other developers. Featuring:
+A super customizable universal remote card iterating on the work of several other projects. Featuring:
 
 - Configuration UI.
 - Out of the box support for [several platforms](#media-platform-and-entity-ids) with default keys and sources lists.
@@ -26,14 +26,16 @@ A super customizable universal remote card iterating on the work of several othe
   - Apple TV
   - Samsung TV
   - LG webOS
-- Support for multiple buttons, touchpads, and sliders using default or user defined actions.
+- 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.
 - Keyboard and search dialog actions for most platforms.
 - [Template](#a-note-on-templating) support for almost all fields using nunjucks.
 - Toggleable haptics.
-- Touchpad [multi-touch](#touchpad-actions) gesture support.
+- Remappable touchpad with [multi-touch](#touchpad-actions) gesture support.
+- Remappable slider with vertical orientation support.
 - User configurable remote [layout](#layout).
 - Icons and labels for all elements.
+- Custom SVG icon support.
 - CSS style options for all sub-elements.
 
 # How To Use
@@ -46,7 +48,7 @@ The editor has four tabs - General, Layout, Actions, and Icons.
 
 <img src="https://raw.githubusercontent.com/Nerwyn/android-tv-card/main/assets/editor_general_tab.png" alt="editor general tab" width="600"/>
 
-Platform, entity ID, and timing field values set in the general tab will be used for default and custom actions. You can also changes these values on a per custom action basis. Note that if you explicitly set one of these fields in a custom action, it will not be overwritten if you change the matching general value and you must clear the value in the custom action for it to use the general field value. You may find it easier to find fields you have set non-overwritable values for by switching to the code editor and searching (CTRL + F) for them.
+Platform, entity ID, and timing fields set in the general tab will be used for default keys and sources. If you do not set these fields for custom actions and autofill is enabled, they will also use these fields. If you explicitly set one of these fields in a custom action, it will not be overwritten if you change the matching general field until you clear the field in the custom action.
 
 ## Media Platform and Entity IDs
 

diff --git a/dist/universal-remote-card.min.js b/dist/universal-remote-card.min.js
diff --git a/src/universal-remote-card-editor.ts b/src/universal-remote-card-editor.ts
@@ -890,6 +890,13 @@ export class UniversalRemoteCardEditor extends LitElement {
 		additionalOptions: TemplateResult<1> = html``,
 		additionalFormOptions: TemplateResult<1> = html``,
 	) {
+		const autofill =
+			(this.renderTemplate(
+				(this.activeEntry as IElementConfig).autofill_entity_id ??
+					this.config.autofill_entity_id ??
+					AUTOFILL,
+				this.getEntryContext(this.activeEntry as IElementConfig),
+			) as boolean) ?? true;
 		const placeholderEntityId =
 			(Array.isArray(
 				(this.activeEntry as IElementConfig)?.tap_action?.target
@@ -912,12 +919,12 @@ export class UniversalRemoteCardEditor extends LitElement {
 				{
 					entity: {},
 				},
-				placeholderEntityId,
+				autofill ? placeholderEntityId : undefined,
 			)}
 			${
 				this.hass.states[
 					(this.activeEntry as IElementConfig)?.entity_id ??
-						placeholderEntityId ??
+						(autofill ? placeholderEntityId : '') ??
 						''
 				]
 					? this.buildSelector(
@@ -930,7 +937,7 @@ export class UniversalRemoteCardEditor extends LitElement {
 											?.entity_id ?? placeholderEntityId,
 								},
 							},
-							'state',
+							autofill ? 'state' : undefined,
 					  )
 					: ''
 			}
@@ -943,15 +950,17 @@ export class UniversalRemoteCardEditor extends LitElement {
 					{
 						boolean: {},
 					},
-					this.config.autofill_entity_id ?? AUTOFILL,
+					autofill
+						? this.config.autofill_entity_id ?? AUTOFILL
+						: AUTOFILL,
 				)}
 				${this.buildSelector(
 					'Haptics',
 					'haptics',
 					{
 						boolean: {},
 					},
-					this.config.haptics ?? HAPTICS,
+					autofill ? this.config.haptics ?? HAPTICS : HAPTICS,
 				)}
 			</div>
 		</div> `;
@@ -1047,6 +1056,13 @@ export class UniversalRemoteCardEditor extends LitElement {
 		const context = this.getEntryContext(
 			(this.activeEntry as IElementConfig) ?? ({} as IElementConfig),
 		);
+		const autofill =
+			(this.renderTemplate(
+				(this.activeEntry as IElementConfig).autofill_entity_id ??
+					this.config.autofill_entity_id ??
+					AUTOFILL,
+				context,
+			) as boolean) ?? true;
 		const action = this.renderTemplate(
 			(this.activeEntry as IElementConfig)?.[actionType]?.action ??
 				'none',
@@ -1066,7 +1082,9 @@ export class UniversalRemoteCardEditor extends LitElement {
 								unit_of_measurement: 'ms',
 							},
 						},
-						this.config.double_tap_window ?? DOUBLE_TAP_WINDOW,
+						(autofill
+							? this.config.double_tap_window
+							: undefined) ?? DOUBLE_TAP_WINDOW,
 				  )
 				: action != 'none' && actionType == 'multi_double_tap_action'
 				? this.buildSelector(
@@ -1080,7 +1098,9 @@ export class UniversalRemoteCardEditor extends LitElement {
 								unit_of_measurement: 'ms',
 							},
 						},
-						this.config.double_tap_window ?? DOUBLE_TAP_WINDOW,
+						(autofill
+							? this.config.double_tap_window
+							: undefined) ?? DOUBLE_TAP_WINDOW,
 				  )
 				: actionType == 'hold_action' &&
 				  (this.activeEntry as IElementConfig).hold_action
@@ -1096,7 +1116,8 @@ export class UniversalRemoteCardEditor extends LitElement {
 									unit_of_measurement: 'ms',
 								},
 							},
-							this.config.hold_time ?? HOLD_TIME,
+							(autofill ? this.config.hold_time : undefined) ??
+								HOLD_TIME,
 						)}
 						${this.renderTemplate(
 							(this.activeEntry as IElementConfig)?.hold_action
@@ -1114,7 +1135,9 @@ export class UniversalRemoteCardEditor extends LitElement {
 											unit_of_measurement: 'ms',
 										},
 									},
-									this.config.repeat_delay ?? REPEAT_DELAY,
+									(autofill
+										? this.config.repeat_delay
+										: undefined) ?? REPEAT_DELAY,
 							  )
 							: ''}
 				  </div>`
@@ -1132,7 +1155,8 @@ export class UniversalRemoteCardEditor extends LitElement {
 									unit_of_measurement: 'ms',
 								},
 							},
-							this.config.hold_time ?? HOLD_TIME,
+							(autofill ? this.config.hold_time : undefined) ??
+								HOLD_TIME,
 						)}
 						${this.renderTemplate(
 							(this.activeEntry as IElementConfig)
@@ -1150,7 +1174,9 @@ export class UniversalRemoteCardEditor extends LitElement {
 											unit_of_measurement: 'ms',
 										},
 									},
-									this.config.repeat_delay ?? REPEAT_DELAY,
+									(autofill
+										? this.config.repeat_delay
+										: undefined) ?? REPEAT_DELAY,
 							  )
 							: ''}
 				  </div>`
@@ -1167,7 +1193,7 @@ export class UniversalRemoteCardEditor extends LitElement {
 									},
 								},
 							},
-							this.config.remote_id,
+							autofill ? this.config.remote_id : undefined,
 						)}
 						${this.buildSelector('Key', `${actionType}.key`, {
 							text: {},
@@ -1186,7 +1212,7 @@ export class UniversalRemoteCardEditor extends LitElement {
 									},
 								},
 							},
-							this.config.remote_id,
+							autofill ? this.config.remote_id : undefined,
 						)}
 						${this.buildSelector('Source', `${actionType}.source`, {
 							text: {},
@@ -1205,7 +1231,7 @@ export class UniversalRemoteCardEditor extends LitElement {
 										},
 									},
 								},
-								this.config.keyboard_id,
+								autofill ? this.config.keyboard_id : undefined,
 							)}
 							${this.buildSelector(
 								'Platform',
@@ -1217,10 +1243,13 @@ export class UniversalRemoteCardEditor extends LitElement {
 										reorder: false,
 									},
 								},
-								KeyboardPlatforms.includes(
-									this.config.platform as KeyboardPlatform,
-								)
-									? this.config.platform
+								autofill
+									? KeyboardPlatforms.includes(
+											this.config
+												.platform as KeyboardPlatform,
+									  )
+										? this.config.platform
+										: 'Android TV'
 									: 'Android TV',
 							)}
 						</div>
@@ -1239,10 +1268,12 @@ export class UniversalRemoteCardEditor extends LitElement {
 						{
 							entity: {},
 						},
-						(this.activeEntry as IElementConfig)?.entity_id ??
-							this.config.remote_id ??
-							this.config.media_player_id ??
-							this.config.keyboard_id,
+						autofill
+							? (this.activeEntry as IElementConfig)?.entity_id ??
+									this.config.remote_id ??
+									this.config.media_player_id ??
+									this.config.keyboard_id
+							: undefined,
 				  )
 				: ''}
 			${action == 'toggle'