Merge pull request #5941 from cmgustavo/feat/collect-email-01

Feat/collect email 01

src/js/controllers/onboarding/collectEmail.js

@@ -1,6 +1,22 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('collectEmailController', function($scope, $state, $timeout, $stateParams, $ionicConfig, profileService, configService, walletService) {
+angular.module('copayApp.controllers').controller('collectEmailController', function($scope, $state, $log, $timeout, $http, $httpParamSerializer, $ionicConfig, profileService, configService, walletService, appConfigService) {
+
+  var wallet, walletId;
+  $scope.data = {};
+  // Get more info: https://mashe.hawksey.info/2014/07/google-sheets-as-a-database-insert-with-apps-script-using-postget-methods-with-ajax-example/
+  var URL = "https://script.google.com/macros/s/AKfycbwQXvUw6-Ix0cRLMi7hBB8dlgNTCTgwfNIQRds6RypPV7dO8evW/exec";
+
+  var _post = function(dataSrc) {
+    return {
+      method: 'POST',
+      url: URL,
+      headers: {
+        'content-type': 'application/x-www-form-urlencoded; charset=UTF-8'
+      },
+      data: $httpParamSerializer(dataSrc)
+    };
+  };
 
   $scope.$on("$ionicView.beforeLeave", function() {
     $ionicConfig.views.swipeBackEnabled(true);
@@ -10,23 +26,42 @@ angular.module('copayApp.controllers').controller('collectEmailController', func
     $ionicConfig.views.swipeBackEnabled(false);
   });
 
-  var wallet = profileService.getWallet($stateParams.walletId);
-  var walletId = wallet.credentials.walletId;
-  $scope.data = {};
-  $scope.data.accept = false;
+  $scope.$on("$ionicView.beforeEnter", function(event, data) {
+    walletId = data.stateParams.walletId;
+    wallet = profileService.getWallet(walletId);
+    $scope.data.accept = true;
+  });
+
+  var collectEmail = function() {
+    var dataSrc = {
+      "App": appConfigService.nameCase,
+      "Email": $scope.data.email,
+      "Platform": ionic.Platform.platform(),
+      "DeviceVersion": ionic.Platform.version()
+    };
+
+    $http(_post(dataSrc)).then(function() {
+      $log.info("SUCCESS: Email collected");
+    }, function(err) {
+      $log.error("ERROR: Could not collect email");
+    });
+  };
 
   $scope.save = function() {
     var opts = {
       emailFor: {}
     };
-    opts.emailFor[walletId] = $scope.email;
+    opts.emailFor[walletId] = $scope.data.email;
     walletService.updateRemotePreferences(wallet, {
-      email: $scope.email,
+      email: $scope.data.email,
     }, function(err) {
-      if (err) $log.warn(err);
+      if (err) return;
       configService.set(opts, function(err) {
         if (err) $log.warn(err);
-        $scope.goNextView();
+        if ($scope.data.accept) collectEmail();
+        $timeout(function() {
+          $scope.goNextView();
+        }, 200);
       });
     });
   };
@@ -40,7 +75,6 @@ angular.module('copayApp.controllers').controller('collectEmailController', func
   $scope.confirm = function(emailForm) {
     if (emailForm.$invalid) return;
     $scope.confirmation = true;
-    $scope.email = emailForm.email.$modelValue;
   };
 
   $scope.cancel = function() {

src/js/controllers/onboarding/tour.js

@@ -62,9 +62,16 @@ angular.module('copayApp.controllers').controller('tourController',
           ongoingProcess.set('creatingWallet', false);
           var wallet = walletClient;
           var walletId = wallet.credentials.walletId;
+
+          $state.go('onboarding.collectEmail', {
+            walletId: walletId
+          });
+
+            /*
           $state.go('onboarding.backupRequest', {
             walletId: walletId
           });
+            */
         });
       }, 300);
     };

src/sass/views/onboarding/onboard-collect-email.scss

@@ -44,7 +44,7 @@ $relish-success: 1.3s;
     color: $v-dark-gray;
     font-size: 1.2rem;
     font-weight: bold;
-    margin: 3rem 0 1rem;
+    margin: 2rem 0 1rem;
   }
   .prompt {
     margin: 1rem 1.5rem;
@@ -62,7 +62,6 @@ $relish-success: 1.3s;
   #collect-email {
     opacity: 1;
     background: #fff;
-    height: 25rem;
     animation-name: topBottom;
     animation-iteration-count: 1;
     animation-timing-function: ease-in;
@@ -80,7 +79,23 @@ $relish-success: 1.3s;
     margin: 0 auto;
   }
 
-
+  #collect-email-confirm {
+    p.confirm {
+      margin: 2rem 0;
+      color: $v-mid-gray;
+    }
+    p.user-email {
+      color: $v-dark-gray;
+      margin-bottom: 2rem;
+    }
+    .row, .col {
+      padding: 0;
+    }
+    .button {
+      padding: 0.5rem;
+      margin-bottom: 0;
+    }
+  }
 
   #news-updates {
     padding-top: 0;
@@ -97,13 +112,13 @@ $relish-success: 1.3s;
       border-width: 2px;
       padding: 12px;
       position: relative;
-      right: 5px;
-      bottom: 5px;
+      right: 2px;
+      bottom: 2px;
     }
     .checkbox input:checked:after,
     input:checked + .checkbox-icon:after {
       border-color: $v-onboarding-checkbox-on-border;
-      top: 4px;
+      top: 8px;
       left: 6px;
     }
     .item-content {

www/views/onboarding/collectEmail.html

@@ -1,35 +1,35 @@
 <ion-view id="onboarding-collect-email" class="onboarding">
-  <ion-content scroll="false">
+  <ion-content>
     <div id="success-container">
       <img src="img/onboarding-success.svg" id="success-image" />
       <div id="success-message" translate>Wallet Created</div>
     </div>
     <div id="collect-email">
       <div id="collect-email-inner" ng-if="!confirmation">
-        <div translate class="heading">Email Notifications</div>
-        <div translate class="prompt">Where would you like to receive email notifications about payments?</div>
+        <div translate class="heading" translate>Notifications by email</div>
+        <div translate class="prompt" translate>Where would you like to receive email notifications about payments?</div>
         <form id="email-form" name="emailForm" ng-submit="confirm(emailForm)" novalidate>
           <label class="item item-input" id="email-label">
-            <input type="email" name="email" ng-model="email" placeholder="email address" required></input>
+            <input type="email" name="email" ng-model="data.email" placeholder="{{'Enter you email'|translate}}" required></input>
           </label>
           <ion-checkbox ng-model="data.accept"><span translate>Get news and updates from BitPay</span></ion-checkbox>
-          <button class="button button-standard button-primary" disabled>
+          <button class="button button-standard button-primary" ng-disabled="emailForm.$invalid">
             Continue &rarr;
           </button>
         </form>
       </div>
-      <div ng-if="confirmation">
-          <p translate class="confirm">Is this email address correct?</p>
-          <p class="user-email">{{email}}</p>
+      <div id="collect-email-confirm" ng-if="confirmation">
+        <p translate class="confirm">Is this email address correct?</p>
+        <p class="user-email">{{data.email}}</p>
         <div class="row">
           <div class="col col-50">
             <button class="button button-block button-stable" ng-click="cancel()">
-              {{'No' | translate}}
+              {{'Edit' | translate}}
             </button>
           </div>
           <div class="col col-50">
             <button class="button button-block button-stable" ng-click="save()">
-              {{'Yes' | translate}}
+              {{'Confirm' | translate}}
             </button>
           </div>
         </div>

www/views/onboarding/tour.html

@@ -6,6 +6,11 @@
         <i class="icon ion-ios-arrow-thin-left"></i>
       </button>
     </ion-nav-buttons>
+    <ion-nav-buttons side="secondary">
+      <button class="button back-button button-clear" ng-show="data.index == 0" ng-click="createDefaultWallet()">
+        {{'Skip' | translate}}
+      </button>
+    </ion-nav-buttons>
   </ion-nav-bar>
   <ion-slides class="slides" options="options" slider="data.slider">
     <ion-slide-page>