aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/app')
-rw-r--r--frontend/src/app/_data/Model.ts13
-rw-r--r--frontend/src/app/_pages/add-model/add-model.component.html69
-rw-r--r--frontend/src/app/_pages/add-model/add-model.component.ts32
-rw-r--r--frontend/src/app/_services/models.service.ts21
-rw-r--r--frontend/src/app/_services/web-socket.service.ts6
5 files changed, 73 insertions, 68 deletions
diff --git a/frontend/src/app/_data/Model.ts b/frontend/src/app/_data/Model.ts
index 48418d51..32247bbd 100644
--- a/frontend/src/app/_data/Model.ts
+++ b/frontend/src/app/_data/Model.ts
@@ -23,12 +23,14 @@ export default class Model {
public hiddenLayerNeurons: number = 1,
public hiddenLayers: number = 1,
public batchSize: number = 5,
- public hiddenLayerActivationFunction = [],
+ public hiddenLayerActivationFunctions: string[] = ['sigmoid'],
//public inputLayerActivationFunction: ActivationFunction = ActivationFunction.Sigmoid,
public outputLayerActivationFunction: ActivationFunction = ActivationFunction.Sigmoid,
public username: string = '',
public nullValues: NullValueOptions = NullValueOptions.DeleteRows,
- public nullValuesReplacers = []
+ public nullValuesReplacers = [],
+ public metrics: Metric[] = [], // TODO add to add-model form
+ public epochs: number = 5 // TODO add to add-model form
) { }
}
@@ -111,4 +113,11 @@ export enum ReplaceWith {
None = 'Popuni...',
Mean = 'Srednja vrednost',
Median = 'Medijana'
+}
+
+export enum Metric {
+ MSE = 'mse',
+ MAE = 'mae',
+ RMSE = 'rmse'
+ //...
} \ No newline at end of file
diff --git a/frontend/src/app/_pages/add-model/add-model.component.html b/frontend/src/app/_pages/add-model/add-model.component.html
index 8d763b00..662d34de 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.html
+++ b/frontend/src/app/_pages/add-model/add-model.component.html
@@ -73,7 +73,8 @@
<br>
<div *ngFor="let item of selectedDataset.header; let i = index">
<input class="form-check-input" type="checkbox" value="{{item}}" id="cb_{{item}}"
- name="cbsNew" [checked] = "this.selectedOutputColumnVal != item" [disabled]="this.selectedOutputColumnVal == item">&nbsp;
+ name="cbsNew" [checked]="this.selectedOutputColumnVal != item"
+ [disabled]="this.selectedOutputColumnVal == item">&nbsp;
<label class="form-check-label" for="cb_{{item}}">
{{item}}
</label>
@@ -165,7 +166,8 @@
</div>
<div class="col-2">
<select id=typeOptions class="form-control" name="type" [(ngModel)]="newModel.type">
- <option *ngFor="let option of Object.keys(ProblemType); let optionName of Object.values(ProblemType)"
+ <option
+ *ngFor="let option of Object.keys(ProblemType); let optionName of Object.values(ProblemType)"
[value]="option">
{{ optionName }}
</option>
@@ -178,7 +180,8 @@
</div>
<div class="col-1">
<input type="number" min="1" class="form-control" name="hiddenLayers"
- [(ngModel)]="newModel.hiddenLayers">
+ [(ngModel)]="newModel.hiddenLayers"
+ (change)="newModel.hiddenLayerActivationFunctions = [].constructor(newModel.hiddenLayers).fill(newModel.hiddenLayerActivationFunctions[0])">
</div>
</div>
@@ -260,56 +263,36 @@
</div>
<div class="row p-2">
-
- <!-- <div class="col-1">
- </div>
+ <div class="col-3"></div>
<div class="col-3">
- <label for="inputLayerActivationFunction" class="col-form-label">Funkcija aktivacije ulaznog
- sloja:</label>
+ <label for="hiddenLayerActivationFunction" class="col-form-label">Funkcija aktivacije skrivenih
+ slojeva:</label>
</div>
-
- <div class="col-2">
- <select id=inputLayerActivationFunctionOptions class="form-control"
- name="inputLayerActivationFunction" [(ngModel)]="newModel.inputLayerActivationFunction">
- <option
- *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)"
- [value]="option">
- {{ optionName }}
- </option>
- </select>
+ <div class="col-3">
+ <div *ngFor="let item of [].constructor(newModel.hiddenLayers); let i = index">
+ <select [id]="'hiddenLayerActivationFunctionOption_'+i" class="form-control"
+ [(ngModel)]="newModel.hiddenLayerActivationFunctions[i]">
+ <option
+ *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)"
+ [value]="option">
+ {{ optionName }}
+ </option>
+ </select>
+ </div>
</div>
+ <div class="col-3"></div>
+ </div>
+
+ <div class="row p-2">
<div class="col-1">
</div>
- -->
-
- <div class="col-5">
+ <div class="col-3">
<label for="splitYesNo" class="form-check-label">Podela test skupa:&nbsp;&nbsp;
<input id="splitYesNo" class="form-check-input" type="checkbox"
[checked]="newModel.randomTestSet"
(change)="newModel.randomTestSet = !newModel.randomTestSet">
</label>
</div>
- <div class="col">
- </div>
- </div>
-
- <div class="row p-2">
- <div class="col-1">
- </div>
- <div class="col-3">
- <label for="hiddenLayerActivationFunction" class="col-form-label">Funkcija aktivacije skrivenih
- slojeva:</label>
- </div>
- <div class="col-2">
- <select id=hiddenLayerActivationFunctionOptions class="form-control"
- name="hiddenLayerActivationFunction" [(ngModel)]="newModel.hiddenLayerActivationFunction">
- <option
- *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)"
- [value]="option">
- {{ optionName }}
- </option>
- </select>
- </div>
<div class="col-1">
</div>
<div class="col-2">
@@ -359,7 +342,7 @@
<button class="btn btn-lg col-4" style="background-color:#003459; color:white;"
(click)="addModel();">Sačuvaj model</button>
<div class="col"></div>
- <button class="btn btn-lg col-4 disabled" style="background-color:#003459; color:white;"
+ <button class="btn btn-lg col-4" style="background-color:#003459; color:white;"
(click)="trainModel();">Treniraj model</button>
<div class="col"></div>
</div>
diff --git a/frontend/src/app/_pages/add-model/add-model.component.ts b/frontend/src/app/_pages/add-model/add-model.component.ts
index 78e1255b..77a506d5 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.ts
+++ b/frontend/src/app/_pages/add-model/add-model.component.ts
@@ -76,19 +76,28 @@ export class AddModelComponent implements OnInit {
addModel() {
if (!this.showMyDatasets)
- this.saveModelWithNewDataset();
+ this.saveModelWithNewDataset(_ => { console.log('MODEL ADDED (with new dataset).') });
else
- this.saveModelWithExistingDataset();
+ this.saveModelWithExistingDataset(_ => { console.log('MODEL ADDED (with existing dataset).') });
}
trainModel() {
- this.saveModelWithNewDataset().subscribe((modelId: any) => {
- if (modelId)
- this.models.trainModel(modelId);
- }); //privremeno cuvanje modela => vraca id sacuvanog modela koji cemo da treniramo sad
+ let saveFunc;
+
+ if (!this.showMyDatasets)
+ saveFunc = (x: (arg0: any) => void) => { this.saveModelWithNewDataset(x) };
+ else
+ saveFunc = (x: (arg0: any) => void) => { this.saveModelWithExistingDataset(x) };
+
+ saveFunc(((model: any) => {
+ console.log('Saved, training model...', model);
+ this.models.trainModel(model).subscribe(response => {
+ console.log('Train model complete!', response);
+ });
+ })); //privremeno cuvanje modela => vraca id sacuvanog modela koji cemo da treniramo sad
}
- saveModelWithNewDataset(): any {
+ saveModelWithNewDataset(callback: ((arg0: any) => void)) {
this.getCheckedInputCols();
this.getCheckedOutputCol();
@@ -117,7 +126,7 @@ export class AddModelComponent implements OnInit {
this.newModel.username = shared.username;
this.models.addModel(this.newModel).subscribe((response) => {
- console.log('ADD MODEL: DONE! REPLY:\n', response);
+ callback(response);
}, (error) => {
alert("Model sa unetim nazivom već postoji u Vašoj kolekciji.\nPromenite naziv modela i nastavite sa kreiranim datasetom.");
}); //kraj addModel subscribe
@@ -133,8 +142,7 @@ export class AddModelComponent implements OnInit {
} //kraj prvog ifa
}
- saveModelWithExistingDataset(): any {
-
+ saveModelWithExistingDataset(callback: ((arg0: any) => void)): any {
if (this.selectedDataset) { //dataset je izabran
this.getCheckedInputCols();
this.getCheckedOutputCol();
@@ -147,7 +155,7 @@ export class AddModelComponent implements OnInit {
this.newModel.username = shared.username;
this.models.addModel(this.newModel).subscribe((response) => {
- console.log('ADD MODEL: DONE! REPLY:\n', response);
+ callback(response);
}, (error) => {
alert("Model sa unetim nazivom već postoji u Vašoj kolekciji.\nPromenite naziv modela i nastavite sa kreiranim datasetom.");
});
@@ -226,7 +234,7 @@ export class AddModelComponent implements OnInit {
for (let i = this.datasetFile.length - 1; i >= 0; i--) { //moguce da je vise redova na kraju fajla prazno i sl.
if (this.datasetFile[i].length != this.datasetFile[0].length)
this.datasetFile[i].pop();
- else
+ else
break; //nema potrebe dalje
}
console.log(this.datasetFile);
diff --git a/frontend/src/app/_services/models.service.ts b/frontend/src/app/_services/models.service.ts
index 1ec92140..3fbad109 100644
--- a/frontend/src/app/_services/models.service.ts
+++ b/frontend/src/app/_services/models.service.ts
@@ -4,6 +4,7 @@ import Model from '../_data/Model';
import { AuthService } from './auth.service';
import { API_SETTINGS } from 'src/config';
import { Observable } from 'rxjs';
+import Dataset from '../_data/Dataset';
@Injectable({
@@ -31,22 +32,26 @@ export class ModelsService {
addModel(model: Model): Observable<any> {
return this.http.post(`${API_SETTINGS.apiURL}/model/add`, model, { headers: this.authService.authHeader() });
}
-
- trainModel(modelId: string): Observable<any> {
- return this.http.post(`${API_SETTINGS.apiURL}/model/train`, modelId, { headers: this.authService.authHeader() });
+ addDataset(dataset: Dataset): Observable<any> {
+ return this.http.post(`${API_SETTINGS.apiURL}/dataset/add`, dataset, { headers: this.authService.authHeader() });
+ }
+ trainModel(model: Model): Observable<any> {
+ return this.http.post(`${API_SETTINGS.apiURL}/model/sendmodel`, model, { headers: this.authService.authHeader(), responseType: 'text' });
+ }
+
+ getMyDatasets(): Observable<Dataset[]> {
+ return this.http.get<Dataset[]>(`${API_SETTINGS.apiURL}/dataset/mydatasets`, { headers: this.authService.authHeader() });
}
getMyModels(): Observable<Model[]> {
return this.http.get<Model[]>(`${API_SETTINGS.apiURL}/model/mymodels`, { headers: this.authService.authHeader() });
}
- editModel(model:Model) : Observable<Model>
- {
+ editModel(model: Model): Observable<Model> {
return this.http.put<Model>(`${API_SETTINGS.apiURL}/model/`, model, { headers: this.authService.authHeader() });
}
- deleteModel(model:Model)
- {
- return this.http.delete(`${API_SETTINGS.apiURL}/model/`+model.name, { headers: this.authService.authHeader(), responseType : "text" });
+ deleteModel(model: Model) {
+ return this.http.delete(`${API_SETTINGS.apiURL}/model/` + model.name, { headers: this.authService.authHeader(), responseType: "text" });
}
}
diff --git a/frontend/src/app/_services/web-socket.service.ts b/frontend/src/app/_services/web-socket.service.ts
index 890ada6b..1a7efa87 100644
--- a/frontend/src/app/_services/web-socket.service.ts
+++ b/frontend/src/app/_services/web-socket.service.ts
@@ -13,15 +13,15 @@ export class WebSocketService {
constructor() {
this.ws = new WebsocketBuilder(API_SETTINGS.apiWSUrl)
- .withBackoff(new ConstantBackoff(30000))
- .onOpen((i, e) => { console.log('WS: Connected to ' + API_SETTINGS.apiWSUrl) })
+ .withBackoff(new ConstantBackoff(120000))
+ .onOpen((i, e) => { /*console.log('WS: Connected to ' + API_SETTINGS.apiWSUrl)*/ })
.onMessage((i, e) => {
console.log('WS MESSAGE: ', e.data);
this.handlers.forEach(handler => {
handler(e.data);
})
})
- .onClose((i, e) => { console.log('WS: Connection closed!') })
+ .onClose((i, e) => { /*console.log('WS: Connection closed!')*/ })
.build();
}
generated by cgit v1.2.3 (git 2.39.1) at 2025-04-20 00:52:23 +0000