Add the date range filter

OpenHistoricalMap · Feb 19, 2019 · f94febf · f94febf
1 parent 21488fc
commit f94febf
Showing 1 changed file with 45 additions and 0 deletions.
diff --git a/modules/ui/map_data.js b/modules/ui/map_data.js
@@ -20,6 +20,7 @@ export function uiMapData(context) {
     var features = context.features().keys();
     var layers = context.layers();
     var fills = ['wireframe', 'partial', 'full'];
+    var dateRanges = ['start_date', 'end_date'];
 
     var settingsCustomData = uiSettingsCustomData(context)
         .on('change', customChanged);
@@ -30,6 +31,7 @@ export function uiMapData(context) {
     var _shown = false;
     var _dataLayerContainer = d3_select(null);
     var _fillList = d3_select(null);
+    var _rangeList = d3_select(null);
     var _featureList = d3_select(null);
     var _QAList = d3_select(null);
 
@@ -71,6 +73,9 @@ export function uiMapData(context) {
         return _fillSelected === d;
     }
 
+    function showsDateRanges(d) {
+        return true;
+    }
 
     function setFill(d) {
         fills.forEach(function(opt) {
@@ -86,6 +91,16 @@ export function uiMapData(context) {
     }
 
 
+    function setDateRanges(d) {
+        var setValue = parseInt(this.value.replace(/-/g,''),10)
+        setValue = isNaN(setValue) ? (d === 'start_date' ? -Infinity : Infinity) : setValue;
+        context.features().dateRange = context.features().dateRange || [-Infinity,Infinity];
+        context.features().dateRange[d === 'start_date' ? 0 : 1] = setValue;
+        context.flush()
+        update();
+    }
+
+
     function showsLayer(which) {
         var layer = layers.layer(which);
         if (layer) {
@@ -561,6 +576,19 @@ export function uiMapData(context) {
         updateFillList();
     }
 
+    function renderDateRanges(selection) {
+        var container = selection.selectAll('.layer-date-range')
+            .data([0]);
+
+        _rangeList = container.enter()
+            .append('ul')
+            .attr('class', 'layer-list layer-date-range')
+            .merge(container);
+
+        updateDateRanges();
+    }
+
+
 
     function renderFeatureList(selection) {
         var container = selection.selectAll('.layer-feature-list')
@@ -588,6 +616,12 @@ export function uiMapData(context) {
             .call(drawListItems, fills, 'radio', 'area_fill', setFill, showsFill);
     }
 
+    function updateDateRanges() {
+        _rangeList
+            .call(drawListItems, dateRanges, 'date', 'date_ranges', setDateRanges, showsDateRanges);
+    }
+
+
     function updateFeatureList() {
         _featureList
             .call(drawListItems, features, 'checkbox', 'feature', clickFeature, showsFeature);
@@ -725,6 +759,17 @@ export function uiMapData(context) {
                 .content(renderFillList)
             );
 
+        // Date Ranges
+        content
+            .append('div')
+            .attr('class', 'map-data-date-ranges')
+            .call(uiDisclosure(context, 'date_ranges', false)
+                .title(t('map_data.date_ranges'))
+                .content(renderDateRanges)
+            );
+
+
+
         // feature filters
         content
             .append('div')