share transaction after sending on mobile + share explorer url on desktop.

This commit is contained in:
Sebastiaan Pasma 2018-07-16 17:21:15 +02:00
commit 236a93d69d
No known key found for this signature in database
GPG key ID: 9A2B0C8B95A1D26F
7 changed files with 71 additions and 18 deletions

View file

@ -648,6 +648,7 @@ msgstr ""
#: src/js/controllers/copayers.js:79
#: src/js/controllers/export.js:193
#: src/js/controllers/confirm.js:41
#: www/views/includes/copyToClipboard.html:4
msgid "Copied to clipboard"
msgstr ""

View file

@ -1,11 +1,12 @@
'use strict';
angular.module('copayApp.controllers').controller('confirmController', function($rootScope, $scope, $interval, $filter, $timeout, $ionicScrollDelegate, gettextCatalog, walletService, platformInfo, lodash, configService, $stateParams, $window, $state, $log, profileService, bitcore, bitcoreCash, txFormatService, ongoingProcess, $ionicModal, popupService, $ionicHistory, $ionicConfig, payproService, feeService, bwcError, txConfirmNotification, externalLinkService, firebaseEventsService, soundService) {
angular.module('copayApp.controllers').controller('confirmController', function($rootScope, $scope, $interval, $filter, $timeout, $ionicScrollDelegate, ionicToast, gettextCatalog, walletService, platformInfo, lodash, configService, $stateParams, $window, $state, $log, profileService, bitcore, bitcoreCash, txFormatService, ongoingProcess, $ionicModal, popupService, $ionicHistory, $ionicConfig, payproService, feeService, bwcError, txConfirmNotification, externalLinkService, firebaseEventsService, soundService, clipboardService) {
var countDown = null;
var FEE_TOO_HIGH_LIMIT_PER = 15;
var tx = {};
var lastTxId = "";
// Config Related values
var config = configService.getSync();
@ -31,6 +32,16 @@ angular.module('copayApp.controllers').controller('confirmController', function(
}, 10);
}
$scope.shareTransaction = function() {
var explorerTxUrl = 'https://explorer.bitcoin.com/'+tx.coin+'/tx/'+lastTxId;
if (platformInfo.isCordova) {
var text = 'Take a look at this Bitcoin transaction here: '+explorerTxUrl;
window.plugins.socialsharing.share(text, null, null, null);
} else {
ionicToast.show(gettextCatalog.getString('Copied to clipboard'), 'bottom', false, 3000);
clipboardService.copyToClipboard(explorerTxUrl);
}
};
$scope.showWalletSelector = function() {
$scope.walletSelector = true;
@ -612,6 +623,7 @@ angular.module('copayApp.controllers').controller('confirmController', function(
txConfirmNotification.subscribe(wallet, {
txid: txp.txid
});
lastTxId = txp.txid;
}
}, onSendStatusChange);
};

View file

@ -9,12 +9,12 @@ angular.module('copayApp.directives')
scope: {
isShown: '=slideSuccessShow',
onConfirm: '&slideSuccessOnConfirm',
hideOnConfirm: '=slideSuccessHideOnConfirm'
hideOnConfirm: '=slideSuccessHideOnConfirm',
onShare: '=slideSuccessOnShare',
},
link: function(scope, element, attrs) {
scope.isWindowsPhoneApp = platformInfo.isCordova && platformInfo.isWP;
scope.isCordova = platformInfo.isCordova;
scope.hasShareFunction = typeof scope.onShare === 'function';
var elm = element[0];
elm.style.display = 'none';
scope.$watch('isShown', function() {
@ -32,6 +32,9 @@ angular.module('copayApp.directives')
elm.style.display = 'none';
}
};
scope.onShareButtonClick = function() {
scope.onShare();
}
}
};
});

View file

