import {Component, Input,Output, EventEmitter, ViewChild} from '@angular/core'; import {Observable} from 'rxjs/Observable'; import { Router} from '@angular/router'; import {ContextsService} from './service/contexts.service'; import {ClaimContext} from './claimEntities.class'; import { StaticAutoCompleteComponent } from '../../utils/staticAutoComplete/staticAutoComplete.component'; declare var UIkit:any; import {Session} from '../../login/utils/helper.class'; import {ErrorCodes} from '../../login/utils/guardHelper.class'; import{EnvProperties} from '../../utils/properties/env-properties'; @Component({ // moduleId: module.id, selector: 'claim-contexts-search-form', template: `
Select a community
and then
search for community concepts
or
browse through community categories:
Please select community first...
  • {{selectedCommunityLabel}} Added
    • {{category.label}} Added
      • {{concept1.label}} Added
        • {{concept2.label}} Added
          • {{concept3.label}} Added
` }) export class ClaimContextSearchFormComponent { // @Input() public inline:boolean = false ; // for claimed started from landing pages public showComponent:boolean = true ; // for claimed started from landing pages @Input() public selectedList; //The following need to be kept in case we have to save the current state @Input() public projects; @Input() public results; @Input() public inlineEntity; @Input() public properties:EnvProperties; @Input() communityId:string= null; @Input() public inlineClaim:boolean=false; public selectedCommunityId:string = "0"; public selectedCategoryId:string ="0"; // @Output() contextSelected = new EventEmitter(); @ViewChild (StaticAutoCompleteComponent) autocomplete : StaticAutoCompleteComponent ; public query = ''; public filteredList = []; public communities:any; public selectedCommunityLabel:string = "Community:"; public categories:any; public selectedCategoryLabel:string ="Category:"; public concepts = []; public conceptsClass = []; public conceptsClassDisplay = []; public conceptsCategoryLoading = []; public warningMessage = ""; public infoMessage = ""; public loading:boolean = false; public error:boolean = false; public simpleView:boolean = true; @Input() localStoragePrefix:string = ""; ngOnInit() { this.getCommunities(); } constructor(private _contextService: ContextsService,private router: Router) { } select($event){ var item = $event.value; this.addNewContext( this.selectedCommunityLabel, this.selectedCategoryLabel, item); } isSelected(id):boolean{ for (var _i = 0; _i < this.selectedList.length; _i++) { let item = this.selectedList[_i]; if(item.concept.id == id){ return true; // this.warningMessage = "Concept already in selected list"; } } return false; } addNewContext(community,category,concept){ var context: ClaimContext= { community: community, category: category, concept: concept }; var found:boolean = false; this.warningMessage = ""; if (!this.isSelected(context.concept.id)) { this.selectedList.push(context); UIkit.notification({ message : 'A new concept is selected.', status : 'primary', timeout : 1000, pos : 'top-center' }); localStorage.setItem(this.localStoragePrefix + "contexts", JSON.stringify(this.selectedList)); }else{ UIkit.notification({ message : 'The concept is already on your list.', status : 'warning', timeout : 1000, pos : 'top-center' }); } } getCommunities () { if(!Session.isLoggedIn()){ this.saveStateAndRedirectLogin(); }else{ this.loading = true; this._contextService.getCommunities(this.properties.contextsAPI).subscribe( data => { this.communities = data; if(this.communities.length > 0){ this.communities.sort((n1,n2)=> n1.label > n2.label); } this.loading = false; if(this.communityId != null){ //preselect community this.selectedCommunityId = this.communityId; this.communityChanged() } }, err => { console.log(err); this.loading = false; this.error = true; } ); } } getCategories () { this.loading = true; this.categories=[]; if(this.selectedCommunityId != '0'){ if(!Session.isLoggedIn()){ this.saveStateAndRedirectLogin(); }else{ this._contextService.getCategories(this.selectedCommunityId,this.properties.contextsAPI).subscribe( data => { this.categories =data; this.concepts = []; this.addCommunityInConcepts(); this.filteredList = []; if (this.query !== ""){ var event = {value: ""}; event.value = this.query; } this.loading = false; }, err => { console.log(err); this.loading = false; } ); } } } getConcepts () { this.loading = true; if(this.selectedCategoryId != '0'){ if(!Session.isLoggedIn()){ this.saveStateAndRedirectLogin(); }else{ this.concepts = []; this._contextService.getConcepts(this.selectedCategoryId, "",true, this.properties.contextsAPI).subscribe( data => { this.concepts =data; console.log(data); for(var i =0 ; i { console.log(err); this.loading = false; } ); } }else{ this.concepts=[]; this.loading = false; } } getSubConcepts (conceptId) { this.loading = true; if(this.selectedCategoryId != '0'){ if(!Session.isLoggedIn()){ this.saveStateAndRedirectLogin(); }else{ this._contextService.getSubConcepts(conceptId, "",true, this.properties.contextsAPI).subscribe( data => { console.log(data); for(var i =0 ; i { console.log(err); this.loading = false; } ); } }else{ this.concepts=[]; this.loading = false; } } displaySubcategory(id) { if(this.conceptsClassDisplay[id] != null){ this.conceptsClassDisplay[id] = !this.conceptsClassDisplay[id]; }else{ this.conceptsClassDisplay[id] = true; } } browseConcepts (categoryId) { if(!Session.isLoggedIn()){ this.saveStateAndRedirectLogin(); }else{ if(this.conceptsClass[categoryId] != null){ this.conceptsClassDisplay[categoryId] = !this.conceptsClassDisplay[categoryId]; return; }else{ this.conceptsClassDisplay[categoryId] = true; } this.conceptsClass[categoryId] = []; this.conceptsCategoryLoading[categoryId] = true; this._contextService.getConcepts(categoryId, "",false, this.properties.contextsAPI).subscribe( data => { var concepts = data; this.conceptsClass[categoryId] = []; for(var i =0 ; i { console.log(err); this.conceptsCategoryLoading[categoryId] = false; } ); } } browseSubConcepts (categoryId, conceptId) { this.conceptsCategoryLoading[categoryId] = true; this._contextService.getSubConcepts(conceptId, "",false, this.properties.contextsAPI).subscribe( data => { var concepts = data[0]; this.conceptsClass[categoryId].push(concepts) console.log("Data"+concepts); console.log(this.conceptsClass[categoryId]); this.conceptsCategoryLoading[categoryId] = false; }, err => { console.log(err); this.conceptsCategoryLoading[categoryId] = false; } ); } communityChanged(){ console.log(this.selectedCommunityId +" "); this.warningMessage = ""; this.infoMessage = ""; for(var i = 0; i< this.communities.length; i++){ if(this.communities[i].id==this.selectedCommunityId){ this.selectedCommunityLabel = this.communities[i].label; break; } } this.selectedCategoryId = "0"; this.selectedCategoryLabel="Select Category:"; if(this.selectedCommunityId != "0"){ this.getCategories(); } } categoryChanged(){ this.warningMessage = ""; this.infoMessage = ""; for(var i = 0; i< this.categories.length; i++){ if(this.categories[i].id==this.selectedCategoryId){ this.selectedCategoryLabel = this.categories[i].label; break; } } this.getConcepts(); } addCommunityInConcepts(){ this.concepts.push({"id":this.selectedCommunityId, "label":this.selectedCommunityLabel}); if(this.autocomplete){ this.autocomplete.updateList(this.concepts); } } saveStateAndRedirectLogin(){ if(this.projects != null){ localStorage.setItem(this.localStoragePrefix + "projects", JSON.stringify(this.projects)); } localStorage.setItem(this.localStoragePrefix + "contexts", JSON.stringify(this.selectedList)); if(this.results != null){ localStorage.setItem(this.localStoragePrefix + "results", JSON.stringify(this.results)); } if(this.inlineEntity != null){ localStorage.setItem(this.localStoragePrefix + "inlineEntity", JSON.stringify(this.inlineEntity)); } this.router.navigate(['/user-info'], { queryParams: { "errorCode": ErrorCodes.NOT_VALID, "redirectUrl": this.router.url } }); } }