-
`
})
-export class StaticAutocompleteComponent {
+export class StaticAutoCompleteComponent {
@Input() placeHolderMessage = "Search for entries";
@Input() title = "Autocomplete";
- @Output() keywordChange = new EventEmitter(); // when changed a method for filtering will be called
- @Output() addNew = new EventEmitter(); // when changed a method for filtering will be called
+ @Output() addItem = new EventEmitter(); // when selected list changes update parent component
+ @Output() selectedValueChanged = new EventEmitter(); // when changed a method for filtering will be called
+ @Output() listUpdated = new EventEmitter(); // when changed a method for filtering will be called
@Input() public list = []; // the entries resulted after filtering function
@Input() public filtered = []; // the entries resulted after filtering function
@Input() public selected = []; // the entries selected from user
@Input() public keywordlimit = 3; // the minimum length of keyword
@Input() public showSelected = true; // the minimum length of keyword
@Input() public multipleSelections:boolean = true;
+ @Input() public allowDuplicates:boolean = false;
+ @Input() public selectedValue:string = '';
+ @Input() public vocabularyId:string ;
+ @Input() public fieldName:string ;
+ @Input() public entityName:string ;
+
@Input() public keyword = '';
@Input() public type = 'search' //search, result, context, project
private warningMessage = "";
private infoMessage = "";
-
+ private showLoading:boolean = false;
private tries = 0;
+ private showInput = true;
+ private sub;
+ private done = false;
+ constructor ( private _vocabulariesService: ISVocabulariesService,private _refineService: RefineFieldResultsService, private myElement: ElementRef) {
+ }
+ ngOnDestroy(){
+ if(this.sub && this.sub != undefined){
+ this.sub.unsubscribe();
+ }
+ }
+ ngOnInit () {
+ if(this.list == undefined || this.list.length == 0){
+ this.showLoading = true;
+
+ if(this.vocabularyId){
+ this.list = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName);
+ this.afterListFetchedActions();
+ }else if(this.fieldName && this.entityName){
+ this.list = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName);
+ this.sub = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName).subscribe(
+ data => {
+ this.list = data;
+ this.afterListFetchedActions();
+
+ },
+ err => {
+ console.error(err);
+ this.warningMessage = "An Error occured..."
+ }
+ );
+ }
+ }else{
+ this.afterListFetchedActions();
+ }
+
+ }
+ public updateList(list){ // used in claim context autocomplete
+ this.list = list;
+ this.afterListFetchedActions()
+ }
+ private afterListFetchedActions(){
+ this.showLoading = false;
+ this.getSelectedNameFromGivenId();
+ this.listUpdated.emit({
+ value: this.list
+ });
+ if(this.list == null || this.list.length == 0 ){
+ this.warningMessage = "There are no results";
+ return;
+ }
+ this.done = true;
+ if(this.keyword != ""){
+ this.filter();
+ }
- constructor () {
- console.info("Type"+this.type);
}
filter() {
- this.infoMessage = "";
- this.filtered = [];
- if(this.keyword == ""){
- this.tries = 0;
- this.warningMessage = "";
- } else if(this.keyword && this.keyword.length < this.keywordlimit){
- this.tries++;
- if(this.tries == this.keywordlimit -1 ){
- this.warningMessage = "Type at least " + this.keywordlimit + " characters";
+ if(this.done){
+ this.infoMessage = "";
+ this.filtered = [];
+ if(this.keyword == ""){
+ var cut = 5;
+ if(this.list.length < 5){
+ cut = this.list.length;
+ }
+ this.filtered =this.list.slice(0, cut);
this.tries = 0;
- }
- }else{
- this.tries = 0;
- this.warningMessage = "";
- this.keywordChange.emit({
- value: this.keyword
- });
+ this.warningMessage = "";
+ // } else if(this.keyword && this.keyword.length < this.keywordlimit){
+ // this.tries++;
+ // if(this.tries == this.keywordlimit -1 ){
+ // this.warningMessage = "Type at least " + this.keywordlimit + " characters";
+ // this.tries = 0;
+ // }
+ }else{
+ this.tries = 0;
+ this.warningMessage = "";
+ this.filtered = this.list.filter(function(el){
+ return el.label.toLowerCase().indexOf(this.keyword.toLowerCase()) > -1;
+ }.bind(this));
+ }
}
}
remove(item:any){
@@ -81,26 +152,52 @@ export class StaticAutocompleteComponent {
if (index > -1) {
this.selected.splice(index, 1);
}
+ if(!this.multipleSelections && this.selected.length == 0 ){
+ this.showInput = true;
+ this.selectedValue = "";
+ this.selectedValueChanged.emit({
+ value: this.selectedValue
+ });
+
+ }
}
select(item:any){
+ // console.log("select"+this.selected.length + item.id + " "+ item.label);
+
+ if(this.multipleSelections){
+ var index:number =this.checkIfExists(item,this.selected);
+ if (index > -1 && !this.allowDuplicates) {
+ this.keyword = "";
+ this.filtered.splice(0, this.filtered.length);
+ return;
+ }
+ else{
+ this.selected.push(item);
+ this.keyword = "";
+ this.filtered.splice(0, this.filtered.length);
+ this.addItem.emit({
+ value: item
+ });
+ }
+ }else{
+ this.selected.splice(0, this.selected.length);
+ this.selected.push(item);
+ this.filtered.splice(0, this.filtered.length);
+ this.keyword = "";
+ this.showInput = false;
+ this.selectedValue = item.id;
+ this.selectedValueChanged.emit({
+ value: this.selectedValue
+ });
+
+ }
+ console.log("selected"+this.selected.length );
- var index:number =this.checkIfExists(item,this.selected);
- if (index > -1) {
- this.keyword = "";
- this.filtered.splice(0, this.filtered.length);
- return;
- }
- else{
- this.selected.push(item);
- this.keyword = "";
- this.filtered.splice(0, this.filtered.length);
- }
}
private checkIfExists(item:any,list):number{
if(item.concept && item.concept.id ){
- console.log("context");
for (var _i = 0; _i < list.length; _i++) {
let itemInList = list[_i];
@@ -130,20 +227,31 @@ export class StaticAutocompleteComponent {
}
}
+ private getSelectedNameFromGivenId(){
+ if(this.list == null ){
+ return;
+ }
+ for( var i = 0; i < this.list.length; i++){
+ if(this.list[i].id == this.selectedValue){
+ this.selectedValue = this.list[i].label;
+ this.selected.push(this.list[i]);
+ this.showInput = false;
+ }
+ }
+ }
-
- // handleClick(event){
- // var clickedComponent = event.target;
- // var inside = false;
- // do {
- // if (clickedComponent === this.elementRef.nativeElement) {
- // inside = true;
- // }
- // clickedComponent = clickedComponent.parentNode;
- // } while (clickedComponent);
- // if(!inside){
- // this.filteredList = [];
- // }
- // }
+ handleClick(event){
+ var clickedComponent = event.target;
+ var inside = false;
+ do {
+ if (clickedComponent === this.myElement.nativeElement) {
+ inside = true;
+ }
+ clickedComponent = clickedComponent.parentNode;
+ } while (clickedComponent);
+ if(!inside){
+ this.filtered.splice(0, this.filtered.length);;
+ }
+ }
}
diff --git a/portal-2/src/app/utils/staticAutoComplete2.component.ts b/portal-2/src/app/utils/staticAutoComplete2.component.ts
deleted file mode 100644
index e60b3ce7..00000000
--- a/portal-2/src/app/utils/staticAutoComplete2.component.ts
+++ /dev/null
@@ -1,258 +0,0 @@
-import {Component, ElementRef, Input, Output, EventEmitter} from '@angular/core';
-import {Value} from '../searchPages/searchUtils/searchHelperClasses.class';
-import {ISVocabulariesService} from '../services/ISVocabularies.service';
-import {RefineFieldResultsService} from '../services/refineFieldResults.service';
-//Usage example
-//
-
-@Component({
- selector: 'static-autocomplete2',
- styleUrls: ['autoComplete.component.css'],
- host: {
- '(document:click)': 'handleClick($event)',
- },
- template: `
-
-
-
- {{showItem(item)}}
-
-
-
-
-
-
-
{{warningMessage}}
-
No results found
-
-
-
- `
-})
-export class StaticAutocomplete2Component {
- @Input() placeHolderMessage = "Search for entries";
- @Input() title = "Autocomplete";
- @Output() addItem = new EventEmitter(); // when selected list changes update parent component
- @Output() selectedValueChanged = new EventEmitter(); // when changed a method for filtering will be called
- @Output() listUpdated = new EventEmitter(); // when changed a method for filtering will be called
- @Input() public list = []; // the entries resulted after filtering function
- @Input() public filtered = []; // the entries resulted after filtering function
- @Input() public selected = []; // the entries selected from user
- @Input() public keywordlimit = 3; // the minimum length of keyword
- @Input() public showSelected = true; // the minimum length of keyword
- @Input() public multipleSelections:boolean = true;
- @Input() public allowDuplicates:boolean = false;
- @Input() public selectedValue:string = '';
- @Input() public vocabularyId:string ;
- @Input() public fieldName:string ;
- @Input() public entityName:string ;
-
- @Input() public keyword = '';
- @Input() public type = 'search' //search, result, context, project
- private warningMessage = "";
- private infoMessage = "";
-
- private tries = 0;
- private showInput = true;
- private sub;
- private done = false;
- constructor ( private _vocabulariesService: ISVocabulariesService,private _refineService: RefineFieldResultsService, private myElement: ElementRef) {
- }
- ngOnDestroy(){
- if(this.sub && this.sub != undefined){
- this.sub.unsubscribe();
- }
- }
- ngOnInit () {
- console.log("auto complete init : list length"+this.list.length);
-
- if(this.list == undefined || this.list.length == 0){
-
- if(this.vocabularyId){
- this.list = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName);
- this.afterListFetchedActions();
- }else if(this.fieldName && this.entityName){
- this.list = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName);
- this.sub = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName).subscribe(
- data => {
- this.list = data;
- this.afterListFetchedActions();
-
- },
- err => {
- console.error(err);
- this.warningMessage = "An Error occured..."
- }
- );
- }
- }else{
- console.log("auto complete init : list length"+this.list.length);
-
- this.afterListFetchedActions();
- }
-
- }
- public updateList(list){ // used in claim context autocomplete
- this.list = list;
- this.afterListFetchedActions()
- }
- private afterListFetchedActions(){
- this.getSelectedNameFromGivenId();
- this.listUpdated.emit({
- value: this.list
- });
- if(this.list == null || this.list.length == 0 ){
- this.warningMessage = "There are no results";
- return;
- }
- this.done = true;
- if(this.keyword != ""){
- this.filter();
- }
-
- }
- filter() {
- if(this.done){
- this.infoMessage = "";
- this.filtered = [];
- if(this.keyword == ""){
- var cut = 5;
- if(this.list.length < 5){
- cut = this.list.length;
- }
- this.filtered =this.list.slice(0, cut);
- this.tries = 0;
- this.warningMessage = "";
- // } else if(this.keyword && this.keyword.length < this.keywordlimit){
- // this.tries++;
- // if(this.tries == this.keywordlimit -1 ){
- // this.warningMessage = "Type at least " + this.keywordlimit + " characters";
- // this.tries = 0;
- // }
- }else{
- this.tries = 0;
- this.warningMessage = "";
- this.filtered = this.list.filter(function(el){
- return el.label.toLowerCase().indexOf(this.keyword.toLowerCase()) > -1;
- }.bind(this));
-
- }
- }
- }
- remove(item:any){
- var index:number =this.checkIfExists(item,this.selected);
- if (index > -1) {
- this.selected.splice(index, 1);
- }
- if(!this.multipleSelections && this.selected.length == 0 ){
- this.showInput = true;
- this.selectedValue = "";
- this.selectedValueChanged.emit({
- value: this.selectedValue
- });
-
-
- }
- }
- select(item:any){
- // console.log("select"+this.selected.length + item.id + " "+ item.label);
-
- if(this.multipleSelections){
- var index:number =this.checkIfExists(item,this.selected);
- if (index > -1 && !this.allowDuplicates) {
- this.keyword = "";
- this.filtered.splice(0, this.filtered.length);
- return;
- }
- else{
- this.selected.push(item);
- this.keyword = "";
- this.filtered.splice(0, this.filtered.length);
- this.addItem.emit({
- value: item
- });
- }
- }else{
- this.selected.splice(0, this.selected.length);
- this.selected.push(item);
- this.filtered.splice(0, this.filtered.length);
- this.keyword = "";
- this.showInput = false;
- this.selectedValue = item.id;
- this.selectedValueChanged.emit({
- value: this.selectedValue
- });
-
- }
- console.log("selected"+this.selected.length );
-
- }
- private checkIfExists(item:any,list):number{
-
- if(item.concept && item.concept.id ){
-
- for (var _i = 0; _i < list.length; _i++) {
- let itemInList = list[_i];
- if(item.concept.id == itemInList.concept.id){
- return _i;
- }
- }
- }else if(item.id){
- for (var _i = 0; _i < list.length; _i++) {
- let itemInList = list[_i];
- if(item.id == itemInList.id){
- return _i;
- }
- }
- }
- return -1;
-
- }
- showItem(item:any):string{
-
- if (item.name){ //search
- return item.name;
- }else if( item.concept && item.concept.label){ //context
- return item.concept.label;
- }else if (item.label){ //simple
- return item.label;
- }
-
- }
- private getSelectedNameFromGivenId(){
- if(this.list == null ){
- return;
- }
- for( var i = 0; i < this.list.length; i++){
- if(this.list[i].id == this.selectedValue){
- this.selectedValue = this.list[i].label;
- this.selected.push(this.list[i]);
- this.showInput = false;
- }
- }
- }
-
- handleClick(event){
- var clickedComponent = event.target;
- var inside = false;
- do {
- if (clickedComponent === this.myElement.nativeElement) {
- inside = true;
- }
- clickedComponent = clickedComponent.parentNode;
- } while (clickedComponent);
- if(!inside){
- this.filtered.splice(0, this.filtered.length);;
- }
- }
-
-}
diff --git a/portal-2/src/app/utils/utils.module.ts b/portal-2/src/app/utils/utils.module.ts
index fc0e65ce..41fcbbf3 100644
--- a/portal-2/src/app/utils/utils.module.ts
+++ b/portal-2/src/app/utils/utils.module.ts
@@ -8,10 +8,8 @@ import {pagingFormatterNoLoad} from './pagingFormatterNoLoad.component';
import {ProjectTitleFormatter} from './projectTitleFormatter.component';
import {PublicationTitleFormatter} from './publicationTitleFormatter.component';
import {PagingFormatter} from './pagingFormatter.component';
-import {StaticAutocompleteComponent} from './staticAutoComplete.component';
-import {StaticAutocomplete2Component} from './staticAutoComplete2.component';
+import {StaticAutoCompleteComponent} from './staticAutoComplete.component';
import {EntitiesAutocompleteComponent} from './entitiesAutoComplete.component';
-import {DynamicAutocompleteComponent} from './dynamicAutoComplete.component';
import {ShowDataProvidersComponent} from './showDataProviders.component';
import {ExportCSVComponent} from './exportCSV.component';
import {IFrameComponent} from './iframe.component';
@@ -28,10 +26,8 @@ import {ModalLoading} from './modal/loading.component';
ProjectTitleFormatter,
PublicationTitleFormatter,
PagingFormatter,
- StaticAutocompleteComponent,
- StaticAutocomplete2Component,
- DynamicAutocompleteComponent,
- EntitiesAutocompleteComponent,
+ StaticAutoCompleteComponent,
+ EntitiesAutocompleteComponent,
ShowDataProvidersComponent,
ExportCSVComponent,
IFrameComponent,
@@ -43,9 +39,7 @@ import {ModalLoading} from './modal/loading.component';
PublicationTitleFormatter,
PagingFormatter,
AlertModal, ModalLoading,
- StaticAutocompleteComponent,
- StaticAutocomplete2Component,
- DynamicAutocompleteComponent,
+ StaticAutoCompleteComponent,
EntitiesAutocompleteComponent,
ShowDataProvidersComponent,
ExportCSVComponent,