CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-02-25 06:55:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'preset-list'

Browse Source
This commit is contained in:
John Firebaugh
2013-04-29 14:50:54 -07:00
parent 57d6c48fa5 13d7144298
commit 31b3f2887a
2 changed files with 47 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
css/app.css
View File

@@ -679,13 +679,13 @@ a:hover .icon.out-link { background-position: -500px -14px;}
.preset-grid {
width:100%;
padding: 20px 10px 10px 20px;
padding: 20px 20px 10px 20px;
border-bottom: 1px solid #ccc;
}
.grid-button-wrap {
padding: 0 10px 10px 0;
height: 120px;
padding-bottom: 10px;
height: 70px;
}
.grid-entry {
@@ -693,7 +693,6 @@ a:hover .icon.out-link { background-position: -500px -14px;}
height: 100%;
position: relative;
border: 1px solid #ccc;
overflow: hidden;
float: left;
}
@@ -707,16 +706,13 @@ a:hover .icon.out-link { background-position: -500px -14px;}
.preset-icon {
position: absolute;
top: 30px;
left: 0;
right: 0;
top: 18px;
left: 18px;
margin: auto;
}
.preset-icon-line {
top: 15px;
left: -10px;
right: -10px;
top: 0; left: 0;
}
.grid-entry .label {
@@ -724,23 +720,28 @@ a:hover .icon.out-link { background-position: -500px -14px;}
text-align: left;
position: absolute;
padding: 5px 10px;
height: 30px;
height: 100%;
bottom: 0;
left: 0; right: 0;
left: 60px;
right: 0;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
border-top: 1px solid rgba(0, 0, 0, .1);
border-left: 1px solid rgba(0, 0, 0, .1);
line-height: 50px;
}
.grid-entry:hover .label {
background: none;
}
.grid-button-wrap button.tag-reference-button {
float: right;
position: static;
margin-top: -30px;
margin-right: 1px;
height: 29px;
border-left: 1px solid #CCC;
border-radius: 0 0 3px 0;
margin-top: -60px;
height: 100%;
border: 1px solid #CCC;
border-radius: 0 3px 3px 0;
}
.current .grid-entry,
@@ -752,15 +753,16 @@ a:hover .icon.out-link { background-position: -500px -14px;}
.category .grid-entry:before {
content: "";
position: absolute;
top: 7px;
left: 0; right: 0;
border-top: 1px solid #ccc;
border-radius: 6px;
top: -5px;
left: -1px; right: -1px;
border: 1px solid #ccc;
border-bottom: none;
border-radius: 6px 6px 0 0;
height: 6px;
}
.category .grid-entry:before {
top: 3px;
top: -3px;
}
.preset-grid-search-wrap .icon {
@@ -786,16 +788,8 @@ a:hover .icon.out-link { background-position: -500px -14px;}
margin: 5px;
}
.subgrid {
width: 100%;
width: -webkit-calc(100% + 10px);
width: calc(100% + 10px);
margin-left: -10px;
overflow: hidden;
}
.subgrid .preset-grid {
padding: 10px 0 0 10px;
padding: 10px 10px 0 10px;
border: 1px solid #CCC;
margin-top: 0;
border-radius: 8px;
@@ -807,21 +801,9 @@ a:hover .icon.out-link { background-position: -500px -14px;}
border-bottom-color: #CCC;
width: 0;
height: 0;
margin-left: 33.3333%;
margin-left: -webkit-calc(16.6666% - 10px);
margin-left: calc(16.6666% - 10px);
margin-top: -10px;
}
.subgrid.arrow-1 .arrow {
margin-left: 50%;
margin-left: -webkit-calc(50% - 10px);
margin-left: calc(50% - 10px);
}
.subgrid.arrow-2 .arrow {
margin-left: 280px;
margin-left: -webkit-calc(84.4444% - 10px);
margin-left: calc(84.4444% - 10px);
margin-top: -10px;
}
.show-more {
@@ -847,7 +829,7 @@ a:hover .icon.out-link { background-position: -500px -14px;}
width: 45px;
margin: auto;
position: absolute;
left: 0; right: 0; top: 19px;
left: 8px; top: 7px;
background:transparent url(img/sprite.svg) no-repeat -240px -80px;
}
@@ -1485,6 +1467,7 @@ img.wiki-image {
width: -webkit-calc(33.3333% - 10px);
width: calc(33.3333% - 10px);
margin-left: 20px;
margin-right: 10px;
border-radius: 4px;
max-height: 200px;
}

59
js/id/ui/preset_grid.js
View File

