Clean up class names

This commit is contained in:
John Firebaugh
2013-05-21 20:22:13 -07:00
parent fb01868a3c
commit 3fdbcfd09e
5 changed files with 57 additions and 57 deletions

View File

@@ -703,25 +703,25 @@ a:hover .icon.out-link { background-position: -500px -14px;}
/* Preset grid */
.preset-grid {
.preset-list {
width:100%;
padding: 20px 20px 10px 20px;
border-bottom: 1px solid #ccc;
}
.grid-button-wrap {
.preset-list-button-wrap {
margin-bottom: 10px;
height: 60px;
}
.grid-entry {
.preset-list-button {
width: 100%;
height: 100%;
position: relative;
border: 1px solid #ccc;
}
.preset-grid.filtered .grid-button-wrap:first-child .grid-entry {
.preset-list.filtered .preset-list-item:first-child .preset-list-button {
background: #ececec;
}
@@ -737,7 +737,7 @@ a:hover .icon.out-link { background-position: -500px -14px;}
left: 0;
}
.grid-entry .label {
.preset-list-button .label {
background-color: #f6f6f6;
text-align: left;
position: absolute;
@@ -757,11 +757,11 @@ a:hover .icon.out-link { background-position: -500px -14px;}
border-radius: 0 3px 3px 0;
}
.grid-entry:hover .label {
.preset-list-button:hover .label {
background-color: #ececec;
}
.grid-button-wrap button.tag-reference-button {
.preset-list-item button.tag-reference-button {
float: right;
position: static;
margin-top: -60px;
@@ -770,13 +770,13 @@ a:hover .icon.out-link { background-position: -500px -14px;}
border-radius: 0 3px 3px 0;
}
.current .grid-entry,
.current .grid-entry .label {
.current .preset-list-button,
.current .preset-list-button .label {
background-color: #E8EBFF;
}
.category .grid-entry:after,
.category .grid-entry:before {
.category .preset-list-button:after,
.category .preset-list-button:before {
content: "";
position: absolute;
top: -5px;
@@ -787,11 +787,11 @@ a:hover .icon.out-link { background-position: -500px -14px;}
height: 6px;
}
.category .grid-entry:before {
.category .preset-list-button:before {
top: -3px;
}
.preset-grid-search-wrap .icon {
.grid-pane .preset-search-icon {
display: block;
position: absolute;
left: 10px;
@@ -799,7 +799,7 @@ a:hover .icon.out-link { background-position: -500px -14px;}
pointer-events: none;
}
.preset-grid-search-wrap input {
.grid-pane .preset-search-input {
position: absolute;
top: 60px;
border-radius: 0;
@@ -808,7 +808,7 @@ a:hover .icon.out-link { background-position: -500px -14px;}
text-indent: 30px;
}
.subgrid .preset-grid {
.subgrid .preset-list {
padding: 10px 10px 0 10px;
border: 1px solid #CCC;
margin-top: 0;

View File

@@ -52,17 +52,17 @@ iD.ui.intro.area = function(context, reveal) {
context.on('enter.intro', null);
timeout = setTimeout(function() {
reveal('.preset-grid-search-wrap input', 'intro.areas.search');
d3.select('.preset-grid-search-wrap input').on('keyup.intro', keySearch);
reveal('.preset-search-input', 'intro.areas.search');
d3.select('.preset-search-input').on('keyup.intro', keySearch);
}, 500);
}
function keySearch() {
var first = d3.select('.grid-button-wrap:first-child');
if (first.datum().id === 'leisure/playground') {
reveal(first.select('.grid-entry').node(), 'intro.areas.choose');
var first = d3.select('.preset-list-item:first-child');
if (first.classed('preset-leisure-playground')) {
reveal(first.select('.preset-list-button').node(), 'intro.areas.choose');
d3.selection.prototype.one.call(context.history(), 'change.intro', selectedPreset);
d3.select('.preset-grid-search-wrap input').on('keyup.intro', null);
d3.select('.preset-search-input').on('keyup.intro', null);
}
}
@@ -78,7 +78,7 @@ iD.ui.intro.area = function(context, reveal) {
context.on('exit.intro', null);
context.history().on('change.intro', null);
context.map().on('move.intro', null);
d3.select('.preset-grid-search-wrap input').on('keyup.intro', null);
d3.select('.preset-search-input').on('keyup.intro', null);
};
return d3.rebind(step, event, 'on');

View File

@@ -97,7 +97,7 @@ iD.ui.intro.line = function(context, reveal) {
timeout(function() {
d3.select('#curtain').style('pointer-events', 'none');
var road = d3.select('.preset-grid .grid-entry').filter(function(d) {
var road = d3.select('.preset-list .preset-list-button').filter(function(d) {
return d.id === 'category-road';
});
reveal(road.node(), 'intro.lines.road');
@@ -109,7 +109,7 @@ iD.ui.intro.line = function(context, reveal) {
timeout(function() {
var grid = d3.select('.subgrid');
reveal(grid.node(), 'intro.lines.residential');
grid.selectAll('.grid-entry').filter(function(d) {
grid.selectAll('.preset-list-button').filter(function(d) {
return d.id === 'highway/residential';
}).one('click.intro', roadDetails);
}, 200);

View File

@@ -40,18 +40,18 @@ iD.ui.intro.point = function(context, reveal) {
context.on('enter.intro', null);
setTimeout(function() {
reveal('.preset-grid-search-wrap input', 'intro.points.search');
d3.select('.preset-grid-search-wrap input').on('keyup.intro', keySearch);
reveal('.preset-search-input', 'intro.points.search');
d3.select('.preset-search-input').on('keyup.intro', keySearch);
}, 500);
}
function keySearch() {
var first = d3.select('.grid-button-wrap:first-child');
if (first.datum().id === 'amenity/cafe') {
reveal(first.select('.grid-entry').node(), 'intro.points.choose');
var first = d3.select('.preset-list-item:first-child');
if (first.classed('preset-amenity-cafe')) {
reveal(first.select('.preset-list-button').node(), 'intro.points.choose');
d3.selection.prototype.one.call(context.history(), 'change.intro', selectedPreset);
d3.select('.preset-grid-search-wrap input').on('keydown.intro', function() {
d3.select('.preset-search-input').on('keydown.intro', function() {
// Prevent search from updating and changing the grid
d3.event.stopPropagation();
d3.event.preventDefault();
@@ -68,7 +68,7 @@ iD.ui.intro.point = function(context, reveal) {
}
function closeEditor() {
d3.select('.preset-grid-search-wrap input').on('keydown.intro', null);
d3.select('.preset-search-input').on('keydown.intro', null);
context.history().on('change.intro', null);
reveal('.tag-pane', 'intro.points.close');
}
@@ -138,7 +138,7 @@ iD.ui.intro.point = function(context, reveal) {
context.on('enter.intro', null);
context.map().on('move.intro', null);
context.history().on('change.intro', null);
d3.select('.preset-grid-search-wrap input').on('keyup.intro', null).on('keydown.intro', null);
d3.select('.preset-search-input').on('keyup.intro', null).on('keydown.intro', null);
};
return d3.rebind(step, event, 'on');

View File

@@ -53,57 +53,57 @@ iD.ui.PresetList = function(context, entity) {
// enter
var value = search.property('value');
if (d3.event.keyCode === 13 && value.length) {
grid.selectAll('.grid-entry:first-child').datum().choose();
list.selectAll('.preset-list-item:first-child').datum().choose();
} else {
grid.classed('filtered', value.length);
list.classed('filtered', value.length);
if (value.length) {
var results = presets.search(value);
message.text(t('inspector.results', {
n: results.collection.length,
search: value
}));
grid.call(drawGrid, results);
list.call(drawList, results);
} else {
grid.call(drawGrid, context.presets().defaults(geometry, 36));
list.call(drawList, context.presets().defaults(geometry, 36));
}
}
}
var searchwrap = selection.append('div')
.attr('class', 'preset-grid-search-wrap');
var searchWrap = selection.append('div')
.attr('class', 'preset-search');
var search = searchwrap.append('input')
.attr('class', 'major')
var search = selection.append('input')
.attr('class', 'preset-search-input major')
.attr('placeholder', t('inspector.search'))
.attr('type', 'search')
.on('keydown', keydown)
.on('keyup', keyup);
searchwrap.append('span')
.attr('class', 'icon search');
searchWrap.append('span')
.attr('class', 'preset-search-icon icon search');
if (autofocus) {
search.node().focus();
}
var gridwrap = selection.append('div')
var listWrap = selection.append('div')
.attr('class', 'fillL2 inspector-body inspector-body-' + geometry);
var grid = gridwrap.append('div')
.attr('class', 'preset-grid fillL cf')
.call(drawGrid, context.presets().defaults(geometry, 36));
var list = listWrap.append('div')
.attr('class', 'preset-list fillL cf')
.call(drawList, context.presets().defaults(geometry, 36));
}
function drawGrid(grid, presets) {
function drawList(list, presets) {
var collection = presets.collection.map(function(preset) {
return preset.members ? CategoryItem(preset) : PresetItem(preset)
});
var items = grid.selectAll('.preset-item')
var items = list.selectAll('.preset-list-item')
.data(collection, function(d) { return d.preset.id; });
items.enter().append('div')
.attr('class', 'preset-item')
.attr('class', function(item) { return 'preset-list-item preset-' + item.preset.id.replace('/', '-'); })
.classed('current', function(item) { return item.preset === current; })
.each(function(item) {
d3.select(this).call(item);
@@ -119,15 +119,15 @@ iD.ui.PresetList = function(context, entity) {
}
function CategoryItem(preset) {
var box, subgrid, shown = false;
var box, sublist, shown = false;
function item(selection) {
var wrap = selection.append('div')
.attr('class', 'grid-button-wrap category col12');
.attr('class', 'preset-list-button-wrap category col12');
wrap.append('button')
.datum(preset)
.attr('class', 'grid-entry')
.attr('class', 'preset-list-button')
.call(iD.ui.PresetIcon(context.geometry(entity.id)))
.on('click', item.choose)
.append('div')
@@ -141,8 +141,8 @@ iD.ui.PresetList = function(context, entity) {
box.append('div')
.attr('class', 'arrow');
subgrid = box.append('div')
.attr('class', 'preset-grid fillL3 cf fl');
sublist = box.append('div')
.attr('class', 'preset-list fillL3 cf fl');
}
item.choose = function() {
@@ -155,7 +155,7 @@ iD.ui.PresetList = function(context, entity) {
.style('padding-bottom', '0');
} else {
shown = true;
subgrid.call(drawGrid, preset.members);
sublist.call(drawList, preset.members);
box.transition()
.duration(200)
.style('opacity', '1')
@@ -172,11 +172,11 @@ iD.ui.PresetList = function(context, entity) {
function PresetItem(preset) {
function item(selection) {
var wrap = selection.append('div')
.attr('class', 'grid-button-wrap col12');
.attr('class', 'preset-list-button-wrap col12');
wrap.append('button')
.datum(preset)
.attr('class', 'grid-entry')
.attr('class', 'preset-list-button')
.call(iD.ui.PresetIcon(context.geometry(entity.id)))
.on('click', item.choose)
.append('div')