diff --git a/modules/services/improveOSM.js b/modules/services/improveOSM.js index b688a2f72..762ef115d 100644 --- a/modules/services/improveOSM.js +++ b/modules/services/improveOSM.js @@ -329,8 +329,6 @@ export default { }); }, - // Test case: - // http://missingroads.skobbler.net/missingGeoService/retrieveComments?tileX=137495&tileY=89379 getComments: function(d, callback) { var key = d.error_key; var qParams = {}; diff --git a/modules/ui/improveOSM_comments.js b/modules/ui/improveOSM_comments.js new file mode 100644 index 000000000..707869b46 --- /dev/null +++ b/modules/ui/improveOSM_comments.js @@ -0,0 +1,92 @@ +import { select as d3_select } from 'd3-selection'; + +import { t } from '../util/locale'; +import { svgIcon } from '../svg'; +import { services } from '../services'; +import { utilDetect } from '../util/detect'; + +export function uiImproveOsmComments() { + var _error; + + + function errorComments(selection) { + // make the div immediately so it appears above the buttons + var comments = selection.selectAll('.comments-container') + .data([0]); + + comments = comments.enter() + .append('div') + .attr('class', 'comments-container') + .merge(comments); + + // must retrieve comments from API before they can be displayed + services.improveOSM.getComments(_error, function(err, d) { + var commentEnter = comments.selectAll('.comment') + .data(_error.comments) + .enter() + .append('div') + .attr('class', 'comment'); + + commentEnter + .append('div') + .attr('class', 'comment-avatar') + .call(svgIcon('#iD-icon-avatar', 'comment-avatar-icon')); + + var mainEnter = commentEnter + .append('div') + .attr('class', 'comment-main'); + + var metadataEnter = mainEnter + .append('div') + .attr('class', 'comment-metadata'); + + metadataEnter + .append('div') + .attr('class', 'comment-author') + .each(function(d) { + var selection = d3_select(this); + var osm = services.osm; + if (osm && d.user) { + selection = selection + .append('a') + .attr('class', 'comment-author-link') + .attr('href', osm.userURL(d.username)) + .attr('tabindex', -1) + .attr('target', '_blank'); + } + selection + .text(function(d) { return d.username }); + }); + + metadataEnter + .append('div') + .attr('class', 'comment-date') + .text(function(d) { + return t('note.status.commented', { when: localeDateString(d.timestamp) }); + }); + + mainEnter + .append('div') + .attr('class', 'comment-text') + .append('p') + .text(function(d) { return d.text; }); + }); + } + + function localeDateString(s) { + if (!s) return null; + var detected = utilDetect(); + var options = { day: 'numeric', month: 'short', year: 'numeric' }; + var d = new Date(s); + if (isNaN(d.getTime())) return null; + return d.toLocaleDateString(detected.locale, options); + } + + errorComments.error = function(val) { + if (!arguments.length) return _error; + _error = val; + return errorComments; + }; + + return errorComments; +} \ No newline at end of file diff --git a/modules/ui/improveOSM_editor.js b/modules/ui/improveOSM_editor.js index b37107fe6..cd43541b7 100644 --- a/modules/ui/improveOSM_editor.js +++ b/modules/ui/improveOSM_editor.js @@ -7,6 +7,7 @@ import { modeBrowse } from '../modes'; import { svgIcon } from '../svg'; import { + uiImproveOsmComments, uiImproveOsmDetails, uiImproveOsmHeader, uiQuickLinks, @@ -19,6 +20,7 @@ import { utilNoAuto, utilRebind } from '../util'; export function uiImproveOsmEditor(context) { var dispatch = d3_dispatch('change'); var errorDetails = uiImproveOsmDetails(context); + var errorComments = uiImproveOsmComments(context); var errorHeader = uiImproveOsmHeader(context); var quickLinks = uiQuickLinks(); @@ -77,6 +79,7 @@ export function uiImproveOsmEditor(context) { .call(errorHeader.error(_error)) .call(quickLinks.choices(choices)) .call(errorDetails.error(_error)) + .call(errorComments.error(_error)) .call(improveOsmSaveSection); } diff --git a/modules/ui/index.js b/modules/ui/index.js index c1361064e..25775c454 100644 --- a/modules/ui/index.js +++ b/modules/ui/index.js @@ -28,6 +28,7 @@ export { uiFormFields } from './form_fields'; export { uiFullScreen } from './full_screen'; export { uiGeolocate } from './geolocate'; export { uiHelp } from './help'; +export { uiImproveOsmComments } from './improveOSM_comments'; export { uiImproveOsmDetails } from './improveOSM_details'; export { uiImproveOsmEditor } from './improveOSM_editor'; export { uiImproveOsmHeader } from './improveOSM_header'; @@ -72,4 +73,4 @@ export { uiUndoRedo } from './undo_redo'; export { uiVersion } from './version'; export { uiViewOnOSM } from './view_on_osm'; export { uiViewOnKeepRight } from './view_on_keepRight'; -export { uiZoom } from './zoom'; +export { uiZoom } from './zoom'; \ No newline at end of file