Merge pull request #56 from mozilla/update_jelly_api

Check the current fxa session stored in the browser and show the correct...

server/views/accounts/desktop_flow.html

@@ -69,6 +69,11 @@ Firefox Sync stores your passwords, bookmarks, tabs and browsing history. Use it
   <div class="notes-t1-get-email">
   </div>
 
+  <div class="signed-in-placeholder">
+      You are signed in as <p class="user">test</p>.
+      <button class="logout">Sign Out</button>
+  </div>
+
   <div class="t2-signed-in-page">
       <h2>Welcome!<br/> You are successfully signed in as:</h2>
         <p class="user">test</p>
@@ -199,6 +204,6 @@ Firefox Sync stores your passwords, bookmarks, tabs and browsing history. Use it
 </div>
 
 
- <script type="text/javascript" src="/javascripts/one.js"></script>
+ <script type="text/javascript" src="/javascripts/flow.js"></script>
 
 {% endblock %}

server/views/accounts/flow.html

@@ -205,6 +205,6 @@
 </div>
 
 
- <script type="text/javascript" src="/javascripts/one.js"></script>
+ <script type="text/javascript" src="/javascripts/flow.js"></script>
 
 {% endblock %}

static/javascripts/common.js

@@ -6,8 +6,8 @@ var serverUrl = fxaUrl || location.origin;
 var currentlyShowing = null;
 
 var state = {};
-
 var setupFunctions = {};
+var sessionReady = false;
 
 state.device = navigator.userAgent.match('Mobile') ? 'mobile' :
                navigator.userAgent.match('Tablet') ? 'tablet' :
@@ -18,6 +18,9 @@ state.os = navigator.userAgent.match('Mac') ? 'mac' :
            navigator.userAgent.match('Android') ? 'android' :
           'linux';
 
+state.pageToLoad = page;
+state.initialLoad = true;
+
 
 if ((state.device === 'mobile'
     || state.device === 'tablet')
@@ -169,6 +172,8 @@ function refreshAccounts() {
 }
 
 function switchTo(which) {
+  if (currentlyShowing === which) return;
+
   console.log('switching to ', which);
 
   function done() {
@@ -246,13 +251,46 @@ function offsetToError() {
 }
 
 function receiveMessage(event) {
+  var type = event.data.type;
+  var result = event.data.content;
   switch (event.data.type) {
     case "message":
-      console.log("Received message from browser: ", event.data.content);
+      console.log("Received message from browser: ", result);
+      sentEvents[result.status]--;
+
+      if (result.status === 'session_status') {
+        // if we get session data back and the user wasn't previously signed in
+        // we'll transition to a signed in user state
+        if (result.data && !state.signedIn) {
+          state.email = result.data.email;
+          state.signedIn = true;
+          console.log('signed in!', result.data);
+          switchTo("signed-in-placeholder");
+        }
+        // else, if the user has been signed in and signs out, we'll transition to
+        // the sign in screen
+        else if (!result.data) {
+          console.log('signed out!');
+          state.signedIn = false;
+          delete state.email;
+          if (state.pageToLoad) {
+            followPage();
+          } else {
+            switchTo('t1-create-signin');
+          }
+        }
+      }
       break;
   }
 }
 
+function followPage() {
+  switchTo(state.pageToLoad);
+  delete state.pageToLoad;
+}
+
+var sentEvents = {};
+
 function sendToBrowser(command, data) {
   console.log('sending command to browser', command, data);
   var event = new CustomEvent("FirefoxAccountsCommand", {
@@ -264,6 +302,14 @@ function sendToBrowser(command, data) {
   });
   try {
     window.dispatchEvent(event);
+    var count = sentEvents[command] = sentEvents[command] ? sentEvents[command] + 1 : 1;
+    // try again if the browser doesn't respond within a second
+    setTimeout(function () {
+      if (sentEvents[command] === count) {
+        sentEvents[command]--;
+        sendToBrowser(command, data);
+      }
+    }, 1000);
   } catch(e) {
     console.log(e);
   }
@@ -271,6 +317,15 @@ function sendToBrowser(command, data) {
 
 $(function() {
   window.addEventListener("message", receiveMessage, false);
+
+  if (page) {
+    switchTo(page);
+  //} else if (user && verified) {
+    //switchTo("signed-in-placeholder");
+  } else {
+    switchTo("t1-create-signin");
+  }
+
 });
 
 // konami code!

static/javascripts/flow.js

@@ -44,7 +44,6 @@ setupFunctions["t1-create-signin"] = function() {
        $(this).addClass('oops').addClass('invalid');
        offsetToError();
        return;
-      
     }
     $(this).addClass('ok');
   });
@@ -212,12 +211,6 @@ setupFunctions["t1-create-signin"] = function() {
         console.log('done logging in!');
         console.log('keys!!', client.sessionToken, client.keyFetchToken, email);
 
-        sendToBrowser('create', {
-          sessionToken: client.sessionToken,
-          keyFetchToken: client.keyFetchToken,
-          email: email
-        });
-
         leaveError();
         makeNotBusy();
         switchTo("verify");
@@ -233,6 +226,19 @@ setupFunctions["t1-create-signin"] = function() {
   });
 };
 
+setupFunctions["signed-in-placeholder"] = function() {
+  console.log('state', state.email);
+
+  $('#dialog .user').html(state.email);
+
+
+  $("#dialog button.logout").on("click", function() {
+    sendToBrowser('sign_out');
+    switchTo("t1-create-signin");
+    console.log('signing out!!');
+  });
+};
+
 setupFunctions["t2-signed-in-page"] = function() {
   console.log('state', state.email);
 
@@ -242,27 +248,6 @@ setupFunctions["t2-signed-in-page"] = function() {
     switchTo("preferences");
   });
 
-  // show devices
-
-  //send('accounts')
-  //.then(function (r) {
-    //var account = state.accounts[state.email];
-
-    //console.log('devices', account.devices);
-
-    //$('#dialog ul.devices').html('');
-    //Object.keys(account.devices).forEach(function(deviceId) {
-      //var device = account.devices[deviceId];
-      //$('#dialog ul.devices').append(
-        //$('<li>')
-          //.addClass(device.form)
-          //.html(device.name.bold())
-          //.addClass(device.syncing ? 'syncing' : 'notsyncing')
-      //);
-    //});
-
-  //});
-
   // show progress meter
   var progressMeter = $('#progress-meter')[0];
   progressMeter.min = 0;
@@ -586,13 +571,16 @@ $(function() {
 
   console.log('state', state);
 
-  if (page) {
-    switchTo(page);
-  } else if (user && verified) {
-    switchTo("preferences");
-  } else {
-    switchTo("t1-create-signin");
-  }
+  //if (page) {
+    //switchTo(page);
+  ////} else if (user && verified) {
+    ////switchTo("signed-in-placeholder");
+  //} else {
+    //switchTo("t1-create-signin");
+  //}
+  //
+
+  sendToBrowser('session_status');
 
   //$("#notes-container").toggle();