Linking: update the communities service and component to read from new Context API

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@52272 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
argiro.kokogiannaki 2018-05-29 14:58:51 +00:00
parent c9eef20d8e
commit 25d1cd429d
3 changed files with 144 additions and 35 deletions

View File

@ -71,23 +71,23 @@ import{EnvProperties} from '../../utils/properties/env-properties';
<ul *ngIf="conceptsClass[category.id] && conceptsClassDisplay[category.id]" class="uk-list uk-animation-fade" id="ul_{{category.id}}" > <ul *ngIf="conceptsClass[category.id] && conceptsClassDisplay[category.id]" class="uk-list uk-animation-fade" id="ul_{{category.id}}" >
<li *ngFor="let concept1 of conceptsClass[category.id]" > <li *ngFor="let concept1 of conceptsClass[category.id]" >
<span (click)="displaySubcategory(concept1.id)" > <span (click)="displaySubcategory(concept1.id)" >
<span *ngIf="!conceptsClassDisplay[concept1.id] && concept1.concept" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span> <span *ngIf="!conceptsClassDisplay[concept1.id] && concept1.concepts" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span>
<span *ngIf="conceptsClassDisplay[concept1.id] && concept1.concept" class="uk-icon"> <span *ngIf="conceptsClassDisplay[concept1.id] && concept1.concepts" class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span> <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span>
{{concept1.label}} {{concept1.label}}
</span> </span>
<a *ngIf="!isSelected(concept1.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept1)" class="uk-button-default uk-align-right" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a> <a *ngIf="!isSelected(concept1.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept1)" class="uk-button-default uk-align-right" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
<ul *ngIf="concept1.concept && conceptsClassDisplay[concept1.id] " class="uk-animation-fade" > <ul *ngIf="concept1.concepts && conceptsClassDisplay[concept1.id] " class="uk-animation-fade" >
<li *ngFor="let concept2 of concept1.concept"><span (click)="displaySubcategory(concept2.id)" > <li *ngFor="let concept2 of concept1.concepts"><span (click)="displaySubcategory(concept2.id)" >
<span *ngIf="!conceptsClassDisplay[concept2.id] && concept2.concept" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span> <span *ngIf="!conceptsClassDisplay[concept2.id] && concept2.concepts" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span>
<span *ngIf="conceptsClassDisplay[concept2.id] && concept2.concept" class="uk-icon"> <span *ngIf="conceptsClassDisplay[concept2.id] && concept2.concepts" class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span> <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span>
{{concept2.label}}</span> {{concept2.label}}</span>
<a *ngIf="!isSelected(concept2.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept2)" class="uk-button-default uk-align-right" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a> <a *ngIf="!isSelected(concept2.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept2)" class="uk-button-default uk-align-right" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
<ul *ngIf="concept2.concept && conceptsClassDisplay[concept2.id] " class="uk-animation-fade" > <ul *ngIf="concept2.concepts && conceptsClassDisplay[concept2.id] " class="uk-animation-fade" >
<li *ngFor="let concept3 of concept2.concept">{{concept3.label}} <li *ngFor="let concept3 of concept2.concepts">{{concept3.label}}
<a *ngIf="!isSelected(concept3.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept3)" class="uk-button-default uk-align-right" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a> <a *ngIf="!isSelected(concept3.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept3)" class="uk-button-default uk-align-right" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
</li> </li>
</ul> </ul>
@ -196,9 +196,9 @@ getCommunities () {
}else{ }else{
this.loading = true; this.loading = true;
var token=Session.getUserJwt(); var token=Session.getUserJwt();
this._contextService.getCommunities(this.properties.claimsAPIURL).subscribe( this._contextService.getCommunities(this.properties.contextsAPI).subscribe(
data => { data => {
this.communities = data.communities; this.communities = data;
this.loading = false; this.loading = false;
}, },
err => { err => {
@ -218,10 +218,10 @@ getCommunities () {
}else{ }else{
var token=Session.getUserJwt(); var token=Session.getUserJwt();
this._contextService.getCategories(this.selectedCommunityId,this.properties.claimsAPIURL).subscribe( this._contextService.getCategories(this.selectedCommunityId,this.properties.contextsAPI).subscribe(
data => { data => {
this.categories = (Array.isArray(data.category))? data.category:[data.category]; this.categories =data;// (Array.isArray(data.category))? data.category:[data.category];
this.concepts = []; this.concepts = [];
this.addCommunityInConcepts(); this.addCommunityInConcepts();
this.filteredList = []; this.filteredList = [];
@ -247,10 +247,15 @@ getCommunities () {
}else{ }else{
this.concepts = []; this.concepts = [];
var token=Session.getUserJwt(); var token=Session.getUserJwt();
this._contextService.getConcepts(this.selectedCategoryId, "",true, this.properties.claimsAPIURL).subscribe( this._contextService.getConcepts(this.selectedCategoryId, "",true, this.properties.contextsAPI).subscribe(
data => { data => {
this.concepts =data; this.concepts =data;
if(this.selectedCategoryId == "egi::classification"){
for(var i =0 ; i<data.length; i++){
this.getSubConcepts(data[i].id);
}
}
this.addCommunityInConcepts(); this.addCommunityInConcepts();
if (this.query !== ""){ if (this.query !== ""){
var event = {value: ""}; var event = {value: ""};
@ -270,6 +275,37 @@ getCommunities () {
this.loading = false; this.loading = false;
} }
} }
getSubConcepts (conceptId) {
this.loading = true;
if(this.selectedCategoryId != '0'){
if(!Session.isValidAndRemove()){
this.saveStateAndRedirectLogin();
}else{
this._contextService.getSubConcepts(conceptId, "",true, this.properties.contextsAPI).subscribe(
data => {
console.log(data);
for(var i =0 ; i<data.length; i++){
this.concepts.push(data[i]);
}
if (this.query !== ""){
var event = {value: ""};
event.value = this.query;
// this.filter(event);
}
this.loading = false;
},
err => {
console.log(err);
this.loading = false;
}
);
}
}else{
this.concepts=[];
this.loading = false;
}
}
displaySubcategory(id) { displaySubcategory(id) {
if(this.conceptsClassDisplay[id] != null){ if(this.conceptsClassDisplay[id] != null){
this.conceptsClassDisplay[id] = !this.conceptsClassDisplay[id]; this.conceptsClassDisplay[id] = !this.conceptsClassDisplay[id];
@ -289,17 +325,46 @@ getCommunities () {
this.conceptsClassDisplay[categoryId] = true; this.conceptsClassDisplay[categoryId] = true;
} }
this.conceptsClass[categoryId] = []; this.conceptsClass[categoryId] = [];
var token=Session.getUserJwt();
this.conceptsCategoryLoading[categoryId] = true; this.conceptsCategoryLoading[categoryId] = true;
this._contextService.getConcepts(categoryId, "",false, this.properties.claimsAPIURL).subscribe( this._contextService.getConcepts(categoryId, "",false, this.properties.contextsAPI).subscribe(
data => { data => {
var concepts = (Array.isArray(data))? data:[data]; var concepts = data;//(Array.isArray(data))? data:[data];
if(categoryId == "egi::classification"){
this.conceptsClass[categoryId] = [];
for(var i =0 ; i<data.length; i++){
this.browseSubConcepts(categoryId, data[i].id);
}
}else{
for(var i=0;i<concepts.length; i++){ for(var i=0;i<concepts.length; i++){
console.log("Data"+concepts[i]); console.log("Data"+concepts[i]);
if(concepts[i].id.split("::").length==3){ if(concepts[i].id.split("::").length==3){
this.conceptsClass[categoryId].push(concepts[i]); this.conceptsClass[categoryId].push(concepts[i]);
} }
} }
console.log(this.conceptsClass[categoryId]);
this.conceptsCategoryLoading[categoryId] = false;
}
},
err => {
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];//(Array.isArray(data))? data:[data];
this.conceptsClass[categoryId].push(concepts)
console.log("Data"+concepts);
console.log(this.conceptsClass[categoryId]); console.log(this.conceptsClass[categoryId]);
this.conceptsCategoryLoading[categoryId] = false; this.conceptsCategoryLoading[categoryId] = false;
}, },
@ -308,7 +373,7 @@ getCommunities () {
this.conceptsCategoryLoading[categoryId] = false; this.conceptsCategoryLoading[categoryId] = false;
} }
); );
}
} }
communityChanged(){ communityChanged(){

View File

@ -14,37 +14,58 @@ export class ContextsService {
} }
public getCommunities( apiUrl:string):any { public getCommunities( apiUrl:string):any {
let url = apiUrl + 'communities'; let url = apiUrl + 's/';
let key = url; let key = url;
console.info('ContextsService: request communities '+url); console.info('ContextsService: request communities '+url);
return this.http.get(url, this.getAuthOptions()) return this.http.get(url)
.map(request => <any> request.json().data) .map(res => <any> res.json()).map(res => this.parseCommunities(res) )
// .do(request => console.info("Get claims: offset = ")) // .do(request => console.info("Get claims: offset = "))
.catch(this.handleError); .catch(this.handleError);
} }
parseCommunities(data){
var communities = [];
for(var i = 0; i< data.length; i++){
if(data[i].type && (data[i].type == "ri" || data[i].type == "community")){
communities.push(data[i]);
}
}
return communities;
}
public getCategories(communityId :string, apiUrl:string):any { public getCategories(communityId :string, apiUrl:string):any {
console.info('ContextsService: request categories for community with id '+communityId); console.info('ContextsService: request categories for community with id '+communityId);
let url= apiUrl + 'communities/' + communityId + '/categories'; let url= apiUrl + '/' + communityId ;
let key = url; let key = url;
return this.http.get(url, this.getAuthOptions()) return this.http.get(url)
.map(request => <any> request.json().data) .map(request => <any> request.json())
// .do(request => console.info("Get claims: offset = " )) // .do(request => console.info("Get claims: offset = " ))
.catch(this.handleError);; .catch(this.handleError);;
} }
public getConcepts(categoryId :string, keyword: string, parsing:boolean, apiUrl:string):any { public getConcepts(categoryId :string, keyword: string, parsing:boolean, apiUrl:string):any {
console.info('ContextsService: request concept for category with id '+categoryId + ' and keyword '+ keyword); console.info('ContextsService: request concept for category with id '+categoryId + ' and keyword '+ keyword);
let url= apiUrl + 'categories/' + categoryId+ "/concepts"; let url= apiUrl + '/category/' + categoryId;
let key = url+"_parsing="+parsing; let key = url+"_parsing="+parsing;
return this.http.get(url, this.getAuthOptions()) return this.http.get(url )
.map(request => <any> request.json().data) .map(request => <any> request.json())
.catch(this.handleError) .catch(this.handleError)
.map(res => (parsing)?this.parse(res.concept):res.concept); .map(res => (parsing)?this.parse(res):res);
// .do(res => console.info("Result is "+ res.length ));
}
public getSubConcepts(subConceptID :string, keyword: string, parsing:boolean, apiUrl:string):any {
console.info('ContextsService: request sub concept for concept with id '+subConceptID + ' and keyword '+ keyword);
let url= apiUrl + '/category/concept/' + subConceptID;
let key = url+"_parsing="+parsing;
return this.http.get(url )
.map(request => <any> request.json())
.catch(this.handleError)
.map(res => (parsing)?this.parseSubConcepts(res):res);
// .do(res => console.info("Result is "+ res.length )); // .do(res => console.info("Result is "+ res.length ));
} }
parse (data: any):AutoCompleteValue[] { parse (data: any):AutoCompleteValue[] {
@ -64,6 +85,29 @@ export class ContextsService {
return array; return array;
}
parseSubConcepts (data: any):AutoCompleteValue[] {
var array:AutoCompleteValue[] =[]
if(data.length >0 && data[0].concepts){
var concepts = data[0].concepts;
for(var i = 0; i < concepts.length; i++){
var value:AutoCompleteValue = new AutoCompleteValue();
value.id = concepts[i].id;
value.label = concepts[i].label;
if(concepts[i].concepts){
var subconcepts = concepts[i].concepts;
for(var x = 0; x < subconcepts.length; x++){
var value:AutoCompleteValue = new AutoCompleteValue();
value.id = subconcepts[x].id;
value.label = subconcepts[x].label;
array.push(value);
}
}
array.push(value);
}
}
return array;
} }
private handleError (error: Response) { private handleError (error: Response) {

View File

@ -81,7 +81,7 @@ export class EnvProperties {
adminToolsCommunity; adminToolsCommunity;
contextsAPI;
communityAPI; communityAPI;
communitiesAPI; communitiesAPI;
datasourcesAPI; datasourcesAPI;