387 lines
11 KiB
TypeScript
387 lines
11 KiB
TypeScript
import { Component, Input, OnInit, AfterViewInit, ElementRef} from '@angular/core';
|
|
import { DialogService } from "ng2-bootstrap-modal";
|
|
import { Router } from '@angular/router';
|
|
import { DatasetsServiceService } from '../services/datasets-service.service';
|
|
import { DatasetProfileService } from '../services/dataset-profile.service';
|
|
import { DmpsServiceService } from '../services/dmps-service.service';
|
|
|
|
import '../../assets/custom.js';
|
|
declare function simple_notifier(type: string, title: string, message:string): any;
|
|
|
|
import {Headers, Http, Response} from '@angular/http';
|
|
import {Observable} from 'rxjs/Observable';
|
|
import * as jQuery from 'jquery';
|
|
|
|
@Component({
|
|
selector: 'app-datasets-viewer',
|
|
templateUrl: './datasets-viewer.component.html',
|
|
styleUrls: ['./datasets-viewer.component.css']
|
|
})
|
|
export class DatasetsViewerComponent implements OnInit, AfterViewInit {
|
|
|
|
//This is the table data
|
|
public data: any[] = new Array();
|
|
public filterQuery = "";
|
|
public rowsOnPage = 10;
|
|
public sortBy = "email";
|
|
public sortOrder = "asc";
|
|
|
|
//this is for viewing or not ids
|
|
private showIDs: boolean = false;
|
|
|
|
//this is for switching between components
|
|
private viewingComponent: number = 1;
|
|
|
|
public dmpsIDLabels : any = null;
|
|
|
|
//for update sensing...
|
|
private haveChanges : boolean = false;
|
|
|
|
//for popups
|
|
private clickedDatasetID: string;
|
|
|
|
//this is the profile under edit
|
|
private profile : any;
|
|
|
|
|
|
constructor(
|
|
private el: ElementRef,
|
|
private datasetsService : DatasetsServiceService,
|
|
private datasetProfileService: DatasetProfileService,
|
|
private http : Http,
|
|
private dmpsService: DmpsServiceService,
|
|
private dialogService:DialogService,
|
|
private router: Router
|
|
) {
|
|
|
|
}
|
|
|
|
|
|
ngOnInit() : void {
|
|
//this.getDatasetIDs();
|
|
this.getTabularDatasets(false);
|
|
this.dmpsIDLabels = this.dmpsService.getDmpIdsLabels().subscribe((data)=> {this.dmpsIDLabels = data;} );
|
|
}
|
|
|
|
ngAfterViewInit() {
|
|
|
|
}
|
|
|
|
onFocusIn($event){
|
|
this.nullSafeProfile();
|
|
this.haveChanges = false;
|
|
}
|
|
|
|
onValueChanged($event){
|
|
this.nullSafeProfile();
|
|
this.haveChanges = true;
|
|
}
|
|
|
|
onFocusOutLabel($event){
|
|
if(this.haveChanges){
|
|
let datasetID = $event.srcElement.parentElement.parentElement.children[0].textContent;
|
|
console.log("Updating the value of label to: "+$event.target.value+" on row with id: "+datasetID);
|
|
this.datasetsService.getDatasetById(datasetID).subscribe( (data) => {
|
|
data.label = $event.target.value;
|
|
this.datasetsService.setDataset(data).subscribe( (data) => {
|
|
//console.log(data);
|
|
});
|
|
simple_notifier("success",null,"Updated value of label to '"+data.label+"'");
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
onFocusOutURI($event){
|
|
if(this.haveChanges){
|
|
let datasetID = $event.srcElement.parentElement.parentElement.children[0].textContent;
|
|
console.log("Updating the value of uri to: "+$event.target.value+" on row with id: "+datasetID);
|
|
this.datasetsService.getDatasetById(datasetID).subscribe(
|
|
(data) => {
|
|
data.uri = $event.target.value;
|
|
this.datasetsService.setDataset(data).subscribe( (data) => {
|
|
//console.log(data);
|
|
}
|
|
);
|
|
simple_notifier("success",null,"Updated value of Uri to '"+data.uri+"'");
|
|
}
|
|
);
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onFocusOutProfileWin($event, value:string) {
|
|
this.nullSafeProfile();
|
|
if(this.haveChanges){
|
|
console.log("Saving profile: "+JSON.stringify(this.profile));
|
|
//save back
|
|
if(this.profile.id == null){ //if profile is new
|
|
//create profile and a) assign it on data[] and on current profile b) assign it to dataset
|
|
this.datasetProfileService.setDatasetProfile(this.profile).subscribe((resp) => {
|
|
|
|
|
|
console.log("SERVICE RESPONSE: ");
|
|
console.log(resp);
|
|
console.log(resp.json());
|
|
this.datasetsService.getDatasetById(this.clickedDatasetID).subscribe( (dataset) => {
|
|
|
|
if(dataset.profile != null){
|
|
this.profile.id = dataset.profile.id;
|
|
|
|
}
|
|
dataset.profile = this.profile;
|
|
|
|
console.log("SAVING DATASET: "+JSON.stringify(dataset));
|
|
|
|
this.datasetsService.setDataset(dataset).subscribe( (resp) => {
|
|
|
|
//console.log(resp);
|
|
simple_notifier("success",null,"Updated profile element");
|
|
});
|
|
});
|
|
|
|
simple_notifier("success",null,"Updated profile element");
|
|
});
|
|
}
|
|
else{
|
|
//this.getDatasetFromDataArray()
|
|
|
|
console.log("this.profile")
|
|
console.log(this.profile)
|
|
|
|
console.log(this.profile)
|
|
this.profile.dataset = {"id": this.profile.dataset};
|
|
|
|
|
|
this.datasetProfileService.setDatasetProfile(this.profile).subscribe(
|
|
response => {
|
|
simple_notifier("success",null,"Saved DMP Profile");
|
|
console.log(response);
|
|
},
|
|
err => {
|
|
simple_notifier("danger",null,"Could not save DMP Profile");
|
|
console.log(err);
|
|
}
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
/*
|
|
onFocusOutProfileWin($event, value:string){
|
|
if(this.haveChanges){
|
|
console.log("Saving profile: "+JSON.stringify(this.profile));
|
|
//save back
|
|
if(this.profile.id == null){ //if profile is new
|
|
console.log("================CH 1 =======================");
|
|
simple_notifier("info",null,"Dataset didn't have a profile. Created and associated a new one");
|
|
//get the appropriate dataset, and add the new profile
|
|
this.datasetsService.getDatasetById(this.clickedDatasetID).subscribe( (dataset) => {
|
|
console.log("================CH 2 =======================");
|
|
if(dataset.profile != null){
|
|
this.profile.id = dataset.profile.id;
|
|
console.log("================CH 3 =======================");
|
|
}
|
|
dataset.profile = this.profile;
|
|
|
|
console.log("SAVING DATASET: "+JSON.stringify(dataset));
|
|
|
|
this.datasetsService.setDataset(dataset).subscribe( (resp) => {
|
|
console.log("================CH 4 =======================");
|
|
//console.log(resp);
|
|
simple_notifier("success",null,"Updated profile element");
|
|
});
|
|
});
|
|
}
|
|
else{
|
|
console.log("================CH 5 =======================");
|
|
this.datasetProfileService.setDatasetProfile(this.profile).subscribe((resp) => {
|
|
console.log("================CH 6 =======================");
|
|
console.log(resp.status);
|
|
simple_notifier("success",null,"Updated profile element");
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
*/
|
|
|
|
nullSafeProfile(){
|
|
if(this.profile==null){
|
|
console.log("BEFORE:");
|
|
console.log(this.profile);
|
|
this.profile = {'label':null, 'definition':null, 'viewstyle':{'label':null, 'definition':null}, 'ruleset':{'label':null, 'definition':null}};
|
|
console.log("AFTER:");
|
|
console.log(this.profile);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
preventDefaults($event){
|
|
if($event.code == 'Tab') {
|
|
$event.preventDefault();
|
|
//AND NOW HACK THE TAB KEY WITHIN THE TEXT EDITOR
|
|
var start = $event.srcElement.selectionStart;
|
|
var end = $event.srcElement.selectionEnd;
|
|
// set textarea value to: text before caret + tab + text after caret
|
|
$event.target.value = $event.target.value.substring(0, start)+"\t"+$event.target.value.substring(end);
|
|
// put caret at right position again
|
|
$event.srcElement.selectionStart =
|
|
$event.srcElement.selectionEnd = start + 1;
|
|
}
|
|
}
|
|
|
|
getTabularDatasets(notifyAlso){
|
|
|
|
this.datasetsService.fetchAllDatasets()
|
|
.map((elems) => {
|
|
let tmpData = new Array();
|
|
for (let elem of elems) {
|
|
let row = {
|
|
"id": elem.id,
|
|
"label":elem.label,
|
|
"dmp": elem.dmp,
|
|
"uri": elem.uri,
|
|
"properties": elem.properties,
|
|
"profile": elem.profile
|
|
};
|
|
tmpData.push(row);
|
|
}
|
|
return tmpData;
|
|
}
|
|
)
|
|
.subscribe((data)=> {
|
|
this.data = data;
|
|
if(notifyAlso)
|
|
simple_notifier("info",null,"Refreshed table");
|
|
});
|
|
}
|
|
|
|
|
|
onShowingPropertiesModal($event){
|
|
var trElem = $event.target;
|
|
while(trElem.nodeName != "TR")
|
|
trElem = trElem.parentElement;
|
|
this.clickedDatasetID = trElem.children[0].textContent;
|
|
}
|
|
|
|
|
|
gotoProfileEditor($event) {
|
|
var trElem = $event.target;
|
|
while(trElem.nodeName != "TR")
|
|
trElem = trElem.parentElement;
|
|
this.clickedDatasetID = trElem.children[0].textContent;
|
|
|
|
if(this.clickedDatasetID == null) console.log("Could not retrieve the id of the clicked dataset");
|
|
|
|
var dataset = this.getDatasetFromDataArray(this.clickedDatasetID);
|
|
if(dataset != null){
|
|
this.profile = dataset.profile;
|
|
this.goToEditor();
|
|
}
|
|
|
|
}
|
|
|
|
getDatasetFromDataArray(datasetID){
|
|
for(var dataRow of this.data){
|
|
if(datasetID == dataRow.id)
|
|
return dataRow;
|
|
}
|
|
return null;
|
|
}
|
|
|
|
|
|
deleteDataset(dataset){
|
|
this.datasetsService.deleteDataset(dataset).subscribe(
|
|
resp =>{
|
|
console.log(status);
|
|
this.refreshTable(null);
|
|
simple_notifier("success",null,"Dataset was deleted");
|
|
},
|
|
err => {
|
|
simple_notifier("danger",null,"Dataset could not be deleted");
|
|
}
|
|
);
|
|
}
|
|
|
|
|
|
goToEditor(){
|
|
this.viewingComponent = 2;
|
|
}
|
|
|
|
goToMain(){
|
|
this.viewingComponent = 1;
|
|
}
|
|
|
|
|
|
setDmpLabelValueOfDatasetID(datasetID, newVal){
|
|
for(var i=0;i<this.data.length;i++){
|
|
var row = this.data[i];
|
|
if(row.id == datasetID){
|
|
if(row["dmp"] != null && row["dmp"].label != null)
|
|
row["dmp"].label = newVal;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
setClickedDatasetID($event){
|
|
var trElem = $event.srcElement;
|
|
while(trElem.nodeName != "TR")
|
|
trElem = trElem.parentElement;
|
|
this.clickedDatasetID = trElem.children[0].textContent;
|
|
}
|
|
|
|
|
|
applyConfirmation($event){
|
|
if($event==true){
|
|
console.log("will delete dataset: "+ this.clickedDatasetID);
|
|
//method 1
|
|
var dataset = {};
|
|
dataset["id"] = this.clickedDatasetID;
|
|
dataset["label"] = " ";
|
|
this.deleteDataset(dataset);
|
|
}
|
|
}
|
|
|
|
notifyNewDatasetID($event){
|
|
this.filterQuery = $event;
|
|
this.refreshTable($event);
|
|
}
|
|
|
|
|
|
refreshTable($event){
|
|
this.getTabularDatasets(true);
|
|
}
|
|
|
|
|
|
assignDMPToDataset($event, dmpID){
|
|
var trElem = $event.srcElement;
|
|
while(trElem.nodeName != "TR")
|
|
trElem = trElem.parentElement;
|
|
var datasetID = trElem.children[0].textContent;
|
|
|
|
this.datasetsService.assignDMPToDataset(datasetID, dmpID).subscribe(
|
|
(resp) => {
|
|
this.setDmpLabelValueOfDatasetID(datasetID, $event.target.text);
|
|
simple_notifier("success",null,"Assigned the dmp on dataset");
|
|
},
|
|
err => {
|
|
simple_notifier("danger",null,"Could not assign the dmp on dataset");
|
|
}
|
|
);
|
|
|
|
}
|
|
|
|
|
|
} |