Change top-bar color

public/views/glidera.html

@@ -2,7 +2,7 @@
 <div
   class="topbar-container"
   ng-include="'views/includes/topbar.html'"
-  ng-init="titleSection='Buy & Sell Bitcoin'; closeToHome = true">
+  ng-init="titleSection='Buy & Sell Bitcoin'; closeToHome = true; noColor = true">
 </div>
 
 

public/views/includes/topbar.html

@@ -1,4 +1,6 @@
-<nav ng-controller="topbarController as topbar" class="tab-bar">
+<nav ng-controller="topbarController as topbar" 
+  class="tab-bar" 
+  ng-style="{'background-color': noColor ? '#4B6178' : index.backgroundColor}">
   <section class="left-small">
     <a id="hamburger" class="p10" ng-show="!goBackToState && !closeToHome  && !index.noFocusedWallet"
       ng-click="index.openMenu()"><i class="fi-list size-24"></i>
@@ -14,12 +16,14 @@
     </a>
   </section>
 
-  <section class="right-small" ng-show="showCamera">
+  <section class="right-small" ng-show="showPreferences">
-    <qr-scanner ng-show="index.isComplete" on-scan="topbar.onQrCodeScanned(data)" before-scan="topbar.openSendScreen()"></qr-scanner>
+    <a class="p10" ng-click="topbar.goPreferences()">
+      <i class="fi-widget size-24"></i>
+    </a>
   </section>
 
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backgroundColor}">
+    <h1 class="title ellipsis">
       {{(titleSection|translate) || (index.alias || index.walletName)}}
     </h1>
   </section>

public/views/modals/advancedSend.html

@@ -1,34 +0,0 @@
-<nav class="tab-bar">
-  <section class="left-small">
-    <a ng-click="cancel()" class="p10">
-      <span class="text-close" translate>Close</span>
-    </a>   
-  </section>
-  <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color':color}" translate>
-      Advanced Send
-    </h1>
-  </section>
-</nav>
-
-
-<div class="modal-content fix-modals-touch">
-  <ul class="no-bullet m0 size-14"> 
-    <h4 class="title m0" translate>Fee Policy</h4>
-    <li ng-repeat="fee in (network == 'livenet' ? feeLevels.livenet : feeLevels.testnet)" ng-click="save(fee.level)" class="line-b p20">
-      <span class="text-capitalize">{{fee.level|translate}}</span>
-      <i class="fi-check size-16 right" ng-show="currentFeeLevel == fee.level"></i>
-    </li>
-  </ul>
-
-  <div class="row column m20t">
-    <div class="text-gray size-12 text-center" ng-repeat="fee in (network == 'livenet' ? feeLevels.livenet :
-      feeLevels.testnet)" ng-if="fee.level == currentFeeLevel">
-      <span translate>Average confirmation time: {{fee.nbBlocks * 10}} minutes</span>. 
-      <span class="size-12 text-light" translate>Current fee rate for this policy: {{fee.feePerKBUnit}}/kiB</span>
-    </div>
-  </div>
-
-  <div class="extra-margin-bottom"></div>
-</div>
-

public/views/modals/customized-amount.html

@@ -1,11 +1,11 @@
-<nav class="tab-bar">
+<nav class="tab-bar" ng-style="{'background-color':color}">
   <section class="left-small">
     <a ng-click="cancel()" class="p10">
       <span class="text-close" translate>Close</span>
     </a>
   </section>
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color':color}" translate>
+    <h1 class="title ellipsis" translate>
       Request a specific amount
     </h1>
   </section>

public/views/modals/destination-address.html

@@ -121,10 +121,9 @@
             </div>
             <div class="columns large-6 medium-6 small-6">
               <input type="submit" 
-                     class="button expand round" 
+                     class="button expand round black" 
                      value="{{'Save'|translate}}"
                      ng-disabled="!addressbookForm.$valid"
-                     ng-style="{'background-color':color}" 
                      ng-click="newAddress = ''; add(addressbook)">
             </div>
           </div>

