diff options
Diffstat (limited to 'frontend/src/app/_pages/add-model/add-model.component.html')
| -rw-r--r-- | frontend/src/app/_pages/add-model/add-model.component.html | 82 |
1 files changed, 35 insertions, 47 deletions
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 09a11e37..662d34de 100644 --- a/frontend/src/app/_pages/add-model/add-model.component.html +++ b/frontend/src/app/_pages/add-model/add-model.component.html @@ -40,21 +40,23 @@ Dodajte novi dataset </button> </div> - + <div class="px-5 my-2"> + <input *ngIf="showMyDatasets" type="text" class="form-control" placeholder="Pretraga" [(ngModel)]="term"> + </div> <div class="px-5"> <div *ngIf="showMyDatasets" class="overflow-auto" style="max-height: 500px;"> <ul class="list-group"> - <li class="list-group-item p-3" *ngFor="let dataset of myDatasets" + <li class="list-group-item p-3" *ngFor="let dataset of myDatasets|filter:term" [ngClass]="{'selectedDatasetClass': this.selectedDataset == dataset}"> <app-item-dataset name="usersDataset" [dataset]="dataset" - (click)="selectThisDataset(dataset)"></app-item-dataset> + (click)="scrollToNextForm(); selectThisDataset(dataset);"></app-item-dataset> </li> </ul> </div> </div> <app-dataset-load *ngIf="!showMyDatasets" id="dataset" - (loaded)="datasetLoaded = true; selectedDataset = datasetLoadComponent?.dataset; datasetFile = datasetLoadComponent?.csvRecords; datasetHasHeader = datasetLoadComponent?.dataset!.hasHeader"> + (loaded)="scrollToNextForm(); datasetLoaded = true; selectedDataset = datasetLoadComponent?.dataset; datasetFile = datasetLoadComponent?.csvRecords; datasetHasHeader = datasetLoadComponent?.dataset!.hasHeader"> </app-dataset-load> <div class="px-5 mt-5"> <app-datatable [data]="datasetFile" [hasHeader]="datasetHasHeader"></app-datatable> @@ -62,6 +64,7 @@ </div> <!-- ULAZNE/IZLAZNE KOLONE --> + <span id="selectInAndOuts"></span> <div *ngIf="selectedDataset"> <div class="row"> <div class="col d-flex justify-content-center"> @@ -70,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 [disabled]="this.selectedOutputColumnVal == item"> + name="cbsNew" [checked]="this.selectedOutputColumnVal != item" + [disabled]="this.selectedOutputColumnVal == item"> <label class="form-check-label" for="cb_{{item}}"> {{item}} </label> @@ -92,7 +96,7 @@ </div> - <div class="my-2" *ngIf="datasetFile"> + <div class="mt-5" *ngIf="datasetFile"> <h2>Popunjavanje nedostajućih vrednosti:</h2> <div class="form-check"> <input type="radio" [(ngModel)]="newModel.nullValues" [value]="NullValueOptions.DeleteRows" @@ -151,8 +155,6 @@ </div> </div> - - <h2 class="mt-5 mb-4">Parametri treniranja:</h2> <div> @@ -160,11 +162,12 @@ <div class="col-1"> </div> <div class="col-3"> - <label for="type" class="col-form-label">Tip mreže: </label> + <label for="type" class="col-form-label">Tip problema: </label> </div> <div class="col-2"> <select id=typeOptions class="form-control" name="type" [(ngModel)]="newModel.type"> - <option *ngFor="let option of Object.keys(ANNType); let optionName of Object.values(ANNType)" + <option + *ngFor="let option of Object.keys(ProblemType); let optionName of Object.values(ProblemType)" [value]="option"> {{ optionName }} </option> @@ -177,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> @@ -259,52 +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: <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"> @@ -354,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> |