Merge pull request #2145 from jpevarnek/login-common

Move some of the common login functionality to a common location
UWNetworksLab · Dec 18, 2015 · a901405 · a901405
2 parents 2ed87bf + c1ffef6
commit a901405
Show file tree

Hide file tree

Showing 4 changed files with 69 additions and 110 deletions.
diff --git a/src/generic_ui/polymer/invite-user.ts b/src/generic_ui/polymer/invite-user.ts
@@ -1,13 +1,15 @@
 /// <reference path='./context.d.ts' />
-/// <reference path='../../../../third_party/polymer/polymer.d.ts' />
 /// <reference path='../../../../third_party/typings/es6-promise/es6-promise.d.ts' />
+/// <reference path='../../../../third_party/polymer/polymer.d.ts' />
 
 import user_interface = require('../scripts/ui');
+import loginCommon = require('./login-common');
+import _ = require('lodash');
 var ui = ui_context.ui;
 var model = ui_context.model;
 var core = ui_context.core;
 
-Polymer({
+var inviteUser = {
   generateInviteUrl: function(name :string) {
     var network = model.getNetwork(name);
     var networkInfo = { name: network.name, userId: network.userId };
@@ -125,21 +127,24 @@ Polymer({
       this.$.loginToInviteFriendDialog.open();
     }
   },
-  loginTapped: function() {
-    this.login(this.selectedNetworkName);
-  },
-  login: function(networkName :string, userName ?:string) {
-    ui.login(networkName, userName).then(() => {
+  login: function(networkName :string, userName ?:string ) {
+    return ui.login(networkName, userName).then(() => {
       if (networkName != 'Quiver') {
         this.$.loginToInviteFriendDialog.close();
-        this.closeInviteUserPanel();
+        if (this.closeInviteUserPanel) {
+          this.closeInviteUserPanel();
+        }
       }
       ui.bringUproxyToFront();
-      this.initInviteForNetwork(networkName);
     }).catch((e: Error) => {
       console.warn('Did not log in ', e);
     });
   },
+  loginTapped: function() {
+    this.login(this.selectedNetworkName).then(() => {
+      this.initInviteForNetwork();
+    });
+  },
   initInviteForNetwork: function(networkName: string) {
     this.selectedNetworkName = networkName;
     if (networkName == "GMail" || networkName == "GitHub" || networkName == "Cloud") {
@@ -150,21 +155,6 @@ Polymer({
       this.sendToFacebookFriend();
     }
   },
-  copypaste: function() {
-    // Logout of all other social networks before starting
-    // copypaste connection.
-    var getConfirmation = Promise.resolve<void>();
-    if (model.onlineNetworks.length > 0) {
-      var confirmationMessage =
-          ui.i18n_t('CONFIRM_LOGOUT_FOR_COPYPASTE');
-      getConfirmation = ui.getConfirmation('', confirmationMessage);
-    }
-
-    getConfirmation.then(ui.logoutAll).then(() => {
-      this.closeInviteUserPanel();
-      this.fire('core-signal', { name: 'copypaste-init' });
-    });
-  },
   loginToInviteFriendDialogOpened: function() {
     // Set confirmation message, which may include some HTML (e.g. strong, br).
     var confirmationMessage :string;
@@ -173,7 +163,7 @@ Polymer({
     } else {
       confirmationMessage = ui.i18n_t(
           'SIGN_IN_TO_INVITE_FRIENDS',
-          {network: this.getNetworkDisplayName(this.selectedNetworkName)});
+          {network: ui.getNetworkDisplayName(this.selectedNetworkName)});
     }
     this.injectBoundHTML(
         ui.i18nSanitizeHtml(confirmationMessage),
@@ -184,14 +174,6 @@ Polymer({
     // will be smaller than expected.
     this.$.loginToInviteFriendDialog.resizeHandler();
   },
-  networkNamesChanged: function() {
-    this.networkButtonNames = _.filter(model.networkNames, (name) => {
-      // we do not want a button for Quiver
-      return name !== 'Quiver';
-    });
-    this.supportsQuiver = model.hasQuiverSupport();
-
-  },
   getNetworkDisplayName: function(networkName :string) {
     return ui.getNetworkDisplayName(networkName);
   },
@@ -206,8 +188,8 @@ Polymer({
     input.select();
   },
   observe: {
-    'model.networkNames': 'networkNamesChanged',
-    'model.onlineNetworks': 'onlineNetworksChanged'
+    'model.networkNames': 'updateNetworkButtonNames',
+    'model.onlineNetworks': 'onlineNetworksChanged',
   },
   ready: function() {
     this.userName = model.globalSettings.quiverUserName; // for Quiver
@@ -217,10 +199,13 @@ Polymer({
     this.inviteUserEmail = ''; // for GMail
     this.selectedNetworkName = '';
     this.quiverInviteUrl = '';
-    this.model = model;
     this.cloudInstanceInput = '';
     this.ui = ui;
+    this.model = model;
 
-    this.networkNamesChanged();
+    this.updateNetworkButtonNames();
   }
-});
+};
+
+(<any>_.mixin)(inviteUser, loginCommon);
+Polymer(inviteUser);
diff --git a/src/generic_ui/polymer/login-common.ts b/src/generic_ui/polymer/login-common.ts
@@ -0,0 +1,38 @@
+/// <reference path='./context.d.ts' />
+/// <reference path='../../../../third_party/typings/es6-promise/es6-promise.d.ts' />
+/// <reference path='../../../../third_party/typings/lodash/lodash.d.ts' />
+
+import _ = require('lodash');
+
+var ui = ui_context.ui;
+var core = ui_context.core;
+var model = ui_context.model;
+
+//TODO: remove this when we switch to roster-as-default
+var loginCommon = {
+  copypaste: function() {
+    // Logout of all other social networks before starting
+    // copypaste connection.
+    var getConfirmation = Promise.resolve<void>();
+    if (model.onlineNetworks.length > 0) {
+      var confirmationMessage =
+          ui.i18n_t('CONFIRM_LOGOUT_FOR_COPYPASTE');
+      getConfirmation = ui.getConfirmation('', confirmationMessage);
+    }
+
+    getConfirmation.then(ui.logoutAll).then(() => {
+      if (this.closeInviteUserPanel) {
+        this.closeInviteUserPanel();
+      }
+      this.fire('core-signal', { name: 'copypaste-init' });
+    });
+  },
+  updateNetworkButtonNames: function() {
+    this.networkButtonNames = _.filter(model.networkNames, (name) => {
+      // we do not want a button for Quiver
+      return name !== 'Quiver';
+    });
+    this.supportsQuiver = model.hasQuiverSupport();
+  },
+};
+export = loginCommon;
diff --git a/src/generic_ui/polymer/splash.html b/src/generic_ui/polymer/splash.html
@@ -232,42 +232,6 @@ <h1>{{ "WELCOME" | $$ }}</h1>
 
     <div vertical layout id='networks' hidden?='{{SPLASH_STATES.NETWORKS!==model.globalSettings.splashState}}'>
       <div class='view' flex>
-        <!-- TODO: translate before launch on webstore -->
-        <div hidden?='{{!supportsQuiver}}'>
-          <h1 id='QuiverTitle'>Sign in to the uProxy network</h1>
-
-          <paper-input-decorator label='Choose a user name' layout vertical>
-            <input is='core-input' value='{{ userName }}' />
-          </paper-input-decorator>
-          <uproxy-button id='QuiverLoginButton' raised on-tap='{{ loginToQuiver }}'>Sign In</uproxy-button>
-
-          <div class='orText'>- - - OR - - -</div>
-          <p>Sign in with a social network.</p>
-          <template repeat='{{ n in networkButtonNames }}' vertical layout>
-            <div on-tap='{{ loginTapped }}' class='networkLoginButton' data-network='{{n}}'>
-              <core-icon icon='uproxy-icons:{{n}}'></core-icon>
-              <div class='networkName'>{{getNetworkDisplayName(n)}}</div>
-              <div class='experimental' hidden?='{{!isExperimentalNetwork(n)}}'>
-                Experimental
-              </div>
-            </div>
-          </template>
-
-          <div class='orText'>- - - OR - - -</div>
-          <div class='networkLoginButton copypaste' on-tap='{{ copypaste }}'>
-            <core-icon icon='uproxy-icons:CopyAndPaste'></core-icon>
-            <div class='networkName'>{{ "SET_UP_ONE_TIME" | $$ }}</div>
-          </div>
-
-          <p>
-            {{ "WE_WONT_POST" | $$ }}
-          </p>
-
-          <span id='submitFeedback' on-tap='{{ openFeedbackForm }}'>
-            {{ "SUBMIT_FEEDBACK" | $$ }}
-          </span>
-        </div>
-
         <!-- TODO: remove this and uproxy-network template once Quiver
         support is on the webstore -->
         <div hidden?='{{supportsQuiver}}'>

diff --git a/src/generic_ui/polymer/splash.ts b/src/generic_ui/polymer/splash.ts
@@ -8,6 +8,8 @@
 declare var require :(path :string) => Object;
 
 import ui_constants = require('../../interfaces/ui');
+import loginCommon = require('./login-common');
+import _ = require('lodash');
 
 interface Language {
   description :string;
@@ -20,7 +22,7 @@ var ui = ui_context.ui;
 var core = ui_context.core;
 var model = ui_context.model;
 
-Polymer({
+var splash = {
   SPLASH_STATES: {
     INTRO: 0,
     METRICS_OPT_IN: 1,
@@ -57,9 +59,6 @@ Polymer({
       this.setState(model.globalSettings.splashState - 1);
     }
   },
-  copypaste: function() {
-    this.fire('core-signal', { name: 'copypaste-init' });
-  },
   openFeedbackForm: function() {
     this.fire('core-signal', {name: 'open-feedback'});
   },
@@ -70,36 +69,6 @@ Polymer({
       window.location.reload();
     }
   },
-  loginToQuiver: function() {
-    model.globalSettings.quiverUserName = this.userName;
-    core.updateGlobalSettings(model.globalSettings);
-    this.login('Quiver', this.userName);
-  },
-  loginTapped: function(event: Event, detail: Object, target: HTMLElement) {
-    var networkName = target.getAttribute('data-network');
-    this.login(networkName);
-  },
-  login: function(networkName :string, userName ?:string) {
-    ui.login(networkName, userName).then(() => {
-      // syncNetwork will update the view to the ROSTER.
-      ui.bringUproxyToFront();
-    }).catch((e: Error) => {
-      console.warn('Did not log in ', e);
-    });
-  },
-  getNetworkDisplayName: function(name :string) {
-    return ui.getNetworkDisplayName(name);
-  },
-  isExperimentalNetwork: function(name :string) {
-    return ui.isExperimentalNetwork(name);
-  },
-  updateNetworkButtonNames: function() {
-    this.networkButtonNames = _.filter(model.networkNames, (name) => {
-      // we do not want a button for Quiver
-      return name !== 'Quiver';
-    });
-    this.supportsQuiver = model.hasQuiverSupport();
-  },
   updateSeenMetrics: function(val :Boolean) {
     model.globalSettings.hasSeenMetrics = true;
     model.globalSettings.statsReportingEnabled = val;
@@ -113,7 +82,7 @@ Polymer({
     return this.updateSeenMetrics(false);
   },
   observe: {
-    'model.networkNames': 'updateNetworkButtonNames'
+    'model.networkNames': 'updateNetworkButtonNames',
   },
   ready: function() {
     this.ui = ui;
@@ -122,4 +91,7 @@ Polymer({
     this.userName = model.globalSettings.quiverUserName;
     this.updateNetworkButtonNames();
   },
-});
+};
+
+(<any>_.mixin)(splash, loginCommon);
+Polymer(splash);