public/views/modals/glidera-tx-details.html

@@ -6,7 +6,7 @@
     </a>
   </section>
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color':color}">
+    <h1 class="title ellipsis">
       Details
     </h1>
   </section>

public/views/modals/paypro.html

@@ -1,11 +1,11 @@
-<nav class="tab-bar">
+<nav class="tab-bar" ng-style="{'background-color':color}">
   <section class="left-small">
     <a ng-click="cancel()" class="p10">
       <span class="text-close" translate>Close</span>
     </a>
   </section>
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color':color}" translate>
+    <h1 class="title ellipsis" translate>
       Payment request
     </h1>
   </section>

public/views/modals/tx-details.html

@@ -1,4 +1,4 @@
-<nav class="tab-bar">
+<nav class="tab-bar" ng-style="{'background-color':color}">
   <section class="left-small">
     <a ng-click="cancel()">
       <i class="icon-arrow-left3 icon-back"></i>
@@ -6,7 +6,7 @@
     </a>
   </section>
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color':color}" translate>
+    <h1 class="title ellipsis" translate>
       Transaction
     </h1>
   </section>

public/views/modals/txp-details.html

@@ -1,4 +1,4 @@
-<nav class="tab-bar">
+<nav class="tab-bar" ng-style="{'background-color':color}">
   <section class="left-small">
     <a ng-click="cancel()">
       <i class="icon-arrow-left3 icon-back"></i>
@@ -6,7 +6,7 @@
     </a>
   </section>
   <section class="middle tab-bar-section">
-    <h1 class="title ellipsis" ng-style="{'color':color}" translate>
+    <h1 class="title ellipsis" translate>
       Payment Proposal
     </h1>
   </section>

public/views/walletHome.html

@@ -1,7 +1,7 @@
 
 <div class="topbar-container"
   ng-include="'views/includes/topbar.html'"
-  ng-init="showCamera = true">
+  ng-init="showPreferences = true">
 </div>
 
 <div ng-controller="walletHomeController as home">
@@ -111,11 +111,8 @@
           <div class="avatar-wallet left"
             ng-style="{'background-color':index.backgroundColor}">{{ (index.alias || index.walletName) | limitTo: 1}}
           </div>
-          <div class="right">
+          <div class="camera-icon" ng-show="index.isComplete">
-            <a ng-click="$root.go('preferences')" class="button outline round light-gray tiny preferences-icon m0">
+            <qr-scanner on-scan="home.onQrCodeScanned(data)" before-scan="home.openSendScreen()"></qr-scanner> 
-              <i class="fi-widget size-18 vm"></i>
-              <span class="show-for-medium-up" translate>Preferences</span>
-            </a>
           </div>
           <div class="wallet-info">
             <div ng-show="index.isShared">

src/css/mobile.css

@@ -90,13 +90,11 @@ _:-ms-fullscreen, :root .main {
 }
 
 .tab-bar {
-  background: #FFFFFF;
+  background-color: #4B6178;
   z-index: 5;
-  border-bottom: 1px solid #E9E9EC;
 }
 
 .tab-bar h1 {
-  color: #7A8C9E;
   font-weight: 500;
   font-size: 14px;
 }
@@ -119,6 +117,10 @@ _:-ms-fullscreen, :root .main {
   border-left: none;
 }
 
