Dodata opcija da se istovremeno podešavaju parametri svih skrivenih slojeva.

3 files changed, 96 insertions, 10 deletions

diff --git a/frontend/src/app/_elements/form-model/form-model.component.css b/frontend/src/app/_elements/form-model/form-model.component.css
index b69b2dbb..5776085f 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.css
+++ b/frontend/src/app/_elements/form-model/form-model.component.css
@@ -21,7 +21,7 @@ mat-form-field {
 hr {
     color: var(--offwhite) !important;
     margin-bottom: 30px;
-    ;
+    
 }
 
 .neuron {
@@ -33,12 +33,10 @@ hr {
     background-color: var(--ns-bg-dark-100) !important;
     min-width: none;
     max-width: 12.5rem;
-}
 
-col-1 {
-    text-align: center;
 }
 
+
 .row {
     margin: 0;
     padding: 0;
@@ -70,11 +68,14 @@ col-1 {
     border: 1px solid var(--ns-primary);
     border-radius: 4px;
     margin: 5px;
-    padding: 3px;
+    padding: 0px;
     width: 12rem;
-    height: 13rem;
+    height: 13.5rem;
 }
 
 .layer>mat-form-field {
     margin-left: 0;
+}
+.m-2{
+    max-height: 20 rem;
 }
\ No newline at end of file
diff --git a/frontend/src/app/_elements/form-model/form-model.component.html b/frontend/src/app/_elements/form-model/form-model.component.html
index 4c5505f0..2a8d79a8 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.html
+++ b/frontend/src/app/_elements/form-model/form-model.component.html
@@ -92,7 +92,10 @@
 <hr>
 <div class="m-2">
     <app-graph [model]="newModel" [inputCols]="newModel.inputColNum"></app-graph>
-    <div id="layers-control">
+</div>
+<div class="ns-row">
+   
+    <div class ="ns-col" id="layers-control">
         <div>Broj Skrivenih Slojeva</div>
         <button class="btn-clear btn-icon" (click)="addLayer()">
             <mat-icon>add</mat-icon>
@@ -101,8 +104,55 @@
         <button class="btn-clear btn-icon" (click)="removeLayer()">
             <mat-icon>remove</mat-icon>
         </button>
+   
+    </div>
+    <div class="break-1"></div>
+    <div class="ns-col">
+        <mat-form-field appearance="fill">
+            <mat-label>Aktivaciona funkcija svih slojeva</mat-label>
+            
+            <mat-select  [(ngModel)]="selectedActivation" (selectionChange)="changeAllActivation()"  >
+                <mat-option *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)" [value]="option">
+                    {{ optionName }}
+                </mat-option>
+            </mat-select>
+        </mat-form-field>
     </div>
+   
+    <div class="ns-col">
+        <mat-form-field appearance="fill">
+            <mat-label>Broj Neurona svih slojeva</mat-label>
+            <input matInput type="number" [(ngModel)]="selectedNumberOfNeurons" (change)="changeAllNumberOfNeurons()">
+        </mat-form-field>
+    </div>
+    <div class="break-2"></div>
+    <div class="ns-col">
+        <mat-form-field appearance="fill">
+            <mat-label>Regularizacija svih slojeva</mat-label>
+            <mat-select [(ngModel)]="selectedRegularisation" (selectionChange)="changeAllRegularisation()">
+                <mat-option *ngFor="let option of Object.keys(Regularisation); let optionName of Object.values(Regularisation)" [value]="option">
+                    {{ optionName }}
+                </mat-option>
+            </mat-select>
+        </mat-form-field>
+    </div>
+    
+    <div class="ns-col">
+        <mat-form-field appearance="fill">
+            <mat-label>Stopa regularizacije svih slojeva</mat-label>
+            <mat-select [(ngModel)]="selectedRegularisationRate" (selectionChange)="changeAllRegularisationRate()">
+                <mat-option *ngFor="let option of Object.keys(RegularisationRate); let optionName of Object.values(RegularisationRate)" [value]="option">
+                    {{ optionName }}
+                </mat-option>
+            </mat-select>
+        </mat-form-field>
+        </div>
+
+
 </div>
+
+<!--kraj selectall**********************************************************************************-->
+<hr>
 <div id="layers">
 
     <div class="layer" *ngFor="let item of newModel.layers; let i=index">
@@ -124,7 +174,7 @@
             <button class="btn-clear btn-icon" (click)="addNeuron(i)">
                 <mat-icon>add</mat-icon>
             </button>
-            <div class="col-1">{{newModel.layers[i].neurons}}</div>
+            <div class="col-2 text-center" >{{newModel.layers[i].neurons}}</div>
             <button class="btn-clear btn-icon" (click)="removeNeuron(i)">
                 <mat-icon>remove</mat-icon>
             </button>
diff --git a/frontend/src/app/_elements/form-model/form-model.component.ts b/frontend/src/app/_elements/form-model/form-model.component.ts
index c29fd0bb..062c380e 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.ts
+++ b/frontend/src/app/_elements/form-model/form-model.component.ts
@@ -4,8 +4,7 @@ import Shared from 'src/app/Shared';
 import Experiment from 'src/app/_data/Experiment';
 import Model, { Layer, ActivationFunction, LossFunction, LearningRate, LossFunctionBinaryClassification, LossFunctionMultiClassification, LossFunctionRegression, Metrics, MetricsBinaryClassification, MetricsMultiClassification, MetricsRegression, NullValueOptions, Optimizer, ProblemType, Regularisation, RegularisationRate, BatchSize } from 'src/app/_data/Model';
 import { GraphComponent } from '../graph/graph.component';
-import { FormGroupDirective, NgForm } from '@angular/forms';
-import { ErrorStateMatcher } from '@angular/material/core';
+
 
 @Component({
   selector: 'app-form-model',
@@ -104,4 +103,40 @@ export class FormModelComponent implements AfterViewInit {
       this.updateGraph();
     }
   }
+  selectedActivation: ActivationFunction = ActivationFunction.Sigmoid;
+  selectedRegularisationRate: RegularisationRate = RegularisationRate.RR1;
+  selectedRegularisation: Regularisation = Regularisation.L1;
+  selectedNumberOfNeurons:number=1;
+
+  changeAllActivation(){
+    for(let i=0;i<this.newModel.layers.length;i++)
+    {
+      this.newModel.layers[i].activationFunction=this.selectedActivation;
+      
+    }
+    
+  }
+  changeAllRegularisation(){
+    for(let i=0;i<this.newModel.layers.length;i++)
+    {
+      this.newModel.layers[i].regularisation=this.selectedRegularisation;
+    }
+  }
+  changeAllRegularisationRate(){
+
+    for(let i=0;i<this.newModel.layers.length;i++)
+    {
+      this.newModel.layers[i].regularisationRate=this.selectedRegularisationRate;
+    }
+  }
+  changeAllNumberOfNeurons(){
+    for(let i=0;i<this.newModel.layers.length;i++)
+    {
+      this.newModel.layers[i].neurons=this.selectedNumberOfNeurons;
+      this.updateGraph();
+    }
+  }
+  
+   
+  
 }