fix trivial components paste handling on MacOS

teamapps-org · May 27, 2024 · f117ad6 · f117ad6
1 parent 0e780f8
commit f117ad6
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 104 deletions.
diff --git a/teamapps-client/ts/modules/trivial-components/TrivialComboBox.ts b/teamapps-client/ts/modules/trivial-components/TrivialComboBox.ts
@@ -259,19 +259,19 @@ export class TrivialComboBox<E> implements TrivialComponent {
 					this.$editor.value = "";
 				}
 				this.closeDropDown();
-			} else {
-				if (!this.isEditorVisible) {
-					this.showEditor();
-					this.$editor.select();
-				}
-				if (!this.config.showDropDownOnResultsOnly) {
-					this.openDropDown();
-				}
-
-				// We need the new editor value (after the keydown event). Therefore setTimeout().
-				setTimeout(() => this.query(this.getEditorValueLeftOfSelection(), this.config.preselectFirstQueryResult && this.$editor.value ? 1 : 0))
 			}
 		});
+		this.$editor.addEventListener("input", e => {
+			if (!this.isEditorVisible) {
+				this.showEditor();
+				this.$editor.select();
+			}
+			if (!this.config.showDropDownOnResultsOnly) {
+				this.openDropDown();
+			}
+
+			this.query(this.getEditorValueLeftOfSelection(), this.config.preselectFirstQueryResult && this.$editor.value ? 1 : 0);
+		});
 
 		[this.$comboBox, this.$dropDown].forEach(element => {
 			element.addEventListener("mousedown", () => {

diff --git a/teamapps-client/ts/modules/trivial-components/TrivialDateTimeField.ts b/teamapps-client/ts/modules/trivial-components/TrivialDateTimeField.ts
@@ -308,22 +308,18 @@ export class TrivialDateTimeField implements TrivialComponent {
 							selectElementContents(this.getActiveEditor()[0], 0, this.getActiveEditor().text().length);
 						}
 						this.closeDropDown();
-					} else {
-						this.setDropDownMode(e.currentTarget === this.$dateEditor[0] ? Mode.MODE_DATE_LIST : Mode.MODE_TIME_LIST);
-						this.openDropDown();
-						setTimeout(() => { // We need the new editor value (after the keydown event). Therefore setTimeout().
-							// if (this.$editor.val()) {
-							// this.query(1);
-							// } else {
-							// 	this.query(0);
-							// 	this.treeBox.setHighlightedEntryById(null);
-							// }
-							this.query(1);
-						});
 					}
 				}
 			);
 
+		[this.$dateEditor, this.$timeEditor].forEach(editor => {
+			editor[0].addEventListener("input", e => {
+				this.setDropDownMode(e.currentTarget === this.$dateEditor[0] ? Mode.MODE_DATE_LIST : Mode.MODE_TIME_LIST);
+				this.openDropDown();
+				this.query(1);
+			})
+		});
+
 		this.setValue(null);
 
 		this.$dateTimeField.add(this.$dropDown).mousedown((e) => {

diff --git a/teamapps-client/ts/modules/trivial-components/TrivialTagComboBox.ts b/teamapps-client/ts/modules/trivial-components/TrivialTagComboBox.ts
@@ -383,17 +383,14 @@ export class TrivialTagComboBox<E> implements TrivialComponent {
 					this.focus();
 				}
 				this.closeDropDown();
-			} else {
-				this.setTagToBeRemoved(null);
-				if (!this.config.showDropDownOnResultsOnly) {
-					this.openDropDown();
-				}
-
-				// We need the new editor value (after the keydown event). Therefore setTimeout().
-				setTimeout(() => this.query(this.config.preselectFirstQueryResult && this.$editor.textContent ? 1 : 0))
 			}
 		});
