Merge pull request #241 from GSA/hierarchicalEnhancement

Hierarchical enhancement X Character count

src/ui-kit/experimental/hierarchical/autocomplete/autocomplete.component.spec.ts

@@ -75,6 +75,25 @@ describe('SamHierarchicalAutocompleteComponent', () => {
     expect(emptyItem).toBeTruthy();
   }));
 
+  it('Should have results with minimumCharacterCountSearch', fakeAsync(() => {
+
+    const event = {
+      "key": "Space",
+      "target": { "value": 'Level 7' }
+    }
+    component.configuration.minimumCharacterCountSearch = 3;
+    component.onKeyup(event);
+    fixture.detectChanges();
+    tick();
+    fixture.detectChanges();
+    const list = fixture.debugElement.query(By.css('.autocomplete-result'));
+    expect(list.nativeElement.children.length).toBe(3);
+
+  }));
+
+
+
+
 
   it('Should have results key press', fakeAsync(() => {
     const event = {
@@ -90,6 +109,24 @@ describe('SamHierarchicalAutocompleteComponent', () => {
     expect(component.results[0]['highlighted']).toBeTruthy();
   }));
 
+
+
+  it('Should have empty results key press minimumCharacterCountSearch', fakeAsync(() => {
+    const event = {
+      "key": "d",
+      "target": { "value": 'id' }
+    }
+    component.configuration.minimumCharacterCountSearch = 3;
+    component.onKeyup(event);
+    fixture.detectChanges();
+    tick();
+    fixture.detectChanges();
+    const list = fixture.debugElement.query(By.css('.autocomplete-result'));
+    expect(list).toBe(null);
+  }));
+
+
+
   it('Should have reuslts on focus', fakeAsync(() => {
     component.inputFocusHandler();
     fixture.detectChanges();

src/ui-kit/experimental/hierarchical/autocomplete/autocomplete.component.ts

@@ -232,22 +232,24 @@ export class SamHierarchicalAutocompleteComponent {
    * @param searchString 
    */
   private getResults(searchString: string): void {
-    if (!this.matchPastSearchString(searchString) ||
-      (this.matchPastSearchString(searchString) && !this.showResults)
-      || this.matchPastSearchString('')) {
-      this.searchString = searchString;
-      window.clearTimeout(this.timeoutNumber);
-      this.timeoutNumber = window.setTimeout(() => {
-        this.service.getDataByText(0, searchString).subscribe(
-          (result) => {
-            this.results = result.items;
-            this.maxResults = result.totalItems;
-            this.highlightedIndex = 0;
-            this.setHighlightedItem(this.results[this.highlightedIndex]);
-            this.showResults = true;
-            this.addScreenReaderMessage(this.maxResults + ' ' + this.resultsAvailableMessage)
-          });
-      }, this.configuration.debounceTime);
+    if (searchString.length >= this.configuration.minimumCharacterCountSearch) {
+      if (!this.matchPastSearchString(searchString) ||
+        (this.matchPastSearchString(searchString) && !this.showResults)
+        || this.matchPastSearchString('')) {
+        this.searchString = searchString;
+        window.clearTimeout(this.timeoutNumber);
+        this.timeoutNumber = window.setTimeout(() => {
+          this.service.getDataByText(0, searchString).subscribe(
+            (result) => {
+              this.results = result.items;
+              this.maxResults = result.totalItems;
+              this.highlightedIndex = 0;
+              this.setHighlightedItem(this.results[this.highlightedIndex]);
+              this.showResults = true;
+              this.addScreenReaderMessage(this.maxResults + ' ' + this.resultsAvailableMessage)
+            });
+        }, this.configuration.debounceTime);
+      }
     }
   }
 

src/ui-kit/experimental/hierarchical/hierarchical/hierarchical.component.html

@@ -1,9 +1,5 @@
-
 <div class="hierarchical component">
-    <a (click)="onModalClick()">Advanced Lookup</a>
-
-<div>
-    <a class="advanced-link" (click)="onModalClick()">Advanced Lookup</a>
+    <a *ngIf="!configuration.hideAdvancedLookup" class="advanced-link" (click)="onModalClick()">Advanced Lookup</a>
     <sam-hierarchical-autocomplete #autocomplete [service]="service" [model]="model" [configuration]="configuration"
         [itemTemplate]="suggestionTemplate"></sam-hierarchical-autocomplete>
     <sam-selected-result *ngIf="!isSingleMode()" [model]="model" [configuration]="configuration" [itemTemplate]="selectedItemTemplate"></sam-selected-result>
@@ -12,4 +8,4 @@
         (onSubmit)="onModalSubmitClick()">
         <sam-hierarchical-tree #hierarchicaltree [configuration]="configuration" [service]="service" [isSingleMode]="isSingleMode()"></sam-hierarchical-tree>
     </sam-modal>
-</div>
+</div>

src/ui-kit/experimental/hierarchical/models/SamHierarchicalAutocompleteConfiguration.ts

@@ -1,47 +1,51 @@
 export class SamHierarchicalAutocompleteConfiguration {
 
-    /**
-     * sets the default debounce time to 250 milliseconds 
-     */
-    constructor() {
-      this.debounceTime = 250;
-    }
-
-    /**
-     * Used to describe the drop down (Text should match the label that will be supplied)
-     */
-    public labelText: string;
-
-    /**
-     * Used for the Id of the control
-     */
-    public id: string;
-
-    /**
-     *  This is the primary field used to identify each object in the results
-     */
-    public primaryKeyField: string;
-
-    /**
-     *  Property from supplied model used for the top part of the basic template
-     */
-    public primaryTextField: string;
-
-    /**
-     *  Property from supplied model used for the bottom part of the basic template
-     */
-    public secondaryTextField: string;
-
-    /**
-     *  Sets the time waited for addional key actions Default is 250 milliseconds
-     */
-    public debounceTime: number;
-
-    /**
-     * Place holder text for autocomplete input
-     */
-    public autocompletePlaceHolderText: string;
-
-
+  /**
+   * sets the default debounce time to 250 milliseconds 
+   */
+  constructor() {
+    this.debounceTime = 250;
+    this.minimumCharacterCountSearch = 0;
   }
-
+
+  /**
+   * Used to describe the drop down (Text should match the label that will be supplied)
+   */
+  public labelText: string;
+
+  /**
+   * Used for the Id of the control
+   */
+  public id: string;
+
+  /**
+   *  This is the primary field used to identify each object in the results
+   */
+  public primaryKeyField: string;
+
+  /**
+   *  Property from supplied model used for the top part of the basic template
+   */
+  public primaryTextField: string;
+
+  /**
+   *  Property from supplied model used for the bottom part of the basic template
+   */
+  public secondaryTextField: string;
+
+  /**
+   *  Sets the time waited for addional key actions Default is 250 milliseconds
+   */
+  public debounceTime: number;
+
+  /**
+   * Place holder text for autocomplete input
+   */
+  public autocompletePlaceHolderText: string;
+
+  /**
+   * Mininumn Characters for search
+   */
+  public minimumCharacterCountSearch: number;
+
+}

src/ui-kit/experimental/hierarchical/models/SamHierarchicalConfiguration.ts

@@ -15,6 +15,7 @@ export class SamHierarchicalConfiguration implements SamHierarchicalAutocomplete
         this.debounceTime = 250;
         this.modalCancelButtonLabel = "Cancel";
         this.modalSelectButtonLabel = "Select";
+        this.minimumCharacterCountSearch = 0;
     }
 
     /**
@@ -87,4 +88,15 @@ export class SamHierarchicalConfiguration implements SamHierarchicalAutocomplete
      */
     public topLevelBreadcrumbText: string;
 
+    /**
+     * Mininumn Characters for search
+     */
+    public minimumCharacterCountSearch: number;
+
+
+    /**
+     * Determines if the the advanced lookup is hidden
+     */
+    public hideAdvancedLookup: boolean;
+
 }