Refactored createWISELinkLinkElement and createWISELinkButtonElement …

…functions. #2626
WISE-Community · Sep 18, 2020 · 0c0a3fe · 0c0a3fe
1 parent de2e531
commit 0c0a3fe
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 48 deletions.
diff --git a/src/main/webapp/wise5/authoringTool/wiseLink/wiseLinkAuthoring.html b/src/main/webapp/wise5/authoringTool/wiseLink/wiseLinkAuthoring.html
@@ -51,7 +51,7 @@ <h5>{{ ::'createAWISELink' | translate }}</h5>
   <md-input-container>
     <label>{{ ::'setLinkText' | translate }}</label>
     <input ng-model="wiseLinkAuthoringController.wiseLinkText"
-         ng-model-options='{ debounce: 1000 }'
+         ng-model-options='{ debounce: 500 }'
          size="50"/>
   </md-input-container>
   <br/>

diff --git a/src/main/webapp/wise5/components/html/htmlAuthoringController.ts b/src/main/webapp/wise5/components/html/htmlAuthoringController.ts
@@ -147,18 +147,46 @@ class HTMLAuthoringController extends HTMLController {
   createWISELink({ nodeId, componentId, wiseLinkNodeId, wiseLinkComponentId, wiseLinkType,
       wiseLinkText, target }) {
     if (nodeId === this.nodeId && componentId === this.componentId && target === 'prompt') {
-      if (wiseLinkType === 'link') {
-        this.injectWISELinkToPrompt(
-          this.createWISELinkLinkElement(wiseLinkNodeId, wiseLinkComponentId, wiseLinkText)
-        );
-      } else {
-        this.injectWISELinkToPrompt(
-          this.createWISELinkButtonElement(wiseLinkNodeId, wiseLinkComponentId, wiseLinkText)
-        );
-      }
+      this.injectWISELinkToPrompt(
+        this.createWISELinkElement(wiseLinkType, wiseLinkNodeId, wiseLinkComponentId, wiseLinkText)
+      );
     }
   }
 
+  injectWISELinkToPrompt(wiseLinkElement) {
+    const summernoteId = 'summernotePrompt_' + this.nodeId + '_' + this.componentId;
+    angular.element(document.querySelector(`#${summernoteId}`)).summernote('editor.restoreRange');
+    angular.element(document.querySelector(`#${summernoteId}`)).summernote('editor.focus');
+    angular
+      .element(document.querySelector(`#${summernoteId}`))
+      .summernote('insertNode', wiseLinkElement);
+    angular
+      .element(document.querySelector(`#${summernoteId}`))
+      .summernote('insertNode', document.createElement('br'));
+  }
+
+  /**
+   * @param type Allowed values are 'link' or 'button'.
+   */
+  createWISELinkElement(type: string, wiseLinkNodeId: string, wiseLinkComponentId: string = '',
+      wiseLinkText: string) {
+    let wiseLinkElement: any;
+    if (type === 'link') {
+      wiseLinkElement = document.createElement('a');
+    } else {
+      wiseLinkElement = document.createElement('button');
+    }
+    wiseLinkElement.setAttribute('type', type);
+    wiseLinkElement.setAttribute('wiselink', true);
+    wiseLinkElement.setAttribute('node-id', wiseLinkNodeId);
+    if (wiseLinkComponentId != '') {
+      wiseLinkElement.setAttribute('component-id', wiseLinkComponentId);
+    }
+    wiseLinkElement.setAttribute('link-text', wiseLinkText);
+    wiseLinkElement.innerHTML = wiseLinkText;
+    return wiseLinkElement;
+  }
+
   createOpenAssetChooserFunction() {
     return (params: any) => {
       this.ProjectAssetService.openAssetChooser(params).then(
@@ -185,44 +213,6 @@ class HTMLAuthoringController extends HTMLController {
     }
   }
 
-  createWISELinkLinkElement(wiseLinkNodeId, wiseLinkComponentId = '', wiseLinkText) {
-    const wiseLinkElement: any = document.createElement('a');
-    wiseLinkElement.innerHTML = wiseLinkText;
-    wiseLinkElement.setAttribute('wiselink', true);
-    wiseLinkElement.setAttribute('node-id', wiseLinkNodeId);
-    if (wiseLinkComponentId != '') {
-      wiseLinkElement.setAttribute('component-id', wiseLinkComponentId);
-    }
-    wiseLinkElement.setAttribute('type', 'link');
-    wiseLinkElement.setAttribute('link-text', wiseLinkText);
-    return wiseLinkElement;
-  }
-
-  createWISELinkButtonElement(wiseLinkNodeId, wiseLinkComponentId = '', wiseLinkText) {
-    const wiseLinkElement: any = document.createElement('button');
-    wiseLinkElement.innerHTML = wiseLinkText;
-    wiseLinkElement.setAttribute('wiselink', true);
-    wiseLinkElement.setAttribute('node-id', wiseLinkNodeId);
-    if (wiseLinkComponentId != '') {
-      wiseLinkElement.setAttribute('component-id', wiseLinkComponentId);
-    }
-    wiseLinkElement.setAttribute('type', 'button');
-    wiseLinkElement.setAttribute('link-text', wiseLinkText);
-    return wiseLinkElement;
-  }
-
-  injectWISELinkToPrompt(wiseLinkElement) {
-    const summernoteId = 'summernotePrompt_' + this.nodeId + '_' + this.componentId;
-    angular.element(document.querySelector(`#${summernoteId}`)).summernote('editor.restoreRange');
-    angular.element(document.querySelector(`#${summernoteId}`)).summernote('editor.focus');
-    angular
-      .element(document.querySelector(`#${summernoteId}`))
-      .summernote('insertNode', wiseLinkElement);
-    angular
-      .element(document.querySelector(`#${summernoteId}`))
-      .summernote('insertNode', document.createElement('br'));
-  }
-
   summernotePromptHTMLChanged() {
     this.authoringComponentContent.html = this.UtilService.insertWISELinks(
       this.ConfigService.removeAbsoluteAssetPaths(this.summernotePromptHTML)