From 6151c65c8f619ce24f66b576787f43e5d750e9f9 Mon Sep 17 00:00:00 2001
From: Image-unavailable <56268917+Image-unavailable@users.noreply.github.com>
Date: Sat, 10 Sep 2022 13:22:19 +0200
Subject: [PATCH 1/3] Fix collisions between bool props with same name

---
 CHANGELOG.md                                               | 1 +
 .../widgets/boolean-widget/boolean-widget.component.html   | 7 +++++--
 .../widgets/boolean-widget/boolean-widget.component.ts     | 3 +++
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9f8ac134..54bbde14 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - Fixed compatibility with the newer Electron versions.
 - Enemy editing popup no longer bugs out when editing enemies inside event steps.
 - Fixed copy-pasting of `IF` steps and other steps with branches.
+- Fixed buggy behaviour when two checkboxes that refer to properties with the same name are visible at the same time ([#240](https://github.com/CCDirectLink/crosscode-map-editor/issues/240)).
 
 ## [0.14.0] 2022-05-28
 - Add coordinate display for the cursor in entity view
diff --git a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html
index 67c518c4..482d2fe1 100644
--- a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html
+++ b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html
@@ -1,6 +1,9 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label [for]="key" class="property-name">{{key}}:</label>
-	<mat-checkbox [id]="key"
+	<!-- uid is necessary because mat-checkbox uses ids to bind events, if two checkboxes anywhere have the same id confusing things happen. -->
+	<!-- Also, a counter which is always increased by one is what mat-checkbox does already when no id is assigned. -->
+	<label for="{{uid}}-{{key}}" class="property-name">{{key}}:</label>
+	<mat-checkbox 
+				  id="{{uid}}-{{key}}"
 	              color="primary"
 	              [checked]="settings[key]"
 	              (change)="setSetting(key, $event.checked)">
diff --git a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts
index b88236f5..17839935 100644
--- a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts
+++ b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts
@@ -7,6 +7,9 @@ import {AbstractWidget} from '../abstract-widget';
 	styleUrls: ['./boolean-widget.component.scss', '../widget.scss']
 })
 export class BooleanWidgetComponent extends AbstractWidget {
+	private static counter = 1;
+	uid = BooleanWidgetComponent.counter++;
+	
 	constructor() {
 		super();
 	}

From 3a2dab95ba6e813b071585f82d4dc39cce5900f8 Mon Sep 17 00:00:00 2001
From: Image-unavailable <56268917+Image-unavailable@users.noreply.github.com>
Date: Tue, 11 Oct 2022 17:37:39 +0200
Subject: [PATCH 2/3] Remove ids from widgets

---
 CHANGELOG.md                                              | 8 +++++++-
 .../widgets/boolean-widget/boolean-widget.component.html  | 3 +--
 .../enemy-type-widget/enemy-type-widget.component.html    | 2 +-
 .../widgets/event-widget/event-widget.component.html      | 2 +-
 .../shared/widgets/json-widget/json-widget.component.html | 3 +--
 .../langlabel-widget/langlabel-widget.component.html      | 6 ++----
 .../npc-states-widget/npc-states-widget.component.html    | 2 +-
 .../npc-states/npc-states.component.html                  | 8 ++++----
 .../widgets/number-widget/number-widget.component.html    | 4 ++--
 .../person-expression-widget.component.html               | 4 ++--
 .../widgets/string-widget/string-widget.component.html    | 5 +----
 .../shared/widgets/vec2-widget/vec2-widget.component.html | 8 ++++----
 12 files changed, 27 insertions(+), 28 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 02be9c3a..e4841496 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
 ## [Unreleased]
+
+### Fixed
+- Fixed buggy behaviour when two checkboxes that refer to properties with the same name are visible at the same time ([#240](https://github.com/CCDirectLink/crosscode-map-editor/issues/240)).
+
+### Changed
+- Clicking the label of a property now no longer selects the input for that property.
+
 ## [0.16.0] 2022-10-03
 ## [0.15.1] 2022-09-28
 
@@ -21,7 +28,6 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - Enemy editing popup no longer bugs out when editing enemies inside event steps.
 - Fixed copy-pasting of `IF` steps and other steps with branches.
 - Fixed inability to edit certain `String` properties of various event and action steps.
-- Fixed buggy behaviour when two checkboxes that refer to properties with the same name are visible at the same time ([#240](https://github.com/CCDirectLink/crosscode-map-editor/issues/240)).
 
 ### Changed
 - `String` inputs for event steps, action steps, and entity properties, as well as the map creation dialog now also allow values different from the suggested ones.
diff --git a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html
index 482d2fe1..f8b5543c 100644
--- a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html
+++ b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.html
@@ -1,9 +1,8 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
 	<!-- uid is necessary because mat-checkbox uses ids to bind events, if two checkboxes anywhere have the same id confusing things happen. -->
 	<!-- Also, a counter which is always increased by one is what mat-checkbox does already when no id is assigned. -->
-	<label for="{{uid}}-{{key}}" class="property-name">{{key}}:</label>
+	<label class="property-name">{{key}}:</label>
 	<mat-checkbox 
-				  id="{{uid}}-{{key}}"
 	              color="primary"
 	              [checked]="settings[key]"
 	              (change)="setSetting(key, $event.checked)">
diff --git a/webapp/src/app/shared/widgets/enemy-type-widget/enemy-type-widget.component.html b/webapp/src/app/shared/widgets/enemy-type-widget/enemy-type-widget.component.html
index 0aea92fe..3ee3e5dc 100644
--- a/webapp/src/app/shared/widgets/enemy-type-widget/enemy-type-widget.component.html
+++ b/webapp/src/app/shared/widgets/enemy-type-widget/enemy-type-widget.component.html
@@ -1,5 +1,5 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label [for]="key" class="property-name">{{key}}:</label>
+	<label class="property-name">{{key}}:</label>
 	<input type="button" class="default-input"
 	       [value]="this.settings[this.key] ? '[ Enemy type ]' : '[ null ]'"
 	       (click)="open()">
diff --git a/webapp/src/app/shared/widgets/event-widget/event-widget.component.html b/webapp/src/app/shared/widgets/event-widget/event-widget.component.html
index abf16edb..078cf73f 100644
--- a/webapp/src/app/shared/widgets/event-widget/event-widget.component.html
+++ b/webapp/src/app/shared/widgets/event-widget/event-widget.component.html
@@ -1,5 +1,5 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label [for]="key" class="property-name">{{key}}:</label>
+	<label class="property-name">{{key}}:</label>
 	<input type="button" class="default-input"
 	       [value]="this.settings[this.key] ? '[ ' + this.settings[this.key].length + ' events ]' : '[ null ]'"
 	       (click)="open()">
diff --git a/webapp/src/app/shared/widgets/json-widget/json-widget.component.html b/webapp/src/app/shared/widgets/json-widget/json-widget.component.html
index d37f3fb7..c444b8d4 100644
--- a/webapp/src/app/shared/widgets/json-widget/json-widget.component.html
+++ b/webapp/src/app/shared/widgets/json-widget/json-widget.component.html
@@ -1,7 +1,6 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label [for]="key" class="property-name" *ngIf="!noPropName">{{key}}:</label>
+	<label class="property-name" *ngIf="!noPropName">{{key}}:</label>
 	<textarea class="default-input"
-	          [id]="key"
 	          [ngModel]="json.stringify(settings[key], null, 2)"
 	          (input)="setCustomSetting(key, $event.target.value)">
 	</textarea>
diff --git a/webapp/src/app/shared/widgets/langlabel-widget/langlabel-widget.component.html b/webapp/src/app/shared/widgets/langlabel-widget/langlabel-widget.component.html
index ac09e999..bd03a44b 100644
--- a/webapp/src/app/shared/widgets/langlabel-widget/langlabel-widget.component.html
+++ b/webapp/src/app/shared/widgets/langlabel-widget/langlabel-widget.component.html
@@ -3,23 +3,21 @@
 	
 	<div fxLayout="column" fxFlex="1 1 0">
 		<div fxLayout="row" class="property-row has-value">
-			<label for=".hasValue" class="property-name">Has value: </label>
+			<label class="property-name">Has value: </label>
 			<mat-checkbox
 				[ngModel]="hasValue"
 				(ngModelChange)="setSetting([key], $event? defaultValue : undefined)"
 				class="material-input"
 				color="primary"
-				id=".hasValue"
 			></mat-checkbox>
 		</div>
 		<div *ngIf="hasValue" class="properties-container" (resized)="resizeTextareas()">
 			<div *ngFor="let language of languages" fxLayout="row" class="property-row language">
-				<label for="{{key}}.{{language}}" class="property-name">{{language}}</label>
+				<label class="property-name">{{language}}</label>
 				<!-- textarea inside div with padding because autosize does not like textareas with padding -->
 				<div class="default-input padded-autosize-textarea">
 					<textarea
 						class="default-input"
-						id="{{key}}.{{language}}"
 						[ngModel]="settings[key][language]"
 						(ngModelChange)="setSetting([key, language], $event)"
 						cdkTextareaAutosize
diff --git a/webapp/src/app/shared/widgets/npc-states-widget/npc-states-widget.component.html b/webapp/src/app/shared/widgets/npc-states-widget/npc-states-widget.component.html
index 341b3f97..1bb42fb7 100644
--- a/webapp/src/app/shared/widgets/npc-states-widget/npc-states-widget.component.html
+++ b/webapp/src/app/shared/widgets/npc-states-widget/npc-states-widget.component.html
@@ -1,4 +1,4 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label [for]="key" class="property-name">{{key}}:</label>
+	<label class="property-name">{{key}}:</label>
 	<input type="button" class="default-input" [value]="'[ ' + npcStates.length + ' Pages ]'" (click)="open()">
 </div>
diff --git a/webapp/src/app/shared/widgets/npc-states-widget/npc-states/npc-states.component.html b/webapp/src/app/shared/widgets/npc-states-widget/npc-states/npc-states.component.html
index 88d35bc2..f0408229 100644
--- a/webapp/src/app/shared/widgets/npc-states-widget/npc-states/npc-states.component.html
+++ b/webapp/src/app/shared/widgets/npc-states-widget/npc-states/npc-states.component.html
@@ -45,12 +45,12 @@
 							<div fxLayout="row" class="property-container">
 								<label fxFlexAlign="center" class="pos-label">Pos:</label>
 								
-								<label for="posx" class="property-name-small">X:</label>
-								<input id="posx" type="number" class="default-input small-input"
+								<label class="property-name-small">X:</label>
+								<input type="number" class="default-input small-input"
 								       [(ngModel)]="currentState.position.x">
 								
-								<label for="posy" class="property-name-small">Y:</label>
-								<input id="posy" type="number" class="default-input small-input"
+								<label class="property-name-small">Y:</label>
+								<input type="number" class="default-input small-input"
 								       [(ngModel)]="currentState.position.y">
 							</div>
 							
diff --git a/webapp/src/app/shared/widgets/number-widget/number-widget.component.html b/webapp/src/app/shared/widgets/number-widget/number-widget.component.html
index bdf6e9d6..0605a7a7 100644
--- a/webapp/src/app/shared/widgets/number-widget/number-widget.component.html
+++ b/webapp/src/app/shared/widgets/number-widget/number-widget.component.html
@@ -1,6 +1,6 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label [for]="key" class="property-name">{{key}}:</label>
-	<input type="number"  class="default-input" [id]="key"
+	<label class="property-name">{{key}}:</label>
+	<input type="number"  class="default-input"
 			[ngModel]="settings[key]"
 		   (input)="setSetting(key, $event.target.value)">
 </div>
diff --git a/webapp/src/app/shared/widgets/person-expression-widget/person-expression-widget.component.html b/webapp/src/app/shared/widgets/person-expression-widget/person-expression-widget.component.html
index e31adb82..0e72d0e1 100644
--- a/webapp/src/app/shared/widgets/person-expression-widget/person-expression-widget.component.html
+++ b/webapp/src/app/shared/widgets/person-expression-widget/person-expression-widget.component.html
@@ -1,6 +1,6 @@
 <app-character-widget [custom]="settings[key]" (onChange)="updateType($event)" key="person"></app-character-widget>
 
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
-	<label for="expression" class="property-name">expression:</label>
-	<input id="expression" class="default-input" [ngModel]="settings[key].expression" (input)="setSetting([key, 'expression'], $event.target.value)">
+	<label class="property-name">expression:</label>
+	<input class="default-input" [ngModel]="settings[key].expression" (input)="setSetting([key, 'expression'], $event.target.value)">
 </div>
\ No newline at end of file
diff --git a/webapp/src/app/shared/widgets/string-widget/string-widget.component.html b/webapp/src/app/shared/widgets/string-widget/string-widget.component.html
index 21018195..299b6b98 100644
--- a/webapp/src/app/shared/widgets/string-widget/string-widget.component.html
+++ b/webapp/src/app/shared/widgets/string-widget/string-widget.component.html
@@ -1,8 +1,7 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description" [matTooltipDisabled]="disableTooltip">
-	<label [for]="key" class="property-name">{{key}}:</label>
+	<label class="property-name">{{key}}:</label>
 	<div class="mat-select-container" *ngIf="attribute?.options; else defaultInput">
 		<app-autocompleted-textbox
-			[id]="key"
 			[availableOptions]="keys"
 			[text]="settings[key]"
 			(textChange)="setSetting(key, $event)"
@@ -12,14 +11,12 @@
 	<ng-template #defaultInput>
 		<input class="default-input"
 		       *ngIf="!attribute?.large; else largeInput"
-		       [id]="key"
 		       [ngModel]="settings[key]"
 		       (input)="setSetting(key, $event.target.value)">
 	</ng-template>
 	
 	<ng-template #largeInput>
 		<textarea class="default-input"
-		          [id]="key"
 		          [ngModel]="settings[key]"
 		          (input)="setSetting(key, $event.target.value)"
 		></textarea>
diff --git a/webapp/src/app/shared/widgets/vec2-widget/vec2-widget.component.html b/webapp/src/app/shared/widgets/vec2-widget/vec2-widget.component.html
index 8c0a3557..f0de9cc9 100644
--- a/webapp/src/app/shared/widgets/vec2-widget/vec2-widget.component.html
+++ b/webapp/src/app/shared/widgets/vec2-widget/vec2-widget.component.html
@@ -1,16 +1,16 @@
 <div fxLayout="row" class="property-container" [matTooltip]="attribute?.description">
 	<label class="property-name">{{displayName || key}}:</label>
 	
-	<label [for]="key + '.x'" class="property-name-small">X:</label>
-	<input [id]="key + '.x'" type="number" class="default-input small-input"
+	<label class="property-name-small">X:</label>
+	<input type="number" class="default-input small-input"
 	       [step]="scaleSettings.scalableStep"
 	       [min]="scaleSettings.baseSize.x"
 	       [disabled]="!scaleSettings.scalableX"
 		   [ngModel]="settings[key].x"
 		   (input)="setVal('x', toInt($event.target.value))">
 	
-	<label [for]="key + '.y'" class="property-name-small">Y:</label>
-	<input [id]="key + '.y'" type="number" class="default-input small-input"
+	<label class="property-name-small">Y:</label>
+	<input type="number" class="default-input small-input"
 	       [step]="scaleSettings.scalableStep"
 	       [min]="scaleSettings.baseSize.y"
 	       [disabled]="!scaleSettings.scalableY"

From fd77ae80b1c93acd18364e4406cde694454dc11b Mon Sep 17 00:00:00 2001
From: cramerL <vegita321@gmail.com>
Date: Tue, 18 Oct 2022 18:18:49 +0200
Subject: [PATCH 3/3] remove unused uid

---
 .../widgets/boolean-widget/boolean-widget.component.ts | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts
index 17839935..11a68e9f 100644
--- a/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts
+++ b/webapp/src/app/shared/widgets/boolean-widget/boolean-widget.component.ts
@@ -1,5 +1,5 @@
-import {Component} from '@angular/core';
-import {AbstractWidget} from '../abstract-widget';
+import { Component } from '@angular/core';
+import { AbstractWidget } from '../abstract-widget';
 
 @Component({
 	selector: 'app-boolean-widget',
@@ -7,10 +7,4 @@ import {AbstractWidget} from '../abstract-widget';
 	styleUrls: ['./boolean-widget.component.scss', '../widget.scss']
 })
 export class BooleanWidgetComponent extends AbstractWidget {
-	private static counter = 1;
-	uid = BooleanWidgetComponent.counter++;
-	
-	constructor() {
-		super();
-	}
 }