Add outline color on indicator rule

kartoza · Jun 17, 2022 · e82e2e0 · e82e2e0
1 parent 53445d7
commit e82e2e0
Show file tree

Hide file tree

Showing 7 changed files with 64 additions and 6 deletions.
diff --git a/...roject/rir_dashboard/static/js/dashboard/context-analysis/views/layers/indicator-layer.js b/...roject/rir_dashboard/static/js/dashboard/context-analysis/views/layers/indicator-layer.js
@@ -272,10 +272,9 @@ define([], function () {
                 });
                 const style = function (feature, layer) {
                     if (levelActivated.includes(feature.properties.scenario_value)) {
-                        let color = '#ffffff';
-                        let weight = 0.5;
+                        let color = feature.properties.outline_color;
+                        let weight = 1;
                         if (self.geometry && feature.id === self.geometry.id) {
-                            color = '#ffffff';
                             weight = 3;
                         }
                         return {

diff --git a/django_project/rir_dashboard/templates/dashboard/admin/indicator/form.html b/django_project/rir_dashboard/templates/dashboard/admin/indicator/form.html
@@ -63,7 +63,9 @@ <h3>Scenario Rules</h3>
             </th>
             <th valign="top">Rule<br>
             </th>
-            <th valign="top">Color<br>
+            <th valign="top">Fill Color<br>
+            </th>
+            <th valign="top">Outline Color<br>
             </th>
         </tr>
         <tr style="border-top: none!important;">
@@ -83,7 +85,16 @@ <h3>Scenario Rules</h3>
                 </div>
             </th>
             <th valign="top">
-                <span class="helptext">Put the hex color with # (e.g. #ffffff) or put the text of color. (e.g. blue).</span>
+                <span class="helptext">
+                    Used for coloring the traffic light or filling the geometry.
+                    Put the hex color with # (e.g. #ffffff) or put the text of color. (e.g. blue).
+                </span>
+            </th>
+            <th valign="top">
+                <span class="helptext">
+                    Used for coloring the outline of the geometry.
+                    Put the hex color with # (e.g. #ffffff) or put the text of color. (e.g. blue).
+                </span>
             </th>
         </tr>
         {% for scenario in scenarios %}
@@ -125,6 +136,19 @@ <h3>Scenario Rules</h3>
                             </div>
                         </div>
                     </div>
+                </td><td>
+                    <div class="row color-review-section">
+                        <input type="text" name="scenario_{{ scenario.id }}_outline_color" value="{{ scenario.rule_outline_color }}" class="scenario-rule-color col" spellcheck="false">
+                        <div class="color-review-wrapper">
+                            <input type="text" class="color-review" spellcheck="false" style="background: {{ scenario.rule_outline_color }}" autocomplete="false">
+                            <div class="color-picker-indicator-wrapper">
+                                <div class="color-picker-indicator">
+                                    <div class="arrow" content="box-shadow-bottom"></div>
+                                    <img src="{% static "img/color-picker.svg" %}" class="box-shadow-bottom">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                 </td>
             </tr>
         {% endfor %}

diff --git a/django_project/rir_dashboard/views/dashboard/admin/indicator/create.py b/django_project/rir_dashboard/views/dashboard/admin/indicator/create.py
@@ -22,7 +22,8 @@ def context_view(self) -> dict:
                 'id': scenario.id,
                 'name': scenario.name,
                 'rule_name': scenario.name,
-                'rule_color': scenario.background_color
+                'rule_color': scenario.background_color,
+                'rule_outline_color': '#FFFFFF'
             })
 
         from_id = self.request.GET.get('from')
@@ -61,6 +62,7 @@ def post(self, request, **kwargs):
                 rule = request.POST.get(f'scenario_{scenario.id}_rule', None)
                 name = request.POST.get(f'scenario_{scenario.id}_name', None)
                 color = request.POST.get(f'scenario_{scenario.id}_color', None)
+                outline_color = request.POST.get(f'scenario_{scenario.id}_outline_color', None)
                 if rule and name:
                     scenario_rule, created = IndicatorScenarioRule.objects.get_or_create(
                         indicator=indicator,
@@ -69,6 +71,7 @@ def post(self, request, **kwargs):
                     scenario_rule.name = name
                     scenario_rule.rule = rule
                     scenario_rule.color = color
+                    scenario_rule.outline_color = outline_color
                     scenario_rule.save()
             return redirect(
                 reverse(

diff --git a/django_project/rir_dashboard/views/dashboard/admin/indicator/edit.py b/django_project/rir_dashboard/views/dashboard/admin/indicator/edit.py
@@ -62,6 +62,7 @@ def post(self, request, **kwargs):
                 rule = request.POST.get(f'scenario_{scenario.id}_rule', None)
                 name = request.POST.get(f'scenario_{scenario.id}_name', None)
                 color = request.POST.get(f'scenario_{scenario.id}_color', None)
+                outline_color = request.POST.get(f'scenario_{scenario.id}_outline_color', None)
                 if name:
                     scenario_rule, created = IndicatorScenarioRule.objects.get_or_create(
                         indicator=indicator,
@@ -70,6 +71,7 @@ def post(self, request, **kwargs):
                     scenario_rule.name = name
                     scenario_rule.rule = rule
                     scenario_rule.color = color
+                    scenario_rule.outline_color = outline_color
                     scenario_rule.save()
             return redirect(
                 reverse(

diff --git a/django_project/rir_data/migrations/0035_indicatorscenariorule_outline_color.py b/django_project/rir_data/migrations/0035_indicatorscenariorule_outline_color.py
@@ -0,0 +1,18 @@
+# Generated by Django 3.2.8 on 2022-06-17 03:41
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('rir_data', '0034_alter_contextlayer_layer_type'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='indicatorscenariorule',
+            name='outline_color',
+            field=models.CharField(default='#FFFFFF', help_text='Color for the outline of geometry on map.', max_length=16),
+        ),
+    ]
diff --git a/django_project/rir_data/models/indicator/indicator.py b/django_project/rir_data/models/indicator/indicator.py
@@ -208,6 +208,7 @@ def scenarios_dict(self):
                 'rule_name': scenario_rule.name if scenario_rule else '',
                 'rule_value': scenario_rule.rule if scenario_rule else '',
                 'rule_color': scenario_rule.color if scenario_rule else '',
+                'rule_outline_color': scenario_rule.outline_color if scenario_rule else '#FFFFFF',
             })
         return scenarios
 
@@ -243,13 +244,15 @@ def serialize(self, geometry, value, attributes=None):
         # return data
         scenario_value = self.scenario_level(value)
         background_color = scenario_value.background_color if scenario_value else ''
+        outline_color = '#FFFFFF'
 
         scenario_text = scenario_value.level if scenario_value else 0
         try:
             scenario_rule = self.scenario_rule(scenario_value.level)
             scenario_text = scenario_rule.name
             if scenario_rule and scenario_rule.color:
                 background_color = scenario_rule.color
+                outline_color = scenario_rule.outline_color
         except AttributeError:
             pass
 
@@ -263,6 +266,7 @@ def serialize(self, geometry, value, attributes=None):
             'scenario_text': scenario_text,
             'text_color': scenario_value.text_color if scenario_value else '',
             'background_color': background_color,
+            'outline_color': outline_color,
         }
         values.update(attributes if attributes else {})
         return values

diff --git a/django_project/rir_data/models/indicator/indicator_rule.py b/django_project/rir_data/models/indicator/indicator_rule.py
@@ -1,5 +1,6 @@
 from django.contrib.gis.db import models
 from django.utils.translation import ugettext_lazy as _
+
 from rir_data.models.indicator.indicator import Indicator
 from rir_data.models.scenario import ScenarioLevel
 
@@ -34,6 +35,13 @@ class IndicatorScenarioRule(models.Model):
             'Color that override the scenario level color'
         )
     )
+    outline_color = models.CharField(
+        max_length=16,
+        default='#FFFFFF',
+        help_text=_(
+            'Color for the outline of geometry on map.'
+        )
+    )
 
     class Meta:
         unique_together = ('indicator', 'scenario_level')