mirror of
https://github.com/FoggedLens/iD.git
synced 2026-05-24 17:14:04 +02:00
Inline tag reference in tag list (#256)
This commit is contained in:
@@ -70,7 +70,6 @@
|
||||
<script src='js/id/ui/save.js'></script>
|
||||
<script src='js/id/ui/tag_reference.js'></script>
|
||||
<script src='js/id/ui/tail.js'></script>
|
||||
<script src='js/id/ui/key_reference.js'></script>
|
||||
|
||||
<script src='js/id/actions.js'></script>
|
||||
<script src="js/id/actions/add_midpoint.js"></script>
|
||||
|
||||
+5
-1
@@ -1209,7 +1209,7 @@ div.combobox {
|
||||
.tag-row {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 30px;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.tag-row input {
|
||||
@@ -1255,6 +1255,10 @@ div.combobox {
|
||||
left: -20px
|
||||
}
|
||||
|
||||
.tag-row div.tag-help {
|
||||
display: hidden;
|
||||
}
|
||||
|
||||
.tag-row:hover input.value,
|
||||
.tag-row:hover input.key {
|
||||
border-radius: 0;
|
||||
|
||||
@@ -79,7 +79,6 @@
|
||||
<script src='js/id/ui/spinner.js'></script>
|
||||
<script src='js/id/ui/restore.js'></script>
|
||||
<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/lasso.js'></script>
|
||||
<script src='js/id/ui/source_switch.js'></script>
|
||||
|
||||
@@ -1,37 +0,0 @@
|
||||
iD.ui.keyReference = function(selection) {
|
||||
selection.each(function() {
|
||||
|
||||
var selection = d3.select(this),
|
||||
data = selection.datum(),
|
||||
header = selection.append('div')
|
||||
.attr('class','modal-section fillL')
|
||||
.append('h2'),
|
||||
body = selection.append('div')
|
||||
.attr('class', 'modal-section fillL2');
|
||||
|
||||
header.append('span').attr('class', 'icon big icon-pre-text big-' + data.geometry);
|
||||
header.append('span').text(data.title);
|
||||
body.append('h3').text('Common Values');
|
||||
|
||||
var table = body.append('table')
|
||||
.attr('class', 'tags'),
|
||||
thead = table.append('thead');
|
||||
|
||||
thead.append('th').text('Value');
|
||||
thead.append('th').text('Description');
|
||||
thead.append('th').text('Count');
|
||||
|
||||
var rows = table.selectAll('tr')
|
||||
.data(data.data)
|
||||
.enter()
|
||||
.append('tr');
|
||||
|
||||
var cols = rows.selectAll('td')
|
||||
.data(function(d) {
|
||||
return [d.value, d.description || "", d.count];
|
||||
})
|
||||
.enter()
|
||||
.append('td')
|
||||
.text(String);
|
||||
});
|
||||
};
|
||||
+56
-44
@@ -1,50 +1,62 @@
|
||||
iD.ui.tagReference = function(selection) {
|
||||
selection.each(function() {
|
||||
function g(x) { return function(d) { return d[x]; }; }
|
||||
var selection = d3.select(this);
|
||||
var header = selection.append('div')
|
||||
.attr('class','modal-section fillL header')
|
||||
.append('h3');
|
||||
iD.ui.TagReference = function(entity, tag) {
|
||||
var taginfo = iD.taginfo();
|
||||
|
||||
header.selectAll('span.icon')
|
||||
.data(g('types'))
|
||||
.enter()
|
||||
.append('span')
|
||||
.attr('title', function(d) {
|
||||
return t('tag_reference.used_with', {type: d});
|
||||
})
|
||||
.attr('class', function(d) {
|
||||
return 'icon big icon-pre-text big-' + d;
|
||||
function findLocal(docs) {
|
||||
var locale = iD.detect().locale.toLowerCase(),
|
||||
localized;
|
||||
|
||||
localized = _.find(docs, function(d) {
|
||||
return d.lang.toLowerCase() === locale;
|
||||
});
|
||||
if (localized) return localized;
|
||||
|
||||
// try the non-regional version of a language, like
|
||||
// 'en' if the language is 'en-US'
|
||||
if (locale.indexOf('-') !== -1) {
|
||||
var first = locale.split('-')[0];
|
||||
localized = _.find(docs, function(d) {
|
||||
return d.lang.toLowerCase() === first;
|
||||
});
|
||||
header.append('span')
|
||||
.text(g('title'));
|
||||
|
||||
var referenceBody = selection.append('div')
|
||||
.attr('class','modal-section fillL2');
|
||||
|
||||
referenceBody
|
||||
.append('h4')
|
||||
.text(t('tag_reference.description'));
|
||||
|
||||
if (selection.datum().image) {
|
||||
referenceBody
|
||||
.append('img')
|
||||
.attr('class', 'wiki-image')
|
||||
.attr('src', selection.datum().image.image_url);
|
||||
if (localized) return localized;
|
||||
}
|
||||
|
||||
referenceBody
|
||||
.append('p')
|
||||
.text(g('description'));
|
||||
// finally fall back to english
|
||||
return _.find(docs, function(d) {
|
||||
return d.lang.toLowerCase() === 'en';
|
||||
});
|
||||
}
|
||||
|
||||
referenceBody
|
||||
.append('a')
|
||||
.attr('target', '_blank')
|
||||
.attr('href', function(d) {
|
||||
return 'http://wiki.openstreetmap.org/wiki/' + d.title;
|
||||
})
|
||||
.text(function(d) {
|
||||
return t('tag_reference.on_wiki', {tag: d.title});
|
||||
});
|
||||
});
|
||||
return function(selection) {
|
||||
selection.html('');
|
||||
|
||||
taginfo.docs({key: tag.key}, function(err, docs) {
|
||||
if (!err && docs) {
|
||||
docs = findLocal(docs);
|
||||
}
|
||||
|
||||
if (!docs || !docs.description) {
|
||||
return selection.text(t('inspector.no_documentation_key'));
|
||||
}
|
||||
|
||||
var referenceBody = selection.append('div')
|
||||
.attr('class','modal-section fillL2');
|
||||
|
||||
if (docs.image && docs.image.thumb_url_prefix) {
|
||||
referenceBody
|
||||
.append('img')
|
||||
.attr('class', 'wiki-image')
|
||||
.attr('src', docs.image.thumb_url_prefix + "100" + docs.image.thumb_url_suffix);
|
||||
}
|
||||
|
||||
referenceBody
|
||||
.append('p')
|
||||
.text(docs.description);
|
||||
|
||||
referenceBody
|
||||
.append('a')
|
||||
.attr('target', '_blank')
|
||||
.attr('href', 'http://wiki.openstreetmap.org/wiki/' + docs.title)
|
||||
.text(t('inspector.reference'));
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
+11
-75
@@ -94,89 +94,25 @@ iD.ui.Taglist = function(context, entity) {
|
||||
removeBtn.append('span')
|
||||
.attr('class', 'icon delete');
|
||||
|
||||
function findLocal(docs) {
|
||||
var locale = iD.detect().locale.toLowerCase(),
|
||||
localized;
|
||||
|
||||
localized = _.find(docs, function(d) {
|
||||
return d.lang.toLowerCase() === locale;
|
||||
});
|
||||
if (localized) return localized;
|
||||
|
||||
// try the non-regional version of a language, like
|
||||
// 'en' if the language is 'en-US'
|
||||
if (locale.indexOf('-') !== -1) {
|
||||
var first = locale.split('-')[0];
|
||||
localized = _.find(docs, function(d) {
|
||||
return d.lang.toLowerCase() === first;
|
||||
});
|
||||
if (localized) return localized;
|
||||
}
|
||||
|
||||
// finally fall back to english
|
||||
return _.find(docs, function(d) {
|
||||
return d.lang.toLowerCase() === 'en';
|
||||
});
|
||||
}
|
||||
|
||||
function keyValueReference(err, docs) {
|
||||
var local;
|
||||
if (!err && docs) {
|
||||
local = findLocal(docs);
|
||||
}
|
||||
if (local) {
|
||||
var types = [];
|
||||
if (local.on_area) types.push('area');
|
||||
if (local.on_node) types.push('point');
|
||||
if (local.on_way) types.push('line');
|
||||
local.types = types;
|
||||
iD.ui.modal(context.container())
|
||||
.select('.content')
|
||||
.datum(local)
|
||||
.call(iD.ui.tagReference);
|
||||
} else {
|
||||
iD.ui.flash(context.container())
|
||||
.select('.content')
|
||||
.append('h3')
|
||||
.text(t('inspector.no_documentation_combination'));
|
||||
}
|
||||
}
|
||||
|
||||
function keyReference(err, values, params) {
|
||||
if (!err && values.length) {
|
||||
iD.ui.modal(context.container())
|
||||
.select('.content')
|
||||
.datum({
|
||||
data: values,
|
||||
title: 'Key:' + params.key,
|
||||
geometry: params.geometry
|
||||
})
|
||||
.call(iD.ui.keyReference);
|
||||
} else {
|
||||
iD.ui.flash(context.container())
|
||||
.select('.content')
|
||||
.append('h3')
|
||||
.text(t('inspector.no_documentation_key'));
|
||||
}
|
||||
}
|
||||
|
||||
var helpBtn = row.append('button')
|
||||
.attr('tabindex', -1)
|
||||
.attr('class', 'tag-help minor')
|
||||
.on('click', function(d) {
|
||||
var params = _.extend({}, d, {
|
||||
geometry: entity.geometry(context.graph())
|
||||
});
|
||||
if (d.key && d.value) {
|
||||
taginfo.docs(params, keyValueReference);
|
||||
} else if (d.key) {
|
||||
taginfo.values(params, keyReference);
|
||||
}
|
||||
.on('click', function(tag) {
|
||||
row.selectAll('div.tag-help')
|
||||
.style('display', 'none');
|
||||
|
||||
d3.select(d3.select(this).node().parentNode)
|
||||
.select('div.tag-help')
|
||||
.style('display', 'block')
|
||||
.call(iD.ui.TagReference(entity, tag));
|
||||
});
|
||||
|
||||
helpBtn.append('span')
|
||||
.attr('class', 'icon inspect');
|
||||
|
||||
row.append('div')
|
||||
.attr('class', 'tag-help');
|
||||
|
||||
if (initial && tags.length === 1 &&
|
||||
tags[0].key === '' && tags[0].value === '') {
|
||||
focusNewKey();
|
||||
|
||||
@@ -81,7 +81,6 @@
|
||||
<script src='../js/id/ui/splash.js'></script>
|
||||
<script src='../js/id/ui/restore.js'></script>
|
||||
<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/lasso.js'></script>
|
||||
<script src='../js/id/ui/source_switch.js'></script>
|
||||
|
||||
Reference in New Issue
Block a user