Spinner is not visible while application list is being fetched #106

Removed debounced grid mask, after user types something, since we load all the application when the dialog opens. Decreased the delay for the reaction on user input in the dialog.
enonic · Sep 6, 2019 · 6ff7c47 · 6ff7c47
1 parent 448da35
commit 6ff7c47
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 11 deletions.
diff --git a/src/main/resources/assets/js/app/installation/InstallAppDialog.ts b/src/main/resources/assets/js/app/installation/InstallAppDialog.ts
@@ -1,17 +1,16 @@
-import '../../api.ts';
 import {ApplicationInput} from './view/ApplicationInput';
 import {MarketAppsTreeGrid} from './view/MarketAppsTreeGrid';
 import {ApplicationUploaderEl} from './ApplicationUploaderEl';
 import {ApplicationUploadStartedEvent} from '../browse/ApplicationUploadStartedEvent';
 import TreeNode = api.ui.treegrid.TreeNode;
 import Application = api.application.Application;
-import i18n = api.util.i18n;
 import DivEl = api.dom.DivEl;
 import MarketApplication = api.application.MarketApplication;
 import UploadFailedEvent = api.ui.uploader.UploadFailedEvent;
 import UploadStartedEvent = api.ui.uploader.UploadStartedEvent;
 import ButtonEl = api.dom.ButtonEl;
 import StringHelper = api.util.StringHelper;
+import i18n = api.util.i18n;
 
 export class InstallAppDialog
     extends api.ui.dialog.ModalDialog {
@@ -59,15 +58,10 @@ export class InstallAppDialog
 
         this.applicationInput.onTextValueChanged(() => {
             this.clearButton.setVisible(!StringHelper.isEmpty(this.applicationInput.getValue()));
+            this.marketAppsTreeGrid.mask();
             this.marketAppsTreeGrid.refresh();
         });
 
-        const showMask = api.util.AppHelper.debounce(this.marketAppsTreeGrid.mask.bind(this.marketAppsTreeGrid), 300, false);
-        this.applicationInput.getTextInput().onValueChanged(() => {
-            if (!this.applicationInput.isUrlTyped()) {
-                showMask();
-            }
-        });
         this.applicationInput.onAppInstallStarted(() => {
             this.marketAppsTreeGrid.mask();
             this.statusMessage.showInstalling();

diff --git a/src/main/resources/assets/js/app/installation/view/ApplicationInput.ts b/src/main/resources/assets/js/app/installation/view/ApplicationInput.ts
@@ -10,9 +10,12 @@ import UploadFailedEvent = api.ui.uploader.UploadFailedEvent;
 
 export class ApplicationInput extends api.dom.CompositeFormInputEl {
 
+    private static LAST_KEY_PRESS_TIMEOUT: number = 300;
+
     private textInput: InputEl;
+
     private applicationUploaderEl: ApplicationUploaderEl;
-    private LAST_KEY_PRESS_TIMEOUT: number;
+
     private cancelAction: Action;
 
     private textValueChangedListeners: {(): void}[] = [];
@@ -40,7 +43,6 @@ export class ApplicationInput extends api.dom.CompositeFormInputEl {
             showCancel: false
         }));
 
-        this.LAST_KEY_PRESS_TIMEOUT = 750;
         this.cancelAction = cancelAction;
 
         this.applicationUploaderEl.onUploadStarted((event: UploadStartedEvent<Application>) => {
@@ -67,7 +69,7 @@ export class ApplicationInput extends api.dom.CompositeFormInputEl {
     }
 
     private initUrlEnteredHandler() {
-        const keyDownHandler: () => void = api.util.AppHelper.debounce(this.startInstall.bind(this), this.LAST_KEY_PRESS_TIMEOUT);
+        const keyDownHandler: () => void = api.util.AppHelper.debounce(() => this.startInstall(), ApplicationInput.LAST_KEY_PRESS_TIMEOUT);
 
         this.onKeyDown((event) => {
             switch (event.keyCode) {