From 6aeb963fa64af9dc0ddf2f9aeaf1903a7db26afc Mon Sep 17 00:00:00 2001
From: Danijel Andjelkovic <adanijel99@gmail.com>
Date: Sun, 13 Mar 2022 20:57:27 +0100
Subject: Dodata naslovna strana i navigacioni meni, kao i neke dodatne
 komponente i modeli podataka (lista elemenata, element-dataset,
 element-prediktor).

---
 .../app/_pages/add-model/add-model.component.html  |  7 ++--
 frontend/src/app/_pages/home/home.component.css    |  0
 frontend/src/app/_pages/home/home.component.html   | 49 ++++++++++++++++++++++
 .../src/app/_pages/home/home.component.spec.ts     | 25 +++++++++++
 frontend/src/app/_pages/home/home.component.ts     | 26 ++++++++++++
 .../app/_pages/login-page/login-page.component.ts  |  4 +-
 6 files changed, 106 insertions(+), 5 deletions(-)
 create mode 100644 frontend/src/app/_pages/home/home.component.css
 create mode 100644 frontend/src/app/_pages/home/home.component.html
 create mode 100644 frontend/src/app/_pages/home/home.component.spec.ts
 create mode 100644 frontend/src/app/_pages/home/home.component.ts

(limited to 'frontend/src/app/_pages')

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 bc292bb9..08e27dd7 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.html
+++ b/frontend/src/app/_pages/add-model/add-model.component.html
@@ -42,15 +42,16 @@
 
     <div class="form-group row my-2">
         <div class="col-sm-2 col-form-label">
-            <label for="type" class="form-check-label">Podela test skupa:
+            <label for="type" class="form-check-label">Automatska podela test skupa:
                 <input class="mx-3 form-check-input" type="checkbox" [checked]="newModel.randomTestSet"
                     (change)="newModel.randomTestSet = !newModel.randomTestSet">
             </label>
 
         </div>
         <div>
-            <input type="range" min="0.1" max="0.9" step="0.1" class="form-control" name="randomTestSetDistribution"
-                [disabled]="!newModel.randomTestSet" [(ngModel)]="newModel.randomTestSetDistribution">
+            <mat-slider min="0.1" max="0.9" step="0.1" value="0.2" name="randomTestSetDistribution" thumbLabel
+                class="w-50" [disabled]="!newModel.randomTestSet" [(ngModel)]="newModel.randomTestSetDistribution">
+            </mat-slider>
         </div>
     </div>
 
diff --git a/frontend/src/app/_pages/home/home.component.css b/frontend/src/app/_pages/home/home.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/home/home.component.html b/frontend/src/app/_pages/home/home.component.html
new file mode 100644
index 00000000..568e89e3
--- /dev/null
+++ b/frontend/src/app/_pages/home/home.component.html
@@ -0,0 +1,49 @@
+<div>
+    <div class="d-flex flex-column align-items-center">
+        <h2 class="my-4">Započnite sa treniranjem!</h2>
+        <div id="cards" class="d-flex flex-row justify-content-center align-items-start">
+            <div class="card" style="width: 18rem;">
+                <div class="card-body">
+                    <mat-icon width="48px" height="48px"
+                        style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">storage</mat-icon>
+                    <h3 class="card-title my-2">Moji izvori podataka</h3>
+                    <p class="card-text">
+                        <a class="stretched-link" routerLink="my-datasets">Preuredite</a> vaše izvore
+                        podataka, ili
+                        dodajte novi.
+                    </p>
+                </div>
+            </div>
+            <div class="card mx-3" style="width: 18rem;">
+                <div class="card-body">
+                    <mat-icon width="48px" height="48px"
+                        style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">model_training
+                    </mat-icon>
+                    <h3 class="card-title my-2">Moji modeli</h3>
+                    <p class="card-text">
+                        <a class="stretched-link" routerLink="my-models">Pregledajte</a> vaše modele, menjajte ih,
+                        napravite nove modele, ili
+                        ih obrišite.
+                    </p>
+                </div>
+            </div>
+            <div class="card" style="width: 18rem;">
+                <div class="card-body">
+                    <mat-icon width="48px" height="48px"
+                        style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">batch_prediction
+                    </mat-icon>
+                    <h3 class="card-title my-2">Rezultati treniranja</h3>
+                    <p class="card-text">
+                        <a class="stretched-link" routerLink="my-predictors">Pregledajte</a> sve vaše trenirane modele,
+                        koristite ih da
+                        predvidite
+                        vrednosti za red ili skup podataka, ili ih obrišite.
+                    </p>
+                </div>
+            </div>
+        </div>
+        <h2 class="my-4">Pogledajte javne projekte!</h2>
+        <app-carousel [items]="publicDatasets">
+        </app-carousel>
+    </div>
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/_pages/home/home.component.spec.ts b/frontend/src/app/_pages/home/home.component.spec.ts
new file mode 100644
index 00000000..2c5a1726
--- /dev/null
+++ b/frontend/src/app/_pages/home/home.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HomeComponent } from './home.component';
+
+describe('HomeComponent', () => {
+  let component: HomeComponent;
+  let fixture: ComponentFixture<HomeComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ HomeComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(HomeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/home/home.component.ts b/frontend/src/app/_pages/home/home.component.ts
new file mode 100644
index 00000000..0c61ef86
--- /dev/null
+++ b/frontend/src/app/_pages/home/home.component.ts
@@ -0,0 +1,26 @@
+import { Component, OnInit } from '@angular/core';
+import Dataset from 'src/app/_data/Dataset';
+import Predictor from 'src/app/_data/Predictor';
+import { ItemDatasetComponent } from 'src/app/_elements/item-dataset/item-dataset.component';
+
+@Component({
+  selector: 'app-home',
+  templateUrl: './home.component.html',
+  styleUrls: ['./home.component.css']
+})
+export class HomeComponent implements OnInit {
+
+  publicDatasets: Dataset[];
+
+  constructor() {
+    this.publicDatasets = [
+      new Dataset('Dataset1', 'Lorem ipsum dolor sir amet', ['kolona1', 'kolona2', 'kolona3']),
+      new Dataset('Drugi Dataset', 'Lorem ipsum dolor sir amet', ['jabuka', 'kruska', 'jagoda']),
+      new Dataset('Dataset III', 'Kratak opis izvora podataka', ['c1', 'c2', 'c3', 'c4', 'c5']),
+    ]
+  }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/login-page/login-page.component.ts b/frontend/src/app/_pages/login-page/login-page.component.ts
index e5366283..26d2547e 100644
--- a/frontend/src/app/_pages/login-page/login-page.component.ts
+++ b/frontend/src/app/_pages/login-page/login-page.component.ts
@@ -13,9 +13,9 @@ declare var window: any;
   selector: 'app-login-page',
   templateUrl: './login-page.component.html',
   styleUrls: ['./login-page.component.css'],
-  
+
 })
-export class LoginPageComponent{
+export class LoginPageComponent {
 
   modalRef?: MDBModalRef;
 
-- 
cgit v1.2.3