From 72afc6dcb95c267b268fea5473bbde07cc8b6ff4 Mon Sep 17 00:00:00 2001 From: Tom MacWright Date: Mon, 14 Jan 2013 14:00:51 -0500 Subject: [PATCH] Namespace UI components --- Makefile | 1 + index.html | 1 + js/id/id.js | 14 +++++++------- js/id/modes/select.js | 2 +- js/id/oauth.js | 4 ++-- js/id/ui.js | 1 + js/id/ui/commit.js | 4 ++-- js/id/ui/confirm.js | 4 ++-- js/id/ui/contributors.js | 2 +- js/id/ui/flash.js | 4 ++-- js/id/ui/geocoder.js | 4 ++-- js/id/ui/geolocate.js | 2 +- js/id/ui/inspector.js | 12 ++++++------ js/id/ui/key_reference.js | 2 +- js/id/ui/layerswitcher.js | 2 +- js/id/ui/loading.js | 4 ++-- js/id/ui/modal.js | 2 +- js/id/ui/notice.js | 2 +- js/id/ui/save.js | 12 ++++++------ js/id/ui/success.js | 2 +- js/id/ui/tag_reference.js | 2 +- js/id/ui/userpanel.js | 2 +- test/index.html | 1 + test/spec/ui/geocoder.js | 4 ++-- test/spec/ui/inspector.js | 4 ++-- 25 files changed, 49 insertions(+), 45 deletions(-) create mode 100644 js/id/ui.js diff --git a/Makefile b/Makefile index 6d585865f..2819f2884 100644 --- a/Makefile +++ b/Makefile @@ -41,6 +41,7 @@ all: \ js/id/renderer/*.js \ js/id/svg.js \ js/id/svg/*.js \ + js/id/ui.js \ js/id/ui/*.js \ js/id/end.js diff --git a/index.html b/index.html index 13b7350c1..8e86da888 100644 --- a/index.html +++ b/index.html @@ -46,6 +46,7 @@ + diff --git a/js/id/id.js b/js/id/id.js index 85336a105..712656cd6 100644 --- a/js/id/id.js +++ b/js/id/id.js @@ -46,13 +46,13 @@ window.iD = function(container) { } } - notice = iD.notice(bar + notice = iD.ui.notice(bar .append('div') .attr('class', 'notice')); map.on('move.disable-buttons', disableTooHigh) .on('move.contributors', _.debounce(function() { - contributors.call(iD.contributors(map)); + contributors.call(iD.ui.contributors(map)); }, 1000)); buttons.append('span') @@ -96,7 +96,7 @@ window.iD = function(container) { var save_button = bar.append('button') .attr('class', 'save action wide') - .call(iD.save().map(map)); + .call(iD.ui.save().map(map)); history.on('change.warn-unload', function() { var changes = history.changes(), @@ -129,14 +129,14 @@ window.iD = function(container) { if (navigator.geolocation) { container.append('div') - .call(iD.geolocate(map)); + .call(iD.ui.geolocate(map)); } var gc = container.append('div').attr('class', 'geocode-control map-control') - .call(iD.geocoder().map(map)); + .call(iD.ui.geocoder().map(map)); container.append('div').attr('class', 'map-control layerswitcher-control') - .call(iD.layerswitcher(map)); + .call(iD.ui.layerswitcher(map)); container.append('div') .attr('class', 'inspector-wrap fillL') @@ -209,7 +209,7 @@ window.iD = function(container) { .center([-77.02271,38.90085]); } - d3.select('.user-container').call(iD.userpanel(connection) + d3.select('.user-container').call(iD.ui.userpanel(connection) .on('logout', connection.logout) .on('login', connection.authenticate)); diff --git a/js/id/modes/select.js b/js/id/modes/select.js index 61a38d77a..d5e39cdb7 100644 --- a/js/id/modes/select.js +++ b/js/id/modes/select.js @@ -5,7 +5,7 @@ iD.modes.Select = function (entity) { entity: entity }; - var inspector = iD.Inspector(), + var inspector = iD.ui.inspector(), behaviors; function remove() { diff --git a/js/id/oauth.js b/js/id/oauth.js index c6a2cd0e1..56a7f4001 100644 --- a/js/id/oauth.js +++ b/js/id/oauth.js @@ -67,7 +67,7 @@ iD.OAuth = function() { o.oauth_signature = ohauth.signature(oauth_secret, '', ohauth.baseString('POST', url, o)); - var l = iD.loading('contacting openstreetmap...'); + var l = iD.ui.loading('contacting openstreetmap...'); // it would make more sense to have this code within the callback // to oauth.xhr below. however, it needs to be directly within a @@ -116,7 +116,7 @@ iD.OAuth = function() { var request_token_secret = token('oauth_request_token_secret'); o.oauth_signature = ohauth.signature(oauth_secret, request_token_secret, ohauth.baseString('POST', url, o)); - var l = iD.loading('contacting openstreetmap...'); + var l = iD.ui.loading('contacting openstreetmap...'); function accessTokenDone(err, xhr) { if (err) callback(err); diff --git a/js/id/ui.js b/js/id/ui.js new file mode 100644 index 000000000..8901175f4 --- /dev/null +++ b/js/id/ui.js @@ -0,0 +1 @@ +iD.ui = {}; diff --git a/js/id/ui/commit.js b/js/id/ui/commit.js index 4af3b3ab9..547f4505f 100644 --- a/js/id/ui/commit.js +++ b/js/id/ui/commit.js @@ -1,6 +1,6 @@ -iD.commit = function() { +iD.ui.commit = function() { var event = d3.dispatch('cancel', 'save'); - + function zipSame(d) { var c = [], n = -1; for (var i = 0; i < d.length; i++) { diff --git a/js/id/ui/confirm.js b/js/id/ui/confirm.js index 84a8d6c87..11515996e 100644 --- a/js/id/ui/confirm.js +++ b/js/id/ui/confirm.js @@ -1,5 +1,5 @@ -iD.confirm = function() { - var modal = iD.modal(); +iD.ui.confirm = function() { + var modal = iD.ui.modal(); modal.select('.modal').classed('modal-alert', true); modal.select('.content') .classed('modal-section', true) diff --git a/js/id/ui/contributors.js b/js/id/ui/contributors.js index 6ac0e9d36..72dedf1d1 100644 --- a/js/id/ui/contributors.js +++ b/js/id/ui/contributors.js @@ -1,4 +1,4 @@ -iD.contributors = function(map) { +iD.ui.contributors = function(map) { function contributors(selection) { diff --git a/js/id/ui/flash.js b/js/id/ui/flash.js index 2b0f9def7..7b3b00628 100644 --- a/js/id/ui/flash.js +++ b/js/id/ui/flash.js @@ -1,5 +1,5 @@ -iD.flash = function() { - var modal = iD.modal(); +iD.ui.flash = function() { + var modal = iD.ui.modal(); modal.select('.modal').classed('modal-alert', true); diff --git a/js/id/ui/geocoder.js b/js/id/ui/geocoder.js index b3372b899..fd061e619 100644 --- a/js/id/ui/geocoder.js +++ b/js/id/ui/geocoder.js @@ -1,4 +1,4 @@ -iD.geocoder = function() { +iD.ui.geocoder = function() { var map; @@ -11,7 +11,7 @@ iD.geocoder = function() { if (err) return hide(); hide(); if (!resp.results.length) { - return iD.flash() + return iD.ui.flash() .select('.content') .text('No location found for "' + resp.query[0] + '"'); } diff --git a/js/id/ui/geolocate.js b/js/id/ui/geolocate.js index 1d4e1a491..906c031c4 100644 --- a/js/id/ui/geolocate.js +++ b/js/id/ui/geolocate.js @@ -1,4 +1,4 @@ -iD.geolocate = function(map) { +iD.ui.geolocate = function(map) { function success(position) { map.center([position.coords.longitude, position.coords.latitude]); diff --git a/js/id/ui/inspector.js b/js/id/ui/inspector.js index c92162ba2..10adc0cf6 100644 --- a/js/id/ui/inspector.js +++ b/js/id/ui/inspector.js @@ -1,4 +1,4 @@ -iD.Inspector = function() { +iD.ui.inspector = function() { var event = d3.dispatch('changeTags', 'changeWayDirection', 'update', 'remove', 'close', 'splitWay'), taginfo = iD.taginfo(), @@ -155,12 +155,12 @@ iD.Inspector = function() { if (en.on_way) types.push('line'); en.types = types; console.log(en); - iD.modal() + iD.ui.modal() .select('.content') .datum(en) - .call(iD.tagReference); + .call(iD.ui.tagReference); } else { - iD.flash() + iD.ui.flash() .select('.content') .text('This is no documentation available for this tag combination'); } @@ -168,7 +168,7 @@ iD.Inspector = function() { } else if (d.key) { taginfo.values(params, function(err, values) { if (values.data.length) { - iD.modal() + iD.ui.modal() .select('.content') .datum({ data: values.data, @@ -177,7 +177,7 @@ iD.Inspector = function() { }) .call(iD.keyReference); } else { - iD.flash() + iD.ui.flash() .select('.content') .text('This is no documentation available for this key'); } diff --git a/js/id/ui/key_reference.js b/js/id/ui/key_reference.js index 0fcdd1d04..5810018f1 100644 --- a/js/id/ui/key_reference.js +++ b/js/id/ui/key_reference.js @@ -1,4 +1,4 @@ -iD.keyReference = function(selection) { +iD.ui.keyReference = function(selection) { selection.each(function() { var selection = d3.select(this), diff --git a/js/id/ui/layerswitcher.js b/js/id/ui/layerswitcher.js index e8a62c0bb..a2acad1b5 100644 --- a/js/id/ui/layerswitcher.js +++ b/js/id/ui/layerswitcher.js @@ -1,4 +1,4 @@ -iD.layerswitcher = function(map) { +iD.ui.layerswitcher = function(map) { var event = d3.dispatch('cancel', 'save'), sources = [{ name: 'Bing', diff --git a/js/id/ui/loading.js b/js/id/ui/loading.js index 6ba7524e9..d5bd97625 100644 --- a/js/id/ui/loading.js +++ b/js/id/ui/loading.js @@ -1,5 +1,5 @@ -iD.loading = function(message) { - var modal = iD.modal(); +iD.ui.loading = function(message) { + var modal = iD.ui.modal(); var loadertext = modal.select('.content') .classed('loading-modal', true) diff --git a/js/id/ui/modal.js b/js/id/ui/modal.js index 3b90f63e3..fed97a0a1 100644 --- a/js/id/ui/modal.js +++ b/js/id/ui/modal.js @@ -1,4 +1,4 @@ -iD.modal = function() { +iD.ui.modal = function() { var animate = d3.select('div.modal').empty(); d3.select('div.modal').transition() diff --git a/js/id/ui/notice.js b/js/id/ui/notice.js index 88669d5d6..1e1b92398 100644 --- a/js/id/ui/notice.js +++ b/js/id/ui/notice.js @@ -1,4 +1,4 @@ -iD.notice = function(selection) { +iD.ui.notice = function(selection) { var message = '', notice = {}; diff --git a/js/id/ui/save.js b/js/id/ui/save.js index 4e49f26de..27d6ef1e5 100644 --- a/js/id/ui/save.js +++ b/js/id/ui/save.js @@ -1,4 +1,4 @@ -iD.save = function() { +iD.ui.save = function() { var map; @@ -16,7 +16,7 @@ iD.save = function() { function commit(e) { d3.select('.shaded').remove(); - var l = iD.loading('Uploading changes to OpenStreetMap.'); + var l = iD.ui.loading('Uploading changes to OpenStreetMap.'); connection.putChangeset(history.changes(), e.comment, history.imagery_used(), function(err, changeset_id) { l.remove(); history.reset(); @@ -28,14 +28,14 @@ iD.save = function() { .text('An error occurred while trying to save'); desc.append('p').text(err.responseText); } else { - var modal = iD.modal(); + var modal = iD.ui.modal(); modal.select('.content') .classed('success-modal', true) .datum({ id: changeset_id, comment: e.comment }) - .call(iD.success() + .call(iD.ui.success() .on('cancel', function() { modal.remove(); })); @@ -49,13 +49,13 @@ iD.save = function() { if (has_changes) { connection.authenticate(function(err) { - var modal = iD.modal(); + var modal = iD.ui.modal(); var changes = history.changes(); changes.connection = connection; modal.select('.content') .classed('commit-modal', true) .datum(changes) - .call(iD.commit() + .call(iD.ui.commit() .on('cancel', function() { modal.remove(); }) diff --git a/js/id/ui/success.js b/js/id/ui/success.js index f81be1028..cd4181bbe 100644 --- a/js/id/ui/success.js +++ b/js/id/ui/success.js @@ -1,4 +1,4 @@ -iD.success = function() { +iD.ui.success = function() { var event = d3.dispatch('cancel', 'save'); function success(selection) { diff --git a/js/id/ui/tag_reference.js b/js/id/ui/tag_reference.js index 8627ebe1c..55e20d8cb 100644 --- a/js/id/ui/tag_reference.js +++ b/js/id/ui/tag_reference.js @@ -1,4 +1,4 @@ -iD.tagReference = function(selection) { +iD.ui.tagReference = function(selection) { selection.each(function() { function g(x) { return function(d) { return d[x]; }; } var selection = d3.select(this); diff --git a/js/id/ui/userpanel.js b/js/id/ui/userpanel.js index abd71aa77..bab5e28d9 100644 --- a/js/id/ui/userpanel.js +++ b/js/id/ui/userpanel.js @@ -1,4 +1,4 @@ -iD.userpanel = function(connection) { +iD.ui.userpanel = function(connection) { var event = d3.dispatch('logout', 'login'); function user(selection) { diff --git a/test/index.html b/test/index.html index 6861e9097..072439887 100644 --- a/test/index.html +++ b/test/index.html @@ -48,6 +48,7 @@ + diff --git a/test/spec/ui/geocoder.js b/test/spec/ui/geocoder.js index 7a2ad5f89..54a7e571c 100644 --- a/test/spec/ui/geocoder.js +++ b/test/spec/ui/geocoder.js @@ -1,6 +1,6 @@ -describe("Geocoder", function () { +describe("iD.ui.geocoder", function () { it('can be instantiated', function () { - var geocoder = iD.geocoder(); + var geocoder = iD.ui.geocoder(); expect(geocoder).to.be.ok; }); }); diff --git a/test/spec/ui/inspector.js b/test/spec/ui/inspector.js index 6d4175ef3..baa830e76 100644 --- a/test/spec/ui/inspector.js +++ b/test/spec/ui/inspector.js @@ -1,10 +1,10 @@ -describe("iD.Inspector", function () { +describe("iD.ui.inspector", function () { var inspector, element, tags = {highway: 'residential'}, entity; function render() { - inspector = iD.Inspector(); + inspector = iD.ui.inspector(); element = d3.select('body') .append('div') .attr('id', 'inspector-wrap')