CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-05-18 14:45:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' of github.com:systemed/iD

Browse Source
This commit is contained in:
Tom MacWright
2013-03-05 15:44:41 -05:00
parent 64200b9920 4fb8688d83
commit 21bd81e890
22 changed files with 220 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files
combobox.html
+1 -1
View File
@@ -61,7 +61,7 @@
<script src='js/id/ui/success.js'></script>
<script src='js/id/ui/loading.js'></script>
<script src='js/id/ui/account.js'></script>
<script src='js/id/ui/layerswitcher.js'></script>
<script src='js/id/ui/background.js'></script>
<script src='js/id/ui/contributors.js'></script>
<script src='js/id/ui/geocoder.js'></script>
<script src='js/id/ui/geolocate.js'></script>
css/app.css
+19 -21
View File
@@ -963,9 +963,9 @@ div.combobox {
border-top:0;
}
/* Layer Switcher */
/* Background Settings */
.layerswitcher-control {
.background-control {
top:190px;
}
@@ -973,7 +973,7 @@ div.combobox {
margin-top: 10px;
}
.layerswitcher-control .adjustments button {
.background-control .adjustments button {
height:30px;
font-size:10px;
padding:0 5px 3px 5px;
@@ -982,7 +982,7 @@ div.combobox {
font-weight: bold;
}
.layerswitcher-control .adjustments button:hover {
.background-control .adjustments button:hover {
background:#ececec;
}
@@ -1012,7 +1012,7 @@ div.combobox {
border-left: 4px solid transparent;
}
.layerswitcher-control .nudge {
.background-control .nudge {
text-indent: -9999px;
overflow: hidden;
width:16.6666%;
@@ -1021,7 +1021,7 @@ div.combobox {
position: relative;
}
.layerswitcher-control .nudge::after {
.background-control .nudge::after {
content: '';
display: block;
position: absolute;
@@ -1031,35 +1031,35 @@ div.combobox {
width: 0;
}
.layerswitcher-control .nudge.left::after {
.background-control .nudge.left::after {
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 5px solid #222;
}
.layerswitcher-control .nudge.right::after {
.background-control .nudge.right::after {
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-right: 5px solid #222;
}
.layerswitcher-control .nudge.top::after {
.background-control .nudge.top::after {
border-right: 5px solid transparent;
border-left: 5px solid transparent;
border-bottom: 5px solid #222;
}
.layerswitcher-control .nudge.bottom::after {
.background-control .nudge.bottom::after {
border-right: 5px solid transparent;
border-left: 5px solid transparent;
border-top: 5px solid #222;
}
.layerswitcher-control .nudge:first-child {
.background-control .nudge:first-child {
border-radius: 4px 0 0 4px;
}
.layerswitcher-control .reset {
.background-control .reset {
width: 33.3333%;
border-radius: 0 4px 4px 0;
}
@@ -1092,18 +1092,18 @@ div.combobox {
z-index: 9999;
}
.layerswitcher-control li:hover .select-box,
.layerswitcher-control li.selected .select-box {
.background-control li:hover .select-box,
.background-control li.selected .select-box {
border: 2px solid #7092ff;
background: rgba(89, 123, 231, .5);
opacity: .5;
}
.layerswitcher-control li.selected:hover .select-box,
.layerswitcher-control li.selected .select-box {
.background-control li.selected:hover .select-box,
.background-control li.selected .select-box {
opacity: 1;
}
.layerswitcher-control .opacity {
.background-control .opacity {
background:#222;
display:inline-block;
width:20px;
@@ -1528,16 +1528,14 @@ a.success-action {
.tooltip {
width: 200px;
position: absolute;
z-index: -1000;
height: 0;
opacity: 0;
display: block;
display: none;
}
.tooltip.in {
opacity: 0.8;
z-index: 1030;
height: auto;
display: block;
}
.tooltip.top {
index.html
+1 -1
View File
@@ -72,7 +72,7 @@
<script src='js/id/ui/success.js'></script>
<script src='js/id/ui/loading.js'></script>
<script src='js/id/ui/account.js'></script>
<script src='js/id/ui/layerswitcher.js'></script>
<script src='js/id/ui/background.js'></script>
<script src='js/id/ui/modes.js'></script>
<script src='js/id/ui/contributors.js'></script>
<script src='js/id/ui/geocoder.js'></script>
js/id/ui.js
+2 -2
View File
@@ -57,8 +57,8 @@ iD.ui = function(context) {
.call(iD.ui.Geocoder(context));
container.append('div')
.attr('class', 'map-control layerswitcher-control')
.call(iD.ui.LayerSwitcher(context));
.attr('class', 'map-control background-control')
.call(iD.ui.Background(context));
container.append('div')
.attr('class', 'map-control geolocate-control')
js/id/ui/layerswitcher.js → js/id/ui/background.js
+71 -66
View File
@@ -1,4 +1,4 @@
iD.ui.LayerSwitcher = function(context) {
iD.ui.Background = function(context) {
var event = d3.dispatch('cancel', 'save'),
opacities = [1, 0.5, 0];
@@ -12,27 +12,29 @@ iD.ui.LayerSwitcher = function(context) {
});
}
function layerswitcher(selection) {
function background(selection) {
var content = selection
.append('div').attr('class', 'content fillD map-overlay hide'),
var content = selection.append('div')
.attr('class', 'content fillD map-overlay hide'),
shown = false;
var tooltip = bootstrap.tooltip().placement('right');
var tooltip = bootstrap.tooltip()
.placement('right');
var button = selection
.append('button')
var button = selection.append('button')
.attr('tabindex', -1)
.attr('class', 'fillD')
.attr('title', t('layerswitcher.description'))
.on('click.layerswitcher-toggle', toggle)
.attr('title', t('background.description'))
.on('click.background-toggle', toggle)
.call(tooltip);
button.append('span')
.attr('class', 'layers icon');
function hide() { setVisible(false); }
function toggle() { tooltip.hide(button); setVisible(content.classed('hide')); }
function toggle() {
tooltip.hide(button);
setVisible(content.classed('hide'));
}
function setVisible(show) {
if (show !== shown) {
@@ -42,18 +44,20 @@ iD.ui.LayerSwitcher = function(context) {
}
}
function clickoutside(selection) {
selection.on('click.layerswitcher-inside', function() {
return d3.event.stopPropagation();
});
context.container().on('click.layerswitcher-outside', hide);
}
selection.on('click.background-inside', function() {
return d3.event.stopPropagation();
});
context.container().on('click.background-outside', function() {
setVisible(false);
});
var opa = content
.append('div')
.attr('class', 'opacity-options-wrapper');
opa.append('h4').text(t('layerswitcher.title'));
opa.append('h4')
.text(t('background.title'));
var opacityList = opa.append('ul')
.attr('class', 'opacity-options');
@@ -73,18 +77,20 @@ iD.ui.LayerSwitcher = function(context) {
.data(opacities)
.enter()
.append('li')
.attr('data-original-title', function(d) {
return t('layerswitcher.percent_brightness', { opacity: (d * 100) });
})
.on('click.set-opacity', setOpacity)
.html("<div class='select-box'></div>")
.call(bootstrap.tooltip().placement('top'))
.append('div')
.attr('class', 'opacity')
.style('opacity', String);
.attr('data-original-title', function(d) {
return t('background.percent_brightness', { opacity: (d * 100) });
})
.on('click.set-opacity', setOpacity)
.html("<div class='select-box'></div>")
.call(bootstrap.tooltip()
.placement('top'))
.append('div')
.attr('class', 'opacity')
.style('opacity', String);
// Make sure there is an active selection by default
opa.select('.opacity-options li:nth-child(2)').classed('selected', true);
opa.select('.opacity-options li:nth-child(2)')
.classed('selected', true);
function selectLayer(d) {
@@ -137,32 +143,40 @@ iD.ui.LayerSwitcher = function(context) {
.data(getSources(), function(d) {
return d.data.name;
});
layerLinks.exit().remove();
var LayerInner = layerLinks.enter()
var layerInner = layerLinks.enter()
.append('li')
.append('a')
.attr('data-original-title', function(d) {
return d.data.description || '';
})
.attr('href', '#')
.attr('class', 'layer')
.each(function(d) {
// only set tooltips for layers with tooltips
if (d.data.description) {
d3.select(this).call(bootstrap.tooltip().placement('right'));
}
})
.on('click.set-source', clickSetSource);
LayerInner.insert('span')
.attr('class','icon toggle');
LayerInner.insert('span').text(function(d) {
return d.data.name;
});
.append('a');
layerInner
.attr('href', '#')
.attr('class', 'layer')
.on('click.set-source', clickSetSource);
// only set tooltips for layers with tooltips
layerInner
.filter(function(d) { return d.data.description; })
.call(bootstrap.tooltip()
.title(function(d) { return d.data.description; })
.placement('right')
);
layerInner.insert('span')
.attr('class', 'icon toggle');
layerInner.insert('span').text(function(d) {
return d.data.name;
});
layerLinks.exit()
.remove();
selectLayer(context.background().source());
}
context.map().on('move.layerswitcher-update', _.debounce(update, 1000));
context.map().on('move.background-update', _.debounce(update, 1000));
update();
var adjustments = content
.append('div')
@@ -174,23 +188,14 @@ iD.ui.LayerSwitcher = function(context) {
['right', [1, 0]],
['bottom', [0, 1]]];
function nudge(d) {
context.background().nudge(d[1], context.map().zoom());
context.redraw();
}
adjustments.append('a')
.text(t('layerswitcher.fix_misalignment'))
.text(t('background.fix_misalignment'))
.attr('href', '#')
.classed('hide-toggle', true)
.classed('expanded', false)
.on('click', function() {
var exp = d3.select(this).classed('expanded');
if (!exp) {
nudge_container.style('display', 'block');
} else {
nudge_container.style('display', 'none');
}
nudge_container.style('display', exp ? 'none' : 'block');
d3.select(this).classed('expanded', !exp);
d3.event.preventDefault();
});
@@ -205,19 +210,19 @@ iD.ui.LayerSwitcher = function(context) {
.append('button')
.attr('class', function(d) { return d[0] + ' nudge'; })
.text(function(d) { return d[0]; })
.on('click', nudge);
.on('click', function(d) {
context.background().nudge(d[1], context.map().zoom());
context.redraw();
});
nudge_container.append('button')
.text(t('layerswitcher.reset'))
.text(t('background.reset'))
.attr('class', 'reset')
.on('click', function() {
context.background().offset([0, 0]);
context.redraw();
});
selection.call(clickoutside);
selectLayer(context.background().source());
}
return d3.rebind(layerswitcher, event, 'on');
return d3.rebind(background, event, 'on');
};
locale/da.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.da = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Baggrund",
description: "Baggrundsindstillinger",
percent_brightness: "{opacity}% lysstyrke",
locale/de.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.de = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Hintergrund",
description: "Hintergrundeinstellungen",
percent_brightness: "{opacity}% Helligkeit",
locale/en.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.en = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Background",
description: "Background Settings",
percent_brightness: "{opacity}% brightness",
locale/es.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.es = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Fondo", //"Background",
description: "Configuración de fondo", //"Background Settings",
percent_brightness: "{opacity}% brillo", //"{opacity}% brightness",
locale/fr.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.fr = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Fond de carte",
description: "Paramètres du fond de carte",
percent_brightness: "{opacity}% luminosité",
locale/it.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.it = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Sfondo",
description: "Impostazioni dello sfondo",
percent_brightness: "{opacity}% opacità",
locale/ja.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.ja = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "背景画像",
description: "背景画像設定",
percent_brightness: "{opacity}% 輝度",
locale/lv.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.lv = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Fons",
description: "Fona iestatījumi",
percent_brightness: "{opacity}% caurspīdīgums",
locale/nl.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.nl = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Achtergrond",
description: "Achtergrondinstellingen",
percent_brightness: "{opacity}% helderheid",
locale/pl.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.pl = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Tło",
description: "Ustawienia tła",
percent_brightness: "jasność {opacity}%",
locale/ru.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.ru = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Подложка",
description: "Настройка подложки",
percent_brightness: "яркость {opacity}%",
locale/tr.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.tr = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Arkaplan",
description: "Arkaplan Ayarları",
percent_brightness: "{opacity}% parlaklık",
locale/uk.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.uk = {
results: "{n} results for {search}"
},
layerswitcher: {
background: {
title: "Фон",
description: "Налаштування фону",
percent_brightness: "прозорість {opacity}%",
locale/vi.js
+1 -1
View File
@@ -188,7 +188,7 @@ locale.vi = {
results: "{n} kết quả cho {search}"
},
layerswitcher: {
background: {
title: "Hình nền",
description: "Tùy chọn Hình nền",
percent_brightness: "Sáng {opacity}%",
test/index.html
+3 -1
View File
@@ -75,7 +75,7 @@
<script src='../js/id/ui/success.js'></script>
<script src='../js/id/ui/loading.js'></script>
<script src='../js/id/ui/account.js'></script>
<script src='../js/id/ui/layerswitcher.js'></script>
<script src='../js/id/ui/background.js'></script>
<script src='../js/id/ui/modes.js'></script>
<script src='../js/id/ui/contributors.js'></script>
<script src='../js/id/ui/geocoder.js'></script>
@@ -254,6 +254,8 @@
<script src="spec/modes/add_point.js"></script>
<script src="spec/presets/preset.js"></script>
<script src="spec/presets/collection.js"></script>
<script src="spec/presets/category.js"></script>
<script>
(window.mochaPhantomJS || window.mocha).run();
test/spec/presets/category.js
+41
View File
@@ -0,0 +1,41 @@
describe("iD.presets.Category", function() {
var category, residential;
beforeEach(function() {
category = {
"match": {
"type": "line"
},
"icon": "highway",
"name": "roads",
"members": [
"residential"
]
};
residential = iD.presets.Preset({
name: 'residential',
match: {
tags: {
highway: 'residential'
},
type: ['line']
}
});
});
it("maps members names to preset instances", function() {
var c = iD.presets.Category(category, iD.presets.Collection([residential]));
expect(c.members.collection[0]).to.eql(residential);
});
describe("#matchType", function() {
it("matches the type of an entity", function() {
var c = iD.presets.Category(category, iD.presets.Collection([residential])),
w = iD.Way(),
n = iD.Node(),
g = iD.Graph().replace(w);
expect(c.matchType(w, g)).to.eql(true);
expect(c.matchType(n, g)).to.eql(false);
});
});
});
test/spec/presets/collection.js
+68
View File
@@ -0,0 +1,68 @@
describe("iD.prests.Collection", function() {
var p = {
other: iD.presets.Preset({
name: 'other',
match: {
tags: {},
type: ['point', 'vertex', 'line', 'area']
}
}),
residential: iD.presets.Preset({
name: 'residential',
match: {
tags: {
highway: 'residential'
},
type: ['line']
}
}),
park: iD.presets.Preset({
name: 'park',
match: {
tags: {
leisure: 'park'
},
type: ['point', 'area']
}
})
};
var c = iD.presets.Collection([p.other, p.residential]),
n = iD.Node( { id: 'n1' }),
w = iD.Way({ tags: { highway: 'residential' }}),
g = iD.Graph().replace(w);
describe("#item", function() {
it("fetches a preset by name", function() {
expect(c.item('residential')).to.equal(p.residential);
});
});
describe("#matchType", function() {
it("returns a new collection only containing presets matching an entity's type", function() {
expect(c.matchType(w, g).collection).to.eql([p.other, p.residential]);
});
});
describe("#matchTags", function() {
it("returns a new collection only containing presets matching an entity's tags", function() {
expect(c.matchTags(w, g)).to.eql(p.residential);
});
});
describe("#search", function() {
it("filters presets by name", function() {
expect(c.search("resid").collection.indexOf(p.residential) >= 0).to.eql(true);
});
it("is fuzzy", function() {
expect(c.search("rusid").collection.indexOf(p.residential) >= 0).to.eql(true);
});
it("always includes other", function() {
expect(c.search("blade of grass").collection.indexOf(p.other) >= 0).to.eql(true);
});
});
});