utfpr-gp · PabloC5 · Jun 1, 2023 · Jun 1, 2023 · Jun 2, 2023 · Jun 2, 2023
diff --git a/src/main/java/br/edu/utfpr/servicebook/controller/IndexController.java b/src/main/java/br/edu/utfpr/servicebook/controller/IndexController.java
@@ -49,7 +49,6 @@ public ModelAndView showIndexPage() {
 
         List<City> cities = cityService.findAll();
         mv.addObject("cities", cities);
-
         return mv;
     }
 

diff --git a/src/main/resources/data.sql b/src/main/resources/data.sql
@@ -30,7 +30,7 @@ VALUES ('Acre', 'AC'),
 
 
 INSERT INTO cities (image, name, state_id)
-VALUES ('https://i.imgur.com/qMKc4rf.png', 'Guarapuava', '16');
+VALUES ('https://i.imgur.com/qMKc4rf.png', 'Guarapuava', '16'), ('https://www.viajeparana.com/sites/viaje-parana/arquivos_restritos/files/imagem/2019-04/igreja_nossa_senhora_da_gloria_ca.jpg', 'Pitanga', '16');
 
 
 

diff --git a/src/main/webapp/WEB-INF/tags/banner.tag b/src/main/webapp/WEB-INF/tags/banner.tag
@@ -13,7 +13,10 @@
 
                         <select id="select-city" class="white-text select-city">
                             <c:forEach var="city" items="${cities}">
-                                <option value="${city.image}">${city.name} - ${city.state.uf}</option>
+<%--                                <c:if test="${city.image}">--%>
+<%--                                </c:if>--%>
+<%--                                <option class="cityOption" selected=savedCity(${city.image}) value="${city.image}">${city.name} - ${city.state.uf}</option>--%>
+                                <option class="cityOption" value="${city.image}">${city.name} - ${city.state.uf}</option>
                             </c:forEach>
                         </select>
                     </div>

diff --git a/src/main/webapp/WEB-INF/tags/template.tag b/src/main/webapp/WEB-INF/tags/template.tag
@@ -20,6 +20,7 @@
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
     <link href="assets/libraries/materialize/css/materialize.min.css" type="text/css" rel="stylesheet" media="screen,projection"/>
     <link href="assets/resources/styles/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
+    <link href="assets/resources/styles/style-banner-hidden.css" type="text/css" rel="stylesheet" media="screen,projection"/>
 </head>
 
 <body>
@@ -82,6 +83,7 @@
 <script src="assets/resources/scripts/main.js"></script>
 <script src="assets/resources/scripts/init.js"></script>
 <script src="assets/resources/scripts/sse.js"></script>
+<script src="assets/resources/scripts/banner-hidden.js"></script>
 <!--script src="assets/resources/scripts/expertise-sidepanel-ajax.js"></script!-->
 <script type="text/javascript">
     function rolar(objID) {

diff --git a/src/main/webapp/WEB-INF/view/visitor/index.jsp b/src/main/webapp/WEB-INF/view/visitor/index.jsp
@@ -5,17 +5,24 @@
 <t:template title="Servicebook - Início">
     <jsp:body>
         <main>
-        <t:banner cities="${cities}"></t:banner>
-
-        <t:search-bar></t:search-bar>
-
-        <div id="panel-heading" class="container">
-            <div class="row">
-                <div class="col s12">
-
+            <div id="panel-heading">
+                <div class="row">
+                    <div class="col s12" id="painel">
+                        <div class="city-name">
+                            <div class="container cityNameContent">
+                                <span id="select-city-name"></span>
+                                <a id="toggle-city-id">ALTERAR A CIDADE</a>
+                            </div>
+                        </div>
+                        <div id="city-panel">
+                            <t:banner cities="${cities}"></t:banner>
+                        </div>
+                    </div>
                 </div>
             </div>
-        </div>
+            <t:search-bar></t:search-bar>
         </main>
     </jsp:body>
 </t:template>
+
+<script></script>
diff --git a/src/main/webapp/assets/resources/scripts/banner-hidden.js b/src/main/webapp/assets/resources/scripts/banner-hidden.js
@@ -0,0 +1,19 @@
+
+$(document).ready(function(){
+    $("#select-city option[value='" + localStorage.getItem('selectCityOption') + "']").attr("selected", "selected")
+    $("#select-city-name").text($("#select-city option[value ='" + localStorage.getItem("selectCityOption") +"']").text().trim());
+    $("#toggle-city-id").click(function(e){
+        e.preventDefault();
+        $("#city-panel").slideToggle(350);
+    });
+
+    $("#select-city").change(function () {
+        let selectCityOption = $('#select-city').val();
+        let selectCity = $("#select-city option[value ='" + this.value +"']").text().trim();
+        console.log(selectCityOption)
+        localStorage.setItem("selectCityOption", selectCityOption);
+        $("#select-city option[value='" + localStorage.getItem('selectCityOption') + "']").attr("selected", "selected")
+        $("#select-city-name").text(selectCity);
+
+    });
+});
diff --git a/src/main/webapp/assets/resources/styles/style-banner-hidden.css b/src/main/webapp/assets/resources/styles/style-banner-hidden.css
@@ -0,0 +1,29 @@
+.city-name {
+    width: 100%;
+    padding: 10px;
+    background-color: #f5f5f5;
+    color: #0d47a1;
+}
+
+.cityNameContent {
+    display: flex;
+    justify-content: start;
+}
+.expanded {
+    transform: rotate(180deg);
+}
+
+#painel {
+    padding: 0;
+}
+
+#toggle-city-id {
+    cursor: pointer;
+    margin-left: 1.2em;
+}
+
+@media screen and (max-width: 600px) {
+    .cityNameContent {
+        justify-content: space-between;
+    }
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -49,7 +49,6 @@ public ModelAndView showIndexPage() { @@
             List<City> cities = cityService.findAll();
             mv.addObject("cities", cities);
             return mv;
         }
@@ Expand Down @@
Original file line number	Diff line number	Diff line change
Expand Up		@@ -30,7 +30,7 @@ VALUES ('Acre', 'AC'),


		INSERT INTO cities (image, name, state_id)
		VALUES ('https://i.imgur.com/qMKc4rf.png', 'Guarapuava', '16');
		VALUES ('https://i.imgur.com/qMKc4rf.png', 'Guarapuava', '16'), ('https://www.viajeparana.com/sites/viaje-parana/arquivos_restritos/files/imagem/2019-04/igreja_nossa_senhora_da_gloria_ca.jpg', 'Pitanga', '16');



Expand Down