Merge pull request #391 from bitjson/wip/design

Send tab clean up

src/js/controllers/tab-send.js

@@ -6,6 +6,7 @@ angular.module('copayApp.controllers').controller('tabSendController', function(
   var CONTACTS_SHOW_LIMIT;
   var currentContactsPage;
 
+
   var updateList = function() {
     CONTACTS_SHOW_LIMIT = 10;
     currentContactsPage = 0;
@@ -103,11 +104,56 @@ angular.module('copayApp.controllers').controller('tabSendController', function(
     });
   };
 
+
+  var updateHasFunds = function() {
+    $scope.hasFunds = null;
+
+    var wallets = profileService.getWallets({
+      onlyComplete: true,
+    });
+
+    if (!wallets || !wallets.length) {
+      $scope.hasFunds = false;
+    }
+
+    var index = 0;
+    lodash.each(wallets, function(w) {
+      walletService.getStatus(w, {}, function(err, status) {
+        ++index;
+        if (err || !status) {
+          $log.error(err);
+          return;
+        }
+
+        if (status.availableBalanceSat) {
+          $scope.hasFunds = true;
+        }
+        if (index == wallets.length) {
+          $scope.hasFunds = $scope.hasFunds || false;
+        }
+      });
+    });
+  };
+
   $scope.$on("$ionicView.beforeEnter", function(event, data) {
     $scope.formData = {
       search: null
     };
     updateList();
+    updateHasFunds();
   });
 
+  // This could probably be enhanced refactoring the routes abstract states
+  $scope.createWallet = function() {
+    $state.go('tabs.home').then(function() {
+      $state.go('tabs.add.create-personal');
+    });
+  };
+
+  $scope.buyBitcoin = function() {
+    $state.go('tabs.home').then(function() {
+      $state.go('tabs.buyandsell.glidera');
+    });
+  };
+
 });

src/sass/buttons.scss

@@ -38,6 +38,9 @@ $button-secondary-active-border:   transparent;
   &.button-secondary {
     &.button-standard {
       @extend %button-standard;
+      & + .button-standard {
+        margin-top: 1rem;
+      }
     }
   }
 }

src/sass/views/tab-scan.scss

@@ -7,51 +7,13 @@ $scannerBackgroundColor: #060d2d;
   .bar-header {
     opacity: .9;
   }
+  .zero-state-cta {
+    padding-bottom: 6vh;
+  }
   &-has-problems,
   &-loading-camera {
     background-color: $scannerBackgroundColor;
   }
-  &-has-problems {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-
-    .zero-state {
-      &-icon {
-        display: inline-block;
-        width: 50px;
-        height: 50px;
-        border-radius: 50%;
-        padding: 13px;
-        box-shadow: $subtle-box-shadow;
-        background-color: #fff;
-      }
-      &-heading {
-        font-size: 20px;
-        margin: 1rem;
-      }
-      &-description {
-        margin: 0 2rem 120px;
-        opacity: .6;
-        max-width: 300px;
-      }
-      &-tldr {
-        margin: 1rem auto;
-      }
-      &-description,
-      &-tldr {
-        max-width: 300px;
-      }
-      &-cta {
-        position: absolute;
-        bottom: 0;
-        width: 100%;
-        padding-bottom: 6vh;
-      }
-    }
-  }
   &-loading-camera {
     height: 100%;
     width: 100%

src/sass/views/tab-send.scss

@@ -1,5 +1,15 @@
 #tab-send {
+  .zero-state-cta {
+    padding-bottom: 3vh;
+  }
+  .send-heading {
+    font-size: 14px;
+    font-weight: bold;
+    padding-bottom: 0;
+  }
   .bitcoin-address {
+    border-top: none;
+    padding-bottom: .5rem;
     @media(max-width: 480px) {
       input {
         font-size: 12px;

src/sass/views/views.scss

@@ -15,6 +15,7 @@
 @import "address-book";
 @import "wallet-backup-phrase";
 @import "address-book";
+@import "zero-state";
 @import "onboarding/onboarding";
 @import "includes/walletActivity";
 @import "includes/wallets";

src/sass/views/zero-state.scss

@@ -0,0 +1,45 @@
+.zero-state {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  &-icon {
+    display: inline-block;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    padding: 13px;
+    box-shadow: $subtle-box-shadow;
+    background-color: #fff;
+    img {
+      height: 100%;
+      width: 100%;
+    }
+  }
+  &-heading {
+    font-size: 20px;
+    margin: 1rem;
+  }
+  &-description {
+    margin-top: 0;
+    margin-left: 2rem;
+    margin-right: 2rem;
+    margin-bottom: 120px;
+    opacity: .6;
+    max-width: 300px;
+  }
+  &-tldr {
+    margin: 1rem auto;
+  }
+  &-description,
+  &-tldr {
+    max-width: 300px;
+  }
+  &-cta {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+  }
+}