From 958e6cac61bc58403f32815b169b157faa9e3ebb Mon Sep 17 00:00:00 2001
From: Rizky Maulana Nugraha <lana.pcfre@gmail.com>
Date: Tue, 7 Feb 2017 02:12:27 +0700
Subject: [PATCH] issue about showing latest flood in map:

- show latest flood as default. inasafe/inasafe-realtime#42
- add stroke color for hazard style. inasafe/inasafe-realtime#48
---
 .../static/realtime/js/flood/flood.js         | 28 +++++++++++++++----
 .../templates/realtime/flood/index.html       |  6 ++++
 2 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/django_project/realtime/static/realtime/js/flood/flood.js b/django_project/realtime/static/realtime/js/flood/flood.js
index 0a18349a..654c32dc 100644
--- a/django_project/realtime/static/realtime/js/flood/flood.js
+++ b/django_project/realtime/static/realtime/js/flood/flood.js
@@ -91,22 +91,30 @@ function createShowFeaturesHandler(event_features_url){
                 }
                 var style_classes = {
                     1: {
-                        color: "#bdc5f7",
+                        stroke: true,
+                        color: "#000",
+                        weight: 2,
                         fillColor: "#bdc5f7",
                         fillOpacity: 0.8
                     },
                     2: {
-                        color: "#fffe73",
+                        stroke: true,
+                        color: "#000",
+                        weight: 2,
                         fillColor: "#fffe73",
                         fillOpacity: 0.8
                     },
                     3: {
-                        color: "#fea865",
+                        stroke: true,
+                        color: "#000",
+                        weight: 2,
                         fillColor: "#fea865",
                         fillOpacity: 0.8
                     },
                     4: {
-                        color: "#da6c7b",
+                        stroke: true,
+                        color: "#000",
+                        weight: 2,
                         fillColor: "#da6c7b",
                         fillOpacity: 0.8
                     }
@@ -115,6 +123,16 @@ function createShowFeaturesHandler(event_features_url){
                     style: function(feature){
                         return style_classes[feature.properties.hazard_data];
                     },
+                    filter: function(feature){
+                        if(feature.properties){
+                            var props = feature.properties;
+                            var hazard_data = props.hazard_data;
+                            return hazard_data >= 1;
+                        }
+                        else {
+                            return false;
+                        }
+                    },
                     onEachFeature: function(feature, layer) {
                         // Set popup content
                         if (feature.properties) {
@@ -134,7 +152,7 @@ function createShowFeaturesHandler(event_features_url){
                     scrollTop: $("#"+map_id).offset().top
                 }, 500);
                 var fitBoundsOption = {
-                    maxZoom: 10,
+                    maxZoom: 15,
                     pan: {
                         animate: true,
                         duration: 0.5
diff --git a/django_project/realtime/templates/realtime/flood/index.html b/django_project/realtime/templates/realtime/flood/index.html
index 211cc42f..5315a586 100644
--- a/django_project/realtime/templates/realtime/flood/index.html
+++ b/django_project/realtime/templates/realtime/flood/index.html
@@ -152,6 +152,12 @@ <h3 class="panel-title">{% trans "Flood" %}</h3>
         dynatable.paginationPerPage.set(100);
         dynatable.sorts.add('time', -1);
         dynatable.process();
+
+        // programatically show first flood in row
+        if(jsonTableContents.length > 0) {
+            var flood_id = jsonTableContents[0].event_id;
+            showFeaturesHandler(flood_id);
+        }
     }
 
     // Create handler for table