From 7cf55aefc4d6fe57a2d78f0846fa405750d67581 Mon Sep 17 00:00:00 2001 From: Kushan Joshi <0o3ko0@gmail.com> Date: Mon, 22 Feb 2016 00:47:23 +0530 Subject: [PATCH] map features master checkbox Adds a master checkbox which selects/deselects all map features. (closes #2904) --- js/id/ui/map_data.js | 52 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) diff --git a/js/id/ui/map_data.js b/js/id/ui/map_data.js index 0298910e4ab..3153d2f8081 100644 --- a/js/id/ui/map_data.js +++ b/js/id/ui/map_data.js @@ -246,6 +246,26 @@ iD.ui.MapData = function(context) { .remove(); } + function updateSelectAll(selection, active) { + var items = selection.selectAll('li') + .filter(function() { + // filter out list item 'Select All' itself + return !d3.select(this).classed('select-all'); + }); + + // keeps a record of all list items checked + var allFeatureSelected = true; + + items.classed('active', function(e) { + allFeatureSelected = allFeatureSelected && active(e); + return active(e); + }); + + selection.selectAll('li.select-all') + .classed('active', allFeatureSelected) + .selectAll('input') + .property('checked', allFeatureSelected); + } function update() { dataLayerContainer.call(drawMapillaryItems); @@ -254,6 +274,7 @@ iD.ui.MapData = function(context) { fillList.call(drawList, fills, 'radio', 'area_fill', setFill, showsFill); featureList.call(drawList, features, 'checkbox', 'feature', clickFeature, showsFeature); + featureList.call(updateSelectAll, showsFeature); } function hidePanel() { @@ -275,6 +296,22 @@ iD.ui.MapData = function(context) { context.map().pan([0,0]); // trigger a redraw } + function toggleSelectAll(selection, toggle) { + selection.selectAll('li') + .filter(function() { + return !d3.select(this).classed('select-all'); + }) + .classed('active', toggle) + .selectAll('input') + .property('checked', function(e) { + if (d3.select(this).node().checked !== toggle) { + context.features().toggle(e); + } + }); + + update(); + } + function setVisible(show) { if (show !== shown) { button.classed('active', show); @@ -381,6 +418,21 @@ iD.ui.MapData = function(context) { var featureList = featureContainer.append('ul') .attr('class', 'layer-list layer-feature-list'); + var selectAll = featureList.append('li') + .attr('class', 'layer select-all') + .append('label'); + + selectAll.append('input') + .attr('class', 'layer-feature-select-all') + .attr('type', 'checkbox') + .attr('name', 'select-all') + .on('click', function() { + var isChecked = d3.select(this).node().checked; + featureList.call(toggleSelectAll, isChecked); + }); + + selectAll.append('span').text('Select All'); + context.features() .on('change.map_data-update', update);