+.right-small a, .left-small a {
+  color: #FFFFFF;
+}
+
 .tab-bar .icon-back {
   font-size: 2.5rem;
   position: absolute;
@@ -220,6 +222,19 @@ _:-ms-fullscreen, :root .main {
   overflow: hidden;
 }
 
+.camera-icon a {
+  color: #fff;
+  display: block;
+  position: absolute;
+  background: #333;
+  border: 1px solid #666;
+  padding: 15px 17px;
+  border-radius: 100%;
+  top: -43px;
+  right: 15px;
+  opacity: 0.7;
+}
+
 .copayers {
   position: relative;
   padding: 0;
@@ -247,12 +262,6 @@ ul.copayer-list img {
   background-color: #213140;
 }
 
-
-
-.right-small a, .left-small a {
-  color: #A5B2BF;
-}
-
 a.missing-copayers {
   bottom: -34px;
   text-align: center;

src/js/controllers/buyGlidera.js

@@ -42,6 +42,7 @@ angular.module('copayApp.controllers').controller('buyGlideraController',
       var ModalInstanceCtrl = function($scope, $modalInstance) {
         $scope.type = 'BUY';
         $scope.wallets = wallets;
+        $scope.noColor = true;
         $scope.cancel = function() {
           $modalInstance.dismiss('cancel');
         };

src/js/controllers/glidera.js

@@ -42,6 +42,7 @@ angular.module('copayApp.controllers').controller('glideraController',
         $scope.tx = tx;
         $scope.settings = config;
         $scope.color = fc.backgroundColor;
+        $scope.noColor = true;
 
         glideraService.getTransaction(token, tx.transactionUuid, function(error, tx) {
           $scope.tx = tx;

src/js/controllers/index.js

@@ -562,6 +562,9 @@ angular.module('copayApp.controllers').controller('indexController', function($r
     self.backgroundColor = config.colorFor[self.walletId] || '#4A90E2';
     var fc = profileService.focusedClient;
     fc.backgroundColor = self.backgroundColor;
+    if (isCordova && StatusBar.isVisible) {
+      StatusBar.backgroundColorByHexString(fc.backgroundColor);
+    }
   };
 
   self.setBalance = function(balance) {

src/js/controllers/sellGlidera.js

@@ -48,6 +48,7 @@ angular.module('copayApp.controllers').controller('sellGlideraController',
       var ModalInstanceCtrl = function($scope, $modalInstance) {
         $scope.type = 'SELL';
         $scope.wallets = wallets;
+        $scope.noColor = true;
         $scope.cancel = function() {
           $modalInstance.dismiss('cancel');
         };

src/js/controllers/topbar.js

@@ -1,17 +1,13 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('topbarController', function($scope, $rootScope, go) {
+angular.module('copayApp.controllers').controller('topbarController', function(go) { 
-
-  this.onQrCodeScanned = function(data) {
-    $rootScope.$emit('dataScanned', data);
-  };
-
-  this.openSendScreen = function() {
-    go.send();
-  };
 
   this.goHome = function() {
     go.walletHome();
   };
 
+  this.goPreferences = function() {
+    go.preferences();
+  };
+
 });

src/js/controllers/walletHome.js

@@ -1,6 +1,6 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('walletHomeController', function($scope, $rootScope, $timeout, $filter, $modal, $log, notification, txStatus, isCordova, profileService, lodash, configService, rateService, storageService, bitcore, isChromeApp, gettext, gettextCatalog, nodeWebkit, addressService, ledger, feeService, bwsError, confirmDialog, txFormatService, animationService, addressbookService) {
+angular.module('copayApp.controllers').controller('walletHomeController', function($scope, $rootScope, $timeout, $filter, $modal, $log, notification, txStatus, isCordova, profileService, lodash, configService, rateService, storageService, bitcore, isChromeApp, gettext, gettextCatalog, nodeWebkit, addressService, ledger, feeService, bwsError, confirmDialog, txFormatService, animationService, addressbookService, go) {
 
   var self = this;
   $rootScope.hideMenuBar = false;
@@ -98,6 +98,14 @@ angular.module('copayApp.controllers').controller('walletHomeController', functi
     }
   };
 
+  this.onQrCodeScanned = function(data) {
+    $rootScope.$emit('dataScanned', data);
+  };
+
+  this.openSendScreen = function() {
+    go.send();
+  };
+
   rateService.whenAvailable(function() {
     self.isRateAvailable = true;
     $rootScope.$digest();
@@ -122,7 +130,6 @@ angular.module('copayApp.controllers').controller('walletHomeController', functi
         'address': ($scope.newAddress || ''),
         'label': ''
       };
-      $scope.color = fc.backgroundColor;
 
       $scope.beforeQrCodeScann = function() {
         $scope.error = null;