From 9d73bc044eaea6176556935a81db8e654476e6f1 Mon Sep 17 00:00:00 2001
From: Danijel Anđelković <adanijel99@gmail.com>
Date: Fri, 29 Apr 2022 00:44:09 +0200
Subject: Promenio liniju u grafu modela na bezier krivu, dodao ispis ulazne
 kolone / aktivacione funkcije sloja na hoveru preko cvora.

---
 .../_elements/form-model/form-model.component.html |  4 +-
 .../_elements/form-model/form-model.component.ts   | 44 ++++++++++------------
 2 files changed, 22 insertions(+), 26 deletions(-)

(limited to 'frontend/src/app/_elements/form-model')

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 f11b609d..d5187383 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.html
+++ b/frontend/src/app/_elements/form-model/form-model.component.html
@@ -90,7 +90,7 @@
 <!--kraj unosa parametara-->
 <hr>
 <div class="m-2">
-    <app-graph [model]="newModel" [inputCols]="newModel.inputColNum"></app-graph>
+    <app-graph [model]="newModel" [inputColumns]="forExperiment?.inputColumns"></app-graph>
 </div>
 <div class="ns-row">
 
@@ -121,7 +121,7 @@
     <div class="ns-col">
         <mat-form-field appearance="fill" class="mat-fix">
             <mat-label>Broj Neurona svih slojeva</mat-label>
