Browse Source

Add loader

Alessia 2 years ago
parent
commit
84ab83760c
3 changed files with 33 additions and 4 deletions
  1. 24 1
      site2/css/mystyle.css
  2. 1 2
      site2/index.html
  3. 8 1
      site2/js/ricerca.js

+ 24 - 1
site2/css/mystyle.css

@@ -58,6 +58,29 @@
   font-weight: bold;
 }
 
+ /*Loader*/
+ .loader {
+  border: 16px solid #f3f3f3;
+  border-radius: 50%;
+  border-top: 16px solid #3498db;
+  width: 120px;
+  height: 120px;
+  -webkit-animation: spin 2s linear infinite; /* Safari */
+  animation: spin 2s linear infinite;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+/* Safari */
+@-webkit-keyframes spin {
+  0% { -webkit-transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(360deg); }
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
 
 
 /* The container must be positioned relative: */
@@ -118,4 +141,4 @@
   
   .select-items div:hover, .same-as-selected {
     background-color: rgba(0, 0, 0, 0.1);
-  }
+  }

+ 1 - 2
site2/index.html

@@ -153,8 +153,7 @@
 
    </div>
 
-
-
+   <div id="loader" class="loader" style="display:none;"></div>
 
    <script src="vendor/jquery/jquery.min.js"></script>
 

+ 8 - 1
site2/js/ricerca.js

@@ -50,6 +50,7 @@ let arrayResponse = [];
 // Separate function to handle response data -- could be moved to different file (a service)
 function processData(response){
     console.log(response);
+    $("#loader").css("display", "none");
     if(response.length==0){
         alert('No results!')
     }
@@ -68,6 +69,7 @@ function processData(response){
 
 function processOccData(response){
   console.log(response);
+  $("#loader").css("display", "none");
   if(response.length==0){
       alert('No results!')
   }
@@ -98,6 +100,7 @@ let queryDTO = {};
 
 function funzioneRicerca(){
   $("#result").html("");
+  $("#loader").css("display", "block");
   let collection_elementoDaRicercare = document.getElementsByClassName("barraDiRicerca");
   var collection_types = document.getElementsByClassName("flViewBy");
   var collection_lenght = collection_elementoDaRicercare.length;
@@ -143,6 +146,9 @@ function funzioneRicerca(){
     else if ((check_tipo == "forma") && (formeLemmi == 1)) {
       tipo = "formaLemma";
     }
+    else if ((check_tipo == "lemma") && (noLemma == 1)) {
+      tipo = "soloLemmatizzate";
+    }
     else if ((check_tipo == "lemma") && (formeLemmi == 0)) {
       tipo = "lemma";
     }
@@ -150,7 +156,7 @@ function funzioneRicerca(){
       tipo = "lemmaForma";
     }
 
-    queryList.push( {"stringa": word, "espansa": espansa, "raddoppiata": raddoppiata, "tipo": tipo, "noLemma": noLemma} );
+    queryList.push( {"stringa": word, "espansa": espansa, "raddoppiata": raddoppiata, "tipo": tipo} );
     //$("#params").append("I tuoi parametri: " + word + "; " + tipo + "; " + espansa + "; " + raddoppiata + "; " + formeLemmi);
   
   }
@@ -676,6 +682,7 @@ $(document).on("change", ".flViewBy", function (ev) {
   
   if (check_tipo == "forma") {
     cc[0].disabled = true;
+    cc[0].checked = false;
   } 
   else if (check_tipo == "lemma"){
     cc[0].disabled = false;