Merge pull request #2718 from matiu/feat/splash-import

Feat/splash import

public/views/add.html

@@ -29,13 +29,6 @@
 			<span translate>Import wallet </span>
 		</a>
 	</li>
-	<li>
-		<a title="Import wallet" ng-click="$root.go('importLegacy')">
-			<i class="fi-archive plus-fixed circle"></i>	  
-			<i class="icon-arrow-right3 size-18 right m20t"></i>  
-			<span translate>Import from Copay Beta 0.9</span>
-		</a>
-	</li>
 
 </ul>
 </div>

public/views/import.html

@@ -49,11 +49,21 @@
               <input type="password" class="form-control" placeholder="{{'Your backup password'|translate}}"
               name="password" ng-model="import.password">
             </div>
-            <button translate type="submit" class="button radius expand black m0" 
+            <button translate type="submit" class="button radius expand black" 
               ng-disabled="importForm.$invalid || !import.password">
               Import backup
             </button>
           </form>
+
+    <div class="text-center text-gray p20v" ng-click="$root.go('importLegacy')">
+      <p class="text-gray m5b size-14" translate> Have a Backup from Copay v0.9?</p>
+      <button class=" outline dark-gray tiny" translate> Import here
+        <i class="icon-arrow-right3 size-14"></i>
+      </button>
+
+
+   </div> 
+
       </div>
     </div>
 </div>

public/views/importLegacy.html

@@ -1,19 +1,14 @@
 <div 
   class="topbar-container" 
   ng-include="'views/includes/topbar.html'"
-  ng-init="titleSection='Import legacy wallet'; goBackToState = 'add'; noColor = true">
+  ng-init="titleSection='Import legacy wallet'; goBackToState = 'import'; noColor = true">
 </div>
 
 
 
 <div class="content p20v" ng-controller="importLegacyController as importLegacy">
   <div class="row m20t">
-    <div class="large-5 large-centered medium-7 medium-centered columns">
-      <div class="logo-setup show-for-large-up">
-        <img src="img/logo-negative.svg" alt="Copay" width="100">
-        <div ng-include="'views/includes/version.html'"></div>
-      </div>
-      <div>
+      <div class="large-12 columns">
         <div ng-show="importLegacy.importing">
           <h1 class="m20b animated infinite flash" translate>Importing...</h1>
           <ul>
@@ -69,15 +64,16 @@
           </div>
         </form>
 
-      <a class="m20t button outline light-gray expand" ng-click="$root.openExternalLink('https://github.com/bitpay/copay/releases/tag/v0.10.0')" translate>
+    <div class="text-center p20v">
+      <a class="m20t  tiny button outline light-gray " ng-click="$root.openExternalLink('https://github.com/bitpay/copay/releases/tag/v0.10.0')" translate>
          Learn more about Wallet Migration
       </a>
+    </div>
  
 
       </div>
     
 
     </div>
-  </div>
 </div>
 

public/views/includes/topbar.html

@@ -20,7 +20,7 @@
   </section>
 
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4B6178' : index.backgroundColor}">
+    <h1 class="title ellipsis" ng-style="{'color': noColor ? '#7A8C9E' : index.backgroundColor}">
       {{(titleSection|translate) || index.walletName}}
     </h1>
   </section>

public/views/preferences.html

@@ -8,14 +8,14 @@
 
 <div class="content preferences" ng-controller="preferencesController as preferences">
 
-  <ul class="no-bullet m0 size-14">
+  <ul class="no-bullet m0 size-14"  ng-show="!index.noFocusedWallet">
     <h4 class="title m0" translate>{{index.walletName}} settings</h4>
 
     <li class="line-b p20" ng-click="$root.go('preferencesColor')">
       <span translate>Color</span>
       <span class="right text-gray">
         <i class="icon-arrow-right3 size-24 right"></i>
-        <span ng-style="{'color':index.backgroundColor || '#1ABC9C'}">&block;</span>
+        <span ng-style="{'color':index.backgroundColor}">&block;</span>
       </span>      
     </li>
     <li class="line-b p20">
@@ -23,7 +23,6 @@
       <switch id="network-name" name="encrypt" ng-model="encrypt" class="green right"></switch>
   </li>
  
