Namespace oauth keys, link to user, fixup modal style

This commit is contained in:
Tom MacWright
2012-11-26 15:33:41 -05:00
parent ee6cf2c146
commit f0b60dac9f
4 changed files with 69 additions and 29 deletions
+18 -1
View File
@@ -82,6 +82,16 @@ input[type=text]:focus {
right:200px;
top:0;
padding:10px;
overflow:hidden;
width:100px;
}
#bar .user {
width:200px;
position:absolute;
right:300px;
top:0;
padding:10px;
}
#bar button[disabled] {
@@ -98,7 +108,7 @@ input[type=text]:focus {
color:#000;
}
#bar button#save {
#bar button.save {
position:absolute;
top:0;
right:100px;
@@ -210,3 +220,10 @@ button small {
margin-left:-330px;
box-shadow:0 0 5px #000;
}
.shaded:before {
content:'';
background:rgba(0,0,0,0.5);
position:fixed;
left:0px; right:0px; top:0px; bottom:0px;
}
+7 -7
View File
@@ -1,5 +1,5 @@
iD.Connection = function() {
var apiURL = 'http://www.openstreetmap.org/api/0.6',
var apiURL = 'http://www.openstreetmap.org',
connection = {},
refNodes = {},
user = {},
@@ -7,13 +7,13 @@ iD.Connection = function() {
// Request data within the bbox from an external OSM server.
function bboxFromAPI(box, callback) {
loadFromURL(apiURL + '/map?bbox=' +
loadFromURL(apiURL + '/api/0.6/map?bbox=' +
[box[0][0], box[1][1], box[1][0], box[0][1]], callback);
}
// Request data within the bbox from an external OSM server.
function wayFromAPI(id, callback) {
loadFromURL(apiURL + '/way/' + id + '/full', callback);
loadFromURL(apiURL + '/api/0.6/way/' + id + '/full', callback);
}
function loadFromURL(url, callback) {
@@ -100,20 +100,20 @@ iD.Connection = function() {
function createChangeset(changes) {
oauth.xhr({
method: 'PUT',
path: '/changeset/create',
path: '/api/0.6/changeset/create',
options: { header: { 'Content-Type': 'text/xml' } },
content: iD.format.XML.changeset()
},
function (changeset_id) {
oauth.xhr({
method: 'POST',
path: '/changeset/' + changeset_id + '/upload',
path: '/api/0.6/changeset/' + changeset_id + '/upload',
options: { header: { 'Content-Type': 'text/xml' } },
content: iD.format.XML.osmChange(user.id, changeset_id, changes)
}, function () {
oauth.xhr({
method: 'PUT',
path: '/changeset/' + changeset_id + '/close'
path: '/api/0.6/changeset/' + changeset_id + '/close'
}, function () {
alert('saved! ' + apiURL.replace('/api/0.6', '/browse') + '/changeset/' + changeset_id);
});
@@ -122,7 +122,7 @@ iD.Connection = function() {
}
function userDetails(callback) {
oauth.xhr({ method: 'GET', path: '/user/details' }, function(user_details) {
oauth.xhr({ method: 'GET', path: '/api/0.6/user/details' }, function(user_details) {
var u = user_details.getElementsByTagName('user')[0];
callback({
display_name: u.attributes.display_name.nodeValue,
+32 -18
View File
@@ -1,6 +1,6 @@
iD.OAuth = function() {
var baseurl = 'http://api06.dev.openstreetmap.org',
apibase = 'http://api06.dev.openstreetmap.org/api/0.6',
apibase = 'http://api06.dev.openstreetmap.org',
oauth_secret = 'aMnOOCwExO2XYtRVWJ1bI9QOdqh1cay2UgpbhA6p',
oauth = {};
@@ -9,6 +9,8 @@ iD.OAuth = function() {
oauth_signature_method: 'HMAC-SHA1'
};
function keyclean(x) { return x.replace(/\W/g, ''); }
if (localStorage.oauth_token) {
o.oauth_token = localStorage.oauth_token;
}
@@ -19,19 +21,30 @@ iD.OAuth = function() {
return o;
}
function token(k, x) {
if (arguments.length == 2) {
localStorage[keyclean(apibase) + k] = x;
}
return localStorage[keyclean(apibase) + k];
}
oauth.authenticated = function() {
return localStorage.oauth_token &&
localStorage.oauth_token_secret;
return token('oauth_token') && token('oauth_token_secret');
};
oauth.logout = function() {
token('oauth_token', '');
token('oauth_token_secret', '');
return ouath;
};
oauth.xhr = function(options, callback) {
if (localStorage.oauth_token) {
o.oauth_token = localStorage.oauth_token;
if (token('oauth_token')) {
o.oauth_token = token('oauth_token');
}
o = timenonce(o);
var url = apibase + options.path;
console.log(apibase, options.path);
var oauth_token_secret = localStorage.oauth_token_secret;
var oauth_token_secret = token('oauth_token_secret');
o.oauth_signature = ohauth.signature(oauth_secret, oauth_token_secret,
ohauth.baseString(options.method, url, o));
ohauth.xhr(options.method, url, o, options.content, options.options, function(xhr) {
@@ -44,10 +57,11 @@ iD.OAuth = function() {
// TODO: deal with changing the api endpoint
if (oauth.authenticated()) return callback();
var d = d3.select(document.body)
.append('div').attr('class', 'modal'),
ifr = d.append('iframe')
.attr({ width: 640, height: 550, frameborder: 'no' });
var shaded = d3.select(document.body)
.append('div').attr('class', 'shaded');
var modal = shaded.append('div').attr('class', 'modal');
var ifr = modal.append('iframe')
.attr({ width: 640, height: 550, frameborder: 'no' });
o = timenonce(o);
var url = baseurl + '/oauth/request_token';
@@ -55,11 +69,11 @@ iD.OAuth = function() {
ohauth.baseString('POST', url, o));
ohauth.xhr('POST', url, o, null, {}, function(xhr) {
var token = ohauth.stringQs(xhr.response);
localStorage.oauth_request_token_secret = token.oauth_token_secret;
var resp = ohauth.stringQs(xhr.response);
token('oauth_request_token_secret', resp.oauth_token_secret);
var at = baseurl + '/oauth/authorize?';
ifr.attr('src', at + ohauth.qsString({
oauth_token: token.oauth_token, oauth_callback: location.href
oauth_token: resp.oauth_token, oauth_callback: location.href
}));
});
ifr.on('load', function() {
@@ -68,16 +82,16 @@ iD.OAuth = function() {
oauth_token = ohauth.stringQs(search.slice(1)),
url = baseurl + '/oauth/access_token';
o = timenonce(o);
d.remove();
shaded.remove();
o.oauth_token = oauth_token.oauth_token;
var request_token_secret = localStorage.oauth_request_token_secret;
var request_token_secret = token('oauth_request_token_secret');
o.oauth_signature = ohauth.signature(oauth_secret, request_token_secret,
ohauth.baseString('POST', url, o));
ohauth.xhr('POST', url, o, null, {}, function(xhr) {
var access_token = ohauth.stringQs(xhr.response);
localStorage.oauth_token = access_token.oauth_token;
localStorage.oauth_token_secret = access_token.oauth_token_secret;
token('oauth_token', access_token.oauth_token);
token('oauth_token_secret', access_token.oauth_token_secret);
callback();
});
}
+12 -3
View File
@@ -5,7 +5,7 @@ var iD = function(container) {
.attr('id', 'map');
var connection = iD.Connection()
.url('http://api06.dev.openstreetmap.org/api/0.6');
.url('http://api06.dev.openstreetmap.org');
var map = iD.Map(m.node(), connection);
@@ -58,8 +58,13 @@ var iD = function(container) {
bar.append('div')
.attr('class', 'messages');
bar.append('div')
.attr('class', 'user')
.append('div')
.attr('class', 'hello');
bar.append('button')
.attr('id', 'save')
.attr('class', 'save')
.html("Save<small id='as-username'></small>")
.on('click', function() {
connection.authenticate(function() {
@@ -129,7 +134,11 @@ var iD = function(container) {
if (connection.authenticated()) {
connection.userDetails(function(user_details) {
connection.user(user_details);
d3.select('.messages').text('logged in as ' + user_details.display_name);
d3.select('.user .hello').text('hi, ')
.append('a')
.attr('href', connection.url() + '/user/' + user_details.display_name)
.attr('target', '_blank')
.text(user_details.display_name);
});
}
};