From 093c0d2eeefa6e1a55524727d301753412486284 Mon Sep 17 00:00:00 2001
From: Danijel Andjelkovic <adanijel99@gmail.com>
Date: Wed, 6 Apr 2022 21:06:06 +0200
Subject: Add model stranica zamenjena sa eksperiment stranicom.

---
 .../app/_pages/add-model/add-model.component.html  | 428 ---------------------
 1 file changed, 428 deletions(-)
 delete mode 100644 frontend/src/app/_pages/add-model/add-model.component.html

(limited to 'frontend/src/app/_pages/add-model/add-model.component.html')

diff --git a/frontend/src/app/_pages/add-model/add-model.component.html b/frontend/src/app/_pages/add-model/add-model.component.html
deleted file mode 100644
index 179e9aea..00000000
--- a/frontend/src/app/_pages/add-model/add-model.component.html
+++ /dev/null
@@ -1,428 +0,0 @@
-<!--<div id="header">
-    <h1>Napravite svoj model veštačke neuronske mreže</h1>
-</div>
-
-<div id="wrapper">
-    <div id="container" class="container p-5" style="background-color: white; min-height: 100%;">
-        <div class="form-group row mt-3 mb-2 d-flex justify-content-center">
-            <h2 class="col-2"> Nov model: </h2>
-            <div class="col-3">
-                <label for="name" class="col-form-label">Naziv modela:</label>
-                <input type="text" class="form-control" name="name" placeholder="Naziv..." [(ngModel)]="newModel.name">
-            </div>
-            <div class="col-5">
-                <label for="desc" class="col-sm-2 col-form-label">Opis:</label>
-                <div>
-                    <textarea class="form-control" name="desc" rows="3" [(ngModel)]="newModel.description"></textarea>
-                </div>
-            </div>
-            <div class="col-2">
-                <label for="dateCreated" class="col-form-label">Datum:</label> &nbsp;&nbsp;
-                <input type="text" class="form-control-plaintext" id="dateCreated" placeholder="--/--/--"
-                    value="{{newModel.dateCreated | date: 'dd/MM/yyyy'}}" readonly>
-            </div>
-        </div>
-
-        <div class="py-3 pr-5 justify-content-center">
-
-            <app-dataset-load (selectedDatasetChangeEvent)="datasetHasChanged($event)"></app-dataset-load>
-
-        </div>
-        <span id="selectInAndOuts"></span>
-        <div
-            *ngIf="selectedDataset && ((showMyDatasets && selectedDatasetLoaded) || (!showMyDatasets && datasetLoaded))">
-            <div class="row">
-                <div class="col d-flex justify-content-center">
-                    <h3>Izaberite ulazne kolone:</h3>
-                    <div id="divInputs" class="form-check mt-2">
-                        <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;
-                            <label class="form-check-label" for="cb_{{item}}">
-                                {{item}}
-                            </label>
-                        </div>
-                    </div>
-                </div>
-                <div class="col d-flex justify-content-left">
-                    <h3>Izaberite izlaznu kolonu:</h3>
-                    <div id="divOutputs" class="form-check mt-2">
-                        <br>
-                        <div *ngFor="let item of selectedDataset.header; let i = index">
-                            <input class="form-check-input" type="radio" value="{{item}}" id="rb_{{item}}" name="rbsNew"
-                                (change)="this.selectedOutputColumnVal = item">&nbsp;
-                            <label class="form-check-label" for="rb_{{item}}">
-                                {{item}}
-                            </label>
-                        </div>
-                    </div>
-                </div>
-
-
-                <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"
-                            class="form-check-input" value="deleteRows" name="fillMissing" id="delRows" checked
-                            data-bs-toggle="collapse" data-bs-target="#fillMissingCustom.show">
-                        <label for="delRows" class="form-check-label">Obriši sve
-                            redove sa nedostajućim vrednostima</label><br>
-                        <input type="radio" [(ngModel)]="newModel.nullValues" [value]="NullValueOptions.DeleteColumns"
-                            class="form-check-input" value="deleteCols" name="fillMissing" id="delCols"
-                            data-bs-toggle="collapse" data-bs-target="#fillMissingCustom.show">
-                        <label for="delCols" class="form-check-label">Obriši sve
-                            kolone sa nedostajućim vrednostima</label><br>
-                        <input type="radio" [(ngModel)]="newModel.nullValues" [value]="NullValueOptions.Replace"
-                            class="form-check-input" name="fillMissing" id="replace" data-bs-toggle="collapse"
-                            data-bs-target="#fillMissingCustom:not(.show)">
-                        <label for="replace" class="form-check-label">Izabraću
-                            vrednosti koje će da zamene nedostajuće vrednosti za svaku kolonu...</label><br><br>
-                        <div class="collapse" id="fillMissingCustom">
-                            <div>
-                                <label for="columnReplacers" class="form-label">Unesite zamenu za svaku kolonu:</label>
-                                <div id="columnReplacers">
-                                    <div *ngFor="let column of selectedDataset.header; let i = index" class="my-3">
-                                        <div *ngIf="getInputById('cb_'+column).checked" class="">
-                                            <span class="w-20 mx-3">
-                                                {{column}}&nbsp;<span class="small"
-                                                    style="color:gray;">({{calculateSumOfNullValuesInCol(column)}}
-                                                    null)</span>
-                                            </span>
-
-                                            <label *ngIf="calculateSumOfNullValuesInCol(column)==0"
-                                                class="text-center form-control mx-3 text-secondary">Ova kolona nema
-                                                nedostajućih
-                                                vrednosti.</label>
-
-                                            <div *ngIf="calculateSumOfNullValuesInCol(column)!=0"
-                                                class="d-flex flex-row justify-content-end">
-                                                <div class="flex-grow-3 mx-3 me-auto">
-                                                    <div class="input-group">
-                                                        <div class="input-group-prepend">
-                                                            <label [for]="'fillCol_'+column" class="form-control">
-                                                                Zameni
-                                                                <input type="radio" [id]="'fillCol_'+column"
-                                                                    [name]="'delOp_'+column">
-                                                            </label>
-                                                        </div>
-                                                        <input type="text" class="form-control"
-                                                            [id]="'fillText_'+column"
-                                                            (keyup)="checkFillColRadio(column)"
-                                                            placeholder="Unesi vrednost...">
-
-                                                        <div class="input-group-append">
-                                                            <select [id]="'replaceOptions'+i"
-                                                                class="form-control btn-primary"
-                                                                *ngIf="isNumber(datasetFile[1][i])"
-                                                                (change)="replaceWithSelectedNumber($event);">
-                                                                <option
-                                                                    *ngFor="let option of Object.keys(ReplaceWith); let optionName of Object.values(ReplaceWith)"
-                                                                    [value]="option">
-                                                                    {{ optionName }}
-                                                                </option>
-                                                            </select>
-                                                            <select [id]="'replaceOptions'+i"
-                                                                class="form-control btn-outline-primary"
-                                                                *ngIf="!isNumber(datasetFile[1][i]) && calculateSumOfNullValuesInCol(column)!=0"
-                                                                (change)="replaceWithSelectedString($event);">
-                                                                <option
-                                                                    *ngFor="let option of arrayColumn(datasetFile, i)"
-                                                                    [value]="option">
-                                                                    {{ option }}
-                                                                </option>
-                                                            </select>
-                                                        </div>
-                                                    </div>
-                                                </div>
-
-                                                <div class="flex-shrink-1 mx-3">
-                                                    <div class="input-group">
-                                                        <label class="form-control" [for]="'delCol_'+column">Izbriši
-                                                            kolonu
-                                                            <input type="radio" [id]="'delCol_'+column"
-                                                                [name]="'delOp_'+column"
-                                                                (change)="emptyFillTextInput(column)"></label>
-                                                    </div>
-                                                </div>
-
-                                                <div class="flex-shrink-1 mx-3">
-                                                    <div class="input-group">
-                                                        <label class="form-control" [for]="'delRows_'+column">Izbriši
-                                                            redove
-                                                            <input type="radio" [id]="'delRows_'+column"
-                                                                [name]="'delOp_'+column" checked
-                                                                (change)="emptyFillTextInput(column)"></label>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div *ngFor="let column of selectedDataset.header; let i = index" class="my-3">
-                                        <div class="input-group row" *ngIf="getInputById('rb_'+column).checked">
-                                            <span class="input-group-text col-2 text-center">
-                                                {{column}}&nbsp;<span class="small"
-                                                    style="color:gray;">({{calculateSumOfNullValuesInCol(column)}}
-                                                    null)</span>
-                                            </span>
-                                            <label *ngIf="calculateSumOfNullValuesInCol(column)==0"
-                                                class="form-control">Ova kolona nema nedostajućih vrednosti.</label>
-
-                                            <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="radio"
-                                                [id]="'fillCol_'+column" class="col-1 mt-2" [name]="'delOp_'+column">
-                                            <select [id]="'replaceOptions'+i" class="form-control col-2"
-                                                *ngIf="isNumber(datasetFile[1][i]) && calculateSumOfNullValuesInCol(column)!=0"
-                                                (change)="replaceWithSelectedNumber($event);">
-                                                <option
-                                                    *ngFor="let option of Object.keys(ReplaceWith); let optionName of Object.values(ReplaceWith)"
-                                                    [value]="option">
-                                                    {{ optionName }}
-                                                </option>
-                                            </select>
-                                            <select [id]="'replaceOptions'+i" class="form-control col-2"
-                                                *ngIf="!isNumber(datasetFile[1][i]) && calculateSumOfNullValuesInCol(column)!=0"
-                                                (change)="replaceWithSelectedString($event);">
-                                                <option *ngFor="let option of arrayColumn(datasetFile, i)"
-                                                    [value]="option">
-                                                    {{ option }}
-                                                </option>
-                                            </select>
-                                            <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="text"
-                                                class="form-control col-1" [id]="'fillText_'+column"
-                                                (keyup)="checkFillColRadio(column)" placeholder="Unesi vrednost...">
-
-                                            <label *ngIf="calculateSumOfNullValuesInCol(column)!=0"
-                                                class="form-control col-2" [for]="'delCol_'+column">Izbriši kolonu
-                                                <input type="radio" [id]="'delCol_'+column" [name]="'delOp_'+column"
-                                                    (change)="emptyFillTextInput(column)"></label>
-                                            <label *ngIf="calculateSumOfNullValuesInCol(column)!=0"
-                                                class="form-control col-2" [for]="'delRows_'+column">Izbriši redove
-                                                <input type="radio" [id]="'delRows_'+column" [name]="'delOp_'+column"
-                                                    (change)="emptyFillTextInput(column)" checked></label>
-                                        </div>
-                                    </div>
-
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <h2 class="mt-5 mb-4">Parametri treniranja:</h2>
-        <div>
-            <div class="row p-2">
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <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"
-                        (change)="filterOptions()">
-                        <option
-                            *ngFor="let option of Object.keys(ProblemType); let optionName of Object.values(ProblemType)"
-                            [value]="option">
-                            {{ optionName }}
-                        </option>
-                    </select>
-                </div>
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <label for="hiddenLayers" class="col-form-label">Broj skrivenih slojeva: </label>
-                </div>
-                <div class="col-1">
-                    <input type="number" min="1" class="form-control" name="hiddenLayers"
-                        [(ngModel)]="newModel.hiddenLayers"
-                        (change)="newModel.hiddenLayerActivationFunctions = [].constructor(newModel.hiddenLayers).fill(newModel.hiddenLayerActivationFunctions[0])">
-                </div>
-            </div>
-
-            <div class="row p-2">
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <label for="encoding" class="col-form-label">Enkoding: </label>
-                </div>
-                <div class="col-2">
-                    <select id=encodingOptions class="form-control" name="encoding" [(ngModel)]="newModel.encoding">
-                        <option *ngFor="let option of Object.keys(Encoding); let optionName of Object.values(Encoding)"
-                            [value]="option">
-                            {{ optionName }}
-                        </option>
-                    </select>
-                </div>
-
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <label for="hiddenLayerNeurons" class="col-form-label">Broj neurona skrivenih slojeva: </label>
-                </div>
-                <div class="col-1">
-                    <input type="number" min="1" class="form-control" name="hiddenLayerNeurons"
-                        [(ngModel)]="newModel.hiddenLayerNeurons">
-                </div>
-            </div>
-
-            <div class="row p-2">
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <label for="optimizer" class="col-form-label">Optimizacija: </label>
-                </div>
-                <div class="col-2">
-                    <select id=optimizerOptions class="form-control" name="optimizer" [(ngModel)]="newModel.optimizer">
-                        <option
-                            *ngFor="let option of Object.keys(Optimizer); let optionName of Object.values(Optimizer)"
-                            [value]="option">
-                            {{ optionName }}
-                        </option>
-                    </select>
-                </div>
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <label for="batchSize" class="col-form-label">Broj uzorka po iteraciji: </label>
-                </div>
-                <div class="col-1">
-                    <input type="number" min="1" class="form-control" name="batchSize" [(ngModel)]="newModel.batchSize">
-                </div>
-            </div>
-            <div class="row p-2">
-                <div class="col-1">
-                </div>
-                <div class="col-3">
-                    <label for="lossFunction" class="col-form-label">Funkcija obrade gubitka: </label>
-                </div>
-                <div class="col-2">
-                    <select id=lossFunctionOptions class="form-control" name="lossFunction"
-                        [(ngModel)]="newModel.lossFunction" aria-checked="true">
-                        <option
-                            *ngFor="let option of Object.keys(lossFunction); let optionName of Object.values(lossFunction)"
-                            [value]="option">
-                            {{ optionName }}
-                        </option>
-                    </select>
-                </div>
-                <div class="col-1"></div>
-                <div class="col-3 mt-2">
-                    <label for="type" class="form-check-label">Nasumičan redosled podataka?</label>
-                    <input class="mx-3 form-check-input" type="checkbox" [(ngModel)]="newModel.randomOrder"
-                        type="checkbox" value="" checked>
-                </div>
-            </div>
-            <div class="border m-3">
-                <div class="row p-2 m-2">
-                    <div class="col-4">
-                        <label for="splitYesNo" class="form-check-label">
-                            <h3>Podela test skupa:&nbsp;&nbsp;
-                                <input id="splitYesNo" class="form-check-input" type="checkbox"
-                                    [checked]="newModel.randomTestSet"
-                                    (change)="newModel.randomTestSet = !newModel.randomTestSet">
-                            </h3>
-                        </label>
-                    </div>
-                    <div class="col-8">
-                        trening
-                        <mat-slider style="width: 85%;" min="10" max="90" step="10" value="10"
-                            name="randomTestSetDistribution" thumbLabel [disabled]="!newModel.randomTestSet"
-                            [(ngModel)]="tempTestSetDistribution">
-                        </mat-slider>
-                        test
-                    </div>
-                </div>
-
-                <div class="row p-2 mx-2">
-                    <div class="col-4">
-                        <label for="percentage" class="form-label">Procenat podataka koji se uzima za trening
-                            skup:</label>
-                    </div>
-                    <div class="col-2">
-                        <input id="percentage" type="number" class="form-control" min="10" max="90" step="10" value="90"
-                            [(ngModel)]="tempTestSetDistribution" [disabled]="!newModel.randomTestSet">
-                    </div>
-                </div>
-            </div>
-            <h3>Aktivacione funkcije:</h3>
-
-            <div class="row p-2 m-2" style="align-self: center;">
-                <div class="col-3">
-                    <label for="hiddenLayerActivationFunction" class="col-form-label"
-                        style="text-align: center;">Funkcija aktivacije skrivenih
-                        slojeva:</label>
-                </div>
-                <div class="col-3">
-                    <div *ngFor="let item of [].constructor(newModel.hiddenLayers); let i = index">
-                        <div class="input-group mb-2">
-                            <div class="input-group-prepend">
-                                <span class="input-group-text">#{{i+1}}</span>
-                            </div>
-                            <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>
-                <div class="col-3">
-                    <label for="outputLayerActivationFunction" class="col-form-label"
-                        style="text-align: center;">Funkcija aktivacije izlaznog
-                        sloja:</label>
-                </div>
-                <div class="col-3">
-                    <select id=outputLayerActivationFunctionOptions class="form-control"
-                        name="outputLayerActivationFunction" [(ngModel)]="newModel.outputLayerActivationFunction">
-                        <option
-                            *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)"
-                            [value]="option">
-                            {{ optionName }}
-                        </option>
-                    </select>
-                </div>
-                <div class="col">
-                </div>
-            </div>
-        </div>
-        <br><br>
-        <hr>
-        <div class="form-check form-check-inline overflow-auto " style="width: max-content;">
-            <h3>Izaberite metrike:</h3>
-            <div id="divMetricsinput">
-
-                <div *ngFor="let option of Object.keys(metrics); let optionName of Object.values(metrics) "
-                    class="form-check form-check-inline">
-
-                    <input name="cbmetrics" class="form-check-input" type="checkbox" value="{{option}}"
-                        id="metrics_{{option}}" style="float: left;">
-                    <label class="form-check-label" for="metrics_{{option}}" for="inlineCheckbox2">
-                        {{optionName}}
-                    </label>
-                </div>
-            </div>
-        </div>
-        <div class="form-group row mt-5 mb-3">
-            <div class="col"></div>
-            <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" style="background-color:#003459; color:white;"
-                (click)="trainModel();">Treniraj model</button>
-            <div class="col"></div>
-        </div>
-
-        <div class="m-3" *ngIf="trainingResult">
-            <h2>Rezultati treniranja</h2>
-            <p>
-                {{trainingResult}}
-            </p>
-        </div>
-    </div>
-</div>
--->
\ No newline at end of file
-- 
cgit v1.2.3