- 
     <h4 class="title m0">&nbsp;</h4>
     <li class="line-b p20" ng-click="$root.go('backup')">
       <i class="icon-arrow-right3 size-24 right text-gray"></i>  
@@ -33,6 +32,8 @@
       <i class="icon-arrow-right3 size-24 right text-gray"></i>  
       <span translate>Advanced</span>
     </li>
+  </ul>
+  <ul class="no-bullet m0 size-14">
 
     <h4 class="title m0" translate>Global settings</h4>
 
@@ -51,7 +52,6 @@
         {{preferences.unitName}}
       </span>
     </li>
-      
     <li class="line-b p20" ng-click="$root.go('preferencesAltCurrency')">
       <span translate>Alternative Currency</span>
       <span class="right text-gray">

public/views/splash.html

@@ -22,10 +22,12 @@
         <div class="rect4"></div>
         <div class="rect5"></div>
       </div>
-      <span translate>Creating Wallet...</span>
+      <span translate>Creating Profile...</span>
     </div>
   </div>
   <div class="row columns start-button" ng-show="!creatingProfile">
     <button ng-click="create()" class="button black expand radius size-12 text-spacing" translate> GET STARTED </button>  
+    <p class="text-gray m5b size-12" translate>Already have a wallet?</p>
+    <button  ng-click="create(true)" class="outline dark-gray tiny" translate>Import backup </button>
   </div>
 </div>

public/views/splash/2.html

@@ -1,3 +0,0 @@
-<div class="tour">
-	<img ng-click="$root.go('splash.four')" class="m15t" src="img/tour2.png" alt="tour1" width="90%">
-</div>

public/views/splash/3.html

@@ -1,3 +0,0 @@
-<div class="tour">
-	<img ng-click="$root.go('splash.four')" class="m15t" src="img/tour3.png" alt="tour1" width="90%">
-</div>

public/views/splash/4.html

@@ -1,3 +0,0 @@
-<div class="tour">
-	<img ng-click="$root.go('walletHome')" class="m15t" src="img/tour4.png" alt="tour1" width="90%">
-</div>

public/views/splash/5.html

@@ -1,15 +0,0 @@
-<div class="tour">
-	<img ng-click="$root.go('splash.finish')" class="m15t" src="img/tour5.png" alt="tour1" width="90%">
-</div>
-<div class="row tour5">
-	<div class="small-6 columns">
-		<button class="button outline light-gray radius expand">
-			SKIP
-		</button>
-	</div>
-	<div class="small-6 columns">
-		<button class="black radius expand">
-			SET A PIN
-		</button>
-	</div>
-</div>

public/views/walletHome.html

@@ -10,6 +10,10 @@
       <i class="fi-alert"></i> <span translate>You do not have any wallet</span>
     </div>
     <button class="button black expand" ng-click="$root.go('add')" translate>Create</button>
+
+    <div class="text-center text-gray p20v" ng-click="$root.go('preferences')">
+      <button class=" outline dark-gray tiny" translate> Preferences </button>
+    </div>
   </div>
 
   <div class="onGoingProcess" ng-show="index.isOffline">
@@ -465,4 +469,4 @@
   </div>
 </div>
 <div class="extra-margin-bottom"></div>
-<div ng-include="'views/includes/menu.html'"></div>
+<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>

src/css/mobile.css

@@ -97,7 +97,7 @@ _:-ms-fullscreen, :root .main {
 }
 
 .tab-bar h1 {
-  color: #1ABC9C;
+  color: #7A8C9E;
   font-weight: 500;
   font-size: 14px;
 }
@@ -404,12 +404,12 @@ to prevent collapsing during animation*/
   left: 0;
   right: 0;
 
-  animation-timing-function: linear;
+  animation-timing-function: ease-in-out;
   animation-duration: .3s;
   animation-iteration-count: 1;
   animation-fill-mode: both;
   
-  -webkit-animation-timing-function: linear;
+  -webkit-animation-timing-function:  ease-in-out;
   -webkit-animation-duration: .3s;
   -webkit-animation-iteration-count: 1;
   -webkit-animation-fill-mode: both;

src/js/controllers/index.js

@@ -721,7 +721,7 @@ angular.module('copayApp.controllers').controller('indexController', function($r
       self.noFocusedWallet = true;
       self.isComplete = null;
       self.walletName = null;
-      go.addWallet();
+      go.path('import');
     });
   });
 