-		this.$editor.addEventListener("keyup", (e) => {
+		this.$editor.addEventListener("input", e => {
+			this.setTagToBeRemoved(null);
+			if (!this.config.showDropDownOnResultsOnly) {
+				this.openDropDown();
+			}
+
 			function splitStringBySeparatorChars(s: string, separatorChars: string[]) {
 				return s.split(new RegExp("[" + escapeSpecialRegexCharacter(separatorChars.join()) + "]"));
 			}
@@ -415,7 +412,9 @@ export class TrivialTagComboBox<E> implements TrivialComponent {
 					this.closeDropDown();
 				}
 			}
-		});
+
+			this.query(this.config.preselectFirstQueryResult && this.$editor.textContent ? 1 : 0);
+		})
 		this.$editor.addEventListener("mousedown", () => {
 			if (this.editingMode === "editable") {
 				if (!this.config.showDropDownOnResultsOnly) {

diff --git a/...ded/src/test/java/org/teamapps/server/jetty/embedded/TeamAppsJettyEmbeddedServerTest.java b/...ded/src/test/java/org/teamapps/server/jetty/embedded/TeamAppsJettyEmbeddedServerTest.java
@@ -20,17 +20,14 @@
 package org.teamapps.server.jetty.embedded;
 
 import org.teamapps.icon.material.MaterialIcon;
-import org.teamapps.ux.application.ResponsiveApplication;
-import org.teamapps.ux.application.layout.StandardLayout;
-import org.teamapps.ux.application.perspective.Perspective;
-import org.teamapps.ux.application.view.View;
+import org.teamapps.ux.component.field.combobox.ComboBox;
+import org.teamapps.ux.component.field.combobox.TagComboBox;
+import org.teamapps.ux.component.field.datetime.LocalDateTimeField;
+import org.teamapps.ux.component.flexcontainer.VerticalLayout;
 import org.teamapps.ux.component.rootpanel.RootPanel;
-import org.teamapps.ux.component.toolbar.ToolbarButton;
-import org.teamapps.ux.component.toolbar.ToolbarButtonGroup;
 import org.teamapps.ux.session.SessionContext;
 
 import java.util.List;
-import java.util.stream.Stream;
 
 public class TeamAppsJettyEmbeddedServerTest {
 
@@ -41,79 +38,33 @@ public static void main(String[] args) throws Exception {
 					RootPanel rootPanel = new RootPanel();
 					sessionContext.addRootPanel(null, rootPanel);
 
-					//create a responsive application that will run on desktops as well as on smart phones
-					ResponsiveApplication application = ResponsiveApplication.createApplication();
 
-					Perspective perspectiveA = createPerspective("A");
-					application.addPerspective(perspectiveA);
-					application.showPerspective(perspectiveA);
-
-					Perspective perspectiveB = createPerspective("B");
-					application.addPerspective(perspectiveB);
-					application.showPerspective(perspectiveB);
+					ComboBox<Object> combo = new ComboBox<>();
+					combo.setModel(s -> {
+						System.out.println("Combo Query: " + s);
+						return List.of(s);
+					});
 
-					ToolbarButtonGroup buttonGroup = new ToolbarButtonGroup();
-					buttonGroup.addButton(ToolbarButton.create(MaterialIcon.SAVE, "Switch Perspective", "")).onClick.addListener(toolbarButtonClickEvent -> {
-						if (application.getActivePerspective() == perspectiveA) {
-							application.showPerspective(perspectiveB);
-						} else {
-							application.showPerspective(perspectiveA);
-						}
+					TagComboBox<Object> tagCombo = new TagComboBox<>();
+					tagCombo.setModel(s -> {
+						System.out.println("TagCombo Query: " + s);
+						return List.of(s);
 					});
-					application.addApplicationButtonGroup(buttonGroup);
 
-					rootPanel.setContent(application.getUi());
+					LocalDateTimeField dateTimeField = new LocalDateTimeField();
+
+
+
+					VerticalLayout verticalLayout = new VerticalLayout();
+					verticalLayout.addComponent(combo);
+					verticalLayout.addComponent(tagCombo);
+					verticalLayout.addComponent(dateTimeField);
+					rootPanel.setContent(verticalLayout);
 				})
 				.setPort(8082)
 				.build()
 				.start();
 	}
 
-	private static Perspective createPerspective(String prefix) {
-		//create perspective with default layout
-		Perspective perspective = Perspective.createPerspective();
-
-		View leftPanel = View.createView(StandardLayout.LEFT, MaterialIcon.MESSAGE, prefix + " - Left panel", null);
-		View centerPanel = View.createView(StandardLayout.CENTER, MaterialIcon.SEARCH, prefix + " - Center panel", null, true);
-		View centerPanel2 = View.createView(StandardLayout.CENTER, MaterialIcon.PEOPLE, prefix + " - Center panel 2", null);
-		View rightPanel = View.createView(StandardLayout.RIGHT, MaterialIcon.FOLDER, prefix + " - Right panel", null);
-		View rightBottomPanel = View.createView(StandardLayout.RIGHT_BOTTOM, MaterialIcon.VIEW_CAROUSEL, prefix + " - Right bottom panel", null);
-
-		Stream.of(leftPanel,
-				centerPanel,
-				centerPanel2,
-				rightPanel,
-				rightBottomPanel).forEach(view -> view.onEffectiveVisibilityChanged().addListener(aBoolean -> {
-			System.out.println(view.getTitle() + " -> " + aBoolean);
-		}));
-
-		//create an empty left panel
-		perspective.addView(leftPanel);
-
-		//create a tabbed center panel
-		perspective.addView(centerPanel);
-		perspective.addView(centerPanel2);
-
-		//create a right panel
-		perspective.addView(rightPanel);
-
-		//create a right bottom panel
-		perspective.addView(rightBottomPanel);
-
-		//create toolbar buttons
-		ToolbarButtonGroup buttonGroup = new ToolbarButtonGroup();
-		buttonGroup.addButton(ToolbarButton.create(MaterialIcon.SAVE, "Save", "Save changes")).onClick.addListener(toolbarButtonClickEvent -> {
-			boolean visible = !centerPanel.isVisible();
-			centerPanel.setVisible(visible);
-			if (visible) {
-				centerPanel.select();
-			}
-		});
-
-		//display these buttons only when this perspective is visible
-		perspective.addWorkspaceButtonGroup(buttonGroup);
-
-		return perspective;
-	}
 
 }