From e49ebe27843e2aa5ee2ff824e6409c48ea864e74 Mon Sep 17 00:00:00 2001 From: samanpwbb Date: Mon, 9 Feb 2015 14:28:55 -0500 Subject: [PATCH] rework save UI --- css/app.css | 13 +++++++++--- data/core.yaml | 6 +++--- dist/locales/en.json | 6 +++--- index.html | 6 ++++++ js/id/modes/save.js | 49 +++++++++++++++++++++++++++++++++++--------- 5 files changed, 61 insertions(+), 19 deletions(-) diff --git a/css/app.css b/css/app.css index 4891a9a4a..6ee7e4466 100644 --- a/css/app.css +++ b/css/app.css @@ -436,6 +436,11 @@ button.action { color: white; } +button[disabled].action { + background: #cccccc; + color: #888; +} + button.action:focus, button.action:hover { background: #597BE7; @@ -2575,8 +2580,6 @@ img.wiki-image { } .error-detail-container { - display: block; - padding: 20px; background: #f6f6f6; border-radius: 3px; margin: 10px 0; @@ -2587,8 +2590,12 @@ img.wiki-image { list-style: disc; } +.error-detail-list { + padding: 20px 20px 10px 20px; +} + .error-choice-buttons { - margin-top: 10px; + padding: 0 20px 20px 20px; } .error-choice-button { diff --git a/data/core.yaml b/data/core.yaml index 3bed0cd43..06c182f76 100644 --- a/data/core.yaml +++ b/data/core.yaml @@ -321,8 +321,8 @@ en: conflict: header: Resolve conflicting edits message: 'Conflicting edits were made to {name}' - keep_local: Keep my changes - keep_remote: Discard my changes + keep_local: Keep mine + keep_remote: Use theirs restore: Restore delete: Leave Deleted annotation: @@ -331,8 +331,8 @@ en: keep_remote: 'Kept remote version of {id}.' restore: 'Restored local version of {id}.' delete: 'Deleted local version of {id}.' - try_again: Try to Save download_changes: Download your changes. + done: "All conflicts resolved!" help: | Another user changed some of the same map features you changed. Click on each item below for more details about the conflict, and choose whether to keep diff --git a/dist/locales/en.json b/dist/locales/en.json index 0e6785614..ebebe12e0 100644 --- a/dist/locales/en.json +++ b/dist/locales/en.json @@ -395,8 +395,8 @@ "conflict": { "header": "Resolve conflicting edits", "message": "Conflicting edits were made to {name}", - "keep_local": "Keep my changes", - "keep_remote": "Discard my changes", + "keep_local": "Keep mine", + "keep_remote": "Use theirs", "restore": "Restore", "delete": "Leave Deleted", "annotation": { @@ -406,8 +406,8 @@ "restore": "Restored local version of {id}.", "delete": "Deleted local version of {id}." }, - "try_again": "Try to Save", "download_changes": "Download your changes.", + "done": "All conflicts resolved!", "help": "Another user changed some of the same map features you changed.\nClick on each item below for more details about the conflict, and choose whether to keep\nyour changes or the other user's changes.\n" } }, diff --git a/index.html b/index.html index 2cf949503..6bf9b4a51 100644 --- a/index.html +++ b/index.html @@ -261,6 +261,12 @@ "oauth_secret": "aMnOOCwExO2XYtRVWJ1bI9QOdqh1cay2UgpbhA6p" } ])); + id.connection() + .switch({ + "url": "http://api06.dev.openstreetmap.org", + "oauth_consumer_key": "zwQZFivccHkLs3a8Rq5CoS412fE5aPCXDw9DZj7R", + "oauth_secret": "aMnOOCwExO2XYtRVWJ1bI9QOdqh1cay2UgpbhA6p" + }); }); diff --git a/js/id/modes/save.js b/js/id/modes/save.js index a5946d468..073c81f87 100644 --- a/js/id/modes/save.js +++ b/js/id/modes/save.js @@ -212,12 +212,13 @@ iD.modes.Save = function(context) { buttons .append('button') + .attr('disabled', true) .attr('class', 'action conflicts-button col6') .on('click.try_again', function() { confirm.remove(); save(e); }) - .text(t('save.conflict.try_again')); + .text(t('save.title')); buttons .append('button') @@ -259,22 +260,35 @@ iD.modes.Save = function(context) { .attr('class', 'error-description') .attr('href', '#') .classed('hide-toggle', true) + .classed('expanded', function(d, i) { + return i === 0; + }) .text(function(d) { return d.msg || t('save.unknown_error_details'); }) .on('click', function() { - var error = d3.select(this), - detail = d3.select(this.nextElementSibling), - exp = error.classed('expanded'); - - detail.style('display', exp ? 'none' : 'block'); - error.classed('expanded', !exp); - + toggleExpanded(this); d3.event.preventDefault(); }); + function toggleExpanded(el) { + var error = d3.select(el), + detail = d3.select(el.nextElementSibling), + exp = error.classed('expanded'); + + detail + .style('opacity', exp ? 1 : 0) + .transition() + .style('opacity', exp ? 0 : 1) + .style('display', exp ? 'none' : 'block'); + + error.classed('expanded', !exp); + }; + var details = enter .append('div') .attr('class', 'error-detail-container') - .style('display', 'none'); + .style('display', function(d,i) { + return i === 0 ? 'block' : 'none'; + }); details .append('ul') @@ -298,7 +312,22 @@ iD.modes.Save = function(context) { .on('click', function(d) { d.action(); d3.event.preventDefault(); - d3.select(this.parentElement.parentElement.parentElement) + var container = this.parentElement.parentElement.parentElement; + var next = container.nextElementSibling; + + window.setTimeout( function() { + if (next) { + toggleExpanded(next.getElementsByTagName('A')[0]); + } else { + d3.select(container.parentElement).append('p') + .text(t('save.conflict.done')); + + d3.select('.conflicts-button') + .attr('disabled', null); + } + }, 250); + + d3.select(container) .transition() .style('opacity', 0) .remove();