mirror of
https://github.com/FoggedLens/iD.git
synced 2026-05-16 05:49:16 +02:00
Clean up
This commit is contained in:
+106
-106
@@ -1,115 +1,38 @@
|
||||
iD.ui.Help = function(context) {
|
||||
|
||||
var key = 'h';
|
||||
|
||||
var docKeys = [
|
||||
'help.help',
|
||||
'help.editing_saving',
|
||||
'help.roads',
|
||||
'help.gps',
|
||||
'help.imagery',
|
||||
'help.addresses',
|
||||
'help.inspector',
|
||||
'help.buildings',
|
||||
'help.relations'];
|
||||
|
||||
var docs = docKeys.map(function(key) {
|
||||
var text = t(key);
|
||||
return {
|
||||
title: text.split('\n')[0].replace('#', '').trim(),
|
||||
html: marked(text.split('\n').slice(1).join('\n'))
|
||||
};
|
||||
});
|
||||
|
||||
function help(selection) {
|
||||
var shown = false;
|
||||
|
||||
var shown = false, pane;
|
||||
|
||||
function setup() {
|
||||
pane = context.container()
|
||||
.select('.help-wrap')
|
||||
.html('');
|
||||
|
||||
var toc = pane.append('ul')
|
||||
.attr('class', 'toc');
|
||||
|
||||
function clickHelp(d, i) {
|
||||
pane.property('scrollTop', 0);
|
||||
doctitle.text(d.title);
|
||||
body.html(d.html);
|
||||
body.selectAll('a')
|
||||
.attr('target', '_blank');
|
||||
menuItems.classed('selected', function(m) {
|
||||
return m.title === d.title;
|
||||
});
|
||||
|
||||
nav.html('');
|
||||
|
||||
if (i > 0) {
|
||||
var prevLink = nav.append('a')
|
||||
.attr('class', 'previous')
|
||||
.on('click', function() {
|
||||
clickHelp(docs[i - 1], i - 1);
|
||||
});
|
||||
prevLink.append('span').attr('class', 'icon back blue');
|
||||
prevLink.append('span').text(docs[i - 1].title);
|
||||
}
|
||||
if (i < docs.length - 1) {
|
||||
var nextLink = nav.append('a')
|
||||
.attr('class', 'next')
|
||||
.on('click', function() {
|
||||
clickHelp(docs[i + 1], i + 1);
|
||||
});
|
||||
nextLink.append('span').text(docs[i + 1].title);
|
||||
nextLink.append('span').attr('class', 'icon forward blue');
|
||||
}
|
||||
}
|
||||
|
||||
var docKeys = [
|
||||
'help.help',
|
||||
'help.editing_saving',
|
||||
'help.roads',
|
||||
'help.gps',
|
||||
'help.imagery',
|
||||
'help.addresses',
|
||||
'help.inspector',
|
||||
'help.buildings',
|
||||
'help.relations'];
|
||||
|
||||
function one(f) { return function(x) { return f(x); }; }
|
||||
var docs = docKeys.map(one(t)).map(function(text) {
|
||||
return {
|
||||
title: text.split('\n')[0].replace('#', '').trim(),
|
||||
html: marked(text.split('\n').slice(1).join('\n'))
|
||||
};
|
||||
});
|
||||
|
||||
var menuItems = toc.selectAll('li')
|
||||
.data(docs)
|
||||
.enter()
|
||||
.append('li')
|
||||
.append('a')
|
||||
.text(function(d) { return d.title; })
|
||||
.on('click', clickHelp);
|
||||
|
||||
toc.append('li')
|
||||
.attr('class','walkthrough')
|
||||
.append('a')
|
||||
.text(t('splash.walkthrough'))
|
||||
.on('click', function() {
|
||||
d3.select(document.body).call(iD.ui.intro(context));
|
||||
setVisible(false);
|
||||
});
|
||||
|
||||
var content = pane.append('div')
|
||||
.attr('class', 'left-content'),
|
||||
doctitle = content.append('h2')
|
||||
.text(t('help.title')),
|
||||
body = content.append('div')
|
||||
.attr('class', 'body'),
|
||||
nav = content.append('div')
|
||||
.attr('class', 'nav');
|
||||
|
||||
clickHelp(docs[0], 0);
|
||||
function hide() {
|
||||
setVisible(false);
|
||||
}
|
||||
|
||||
function hide() { setVisible(false); }
|
||||
function toggle() {
|
||||
if (d3.event) d3.event.preventDefault();
|
||||
tooltip.hide(button);
|
||||
setVisible(!button.classed('active'));
|
||||
}
|
||||
|
||||
function blockClick() {
|
||||
pane.on('mousedown.help-inside', function() {
|
||||
return d3.event.stopPropagation();
|
||||
});
|
||||
selection.on('mousedown.help-inside', function() {
|
||||
return d3.event.stopPropagation();
|
||||
});
|
||||
}
|
||||
|
||||
function setVisible(show) {
|
||||
if (show !== shown) {
|
||||
button.classed('active', show);
|
||||
@@ -119,8 +42,7 @@ iD.ui.Help = function(context) {
|
||||
.style('right', '-500px')
|
||||
.transition()
|
||||
.duration(200)
|
||||
.style('right', '0px')
|
||||
.each('end', blockClick);
|
||||
.style('right', '0px');
|
||||
} else {
|
||||
pane.style('right', '0px')
|
||||
.transition()
|
||||
@@ -129,11 +51,47 @@ iD.ui.Help = function(context) {
|
||||
.each('end', function() {
|
||||
d3.select(this).style('display', 'none');
|
||||
});
|
||||
pane.on('mousedown.help-inside', null);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function clickHelp(d, i) {
|
||||
pane.property('scrollTop', 0);
|
||||
doctitle.text(d.title);
|
||||
body.html(d.html);
|
||||
body.selectAll('a')
|
||||
.attr('target', '_blank');
|
||||
menuItems.classed('selected', function(m) {
|
||||
return m.title === d.title;
|
||||
});
|
||||
|
||||
nav.html('');
|
||||
|
||||
if (i > 0) {
|
||||
var prevLink = nav.append('a')
|
||||
.attr('class', 'previous')
|
||||
.on('click', function() {
|
||||
clickHelp(docs[i - 1], i - 1);
|
||||
});
|
||||
prevLink.append('span').attr('class', 'icon back blue');
|
||||
prevLink.append('span').text(docs[i - 1].title);
|
||||
}
|
||||
if (i < docs.length - 1) {
|
||||
var nextLink = nav.append('a')
|
||||
.attr('class', 'next')
|
||||
.on('click', function() {
|
||||
clickHelp(docs[i + 1], i + 1);
|
||||
});
|
||||
nextLink.append('span').text(docs[i + 1].title);
|
||||
nextLink.append('span').attr('class', 'icon forward blue');
|
||||
}
|
||||
}
|
||||
|
||||
function clickWalkthrough() {
|
||||
d3.select(document.body).call(iD.ui.intro(context));
|
||||
setVisible(false);
|
||||
}
|
||||
|
||||
var tooltip = bootstrap.tooltip()
|
||||
.placement('left')
|
||||
.html(true)
|
||||
@@ -147,14 +105,56 @@ iD.ui.Help = function(context) {
|
||||
button.append('span')
|
||||
.attr('class', 'icon help light');
|
||||
|
||||
var pane = context.container()
|
||||
.select('.help-wrap');
|
||||
|
||||
var toc = pane.append('ul')
|
||||
.attr('class', 'toc');
|
||||
|
||||
var menuItems = toc.selectAll('li')
|
||||
.data(docs)
|
||||
.enter()
|
||||
.append('li')
|
||||
.append('a')
|
||||
.text(function(d) { return d.title; })
|
||||
.on('click', clickHelp);
|
||||
|
||||
toc.append('li')
|
||||
.attr('class','walkthrough')
|
||||
.append('a')
|
||||
.text(t('splash.walkthrough'))
|
||||
.on('click', clickWalkthrough);
|
||||
|
||||
var content = pane.append('div')
|
||||
.attr('class', 'left-content');
|
||||
|
||||
var doctitle = content.append('h2')
|
||||
.text(t('help.title'));
|
||||
|
||||
var body = content.append('div')
|
||||
.attr('class', 'body');
|
||||
|
||||
var nav = content.append('div')
|
||||
.attr('class', 'nav');
|
||||
|
||||
clickHelp(docs[0], 0);
|
||||
|
||||
var keybinding = d3.keybinding('help')
|
||||
.on(key, toggle);
|
||||
|
||||
d3.select(document)
|
||||
.call(keybinding);
|
||||
|
||||
context.surface().on('mousedown.help-outside', hide);
|
||||
context.container().on('mousedown.b.help-outside', hide);
|
||||
|
||||
setup();
|
||||
pane.on('mousedown.help-inside', function() {
|
||||
return d3.event.stopPropagation();
|
||||
});
|
||||
|
||||
var keybinding = d3.keybinding('help');
|
||||
keybinding.on(key, toggle);
|
||||
d3.select(document).call(keybinding);
|
||||
selection.on('mousedown.help-inside', function() {
|
||||
return d3.event.stopPropagation();
|
||||
});
|
||||
}
|
||||
|
||||
return help;
|
||||
|
||||
Reference in New Issue
Block a user