kommentarer, ryddet i koden
authorRoza Moustafa <roza.92m@hotmail.com>
Thu, 10 Dec 2015 15:17:50 +0000 (16:17 +0100)
committerRoza Moustafa <roza.92m@hotmail.com>
Thu, 10 Dec 2015 15:17:50 +0000 (16:17 +0100)
src/components/search/search.html
src/components/search/search.ts
src/css/map.css

index d8505db..10104a5 100644 (file)
@@ -1,8 +1,9 @@
 <div id="search">
 
+    <!-- Search bar -->
     <label class="sr-only" for="livesearch">Search</label>
 
-    <form id="myForm">
+    <form id="searchform">
         <div class="row">
             <input
                     mou-live-search
                     name="livesearch"
                     id="livesearch"
                     placeholder="Search"
-                    onblur= "this.placeholder = 'Search'"
+                    onblur="this.placeholder = 'Search'"
                     onfocus="this.placeholder = ''"
                     value=""/>
 
-            <button type="button" class="knapp col-md-2" (click)="toggle()"
+            <!--Show and empty filtermenu-->
+            <button type="button" class="filterbutton col-md-2" (click)="toggle()"
                     data-toggle="collapse" data-target="#dropdown-menu">
                 {{ visible ? '&xdtri;' : '&cross;' }}
             </button>
         <span [hidden]="hideDiv()">
             <div class="divresult col-md-10" id="divresult" [hidden]="checkOrgunits()">
                 <ul class="dropdown-menu result">
-                    <li><button type="button" class="btn btn-default emptyresult" (click)="emptyByClick()">
-                        <span class="glyphicon glyphicon-remove"></span></button></li>
+                    <li>
+                        <!--exit results-->
+                        <button type="button" class="btn btn-default emptyresult" (click)="emptyByClick()">
+                            <span class="glyphicon glyphicon-remove"></span></button>
+                    </li>
                     <li *ng-for="#orgunit of filteredOrgunits" id="orglist" (click)="getMoreInfo(orgunit)">
                         <a id="left-menu" href="#">{{orgunit.name}}</a>
                     </li>
                     <li *ng-if="filteredOrgunits.length == 0">
-                        <p class="nomatch">  No matching results </p>
+                        <p class="nomatch"> No matching results </p>
                     </li>
                 </ul>
             </div>
 
         <!-- Filter selectors to be filled inn by getUnitGroupSets() -->
         <div id="dropdowndiv" class="btn-group collapse col-md-2">
-            <ul id="dropdown-menu" role="menu" class="dropdown-menu meny">
+            <ul id="dropdown-menu" role="menu" class="dropdown-menu filtermenu">
                 <li>Facility</li>
                 <li class="dropdown-header">Ownership</li>
                 <li>
-                    <select class="form-control filtervalg" id="ownershipSelector" (click)="setFilter()"></select>
+                    <select class="form-control filteroption" id="ownershipSelector" (click)="setFilter()"></select>
                 </li>
                 <li class="dropdown-header">Type</li>
                 <li>
-                    <select class="form-control filtervalg" id="typeSelector" (click)="setFilter()"></select>
+                    <select class="form-control filteroption" id="typeSelector" (click)="setFilter()"></select>
                 </li>
                 <li class="divider"></li>
                 <li>Location</li>
                 <li class="dropdown-header">Rural/Urban</li>
                 <li>
-                    <select class="form-control filtervalg" id="locationSelector" (click)="setFilter()"></select>
+                    <select class="form-control filteroption" id="locationSelector" (click)="setFilter()"></select>
                 </li>
             </ul>
         </div>
index 6b084d7..5186d9c 100644 (file)
@@ -43,7 +43,7 @@ export class Search {
 
     }
 
-    //pil opp og ned
+    //When filtermenu is open show x else show arraowdown
     toggle() {
         this.visible = !this.visible;
         if (this.visible) {
@@ -58,15 +58,17 @@ export class Search {
         this.checkOrgunits();
     }
 
+    //Hide results when search bar input is erased
     hideDiv() {
         if (this.searchBar.value == "")
             return true;
 
     }
 
+    //Click out results and empty the search bar
     emptyByClick(){
         this.orgunits = [];
-        return document.getElementById("myForm").reset();
+        return document.getElementById("searchform").reset();
     }
 
     //Gets all unit group sets (category groups) and the unit groups
index d011d85..5403b3d 100644 (file)
@@ -28,7 +28,7 @@ html, body {
     max-width: 100%;
 }
 
-/* search input*/
+/* search bar and filter button */
 
 #livesearch{
     box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.3);
@@ -63,7 +63,7 @@ html, body {
     background: white;
 }
 
-.knapp
+.filterbutton
 {
     border-radius: 0px 2px 2px 0px; /* top left, top right, bottom right, bottom left */
     box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.3);
@@ -81,12 +81,16 @@ html, body {
     float: left;
 }
 
-.knapp:focus {
+.filterbutton:focus {
     outline:0;
 }
 
 /* search results */
 
+.nomatch{
+    margin-left: 20px;
+    font-size: 14px;
+}
 
 .divresult{
     padding:0;
@@ -168,7 +172,7 @@ html, body {
     margin: 0;
 
 }
-.meny{
+.filtermenu{
     border: none;
     border-top: 2px solid darkgrey;
     box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
@@ -182,13 +186,13 @@ html, body {
     margin-left: 2px;
 }
 
-.meny li{
+.filtermenu li{
     background-color: white;
     padding-left: 20px;
     padding-right: 20px;
 }
 
-.filtervalg{
+.filteroption{
     box-shadow: 0 0 1px darkgrey;
     margin-top: 5px;
     margin-bottom: 5px;
@@ -204,7 +208,7 @@ html, body {
     transition: all 0.15s;
 }
 
-.filtervalg:focus{
+.filteroption:focus{
     outline: 0;
 }
 .bootstrap-select .btn:focus {
@@ -219,10 +223,6 @@ html, body {
     color: white;
 }
 
-.nomatch{
-    margin-left: 20px;
-}
-
 /* sidebar */
 
 .ng-valid.ng-dirty {