@@ -1,7 +1,5 @@
iD.ui.PresetGrid = function(context, entity) {
var event = d3.dispatch('choose', 'close'),
defaultLimit = 9,
currentlyDrawn = 9,
presets,
autofocus = false;
@@ -37,16 +35,7 @@ iD.ui.PresetGrid = function(context, entity) {
var grid = gridwrap.append('div')
.attr('class', 'preset-grid fillL cf')
.data([context.presets().defaults(entity, 36).collection]);
var showMore = gridwrap.append('button')
.attr('class', 'fillL show-more')
.text(t('inspector.show_more'))
.on('click', function() {
grid.call(drawGrid, (currentlyDrawn += defaultLimit));
});
grid.call(drawGrid, defaultLimit);
.call(drawGrid, context.presets().defaults(entity, 36));
function keydown() {
// hack to let delete shortcut work when search is autofocused
@@ -73,7 +62,6 @@ iD.ui.PresetGrid = function(context, entity) {
if (d3.event.keyCode === 13 && value.length) {
choose(grid.selectAll('.grid-entry:first-child').datum());
} else {
currentlyDrawn = defaultLimit;
grid.classed('filtered', value.length);
if (value.length) {
var results = presets.search(value);
@@ -81,11 +69,9 @@ iD.ui.PresetGrid = function(context, entity) {
n: results.collection.length,
search: value
}));
grid.data([results.collection])
.call(drawGrid, defaultLimit);
grid.call(drawGrid, results);
} else {
grid.data([context.presets().defaults(entity, 36).collection])
.call(drawGrid, defaultLimit);
grid.call(drawGrid, context.presets().defaults(entity, 36));
}
}
}
@@ -118,15 +104,14 @@ iD.ui.PresetGrid = function(context, entity) {
subgrid.append('div')
.attr('class', 'preset-grid fillL3 cf fl')
.data([d.members.collection])
.call(drawGrid, 1000);
.call(drawGrid, d.members);
subgrid.style('max-height', '0px')
.style('padding-bottom', '0px')
.transition()
.duration(300)
.style('padding-bottom', '20px')
.style('max-height', (d.members.collection.length / 3 * 150) + 200 + 'px');
.style('max-height', (d.members.collection.length * 80) + 200 + 'px');
}
// Preset
@@ -136,8 +121,6 @@ iD.ui.PresetGrid = function(context, entity) {
}
}
function name(d) { return d.name(); }
// Inserts a div inline after the entry for the provided entity
// Used for preset descriptions, and for expanding categories
function insertBox(grid, entity, klass) {
@@ -164,25 +147,24 @@ iD.ui.PresetGrid = function(context, entity) {
if (d === entity) index = i;
});
var insertIndex = index + 3 - index % 3;
if (insertIndex > shownIndex) insertIndex ++;
if (index >= shownIndex) index++;
var elem = document.createElement('div');
grid.node().insertBefore(elem, grid.node().childNodes[insertIndex]);
grid.node().insertBefore(elem, grid.node().childNodes[index + 1]);
var newbox = d3.select(elem)
.attr('class', 'col12 box-insert ' + klass + ' arrow-' + (index % 3))
.attr('class', 'col12 box-insert ' + klass)
.datum(entity);
return newbox;
}
function drawGrid(selection, limit) {
function drawGrid(grid, presets) {
function helpClick(d) {
d3.event.stopPropagation();
var presetinspect = insertBox(selection, d, 'preset-inspect');
var presetinspect = insertBox(grid, d, 'preset-inspect');
if (!presetinspect) return;
@@ -198,23 +180,18 @@ iD.ui.PresetGrid = function(context, entity) {
tagReference.show();
}
if (selection.node() === grid.node()) {
showMore
.style('display', (selection.data()[0].length > limit) ? 'block' : 'none');
}
grid.selectAll('.preset-inspect, .subgrid').remove();
selection.selectAll('.preset-inspect, .subgrid').remove();
var entries = selection
.selectAll('div.grid-entry-wrap')
.data(function(d) { return d.slice(0, limit); }, name);
var entries = grid
.selectAll('.grid-entry-wrap')
.data(presets.collection, function(d) { return d.id; });
entries.exit()
.remove();
var entered = entries.enter()
.append('div')
.attr('class','grid-button-wrap col4 grid-entry-wrap')
.attr('class','grid-button-wrap col12 grid-entry-wrap')
.classed('category', function(d) { return !!d.members; })
.classed('current', function(d) { return d === preset; });
@@ -232,15 +209,15 @@ iD.ui.PresetGrid = function(context, entity) {
var label = buttonInner.append('div')
.attr('class','label')
.text(name);
.text(function(d) { return d.name(); });
entered.filter(function(d) { return !d.members; })
.append('button')
.attr('tabindex', -1)
.attr('class', 'tag-reference-button minor')
.on('click', helpClick, selection)
.on('click', helpClick)
.append('span')
.attr('class', 'icon inspect');
.attr('class', 'icon inspect');
entries.order();
}