Merge pull request #208 from Bitcoin-com/wallet/sprint/18

Wallet/sprint/18

src/js/controllers/tab-home.js

@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('copayApp.controllers').controller('tabHomeController',
-  function($rootScope, $timeout, $scope, $state, $stateParams, $ionicModal, $ionicScrollDelegate, $window, gettextCatalog, lodash, popupService, ongoingProcess, externalLinkService, latestReleaseService, profileService, walletService, configService, $log, platformInfo, storageService, txpModalService, appConfigService, startupService, addressbookService, feedbackService, bwcError, nextStepsService, buyAndSellService, homeIntegrationsService, bitpayCardService, pushNotificationsService, timeService, bitcoincomService, pricechartService, firebaseEventsService, servicesService, shapeshiftService, $ionicNavBarDelegate, signVerifyMessageService) {
+  function($rootScope, $timeout, $scope, $state, $stateParams, $ionicModal, $ionicScrollDelegate, $window, gettextCatalog, lodash, popupService, ongoingProcess, bannerService, externalLinkService, latestReleaseService, profileService, walletService, configService, $log, platformInfo, storageService, txpModalService, appConfigService, startupService, addressbookService, feedbackService, bwcError, nextStepsService, buyAndSellService, homeIntegrationsService, bitpayCardService, pushNotificationsService, timeService, bitcoincomService, pricechartService, firebaseEventsService, servicesService, shapeshiftService, $ionicNavBarDelegate, signVerifyMessageService) {
     var wallet;
     var listeners = [];
     var notifications = [];
@@ -16,9 +16,19 @@ angular.module('copayApp.controllers').controller('tabHomeController',
     $scope.isNW = platformInfo.isNW;
     $scope.showRateCard = {};
     $scope.showServices = false;
+    $scope.bannerIsLoading = true;
+    $scope.bannerImageUrl = '';
+    $scope.bannerUrl = '';
+
 
     $scope.$on("$ionicView.afterEnter", function() {
       startupService.ready();
+
+      bannerService.getBanner(function (banner) {
+        $scope.bannerImageUrl = banner.imageURL;
+        $scope.bannerUrl = banner.url;
+        $scope.bannerIsLoading = false;
+      });
     });
 
     $scope.$on("$ionicView.beforeEnter", function(event, data) {
@@ -155,8 +165,8 @@ angular.module('copayApp.controllers').controller('tabHomeController',
       externalLinkService.open(url, optIn, title, message, okText, cancelText);
     };
 
-    $scope.openStore = function() {
-      externalLinkService.open('https://store.bitcoin.com/', false);
+    $scope.openBannerUrl = function() {
+      externalLinkService.open($scope.bannerUrl, false);
     };
 
     $scope.openNotificationModal = function(n) {

src/js/services/bannerService.js

@@ -0,0 +1,78 @@
+'use strict';
+angular.module('copayApp.services').factory('bannerService', function ($http, $log) {
+  // Export
+  var root = {};
+
+  // Constant
+  var API_URL = 'https://bwscash.bitcoin.com/bws/api/v1/marketing';
+
+  // Variable
+  var hasFetched = false;
+  var banners = [];
+  var defaultBanner = {
+    id: 'default-banner',
+    imageURL: 'img/banner-store.png',
+    url: 'https://store.bitcoin.com/',
+    isLocal: true
+  };
+
+  // Private methods
+  var fetchSettings = function (cb) {
+    var req = {
+      method: 'GET',
+      url: API_URL+'/settings',
+      headers: {
+        'Content-Type': 'application/json',
+        'Accept': 'application/json'
+      }
+    };
+    $http(req).then(function (response) {
+      $log.info('Get banner settings: SUCCESS');
+      banners = response.data;
+      return cb(true);
+    }, function (error) {
+      $log.error('Get banner settings: ERROR ' + error.statusText);
+      return cb(false);
+    });
+  };
+
+  root.getBanner = function (cb) {
+    
+    // If not fetch get the banner
+    if (!hasFetched) {
+      hasFetched = true;
+
+      // If never fetch, lets fetch
+      fetchSettings(function (isSuccess) {
+        root.getBanner(cb);
+      });
+
+    // If fetch, and got banners, lets have a look
+    } else if (banners.length > 0) {
+      var selectedBanners = [];
+      for(var i in banners) {
+        var banner = banners[i]; 
+
+        // Generate the URL for the banner
+        var fileName = banner.image.substring(0, banner.image.lastIndexOf('.'));
+        var extension = banner.image.substring(banner.image.lastIndexOf('.')+1);
+        banner.imageURL = API_URL +'/banners/'+fileName+"/"+extension;
+
+        // Add the banner
+        selectedBanners.push(banners[i]);
+      }
+
+      // If no banner activated, return the default one
+      if (selectedBanners.length == 0) {
+        return cb(defaultBanner);
+      } else {
+        return cb(selectedBanners[Math.floor(Math.random()*banners.length)]);
+      }
+
+    } else {
+      return cb(defaultBanner);
+    }
+  };
+
+  return root;
+});

src/sass/qr.scss

@@ -1,14 +1,15 @@
 qrcode {
-  &.qr-icon {
+  position: relative;
+  &.qr-overlay {
     &::before {
       content: "";
       background-size: 100% 100%;
       display: block;
-      margin-left: calc(50% - 22px);
+      left: 88px;
       margin-top: 88px;
       width: 44px;
       height: 44px;
-      position: absolute;
+      position:absolute;
     }
     &--bch::before {
       background-image: url('../img/qr-overlay-bch.png');

src/sass/views/tab-home.scss

@@ -59,6 +59,9 @@
       }
     }
     &-banner {
+      svg {
+        margin: 40px auto 40px;
+      }
       padding: 0;
       &__img {
         width: 100%;

www/views/tab-home.html

@@ -73,7 +73,6 @@
     <div class="list card">
       <div class="item item-icon-right item-heading">
         <div translate>Bitcoin Core (BTC)</div>
-        <div translate class="subtitle">Slow transactions with high fees</div>
         <a ui-sref="tabs.add"><i class="icon ion-ios-plus-empty list-add-button"></i></a>
       </div>
       <div>
@@ -92,9 +91,11 @@
     <div class="ng-hide list card" ng-show="showServices && (walletsBch[0] || walletsBtc[0])" ng-include="'views/includes/services.html'"></div>
 
     <div class="list card card-banner">
-      <a ng-click="openStore()">
-        <img class="card-banner__img" src="img/banner-store.png"/>
+      <ion-spinner ng-if="bannerIsLoading"></ion-spinner>
+      <a ng-if="!bannerIsLoading" ng-click="openBannerUrl()">
+        <img class="card-banner__img" ng-src="{{bannerImageUrl}}"/>
       </a>
+
     </div>
     
     <div class="ng-hide list card" ng-show="nextStepsItems.length>0 && !isWindowsPhoneApp" ng-include="'views/includes/community.html'"></div>

www/views/tab-receive.html

@@ -41,7 +41,7 @@
               </button>
             </span>
 
-            <qrcode class="qr-icon qr-icon--{{ wallet.coin }}" ng-if="addr" size="220" data="{{ protocolHandler }}:{{addr}}" color="#334"></qrcode>
+            <qrcode class="qr-overlay qr-overlay--{{ wallet.coin }}" ng-if="addr" size="220" data="{{ protocolHandler }}:{{addr}}" color="#334"></qrcode>
             <div class="address-label">
               <span class="ellipsis">{{addr}}</span>
               <ion-spinner ng-show="!addr" class="spinner-dark" icon="crescent"></ion-spinner>