Add preset search.

This commit is contained in:
Tom MacWright
2013-01-31 13:50:19 -05:00
parent e6e0306953
commit c871361bad
5 changed files with 91 additions and 10 deletions

View File

@@ -1269,6 +1269,22 @@ a.success-action {
}
.preset-section.cf,
.inspector-preset.cf,
.preset-section-input.cf {
width: 100%;
}
.preset-search-input {
width:100%;
}
.preset-search-input input {
width: 100%;
padding: 5px;
}
.preset-search-result {
padding: 0px 10px;
height:30px;
margin: 5px;
}

View File

@@ -73,6 +73,7 @@
<script src='js/id/ui/tag_reference.js'></script>
<script src='js/id/ui/key_reference.js'></script>
<script src='js/id/ui/preset.js'></script>
<script src='js/id/ui/presetsearch.js'></script>
<script src='js/id/actions.js'></script>
<script src="js/id/actions/add_midpoint.js"></script>

View File

@@ -9,8 +9,6 @@ iD.ui.inspector = function() {
function inspector(selection) {
var entity = selection.datum();
var possiblePresets = presetData.match(entity);
var inspector = selection.append('div')
.attr('class','inspector content');
@@ -24,12 +22,18 @@ iD.ui.inspector = function() {
var inspectorwrap = inspectorbody.append('div')
.attr('class', 'inspector-inner tag-wrap fillL2');
if (possiblePresets.length) {
var inspectorpreset = inspectorwrap.append('div')
.attr('class', 'inspector-preset cf')
.call(iD.ui.preset()
.preset(possiblePresets[0]));
}
var inspectorpresetsearch = inspectorwrap.append('div')
.attr('class', 'inspector-preset cf')
.call(iD.ui.presetsearch()
.entity(entity)
.presetData(presetData)
.on('choose', function(preset) {
inspectorpreset.call(iD.ui.preset()
.preset(preset));
}));
var inspectorpreset = inspectorwrap.append('div')
.attr('class', 'inspector-preset cf');
inspectorwrap.append('h4')

View File

@@ -66,8 +66,7 @@ iD.ui.preset = function() {
var wrap = s.append('div')
.attr('class', 'preset-section-input cf');
wrap
.append('div')
wrap.append('div')
.attr('class', 'col6')
.text(d.text);

61
js/id/ui/presetsearch.js Normal file
View File

@@ -0,0 +1,61 @@
iD.ui.presetsearch = function() {
var event = d3.dispatch('choose'),
presetData;
function search(selection) {
var viable = presetData.match(entity);
function filter(value) {
value = value.toLowerCase();
return viable.filter(function(v) {
return v.name.toLowerCase().indexOf(value) !== -1;
});
}
function showResults() {
var values = filter(this.value).slice(0, 10);
var res = search_output.selectAll('div.preset-search-result')
.data(values, function(d) { return d.name; });
res.exit().remove();
res.enter()
.append('button')
.attr('class', 'preset-search-result')
.text(function(d) {
return d.name;
})
.on('click', function(d) {
search_output
.selectAll('button.preset-search-result')
.remove();
event.choose(d);
});
}
selection.append('div')
.attr('class', 'preset-search-input')
.append('h3')
.append('input')
.on('keyup', showResults)
.on('change', showResults);
var search_output = selection.append('div')
.attr('class', 'preset-search-output');
}
search.presetData = function(_) {
if (!arguments.length) return presetData;
presetData = _;
return search;
};
search.entity = function(_) {
if (!arguments.length) return entity;
entity = _;
return search;
};
return d3.rebind(search, event, 'on');
};