From d9815219d67a175b84b8a272ca5fcd7afadcf320 Mon Sep 17 00:00:00 2001 From: chuanlin2018 Date: Fri, 9 Aug 2024 19:56:16 -0400 Subject: [PATCH] Topics, keywords - bubbles; Filters layout changes. --- .../app/_helpers/fakeBackendInterceptor.ts | 22 +- .../landing/filters/filters.component.html | 24 +- .../app/landing/filters/filters.component.ts | 195 ++++++++------- .../app/landing/keyword/keyword.component.css | 4 + .../landing/keyword/keyword.component.html | 50 ++-- .../app/landing/keyword/keyword.component.ts | 70 +++++- .../resultlist/resultlist.component.html | 4 +- .../resultlist/resultlist.component.ts | 32 +-- .../landing/taxonomy/taxonomy.component.css | 7 +- .../landing/taxonomy/taxonomy.component.html | 15 +- .../landing/taxonomy/taxonomy.component.ts | 138 +++++++++-- .../topic-popup/search-topics.component.ts | 2 +- .../app/landing/topic/topic.component.html | 41 ++-- .../src/app/landing/topic/topic.component.ts | 54 +++- .../collection-service/collection.service.ts | 11 +- .../sample-data/collectionTestData.json | 7 +- .../src/assets/sample-data/pdr0-0002-new.json | 225 +++++++++++++++++ .../src/assets/sample-data/pdr0-0002-old.json | 231 ++++++++++++++++++ .../assets/site-constants/collections.json | 13 +- 19 files changed, 943 insertions(+), 202 deletions(-) create mode 100644 angular/src/assets/sample-data/pdr0-0002-new.json create mode 100644 angular/src/assets/sample-data/pdr0-0002-old.json diff --git a/angular/src/app/_helpers/fakeBackendInterceptor.ts b/angular/src/app/_helpers/fakeBackendInterceptor.ts index 6bcee099e..c3268f406 100644 --- a/angular/src/app/_helpers/fakeBackendInterceptor.ts +++ b/angular/src/app/_helpers/fakeBackendInterceptor.ts @@ -17,6 +17,8 @@ export class FakeBackendInterceptor implements HttpInterceptor { const sampleData: any = require('../../assets/sample-data/semi-conductors.json'); // const sampleCollection: any = require('../../assets/sample-data/semiconductors-collection.json'); const sampleCollection: any = require('../../assets/sample-data/semiconductor-realdata.json'); + + const pdr0_0002: any = require('../../assets/sample-data/pdr0-0002-new.json'); const sampleCollection2: any = require('../../assets/sample-data/collectionTestData.json'); @@ -64,15 +66,15 @@ export class FakeBackendInterceptor implements HttpInterceptor { return of(new HttpResponse({ status: 200, body: fields })); } - if (request.url.indexOf('isPartOf') > -1 && request.url.indexOf('pdr0-0002') > -1 && request.method === 'GET') { - console.log("Getting semiconductors collections.....") - return of(new HttpResponse({ status: 200, body: sampleCollection })); - } + // if (request.url.indexOf('isPartOf') > -1 && request.url.indexOf('pdr0-0002') > -1 && request.method === 'GET') { + // console.log("Getting semiconductors collections.....") + // return of(new HttpResponse({ status: 200, body: sampleCollection })); + // } - if (request.url.indexOf('pdr0-0002') > -1 && request.method === 'GET') { - console.log("Getting semiconductors.....") - return of(new HttpResponse({ status: 200, body: sampleData })); - } + // if (request.url.indexOf('pdr0-0002') > -1 && request.method === 'GET') { + // console.log("Getting semiconductors.....") + // return of(new HttpResponse({ status: 200, body: sampleData })); + // } if (request.url.indexOf('usagemetrics/files') > -1 && request.method === 'GET') { @@ -153,6 +155,10 @@ export class FakeBackendInterceptor implements HttpInterceptor { return of(new HttpResponse({ status: 200, body: sampleCollection2 })); } + if (request.url.indexOf('oardev.nist.gov/od/id/pdr0-0002') > -1 && request.method === 'GET') { + console.log("Getting CHIPS pdr0-0002.....") + return of(new HttpResponse({ status: 200, body: pdr0_0002 })); + } // return 401 not authorised if token is null or invalid // if (request.url.indexOf('auth/_perm/') > -1 && request.method === 'GET') { diff --git a/angular/src/app/landing/filters/filters.component.html b/angular/src/app/landing/filters/filters.component.html index 1a729fbbe..8edcb8240 100644 --- a/angular/src/app/landing/filters/filters.component.html +++ b/angular/src/app/landing/filters/filters.component.html @@ -22,11 +22,11 @@ -
+
-
@@ -39,6 +39,11 @@
+ + +
- + + +
diff --git a/angular/src/app/landing/filters/filters.component.ts b/angular/src/app/landing/filters/filters.component.ts index b6ac5bd1b..36ddb24bf 100644 --- a/angular/src/app/landing/filters/filters.component.ts +++ b/angular/src/app/landing/filters/filters.component.ts @@ -193,6 +193,107 @@ export class FiltersComponent implements OnInit { this.filterResults(); } + + /** + * Form the filter string and refresh the result page + */ + filterResults() { + let lFilterString: string = ""; + this.selectedThemes = []; + this.selectedComponents = []; + this.selectedResourceType = []; + let componentSelected: boolean = false; + let resourceTypesSelected: boolean = false; + let compType = ''; + let resourceType = ''; + + // Resource type + // if (this.selectedResourceTypeNode.length > 0) { + // lFilterString += "@type="; + + // for (let res of this.selectedResourceTypeNode) { + // if (res && typeof res.data !== 'undefined' && res.data !== 'undefined') { + // resourceTypesSelected = true; + // this.selectedResourceType.push(res.data); + // resourceType += res.data[0] + ','; + + // lFilterString += res.data[0].replace(/\s/g, "") + ","; + // } + // } + + // lFilterString = this.removeEndingComma(lFilterString); + // } + + if(this.filterStrings["@type"]) { + if(lFilterString != '') lFilterString += "&"; + lFilterString += this.filterStrings["@type"]; + lFilterString = this.removeEndingComma(lFilterString); + } + + for(let col of this.collectionOrder) { + if(this.filterStrings[col]) { + if(lFilterString != '') lFilterString += "&"; + lFilterString += this.filterStrings[col]; + lFilterString = this.removeEndingComma(lFilterString); + } + } + + // Record has + // if (this.selectedComponentsNode.length > 0) { + // if(lFilterString != '') lFilterString += "&"; + + // lFilterString += "components.@type="; + + // for (let comp of this.selectedComponentsNode) { + // if (comp != 'undefined' && typeof comp.data !== 'undefined' && comp.data !== 'undefined') { + // componentSelected = true; + // this.selectedComponents.push(comp.data); + // compType += comp.data[0] + ','; + + // lFilterString += comp.data[0].replace(/\s/g, "") + ","; + // } + // } + // } + + if(this.filterStrings["components.@type"]) { + if(lFilterString != '') lFilterString += "&"; + lFilterString += this.filterStrings["components.@type"]; + lFilterString = this.removeEndingComma(lFilterString); + } + + // lFilterString = this.removeEndingComma(lFilterString); + + // Authors and contributors + if (this.selectedAuthor.length > 0) { + if(lFilterString != '') lFilterString += "&"; + + lFilterString += "contactPoint.fn="; + + for (let author of this.selectedAuthor) { + lFilterString += author + ","; + } + } + + lFilterString = this.removeEndingComma(lFilterString); + + // Keywords + if (this.selectedKeywords.length > 0) { + if(lFilterString != '') lFilterString += "&"; + + lFilterString += "keyword="; + for (let keyword of this.selectedKeywords) { + lFilterString += this.suggestedKeywordsLkup[keyword] + ","; + } + } + + lFilterString = this.removeEndingComma(lFilterString); + if(!lFilterString) lFilterString = "NoFilter"; + + // console.log('lFilterString', lFilterString); + this.filterString.emit(lFilterString); + } + + /** * If search value changed, clear the filters and refresh the search result. * @param changes - changed detected @@ -385,7 +486,7 @@ export class FiltersComponent implements OnInit { compNoData = true; this.componentsWithCount = []; this.componentsTree = [{ - label: 'Record has -', + label: 'Record has', "expanded": true, children: this.componentsWithCount, }]; @@ -430,14 +531,14 @@ export class FiltersComponent implements OnInit { this.resourceTypeTree = [{ - label: 'Type of Resource -', + label: 'Type of Resource', "expanded": false, children: this.resourceTypesWithCount }]; if (!compNoData) { this.componentsTree = [{ - label: 'Record has -', + label: 'Record has', "expanded": false, children: this.componentsWithCount, }]; @@ -468,92 +569,6 @@ export class FiltersComponent implements OnInit { this.searching = false; } - /** - * Form the filter string and refresh the result page - */ - filterResults() { - let lFilterString: string = ""; - this.selectedThemes = []; - this.selectedComponents = []; - this.selectedResourceType = []; - let componentSelected: boolean = false; - let resourceTypesSelected: boolean = false; - let compType = ''; - let resourceType = ''; - - // Resource type - if (this.selectedResourceTypeNode.length > 0) { - lFilterString += "@type="; - - for (let res of this.selectedResourceTypeNode) { - if (res && typeof res.data !== 'undefined' && res.data !== 'undefined') { - resourceTypesSelected = true; - this.selectedResourceType.push(res.data); - resourceType += res.data + ','; - - lFilterString += res.data.replace(/\s/g, "") + ","; - } - } - - lFilterString = this.removeEndingComma(lFilterString); - } - - for(let col of this.collectionOrder) { - if(this.filterStrings[col]) { - lFilterString += this.filterStrings[col]; - lFilterString = this.removeEndingComma(lFilterString); - } - } - - // Record has - if (this.selectedComponentsNode.length > 0) { - if(lFilterString != '') lFilterString += "&"; - - lFilterString += "components.@type="; - - for (let comp of this.selectedComponentsNode) { - if (comp != 'undefined' && typeof comp.data !== 'undefined' && comp.data !== 'undefined') { - componentSelected = true; - this.selectedComponents.push(comp.data); - compType += comp.data + ','; - - lFilterString += comp.data.replace(/\s/g, "") + ","; - } - } - } - - lFilterString = this.removeEndingComma(lFilterString); - - // Authors and contributors - if (this.selectedAuthor.length > 0) { - if(lFilterString != '') lFilterString += "&"; - - lFilterString += "contactPoint.fn="; - - for (let author of this.selectedAuthor) { - lFilterString += author + ","; - } - } - - lFilterString = this.removeEndingComma(lFilterString); - - // Keywords - if (this.selectedKeywords.length > 0) { - if(lFilterString != '') lFilterString += "&"; - - lFilterString += "keyword="; - for (let keyword of this.selectedKeywords) { - lFilterString += this.suggestedKeywordsLkup[keyword] + ","; - } - } - - lFilterString = this.removeEndingComma(lFilterString); - if(!lFilterString) lFilterString = "NoFilter"; - - console.log('lFilterString', lFilterString); - this.filterString.emit(lFilterString); - } - /** * Remove the ending comma of the given string * @param inputrString @@ -976,7 +991,7 @@ export class FiltersComponent implements OnInit { allThemes[Collections.FORENSICS].push({ label: topicLabel, value: data }); allThemesArray[Collections.FORENSICS].push(topicLabel); } - }else{ + }else if(topic['scheme'].indexOf(this.taxonomyURI[Collections.DEFAULT]) >= 0){ topicLabel = topics[0]; if (allThemesArray[Collections.DEFAULT].indexOf(topicLabel) < 0) { diff --git a/angular/src/app/landing/keyword/keyword.component.css b/angular/src/app/landing/keyword/keyword.component.css index e69de29bb..36dc389b7 100644 --- a/angular/src/app/landing/keyword/keyword.component.css +++ b/angular/src/app/landing/keyword/keyword.component.css @@ -0,0 +1,4 @@ +.ind { + padding-left: 0px; +} +.ind:first-line {padding-left:0px !important;} \ No newline at end of file diff --git a/angular/src/app/landing/keyword/keyword.component.html b/angular/src/app/landing/keyword/keyword.component.html index 53e19b133..18ccd9204 100644 --- a/angular/src/app/landing/keyword/keyword.component.html +++ b/angular/src/app/landing/keyword/keyword.component.html @@ -1,37 +1,39 @@ -
Subject Keywords:
- -
-
-
+
+
+ +
- Add subject keywords:   + Add subject keywords:  
-
- - - - +
+ + + + Keywords: + {{ keyword }} - - - - * -
-
\ No newline at end of file + [ngClass]="{'icon_enabled': updated, 'icon_disabled':!updated }" + data-toggle="tooltip" title="Undo keyword"> + + + * +
+
\ No newline at end of file diff --git a/angular/src/app/landing/keyword/keyword.component.ts b/angular/src/app/landing/keyword/keyword.component.ts index 0e04aff33..ca4ada835 100644 --- a/angular/src/app/landing/keyword/keyword.component.ts +++ b/angular/src/app/landing/keyword/keyword.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter, SimpleChanges } from '@angular/core'; import { NgbModalOptions, NgbModal } from '@ng-bootstrap/ng-bootstrap'; import { DescriptionPopupComponent } from '../description/description-popup/description-popup.component'; import { NotificationService } from '../../shared/notification-service/notification.service'; @@ -7,12 +7,16 @@ import { MetadataUpdateService } from '../editcontrol/metadataupdate.service'; @Component({ selector: 'app-keyword', templateUrl: './keyword.component.html', - styleUrls: ['../landing.component.css'] + styleUrls: ['../landing.component.css', './keyword.component.css'] }) export class KeywordComponent implements OnInit { @Input() record: any[]; @Input() inBrowser: boolean; // false if running server-side fieldName: string = 'keyword'; + keywordShort: string[] = []; + keywordLong: string[] = []; + keywordBreakPoint: number = 5; + keywordDisplay: string[] = []; constructor(public mdupdsvc : MetadataUpdateService, private ngbModal: NgbModal, @@ -37,8 +41,70 @@ export class KeywordComponent implements OnInit { } ngOnInit() { + this.keywordInit(); + } + /** + * Once input record changed, refresh the topic list + * @param changes + */ + ngOnChanges(changes: SimpleChanges): void { + this.keywordInit(); + } + + /** + * Generate short and long keyword list for display + */ + keywordInit() { + if(this.record['keyword']) { + if(this.record['keyword'].length > 5) { + this.keywordShort = JSON.parse(JSON.stringify(this.record['keyword'])).slice(0, this.keywordBreakPoint); + this.keywordShort.push("Show more..."); + this.keywordLong = JSON.parse(JSON.stringify(this.record['keyword'])); + this.keywordLong.push("Show less..."); + }else { + this.keywordShort = JSON.parse(JSON.stringify(this.record['keyword'])); + this.keywordLong = JSON.parse(JSON.stringify(this.record['keyword'])); + } + }else{ + this.keywordShort = []; + this.keywordLong = []; + } + + this.keywordDisplay = this.keywordShort; + } + + /** + * Set bubble color based on content + * @param keyword + */ + bubbleColor(keyword) { + if(keyword == "Show more..." || keyword == "Show less..." ) { + return "#ffffe6"; + }else{ + return "#cceeff"; + } + } + + /** + * Display short/long list based on which button was clicked. + * @param keyword + */ + keywordClick(keyword) { + if(keyword == "Show more...") { + this.keywordDisplay = this.keywordLong; + } + + if(keyword == "Show less...") { + this.keywordDisplay = this.keywordShort; + } + } + + /** + * Open popup for editing + * @returns + */ openModal() { if (! this.mdupdsvc.isEditMode) return; diff --git a/angular/src/app/landing/resultlist/resultlist.component.html b/angular/src/app/landing/resultlist/resultlist.component.html index ff18c9ad9..b2ee0d9c7 100644 --- a/angular/src/app/landing/resultlist/resultlist.component.html +++ b/angular/src/app/landing/resultlist/resultlist.component.html @@ -11,10 +11,10 @@
-
+
+ [style]="{'text-align': 'left', 'height':'35px','vertical-align' : 'top','width': resultWidthNum > 500?'140px':'60px','margin-top':'-9px','margin-bottom':'0px'}">
diff --git a/angular/src/app/landing/resultlist/resultlist.component.ts b/angular/src/app/landing/resultlist/resultlist.component.ts index 204ee3eb3..447f330c3 100644 --- a/angular/src/app/landing/resultlist/resultlist.component.ts +++ b/angular/src/app/landing/resultlist/resultlist.component.ts @@ -109,7 +109,7 @@ export class ResultlistComponent implements OnInit { } onPageChange(value: any){ - console.log("this.currentPage", value.target.value); + // console.log("this.currentPage", value.target.value); } setColor() { @@ -179,7 +179,7 @@ export class ResultlistComponent implements OnInit { this.pages = []; for(let i=1; i <= this.totalPages; i++) { - this.pages.push({name:'Page '+i+'/'+this.totalPages, value:i}) + this.pages.push({name:'Page '+i+' of '+this.totalPages, value:i}) } } @@ -357,12 +357,12 @@ export class ResultlistComponent implements OnInit { /** * Reset active flags of all search result items to true (default) */ - resetResult() { + resetResult(active: boolean = false) { if(this.searchResults) { this.searchResults.forEach((object) => { object.expandIcon = "faa faa-caret-right"; object.isExpanded = false; - object.active = true; + object.active = active; }) } } @@ -376,7 +376,7 @@ export class ResultlistComponent implements OnInit { let filters: string[]; // Reset the search result - this.resetResult(); + this.resetResult(this.filterString=="NoFilter"); // Handle search text box first this.filterResultByPhase(this.searchPhases); @@ -388,8 +388,8 @@ export class ResultlistComponent implements OnInit { switch(filter.split("=")[0]){ case "@type": this.searchResults.forEach((object) => { - if(object.active == true){ - object.active = false; + if(!object.active){ + // object.active = false; object["@type"].forEach((oType) => { let types = filter.split("=")[1].split(","); @@ -406,8 +406,8 @@ export class ResultlistComponent implements OnInit { let topics = filter.split("=")[1].split(","); for(let resultItem of this.searchResults) { - if(resultItem.active == true){ - resultItem.active = false; + if(!resultItem.active){ + // resultItem.active = false; for(let oTopic of resultItem["topic"]) { for(let topic of topics) { @@ -432,8 +432,8 @@ export class ResultlistComponent implements OnInit { case "components.@type": this.searchResults.forEach((object) => { if(object["components"] != undefined) { - if(object.active == true){ - object.active = false; + if(!object.active){ + // object.active = false; object["components"].forEach((component) => { component["@type"].forEach((cType) => { @@ -453,8 +453,8 @@ export class ResultlistComponent implements OnInit { break; case "contactPoint.fn": this.searchResults.forEach((object) => { - if(object.active == true){ - object.active = false; + if(!object.active){ + // object.active = false; if(object["contactPoint"]["fn"].includes(filter.split("=")[1])) object.active = true; @@ -466,8 +466,8 @@ export class ResultlistComponent implements OnInit { // Loop through each keyword in each search result. Display those that match // the keywords from keyword filter this.searchResults.forEach((object) => { - if(object.active == true){ - object.active = false; + if(!object.active){ + // object.active = false; object["keyword"].forEach((keyword) => { //Loop through each search keyword from keyword filter @@ -500,7 +500,7 @@ export class ResultlistComponent implements OnInit { * @param event sort item */ onSortByChange(event: any) { - console.log("event", event.value); + // console.log("event", event.value); let key = event.value.value; if(key == "modified"){ diff --git a/angular/src/app/landing/taxonomy/taxonomy.component.css b/angular/src/app/landing/taxonomy/taxonomy.component.css index 3d5adaca8..83acb7142 100644 --- a/angular/src/app/landing/taxonomy/taxonomy.component.css +++ b/angular/src/app/landing/taxonomy/taxonomy.component.css @@ -4,6 +4,7 @@ .filter-checkbox { width: 100%; + margin-left: -10px; /* min-width: 410px; */ overflow-x: hidden; } @@ -23,4 +24,8 @@ border-radius: 100%; padding: 2px 6px 2px 2px; font-size: small; -} \ No newline at end of file +} + +input[type=checkbox] {width:20px; height:20px;} + +.hasborder { border:1px solid #F00; float: right;} \ No newline at end of file diff --git a/angular/src/app/landing/taxonomy/taxonomy.component.html b/angular/src/app/landing/taxonomy/taxonomy.component.html index 95993c1c7..672039bd9 100644 --- a/angular/src/app/landing/taxonomy/taxonomy.component.html +++ b/angular/src/app/landing/taxonomy/taxonomy.component.html @@ -1,11 +1,18 @@
+
+ + + + + {{collectionThemesTree[0].label}} + +
+
- + (onNodeSelect)="filterResults()">
{{node.label.split("---")[0]}}  diff --git a/angular/src/app/landing/taxonomy/taxonomy.component.ts b/angular/src/app/landing/taxonomy/taxonomy.component.ts index f73a77a39..74291b9c7 100644 --- a/angular/src/app/landing/taxonomy/taxonomy.component.ts +++ b/angular/src/app/landing/taxonomy/taxonomy.component.ts @@ -11,7 +11,7 @@ import { Themes, ThemesPrefs, Collections, Collection, ColorScheme, CollectionTh providers: [TaxonomyListService, SearchfieldsListService], animations: [ trigger('expand', [ - state('closed', style({height: '50px'})), + state('closed', style({height: '0px'})), state('collapsed', style({height: '183px'})), state('expanded', style({height: '*'})), transition('expanded <=> collapsed', animate('625ms')), @@ -31,9 +31,13 @@ import { Themes, ThemesPrefs, Collections, Collection, ColorScheme, CollectionTh ] }) export class TaxonomyComponent implements OnInit { - collectionNodeExpanded: boolean = true; + // collectionNodeExpanded: boolean = true; collectionShowMoreLink: boolean = false; collectionSelectedThemesNode: any[] = []; + tempTotal: number = 0; + totalNodes: number = 0; + totalSelectedNodes: number = 0; + allChecked: boolean = true; researchTopicStyle = {'width':'100%','padding-top': '.5em', 'padding-bottom': '.5em', 'background-color': 'var(--science-theme-background-light)', 'overflow':'hidden','border-width':'0'}; @@ -41,47 +45,133 @@ export class TaxonomyComponent implements OnInit { @Input() backgroundColor: string = "white"; @Input() defaultColor: string = "black"; @Input() collection: string = Collections.DEFAULT; + @Input() isCollection: boolean = false; + @Input() collectionNodeExpanded: boolean = false; @Output() filterString: EventEmitter = new EventEmitter(); constructor() { + } ngOnInit(): void { - console.log("collectionThemesTree", this.collectionThemesTree); + this.getTotlalNode(this.collectionThemesTree); + this.totalNodes = this.tempTotal; + console.log("totalNodes", this.totalNodes); + console.log("collection", this.collection); + } + + ngAfterViewInit(): void { + //Called after ngAfterContentInit when the component's view has been initialized. Applies to components only. + //Add 'implements AfterViewInit' to the class. + this.checkAll(); } ngOnChanges(changes: SimpleChanges): void { //Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here. //Add '${implements OnChanges}' to the class. - console.log("changes", changes); + // console.log("changes", changes); + } + + get isAllChecked() { + let totalChecked = this.collectionSelectedThemesNode.length + 1; + + return ( totalChecked == this.totalNodes); } + + updateCheckbox() { + if(this.allChecked) { + this.checkAll(); + }else{ + this.uncheckAll(); + } + } + + checkAll() { + this.collectionSelectedThemesNode = []; + if(this.collectionThemesTree && this.collectionThemesTree.length > 0) + this.preselectNodes(this.collectionThemesTree[0].children); + + this.filterResults(); + } + + uncheckAll() { + this.collectionSelectedThemesNode = []; + this.filterResults(); + } + + preselectNodes(allNodes: TreeNode[]): void { + for (let node of allNodes) { + // let temp = JSON.parse(JSON.stringify(node)); + // temp.children = []; + this.collectionSelectedThemesNode.push(node); + if(node.children.length > 0) { + this.preselectNodes(node.children); + } + } + } + + totalNode(allNodes: TreeNode) { + let that = this; + if(!allNodes) return 0; + + if(allNodes.children.length > 0){ + that.tempTotal += 1; + for(let child of allNodes.children){ + this.totalNode(child); + } + }else{ + that.tempTotal += 1; + } + } + + getTotlalNode(nodes: TreeNode[]) { + this.tempTotal = 0; + + if(nodes && nodes.length > 0){ + for(let node of nodes) { + this.totalNode(node); + } + } + + return this.tempTotal; + } + /** * Form the filter string and refresh the result page */ filterResults() { + this.allChecked = this.isAllChecked; let lFilterString: string = ""; let themeSelected: boolean = false; - let themeType = ''; + // let themeType = ''; // Collection Research topics - if (this.collectionSelectedThemesNode.length > 0) { - for (let theme of this.collectionSelectedThemesNode) { - if (theme != 'undefined' && typeof theme.data !== 'undefined' && theme.data[0] !== 'undefined') { - themeSelected = true; - for(let i = 0; i < theme.data.length; i++ ){ - // this.collectionSelectedThemesNode.push(theme.data[i]); - - themeType += theme.data[i] + ','; - - lFilterString += this.collection + "----" + theme.data[i].trim() + ","; + + if (this.collectionSelectedThemesNode.length > 0) { + for (let theme of this.collectionSelectedThemesNode) { + if (theme != 'undefined' && typeof theme.data !== 'undefined' && theme.data[0] !== 'undefined') { + themeSelected = true; + for(let i = 0; i < theme.data.length; i++ ){ + if(this.isCollection) { + // themeType += theme.data[i] + ','; + lFilterString += this.collection + "----" + theme.data[i].trim() + ","; + }else{ + lFilterString += theme.data[i].trim().replace(/\s/g, "") + ","; + } + } } } } - } - lFilterString = this.removeEndingComma(lFilterString); - if(!lFilterString) lFilterString = ""; - else lFilterString = "topic.tag=" + lFilterString; + lFilterString = this.removeEndingComma(lFilterString); + if(!lFilterString) lFilterString = ""; + else { + if(this.isCollection) { + lFilterString = "topic.tag=" + lFilterString; + }else{ + lFilterString = this.collection + "=" + lFilterString; + } + } this.filterString.emit(lFilterString); } @@ -99,6 +189,14 @@ export class TaxonomyComponent implements OnInit { return inputrString; } + expandIcon() { + if(!this.collectionNodeExpanded){ + return "pi pi-chevron-right"; + }else{ + return "pi pi-chevron-down" + } + } + /** * Return tooltip text for given filter tree node. * @param filternode tree node of a filter @@ -106,7 +204,7 @@ export class TaxonomyComponent implements OnInit { */ filterTooltip(filternode: any) { if(filternode && filternode.label) - return filternode.label.split('-')[0] + "-" + filternode.label.split('-')[1]; + return filternode.label.split('-')[0] + "-" + filternode.count; else return ""; } diff --git a/angular/src/app/landing/topic/topic-popup/search-topics.component.ts b/angular/src/app/landing/topic/topic-popup/search-topics.component.ts index 6c3292421..491c00567 100644 --- a/angular/src/app/landing/topic/topic-popup/search-topics.component.ts +++ b/angular/src/app/landing/topic/topic-popup/search-topics.component.ts @@ -46,7 +46,7 @@ export class SearchTopicsComponent implements OnInit { this.inputValue[this.field] = []; }else{ this.addMode = false; - this.inputValue = this.inputTopics; + this.inputValue = JSON.parse(JSON.stringify(this.inputTopics)); } this.taxonomyListService.get(0).subscribe((result) => { diff --git a/angular/src/app/landing/topic/topic.component.html b/angular/src/app/landing/topic/topic.component.html index cf0e411e9..46c11e2da 100644 --- a/angular/src/app/landing/topic/topic.component.html +++ b/angular/src/app/landing/topic/topic.component.html @@ -1,31 +1,34 @@ -
+

Research Areas:

-
+
-
-
- {{ allCollections[col].tag }}: -
- -
- Add {{ allCollections[col].tag }}: -
-
-
- - - - - - {{ topic.tag }} - +
+
+ + {{ allCollections[col].tag }}: + + + + Add {{ allCollections[col].tag }}: + + + + + + + + + {{ topic.tag }} + +
+