IzmenaProfilaUpdate

SkuciSe/src/main/java/com/example/SkuciSe/controller/AppController.java

@@ -66,6 +66,7 @@ public class AppController
         model.addAttribute("editUser", loggedUser.getKorisnik());
         model.addAttribute("profileRole", kRepo.findRoleById( loggedUser.getKorisnik().getTipId()));
         model.addAttribute("grad", lRepo.findById( loggedUser.getKorisnik().getGradId()));
+        model.addAttribute("lokacije", lRepo.findAll());
         return("profile");
     }
 

SkuciSe/src/main/resources/static/css/style.css

@@ -279,6 +279,7 @@ h3{
 .container {
     max-width: 1000px;
     padding: 0;
+    height: 600px;
 }
 
 p {
@@ -358,4 +359,23 @@ img {
     font-size: 12px;
     width: 50%;
     text-align: center;
+}
+/*the fade animations*/
+
+@keyframes fade-out {
+    from {
+        opacity: 100%;
+    }
+    to {
+        opacity: 0%;
+    }
+}
+
+@keyframes fade-in {
+    from {
+        opacity: 0%;
+    }
+    to {
+        opacity: 100%;
+    }
 }
\ No newline at end of file

SkuciSe/src/main/resources/static/js/main.js

@@ -26,4 +26,28 @@ function proveraLogin(){
     {
         document.getElementById("losaSifra").style.display = "none";
     }
+}
+//toggle var
+var fade_state = true;
+//on btn click
+function fade() {
+    //get the button and div
+    let div = document.getElementById("fadeDiv");
+    let btn = document.getElementById("fade");
+    //if faded in or out
+    if (fade_state == true) {
+        //trigers animation
+        div.style.animation = "fade-out 2s forwards";
+        //sets the text
+        btn.innerHTML = "fade-in";
+        //sets fade_state
+        fade_state = false;
+    } else if (fade_state == false) {
+        //trigers animation
+        div.style.animation = "fade-in 2s forwards";
+        //sets the text
+        btn.innerHTML = "fade-out";
+        //sets fade_state
+        fade_state = true;
+    }
 }
\ No newline at end of file

SkuciSe/src/main/resources/templates/register.html

@@ -71,10 +71,14 @@
                             <div class="invalid-feedback">Email ne sme biti prazan!</div>
                         </div>
 
-                        <select th:field="${newUser.gradId}">
-                            <option th:each="lokacija: ${lokacije}" th:value="${lokacija.getLokacijaId()}" th:text="${lokacija.getNaziv()}">
-                            </option>
-                        </select>
+
+                        div class="col-md-12">
+                            <select th:field="${newUser.gradId}">
+                                <option th:each="lokacija: ${lokacije}" th:value="${lokacija.getLokacijaId()}" th:text="${lokacija.getNaziv()}">
+                                </option>
+                            </select>
+                            <div class="valid-feedback">Dobar grad!</div>
+                        </div>
 
                         <div class="col-md-12">
                             <input th:field="${newUser.sifra}" class="form-control" type="password" name="password" placeholder="Sifra" required>