From f117ad68c2e910243501ba8974d75bcd44245f73 Mon Sep 17 00:00:00 2001 From: Yann Massard Date: Mon, 27 May 2024 13:35:56 +0200 Subject: [PATCH] fix trivial components paste handling on MacOS --- .../trivial-components/TrivialComboBox.ts | 22 ++--- .../TrivialDateTimeField.ts | 20 ++-- .../trivial-components/TrivialTagComboBox.ts | 19 ++-- .../TeamAppsJettyEmbeddedServerTest.java | 93 +++++-------------- 4 files changed, 50 insertions(+), 104 deletions(-) diff --git a/teamapps-client/ts/modules/trivial-components/TrivialComboBox.ts b/teamapps-client/ts/modules/trivial-components/TrivialComboBox.ts index 2143f62d0..657ab3988 100644 --- 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 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 index 071471e46..d3891c2bc 100644 --- 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 index 1ac4aec44..d1236af54 100644 --- 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 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 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/teamapps-server-jetty-embedded/src/test/java/org/teamapps/server/jetty/embedded/TeamAppsJettyEmbeddedServerTest.java b/teamapps-server-jetty-embedded/src/test/java/org/teamapps/server/jetty/embedded/TeamAppsJettyEmbeddedServerTest.java index c4f018092..a6bc7d7aa 100644 --- a/teamapps-server-jetty-embedded/src/test/java/org/teamapps/server/jetty/embedded/TeamAppsJettyEmbeddedServerTest.java +++ b/teamapps-server-jetty-embedded/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 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 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; - } }