@ -12,12 +12,6 @@ slide-to-accept-success {
.slide-success {
$duration: 400ms;
&__windows-background {
background: $v-success-bg-color;
height: 100%;
width: 100%;
position: fixed;
}
&__background {
$start-radius: 5;
$scale-factor: 20;
@ -40,9 +34,11 @@ slide-to-accept-success {
&__content {
position: relative;
z-index: 1;
margin-top: -20vh;
margin-top: -10vh;
> img {
width: 45vw;
max-width: 166px;
margin-bottom: 1.8rem;
-webkit-transform: translateY(5rem);
transform: translateY(5rem);
@ -59,7 +55,7 @@ slide-to-accept-success {
&__header {
color: #FFFFFF;
font-size: 26px;
font-size: 29px;
-webkit-transform: translateY(5rem);
transform: translateY(5rem);
opacity: 0;
@ -72,6 +68,26 @@ slide-to-accept-success {
opacity: 1;
}
}
&__share {
transition: transform $duration ease, opacity $duration ease;
transition-delay: 1000ms;
opacity: 0;
margin-top: 15vh;
span {
color: #FFF;
font-size: 22px;
height: 28px;
}
img {
height: 28px;
width: auto;
vertical-align: bottom;
margin-right: 4px;
}
&.reveal {
opacity: 0.79;
}
}
}
&__footer {
@ -98,11 +114,11 @@ slide-to-accept-success {
&__btn {
display: block;
color: #FFFFFF;
font-size: 18px;
font-size: 22px;
font-weight: 600;
letter-spacing: 2.86px;
padding: 1rem 0 1.1rem;
border-top: 1px solid rgba(255, 255, 255, .45);
padding: 2rem 0 2.1rem;
border-top: 1px solid rgba(255, 255, 255, 0.25);
cursor: pointer;
}
}

View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="400px" height="400px" viewBox="56 56 400 400" enable-background="new 56 56 400 400" xml:space="preserve">
<g>
<g>
<path fill="#FFFFFF" d="M350.833,297.017c-17.517,0-32.967,8.346-43.062,21.124l-93.629-47.881
c1.226-4.571,2.106-9.296,2.106-14.267c0-5.412-1.046-10.507-2.506-15.465l93.216-47.661
c10.039,13.358,25.889,22.089,43.888,22.089c30.489,0,55.153-24.664,55.153-55.125c0-30.435-24.664-55.112-55.152-55.112
c-30.42,0-55.111,24.677-55.111,55.111c0,4.985,0.882,9.723,2.12,14.308l-93.615,47.882
c-10.108-12.793-25.587-21.166-43.131-21.166c-30.462,0-55.111,24.691-55.111,55.139c0,30.447,24.65,55.125,55.111,55.125
c18.026,0,33.863-8.758,43.943-22.129l93.174,47.66c-1.46,4.943-2.52,10.081-2.52,15.507c0,30.447,24.691,55.125,55.111,55.125
c30.489,0,55.152-24.678,55.152-55.125C405.985,321.681,381.322,297.017,350.833,297.017z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View file

@ -120,6 +120,7 @@
<slide-to-accept-success
slide-success-show="sendStatus === 'success'"
slide-success-on-confirm="onSuccessConfirm()"
slide-success-on-share="shareTransaction"
slide-success-hide-on-confirm="true">
<span ng-show="wallet.m == 1 && (wallet.canSign() || wallet.isPrivKeyExternal())" translate>Payment Sent</span>
<span ng-show="wallet.m > 1 && (wallet.canSign() || wallet.isPrivKeyExternal())" translate>Proposal Created</span>

View file

@ -1,13 +1,16 @@
<div
class="slide-success__background"
ng-class="{'fill-screen': fillScreen, 'slide-success__windows-background': isWindowsPhoneApp}">
ng-class="{'fill-screen': fillScreen}">
</div>
<div ng-disabled="wallet" class="slide-success__content">
<img src="img/onboarding-success.svg" ng-class="{reveal: fillScreen}">
<img src="img/icon-sent-successful.svg" ng-class="{reveal: fillScreen}">
<div class="slide-success__content__header" ng-class="{reveal: fillScreen}">
<ng-transclude>Payment Sent</ng-transclude>
</div>
<div class="slide-success__content__share" ng-if="hasShareFunction" ng-class="{reveal: fillScreen}" ng-click="onShareButtonClick()">
<span><img src="img/icon-share-white.svg"></span><span translate>Share this Transaction</span>
</div>
</div>
<div class="slide-success__footer" ng-class="{reveal: fillScreen}">