src/js/controllers/preferences.js

@@ -10,10 +10,13 @@ angular.module('copayApp.controllers').controller('preferencesController',
       isoCode: config.wallet.settings.alternativeIsoCode
     }; 
     var fc = profileService.focusedClient;
-    $scope.encrypt = fc.hasPrivKeyEncrypted();
+    if (fc)
+      $scope.encrypt = fc.hasPrivKeyEncrypted();
 
     var unwatch = $scope.$watch('encrypt', function(val) {
       var fc = profileService.focusedClient;
+      if (!fc) return;
+
       if (val && !fc.hasPrivKeyEncrypted()) {
         $rootScope.$emit('Local/NeedsPassword', true, function(err, password) {
           if (err || !password) {

src/js/controllers/preferencesColor.js

@@ -4,6 +4,7 @@ angular.module('copayApp.controllers').controller('preferencesColorController',
   function($scope, configService, profileService, go) {
     var config = configService.getSync();
     this.colorOpts = [
+      '#7A8C9E',
       '#F38F12',
       '#F4D03F',
       '#4A90E2',
@@ -11,7 +12,6 @@ angular.module('copayApp.controllers').controller('preferencesColorController',
       '#9B59B6',
       '#E856EF',
       '#F883B4',
-      '#7A8C9E',
     ];
 
     var fc = profileService.focusedClient;

src/js/controllers/walletHome.js

@@ -357,6 +357,9 @@ angular.module('copayApp.controllers').controller('walletHomeController', functi
       return;
 
     var fc = profileService.focusedClient;
+    if (!fc)
+      return;
+
     $timeout(function() {
       storageService.getLastAddress(fc.credentials.walletId, function(err, addr) {
         if (addr) {

src/js/models/profile.js

@@ -14,17 +14,20 @@ Profile.create = function(opts) {
 
   var x = new Profile();
   x.createdOn = Date.now();
-  x.credentials = opts.credentials;
+  x.credentials = opts.credentials || [];
   return x;
 };
 
 
 Profile.fromObj = function(obj) {
   var x = new Profile();
+
   x.createdOn = obj.createdOn;
   x.credentials = obj.credentials;
+
   if (x.credentials[0] && typeof x.credentials[0] != 'object')
     throw ("credentials should be an object");
+
   return x;
 };
 

src/js/routes.js

@@ -68,23 +68,23 @@ angular
         needProfile: false,
         views: {
           'main': {
-            templateUrl: 'views/splash/1.html',
+            templateUrl: 'views/splash.html',
             controller: function($scope, $timeout, $log, profileService, go) {
               if (profileService.profile) {
                 go.walletHome();
               }
 
-              $scope.create = function() {
+              $scope.create = function(noWallet) {
                 $scope.creatingProfile = true;
 
-                profileService.create(function(err) {
+                profileService.create({noWallet: noWallet}, function(err) {
                   if (err) {
                     $scope.creatingProfile = false;
                     $log.warn(err);
                     $scope.error = err;
                     $scope.$apply();
                     $timeout(function() {
-                      $scope.create();
+                      $scope.create(noWallet);
                     }, 3000);
                   }
                 });
@@ -384,7 +384,7 @@ angular
       create: 12,
       join: 12,
       import: 12,
-      importLegacy: 12
+      importLegacy: 13
     };
 
 

src/js/services/profileService.js

@@ -157,9 +157,13 @@ angular.module('copayApp.services')
       });
     };
 
-    root._createNewProfile = function(cb) {
-      var walletClient = bwcService.getClient();
+    root._createNewProfile = function(opts, cb) {
 
+      if (opts.noWallet) {
+        return cb(null, Profile.create());
+      }
+
+      var walletClient = bwcService.getClient();
       walletClient.createWallet('Personal Wallet', 'me', 1, 1, {
         network: 'livenet'
       }, function(err) {
@@ -276,13 +280,11 @@ angular.module('copayApp.services')
       });
     };
 
-
-
-    root.create = function(cb) {
+    root.create = function(opts, cb) {
       $log.info('Creating profile');
       configService.get(function(err) {
         root.applyConfig();
-        root._createNewProfile(function(err, p) {
+        root._createNewProfile(opts, function(err, p) {
           if (err) return cb(err);
 
           root.bindProfile(p, function(err) {