wip: deal with gt/lt and numbers in conditional rules

umap/static/umap/js/modules/rules.js

@@ -36,23 +36,52 @@ class Rule {
     this.map.render(fields)
   }
 
+  equal(other) {
+    return this.expected === other
+  }
+
+  not_equal(other) {
+    return this.expected != other
+  }
+
+  gt(other) {
+    return other > this.expected
+  }
+
+  lt(other) {
+    return other < this.expected
+  }
+
+  OPERATORS = [
+    ['>', this.gt],
+    ['<', this.lt],
+    // When sent by Django
+    ['&lt;', this.lt],
+    ['!=', this.not_equal],
+    ['=', this.equal],
+  ]
+
   parse() {
     let vars = []
-    if (this.condition.includes('!=')) {
+    this.cast = (v) => v
-      this.operator = (our, other) => our != other
+    this.operator = undefined
-      vars = this.condition.split('!=')
+    for (const [sign, func] of this.OPERATORS) {
-    } else if (this.condition.includes('=')) {
+      if (this.condition.includes(sign)) {
-      this.operator = (our, other) => our === other
+        this.operator = func
-      vars = this.condition.split('=')
+        vars = this.condition.split(sign)
+        break
+      }
     }
-    if (vars.length != 2) this.operator = undefined
+    if (vars.length != 2) return
     this.key = vars[0]
     this.expected = vars[1]
+    if (!isNaN(this.expected)) this.cast = parseFloat
+    this.expected = this.cast(this.expected)
   }
 
   match(props) {
     if (!this.operator || !this.active) return false
-    return this.operator(this.expected, props[this.key])
+    return this.operator(this.cast(props[this.key]))
   }
 
   getMap() {
@@ -170,10 +199,7 @@ export default class Rules {
   }
 
   edit(container) {
-    const body = DomUtil.createFieldset(
+    const body = DomUtil.createFieldset(container, translate('Conditional style rules'))
-      container,
-      translate('Conditional style rules')
-    )
     if (this.rules.length) {
       const ul = DomUtil.create('ul', '', body)
       for (const rule of this.rules) {

umap/tests/integration/test_conditional_rules.py

@@ -73,7 +73,7 @@ DATALAYER_DATA2 = {
 }
 
 
-def test_simple_simple_equal_rule_at_load(live_server, page, map):
+def test_simple_equal_rule_at_load(live_server, page, map):
     map.settings["properties"]["rules"] = [
         {"condition": "mytype=odd", "options": {"color": "aliceblue"}}
     ]
@@ -87,7 +87,7 @@ def test_simple_simple_equal_rule_at_load(live_server, page, map):
     assert colors.count("rgb(240, 248, 255)") == 2
 
 
-def test_simple_simple_not_equal_rule_at_load(live_server, page, map):
+def test_simple_not_equal_rule_at_load(live_server, page, map):
     map.settings["properties"]["rules"] = [
         {"condition": "mytype!=even", "options": {"color": "aliceblue"}}
     ]
@@ -101,6 +101,48 @@ def test_simple_simple_not_equal_rule_at_load(live_server, page, map):
     assert colors.count("rgb(240, 248, 255)") == 2
 
 
+def test_gt_rule_with_number_at_load(live_server, page, map):
+    map.settings["properties"]["rules"] = [
+        {"condition": "mynumber>10", "options": {"color": "aliceblue"}}
+    ]
+    map.save()
+    DataLayerFactory(map=map, data=DATALAYER_DATA1)
+    DataLayerFactory(map=map, data=DATALAYER_DATA2)
+    page.goto(f"{live_server.url}{map.get_absolute_url()}#6/48.948/1.670")
+    markers = page.locator(".leaflet-marker-icon .icon_container")
+    expect(markers).to_have_count(4)
+    colors = getColors(markers)
+    assert colors.count("rgb(240, 248, 255)") == 2
+
+
+def test_lt_rule_with_number_at_load(live_server, page, map):
+    map.settings["properties"]["rules"] = [
+        {"condition": "mynumber<14", "options": {"color": "aliceblue"}}
+    ]
+    map.save()
+    DataLayerFactory(map=map, data=DATALAYER_DATA1)
+    DataLayerFactory(map=map, data=DATALAYER_DATA2)
+    page.goto(f"{live_server.url}{map.get_absolute_url()}#6/48.948/1.670")
+    markers = page.locator(".leaflet-marker-icon .icon_container")
+    expect(markers).to_have_count(4)
+    colors = getColors(markers)
+    assert colors.count("rgb(240, 248, 255)") == 3
+
+
+def test_lt_rule_with_float_at_load(live_server, page, map):
+    map.settings["properties"]["rules"] = [
+        {"condition": "mynumber<12.3", "options": {"color": "aliceblue"}}
+    ]
+    map.save()
+    DataLayerFactory(map=map, data=DATALAYER_DATA1)
+    DataLayerFactory(map=map, data=DATALAYER_DATA2)
+    page.goto(f"{live_server.url}{map.get_absolute_url()}#6/48.948/1.670")
+    markers = page.locator(".leaflet-marker-icon .icon_container")
+    expect(markers).to_have_count(4)
+    colors = getColors(markers)
+    assert colors.count("rgb(240, 248, 255)") == 3
+
+
 def test_can_create_new_rule(live_server, page, openmap):
     DataLayerFactory(map=openmap, data=DATALAYER_DATA1)
     DataLayerFactory(map=openmap, data=DATALAYER_DATA2)