Pull user information from the endpoint, abstract oauth xhr

Right now there's both an OAuth wrapper and ohauth.js. These may want to
be combined.

index.html

@@ -18,7 +18,7 @@
                 &larr;<small>&nbsp;</small></button><button class='mini' id='redo'>
                 &rarr;</button><input type='text' id='geocode-location' placeholder='find a place' />
                 <div class='messages'></div>
-                <button id='save'>Save</button>
+                <button id='save'>Save<small id='as-username'></small></button>
                 <div class='zoombuttons'>
                     <button class='zoom-in'>+</button><button class='zoom-out'>&ndash;</button>
                 </div>
@@ -71,12 +71,25 @@
             var m = d3.select('#map');
             var hash = iD.Hash().map(map);
             if (!hash.hadHash) map.setZoom(19).setCenter({
-                lat: 51.85888,
-                lon: -1.60015
+                lat: 51.87502,
+                lon: -1.49475
             });
 
             var controller = iD.Controller(map);
-            var oauth = iD.OAuth(map);
+            var oauth = iD.OAuth(map)
+                .setAPI('http://api06.dev.openstreetmap.org/api/0.6');
+
+            if (oauth.authenticated()) {
+                oauth.xhr('GET', '/user/details', function(user_details) {
+                    var u = user_details.getElementsByTagName('user')[0];
+                    map.connection.user({
+                        display_name: u.attributes.display_name.nodeValue,
+                        id: u.attributes.id.nodeValue
+                    });
+                    d3.select('.messages').text('logged in as ' +
+                        map.connection.user().display_name);
+                });
+            }
 
             d3.selectAll('button#save').on('click', function() {
                 oauth.authenticate();

js/iD/Connection.js

@@ -1,7 +1,8 @@
 iD.Connection = function() {
-    var apiURL = 'http://www.openstreetmap.org/api/0.6/';
-
-    var connection = {}, refNodes = {};
+    var apiURL = 'http://www.openstreetmap.org/api/0.6/',
+        connection = {},
+        refNodes = {},
+        user = {};
 
     // Request data within the bbox from an external OSM server.
     function bboxFromAPI(box, callback) {
@@ -15,9 +16,7 @@ iD.Connection = function() {
     }
 
     function loadFromURL(url, callback) {
-        d3.xml(url, function(err, dom) {
-            callback(parse(dom));
-        });
+        d3.xml(url, function(err, dom) { callback(parse(dom)); });
     }
 
     function getNodes(obj) {
@@ -29,8 +28,6 @@ iD.Connection = function() {
         return nodes;
     }
 
-    // <tag k="highway" v="unclassified"/>
-    // { highway: 'classified' }
     function getTags(obj) {
         var tags = {}, tagelems = obj.getElementsByTagName('tag');
         for (var i = 0, l = tagelems.length; i < l; i++) {
@@ -40,7 +37,6 @@ iD.Connection = function() {
         return tags;
     }
 
-    // <member type="node" ref="364933006" role=""/>
     function getMembers(obj) {
         var members = [],
             elems = obj.getElementsByTagName('member');
@@ -55,15 +51,6 @@ iD.Connection = function() {
         return members;
     }
 
-    // <node id="1831881213"
-    //     version="1"
-    //     changeset="12370172"
-    //     lat="54.0900666"
-    //     lon="12.2539381"
-    //     user="lafkor"
-    //     uid="75625"
-    //     visible="true"
-    //     timestamp="2012-07-20T09:43:19Z">
     function objectData(obj) {
         var o = {
             type: obj.nodeName,
@@ -107,6 +94,12 @@ iD.Connection = function() {
         return connection;
     };
 
+    connection.user = function(x) {
+        if (!arguments.length) return user;
+        user = x;
+        return connection;
+    };
+
     connection.bboxFromAPI = bboxFromAPI;
     connection.wayFromAPI = wayFromAPI;
     connection.loadFromURL = loadFromURL;

js/iD/OAuth.js

@@ -5,6 +5,7 @@ iD.OAuth = function() {
 
     var o = {
         oauth_consumer_key: 'zwQZFivccHkLs3a8Rq5CoS412fE5aPCXDw9DZj7R',
+        oauth_token: localStorage.oauth_token || '',
         oauth_signature_method: 'HMAC-SHA1'
     };
 
@@ -14,7 +15,25 @@ iD.OAuth = function() {
         return o;
     }
 
+    oauth.authenticated = function() {
+        return localStorage.oauth_token &&
+            localStorage.oauth_token_secret;
+    };
+
+    oauth.xhr = function(method, path, callback) {
+        o = timenonce(o);
+        var url = baseurl + path;
+        var oauth_token_secret = localStorage.oauth_token_secret;
+        o.oauth_signature = ohauth.signature(oauth_secret, oauth_token_secret,
+            ohauth.baseString(method, url, o));
+        ohauth.xhr(method, url, o, null, {}, function(xhr) {
+            if (xhr.responseXML) callback(xhr.responseXML);
+        });
+    };
+
     oauth.authenticate = function() {
+        // TODO: deal with changing the api endpoint
+        if (oauth.authenticated()) return;
         var d = document.body.appendChild(document.createElement('div')),
             ifr = d.appendChild(document.createElement('iframe'));
         d.className = 'modal';
@@ -56,5 +75,10 @@ iD.OAuth = function() {
         };
     };
 
+    oauth.setAPI = function(x) {
+        baseurl = x;
+        return oauth;
+    };
+
     return oauth;
 };