-            <input matInput type="number" [(ngModel)]="selectedNumberOfNeurons" (change)="changeAllNumberOfNeurons()">
+            <input matInput type="number" min="1" max="18" [(ngModel)]="selectedNumberOfNeurons" (change)="changeAllNumberOfNeurons()">
         </mat-form-field>
     </div>
     <div class="break-2"></div>
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 062c380e..e58d1764 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.ts
+++ b/frontend/src/app/_elements/form-model/form-model.component.ts
@@ -60,7 +60,7 @@ export class FormModelComponent implements AfterViewInit {
   showMyModels: boolean = true;
 
   updateGraph() {
-    console.log(this.newModel.layers);
+    //console.log(this.newModel.layers);
     this.graph.update();
   }
 
@@ -73,7 +73,7 @@ export class FormModelComponent implements AfterViewInit {
   }
   addLayer() {
     if (this.newModel.hiddenLayers < 128) {
-      this.newModel.layers.push(new Layer(this.newModel.layers.length));
+      this.newModel.layers.push(new Layer(this.newModel.layers.length, this.selectedActivation, this.selectedNumberOfNeurons, this.selectedRegularisation, this.selectedRegularisationRate));
 
       this.newModel.hiddenLayers += 1;
       this.updateGraph();
@@ -106,37 +106,33 @@ export class FormModelComponent implements AfterViewInit {
   selectedActivation: ActivationFunction = ActivationFunction.Sigmoid;
   selectedRegularisationRate: RegularisationRate = RegularisationRate.RR1;
   selectedRegularisation: Regularisation = Regularisation.L1;
-  selectedNumberOfNeurons:number=1;
+  selectedNumberOfNeurons: number = 3;
+
+  changeAllActivation() {
+    for (let i = 0; i < this.newModel.layers.length; i++) {
+      this.newModel.layers[i].activationFunction = this.selectedActivation;
 
-  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;
+  changeAllRegularisation() {
+    for (let i = 0; i < this.newModel.layers.length; i++) {
+      this.newModel.layers[i].regularisation = this.selectedRegularisation;
     }
   }
-  changeAllRegularisationRate(){
+  changeAllRegularisationRate() {
 
-    for(let i=0;i<this.newModel.layers.length;i++)
-    {
-      this.newModel.layers[i].regularisationRate=this.selectedRegularisationRate;
+    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;
+  changeAllNumberOfNeurons() {
+    for (let i = 0; i < this.newModel.layers.length; i++) {
+      this.newModel.layers[i].neurons = this.selectedNumberOfNeurons;
       this.updateGraph();
     }
   }
-  
-   
-  
+
+
+
 }
-- 
cgit v1.2.3


From 6cfa4e691fd176c4d7fa67b67307d86bddfd7eeb Mon Sep 17 00:00:00 2001
From: Danijel Anđelković <adanijel99@gmail.com>
Date: Fri, 29 Apr 2022 00:54:55 +0200
Subject: Dodao responzivnost na dugmice za dodavanje i brisanje slojeva i
 neurona, ispravio BUG gde je bilo moguce dodati vise neurona za individualni
 sloj nego za sve slojeve.

---
 .../src/app/_elements/form-model/form-model.component.html     | 10 +++++-----
 frontend/src/app/_elements/form-model/form-model.component.ts  |  2 +-
 frontend/src/styles/theme.css                                  |  4 ++--
 3 files changed, 8 insertions(+), 8 deletions(-)

(limited to 'frontend/src/app/_elements/form-model')

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 d5187383..76601465 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.html
+++ b/frontend/src/app/_elements/form-model/form-model.component.html
@@ -96,11 +96,11 @@
 
     <div class="ns-col" id="layers-control">
         <div>Broj Skrivenih Slojeva</div>
-        <button class="btn-clear btn-icon" (click)="addLayer()">
+        <button class="btn-clear btn-icon bubble" (click)="addLayer()">
             <mat-icon>add</mat-icon>
         </button>
         <div>{{newModel.hiddenLayers}}</div>
-        <button class="btn-clear btn-icon" (click)="removeLayer()">
+        <button class="btn-clear btn-icon bubble" (click)="removeLayer()">
             <mat-icon>remove</mat-icon>
         </button>
 
@@ -120,7 +120,7 @@
 
     <div class="ns-col">
         <mat-form-field appearance="fill" class="mat-fix">
-            <mat-label>Broj Neurona svih slojeva</mat-label>
+            <mat-label>Broj neurona svih slojeva</mat-label>
             <input matInput type="number" min="1" max="18" [(ngModel)]="selectedNumberOfNeurons" (change)="changeAllNumberOfNeurons()">
         </mat-form-field>
     </div>
@@ -172,11 +172,11 @@
 
         <div class="d-flex flex-row align-items-center justify-content-center tm">
             <div class="col-6" style="font-size: 13px;">Broj čvorova</div>
-            <button class="btn-clear btn-icon" (click)="addNeuron(i)">
+            <button class="btn-clear btn-icon bubble" (click)="addNeuron(i)">
                 <mat-icon>add</mat-icon>
             </button>
             <div class="col-2 text-center">{{newModel.layers[i].neurons}}</div>
-            <button class="btn-clear btn-icon" (click)="removeNeuron(i)">
+            <button class="btn-clear btn-icon bubble" (click)="removeNeuron(i)">
                 <mat-icon>remove</mat-icon>
             </button>
         </div>
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 e58d1764..2c78cd56 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.ts
+++ b/frontend/src/app/_elements/form-model/form-model.component.ts
@@ -98,7 +98,7 @@ export class FormModelComponent implements AfterViewInit {
     }
   }
   addNeuron(index: number) {
-    if (this.newModel.layers[index].neurons < 100) {
+    if (this.newModel.layers[index].neurons < 18) {
       this.newModel.layers[index].neurons += 1;
       this.updateGraph();
     }
diff --git a/frontend/src/styles/theme.css b/frontend/src/styles/theme.css
index a76f4714..ee7a2e61 100644
--- a/frontend/src/styles/theme.css
+++ b/frontend/src/styles/theme.css
@@ -54,11 +54,11 @@ a {
 
 .bubble {
     background-position: center;
-    transition: background 0.8s;
+    transition: background 0.2s;
 }
 
 .bubble:hover {
-    background: #47a7f5 radial-gradient(circle, transparent 1%, #47a7f5 1%) center/15000%;
+    background: var(--ns-primary-50) radial-gradient(circle, transparent 1%, var(--ns-accent) 1%) center/15000%;
 }
 
 .bubble:active {
-- 
cgit v1.2.3