Merge branch 'redesign' of http://gitlab.pmf.kg.ac.rs/igrannonica/neuronstellar

8 files changed, 247 insertions, 0 deletions

diff --git a/frontend/src/app/_modals/share-dialog/share-dialog.component.css b/frontend/src/app/_modals/share-dialog/share-dialog.component.css
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/frontend/src/app/_modals/share-dialog/share-dialog.component.css
diff --git a/frontend/src/app/_modals/share-dialog/share-dialog.component.html b/frontend/src/app/_modals/share-dialog/share-dialog.component.html
new file mode 100644
index 00000000..32584197
--- /dev/null
+++ b/frontend/src/app/_modals/share-dialog/share-dialog.component.html
@@ -0,0 +1,14 @@
+<h1 mat-dialog-title class="text-center">Podeli {{data.fileType == 0 ? 'izvor podataka' : 'konfiguraciju neuronske mreže'}}</h1>
+<div mat-dialog-content class="mt-5 mb-3 mx-1">
+    <form>
+        <mat-checkbox class="m-2" [(ngModel)]="data.file.isPublic" [ngModelOptions]="{standalone: true}" (change)="publicChanged()">Svi mogu da vide </mat-checkbox>
+        <mat-checkbox class="m-2" [(ngModel)]="data.file.accessibleByLink" [ngModelOptions]="{standalone: true}" (change)="linkChanged()">Osobe sa linkom mogu da vide</mat-checkbox>
+        <div class="input-group my-3">
+            <input type="text" [value]="link" class="form-control" placeholder="" aria-label="Copy link button addon" aria-describedby="button-copy">
+            <button class="btn btn-outline-primary" type="button" id="button-copy" (click)="copy()" [disabled]="!data.file.accessibleByLink"><div class="mt-1"><mat-icon *ngIf="data.file.accessibleByLink">link</mat-icon><mat-icon *ngIf="!data.file.accessibleByLink">link_off</mat-icon></div></button>
+        </div>
+    </form>
+</div>
+<div mat-dialog-actions class="justify-content-center">
+    <button mat-stroked-button (click)="close()">Gotovo</button>
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/_modals/share-dialog/share-dialog.component.spec.ts b/frontend/src/app/_modals/share-dialog/share-dialog.component.spec.ts
new file mode 100644
index 00000000..51bd4c9a
--- /dev/null
+++ b/frontend/src/app/_modals/share-dialog/share-dialog.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ShareDialogComponent } from './share-dialog.component';
+
+describe('ShareDialogComponent', () => {
+  let component: ShareDialogComponent;
+  let fixture: ComponentFixture<ShareDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ShareDialogComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ShareDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_modals/share-dialog/share-dialog.component.ts b/frontend/src/app/_modals/share-dialog/share-dialog.component.ts
new file mode 100644
index 00000000..2331cd8b
--- /dev/null
+++ b/frontend/src/app/_modals/share-dialog/share-dialog.component.ts
@@ -0,0 +1,70 @@
+import { Component, Inject, Input, OnInit } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import Dataset from 'src/app/_data/Dataset';
+import { FolderType } from 'src/app/_data/FolderFile';
+import Model from 'src/app/_data/Model';
+import { DatasetsService } from 'src/app/_services/datasets.service';
+import { ModelsService } from 'src/app/_services/models.service';
+
+interface DialogData {
+  file: (Dataset | Model);
+  fileType: FolderType;
+}
+
+@Component({
+  selector: 'app-share-dialog',
+  templateUrl: './share-dialog.component.html',
+  styleUrls: ['./share-dialog.component.css']
+})
+export class ShareDialogComponent implements OnInit {
+  constructor(public dialogRef: MatDialogRef<ShareDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: DialogData, private modelsService: ModelsService, private datasetsService: DatasetsService) {
+
+  }
+
+  link: string = '';
+
+  ngOnInit(): void {
+    let link = window.location.origin;
+    if (this.data.fileType == FolderType.Dataset) {
+      link += '/dataset/';
+    } else if (this.data.fileType == FolderType.Model) {
+      link += '/model/';
+    }
+    link += this.data.file._id;
+    this.link = link;
+  }
+
+  close() {
+    this.dialogRef.close();
+  }
+
+  copy() {
+    navigator.clipboard.writeText(this.link);
+  }
+
+  publicChanged() {
+    if (this.data.fileType == FolderType.Dataset) {
+      this.datasetsService.updateDatasetIsPublic(this.data.file._id, this.data.file.isPublic).subscribe(() => {
+      });
+    } else if (this.data.fileType == FolderType.Model) {
+      this.modelsService.updateModelIsPublic(this.data.file._id, this.data.file.isPublic).subscribe(() => {
+      });
+    }
+
+    if (this.data.file.isPublic) {
+      this.data.file.accessibleByLink = true;
+    }
+  }
+
+  linkChanged() {
+    if (this.data.fileType == FolderType.Dataset) {
+      this.datasetsService.updateDatasetAccessibleByLink(this.data.file._id, this.data.file.accessibleByLink).subscribe(() => {
+      });
+    } else if (this.data.fileType == FolderType.Model) {
+      this.modelsService.updateModelAccessibleByLink(this.data.file._id, this.data.file.accessibleByLink).subscribe(() => {
+      });
+    }
+  }
+
+  FolderType = FolderType;
+}
diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css
new file mode 100644
index 00000000..551a4e21
--- /dev/null
+++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css
@@ -0,0 +1,21 @@
+#btnYes {
+    background-color: var(--offwhite);
+    color: var(--ns-bg-dark-100);
+}
+
+#btnNo {
+    color: gray;
+}
+
+.wrongInput {
+    color: var(--ns-warn);
+    font-size: 11px;
+}
+
+::ng-deep.mat-dialog-content {
+    overflow: visible;
+}
+
+.hidden-class {
+    opacity: 0;
+}
\ No newline at end of file
diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html
new file mode 100644
index 00000000..db44dfe1
--- /dev/null
+++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html
@@ -0,0 +1,24 @@
+<h1 mat-dialog-title class="text-center">Sačuvaj izmene</h1>
+<div mat-dialog-content class="mt-5 mb-3 mx-1">
+    <form (keydown)="saveWithEnterKey($event)">
+        <mat-radio-group [(ngModel)]="selectedOption" [ngModelOptions]="{standalone: true}">
+            <!-- I   Update the existing experiment -->
+            <mat-radio-button [value]="1" checked>Izmeni postojeći eksperiment</mat-radio-button>
+            <!-- II  Save as new experiment -->
+            <mat-radio-button [value]="2" class="mt-4">Sačuvaj kao novi eksperiment</mat-radio-button>
+        </mat-radio-group>
+        <div class="d-flex align-items-center justify-content-center mt-3" [ngClass]="{'hidden-class': selectedName.length == 0 && selectedOption == 1}">
+            <mat-form-field [style.width.px]=200>
+                <input type="text" matInput [(ngModel)]="selectedName" (click)="selectedOption = 2" (keydown)="selectedOption = 2" cdkFocusInitial [ngModelOptions]="{standalone: true}" placeholder="Naziv novog eskperimenta">
+            </mat-form-field>
+        </div>
+        <div class="d-flex align-items-center justify-content-center mt-1 mx-4">
+            <p *ngIf="wrongAlreadyExists" class="wrongInput">Eskperiment sa unetim nazivom već postoji u kolekciji.<br>Izaberite drugi naziv.</p>
+            <p *ngIf="wrongEmptyName" class="wrongInput">Unesite naziv eksperimenta.</p>
+        </div>
+    </form>
+</div>
+<div mat-dialog-actions class="justify-content-center">
+    <button id="btnYes" mat-stroked-button color="basic" (click)="onYesClick()">Sačuvaj</button>
+    <button id="btnNo" mat-stroked-button (click)="onNoClick()">Odustani</button>
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts
new file mode 100644
index 00000000..e0f26b2c
--- /dev/null
+++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UpdateExperimentDialogComponent } from './update-experiment-dialog.component';
+
+describe('UpdateExperimentDialogComponent', () => {
+  let component: UpdateExperimentDialogComponent;
+  let fixture: ComponentFixture<UpdateExperimentDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ UpdateExperimentDialogComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(UpdateExperimentDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts
new file mode 100644
index 00000000..068aa2ef
--- /dev/null
+++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts
@@ -0,0 +1,68 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import Experiment from 'src/app/_data/Experiment';
+import { ExperimentsService } from 'src/app/_services/experiments.service';
+
+interface DialogData {
+  experiment: Experiment;
+  selectedOption: number;
+}
+
+@Component({
+  selector: 'app-update-experiment-dialog',
+  templateUrl: './update-experiment-dialog.component.html',
+  styleUrls: ['./update-experiment-dialog.component.css']
+})
+export class UpdateExperimentDialogComponent implements OnInit {
+
+  selectedOption: number = 1;
+  selectedName: string = '';
+  wrongAlreadyExists: boolean = false;
+  wrongEmptyName: boolean = false;
+
+  constructor(public dialogRef: MatDialogRef<UpdateExperimentDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: DialogData, private experimentService: ExperimentsService) { 
+    this.wrongAlreadyExists = false;
+    this.wrongEmptyName = false;
+  }
+
+  ngOnInit(): void {
+  }
+
+  onNoClick() {
+    this.dialogRef.close();
+  }
+
+  saveWithEnterKey(keyboardEvent: KeyboardEvent) {
+    if (keyboardEvent.code == "Enter" || keyboardEvent.code == "NumpadEnter") 
+      this.onYesClick();
+  }
+
+  onYesClick() {
+    if (this.selectedOption == 1) { //update
+      this.experimentService.updateExperiment(this.data.experiment).subscribe((response) => { 
+        this.data.experiment = response;
+        this.dialogRef.close(this.data.experiment);
+      });
+    }
+    else { //save new
+      if (this.selectedName == "") {
+        this.wrongEmptyName = true;
+        return;
+      }
+      this.wrongEmptyName = false;
+
+      const newExperiment = new Experiment();
+      Object.assign(newExperiment, this.data.experiment);
+      newExperiment.name = this.selectedName;
+      newExperiment._id = '';
+      this.experimentService.addExperiment(newExperiment!).subscribe((response) => {
+        this.wrongAlreadyExists = false;
+        this.dialogRef.close(response);
+      }, (error) => {
+        if (error.error == "Experiment with this name exists") {
+          this.wrongAlreadyExists = true;
+        }
+      });
+    }
+  }
+}