anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #2424 from cmgustavo/bug/UX-issues-01

Browse source 
Bug/ux issues 01
This commit is contained in:
Matias Alejo Garcia 2015-02-20 10:58:11 -03:00
commit 3796ddc4fb
19 changed files with 291 additions and 272 deletions
Download patch file Download diff file Expand all files Collapse all files

12
css/src/desktop.css
View file

@ -26,10 +26,6 @@ a:hover {
color: #2980b9; color: #2980b9;
} }
.last-transactions-content:hover {
background: #eee;
}
a.button-setup.add-wallet:hover { a.button-setup.add-wallet:hover {
opacity: 1; opacity: 1;
} }
@ -51,11 +47,6 @@ ul.pagination li.current a:hover, ul.pagination li.current a:focus {
background: #16A085; background: #16A085;
} }
table tr:hover {
background-color: #eee;
cursor: pointer;
}
.button.outline.light-gray:hover { .button.outline.light-gray:hover {
background: rgba(206,213,220,0.40); background: rgba(206,213,220,0.40);
color: #4B6178; color: #4B6178;
@ -187,7 +178,4 @@ a.text-warning:hover {color: #FD7262;}
color: #fff; color: #fff;
} }
.last-transactions-content.active:hover {
background-color: #E4E8EC;
}

7
css/src/main.css
View file

@ -616,11 +616,6 @@ ul.tx-copayers {
.ma { margin: 0 auto;} .ma { margin: 0 auto;}
.tu {text-transform: uppercase;} .tu {text-transform: uppercase;}
.small {
font-size: 60%;
line-height: inherit;
}
.line-dashed-setuph-v { .line-dashed-setuph-v {
border-left: 1px dashed #415970; border-left: 1px dashed #415970;
} }
@ -850,6 +845,8 @@ input[type=number]::-webkit-outer-spin-button {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
padding-top: 3px;
line-height: 120%;
} }
ul.pagination li.current a { ul.pagination li.current a {

19
css/src/mobile.css
View file

@ -121,7 +121,7 @@
} }
.modal-mobile { .modal-mobile {
padding: 60px 0.5rem; padding: 20px .5rem;
} }
.reveal-modal { .reveal-modal {
@ -393,11 +393,6 @@
transform: none !important; transform: none !important;
} }
.button.secondary:hover, button.secondary:hover {
background: #008CC1;
color: #fff;
}
.move-right .close-menu { .move-right .close-menu {
cursor: pointer; cursor: pointer;
box-shadow: none; box-shadow: none;
@ -462,10 +457,22 @@
color: #1ABC9C; color: #1ABC9C;
} }
.tab-bar {
position: relative;
}
} }
@media (max-width: 640px) { @media (max-width: 640px) {
.tab-bar {
position: absolute;
}
.modal-mobile {
padding: 60px 0.5rem;
}
.tx-comment { .tx-comment {
border-top: 1px solid #eee; border-top: 1px solid #eee;
padding-top: 10px; padding-top: 10px;

35
js/controllers/copayers.js
View file

@ -33,25 +33,24 @@ angular.module('copayApp.controllers').controller('CopayersController',
}; };
$scope.deleteWallet = function() { $scope.deleteWallet = function() {
$scope.loading = true; $rootScope.starting = true;
identityService.deleteWallet(w, function(err) { $timeout(function() {
if (err) { identityService.deleteWallet(w, function(err) {
$scope.loading = null; $rootScope.starting = false;
$scope.error = err.message || err; if (err) {
copay.logger.warn(err); $scope.error = err.message || err;
$timeout(function() { copay.logger.warn(err);
$scope.$digest(); $timeout(function () { $scope.$digest(); });
}); } else {
} else { if ($rootScope.wallet) {
$scope.loading = false; go.walletHome();
if ($rootScope.wallet) { }
go.walletHome(); $timeout(function() {
notification.success('Success', 'The wallet "' + (w.name || w.id) + '" was deleted');
});
} }
$timeout(function() { });
notification.success('Success', 'The wallet "' + (w.name || w.id) + '" was deleted'); }, 100);
});
}
});
}; };
$scope.copySecret = function(secret) { $scope.copySecret = function(secret) {

2
js/controllers/history.js
View file

@ -18,6 +18,7 @@ angular.module('copayApp.controllers').controller('HistoryController',
$scope.alternativeCurrency = []; $scope.alternativeCurrency = [];
$scope.selectPage = function(page) { $scope.selectPage = function(page) {
$scope.paging = true;
$scope.currentPage = page; $scope.currentPage = page;
$scope.update(); $scope.update();
}; };
@ -188,6 +189,7 @@ angular.module('copayApp.controllers').controller('HistoryController',
$scope.totalItems = res.nbItems; $scope.totalItems = res.nbItems;
$scope.loading = false; $scope.loading = false;
$scope.paging = false;
setTimeout(function() { setTimeout(function() {
$scope.$digest(); $scope.$digest();
}, 1); }, 1);

29
js/controllers/more.js
View file

@ -119,22 +119,23 @@ angular.module('copayApp.controllers').controller('MoreController',
$scope.deleteWallet = function() { $scope.deleteWallet = function() {
$scope.loading = true; $scope.loading = true;
identityService.deleteWallet(w, function(err) { $timeout(function() {
if (err) { identityService.deleteWallet(w, function(err) {
$scope.loading = null;
$scope.error = err.message || err;
copay.logger.warn(err);
$timeout(function () { $scope.$digest(); });
} else {
$scope.loading = false; $scope.loading = false;
if ($rootScope.wallet) { if (err) {
go.walletHome(); $scope.error = err.message || err;
copay.logger.warn(err);
$timeout(function () { $scope.$digest(); });
} else {
if ($rootScope.wallet) {
go.walletHome();
}
$timeout(function() {
notification.success('Success', 'The wallet "' + (w.name || w.id) + '" was deleted');
});
} }
$timeout(function() { });
notification.success('Success', 'The wallet "' + (w.name || w.id) + '" was deleted'); }, 100);
});
}
});
}; };
$scope.copyText = function(text) { $scope.copyText = function(text) {

2
js/controllers/receive.js
View file

@ -60,7 +60,7 @@ angular.module('copayApp.controllers').controller('ReceiveController',
$modal.open({ $modal.open({
templateUrl: 'views/modals/qr-address.html', templateUrl: 'views/modals/qr-address.html',
windowClass: 'tiny', windowClass: 'small',
controller: ModalInstanceCtrl, controller: ModalInstanceCtrl,
resolve: { resolve: {
address: function() { address: function() {

24
js/controllers/send.js
View file

@ -407,10 +407,13 @@ angular.module('copayApp.controllers').controller('SendController',
var $oscope = $scope; var $oscope = $scope;
$scope.openPPModal = function(merchantData) { $scope.openPPModal = function(merchantData) {
var ModalInstanceCtrl = function($scope, $modalInstance) { var ModalInstanceCtrl = function($scope, $modalInstance) {
var w = $rootScope.wallet;
var satToUnit = 1 / w.settings.unitToSatoshi;
$scope.md = merchantData; $scope.md = merchantData;
$scope.alternative = $oscope._alternative; $scope.alternative = $oscope._alternative;
$scope.alternativeIsoCode = $oscope.alternativeIsoCode; $scope.alternativeIsoCode = $oscope.alternativeIsoCode;
$scope.isRateAvailable = $oscope.isRateAvailable; $scope.isRateAvailable = $oscope.isRateAvailable;
$scope.unitTotal = (merchantData.total * satToUnit).toFixed(w.settings.unitDecimals);
$scope.cancel = function() { $scope.cancel = function() {
$modalInstance.dismiss('cancel'); $modalInstance.dismiss('cancel');
@ -418,7 +421,7 @@ angular.module('copayApp.controllers').controller('SendController',
}; };
$modal.open({ $modal.open({
templateUrl: 'views/modals/paypro.html', templateUrl: 'views/modals/paypro.html',
windowClass: 'tiny', windowClass: 'medium',
controller: ModalInstanceCtrl, controller: ModalInstanceCtrl,
}); });
}; };
@ -534,7 +537,8 @@ angular.module('copayApp.controllers').controller('SendController',
}; };
$scope.cancel = function(form) { $scope.cancel = function(form) {
$scope.error = $scope.success = null; $scope.error = $scope.success = $scope.newaddress = $scope.newlabel = null;
clearForm(form);
$scope.toggleForm(); $scope.toggleForm();
}; };
@ -542,11 +546,23 @@ angular.module('copayApp.controllers').controller('SendController',
$scope.showForm = !$scope.showForm; $scope.showForm = !$scope.showForm;
}; };
var clearForm = function(form) {
form.newaddress.$pristine = true;
form.newaddress.$setViewValue('');
form.newaddress.$render();
form.newlabel.$pristine = true;
form.newlabel.$setViewValue('');
form.newlabel.$render();
form.$setPristine();
};
// TODO change to modal // TODO change to modal
$scope.submitAddressBook = function(form) { $scope.submitAddressBook = function(form) {
if (form.$invalid) { if (form.$invalid) {
return; return;
} }
$scope.loading = true;
$timeout(function() { $timeout(function() {
var errorMsg; var errorMsg;
var entry = { var entry = {
@ -563,11 +579,13 @@ angular.module('copayApp.controllers').controller('SendController',
if (errorMsg) { if (errorMsg) {
$scope.error = errorMsg; $scope.error = errorMsg;
} else { } else {
clearForm(form);
$scope.toggleForm(); $scope.toggleForm();
notification.success('Entry created', 'New addressbook entry created') notification.success('Entry created', 'New addressbook entry created')
} }
$scope.loading = false;
$rootScope.$digest(); $rootScope.$digest();
}, 1); }, 100);
return; return;
}; };

142
views/copayers.html
View file

@ -1,80 +1,86 @@
<div ng-controller="CopayersController" ng-init="init()"> <div ng-controller="CopayersController" ng-init="init()">
<div class="row"> <div ng-show="$root.starting">
<div class="large-12 medium-12 small-12 columns"> <div ng-include="'views/includes/loading.html'" ng-init="title = 'Deleting'"></div>
<h1>Share this secret with your copayers</h1>
</div>
</div> </div>
<div class="row"> <div class="!$root.starting">
<div class="large-8 columns"> <div class="row">
<div class="large-12 medium-12 small-12 columns">
<div ng-if="!$root.wallet.isComplete()"> <h1>Share this secret with your copayers</h1>
<div class="panel oh">
<div class="box-notification">
<div class="box-icon error">
<i class="fi-alert size-24"></i>
</div>
<span class="text-warning size-14">
Please note the wallet creator <b>must be online</b> until all copayers have joined.
</span>
</div>
<div ng-click="copySecret(secret)">
<div class="text-center">
<qrcode size="250" data="{{secret}}"></qrcode>
</div>
<div class="secret m10t">
{{secret}}
</div>
</div>
<div class="text-center m10t" ng-if="isCordova">
<span class="button outline dark-gray tiny"
ng-click="shareSecret(secret)">
<i class="fi-share"></i> Share secret
</span>
</div>
<div class="size-10 line-t text-center">
<h2 class="m10t">{{$root.wallet.getName()}}</h2>
<span class="text-gray">
[{{$root.wallet.requiredCopayers}} of {{$root.wallet.totalCopayers}} ]
</span>
<span ng-if="$root.wallet.isTestnet()"> in TESTNET</span>
</div>
</div>
</div> </div>
</div> </div>
<div class="large-4 columns">
<div class="panel oh"> <div class="row">
<h3>Waiting for copayers</h3> <div class="large-8 columns">
<div ng-include="'views/includes/copayers.html'"></div>
<div ng-if="!$root.wallet.isComplete()" class="m15t"> <div ng-if="!$root.wallet.isComplete()">
<div class="left m10r" ng-include="'views/includes/photo.html'"></div> <div class="panel oh">
<p class="size-12 m0 m5t left mv"> <div class="box-notification">
<div class="box-icon error">
<i class="fi-alert size-24"></i>
</div>
<span class="text-warning size-14">
Please note the wallet creator <b>must be online</b> until all copayers have joined.
</span>
</div>
<div ng-click="copySecret(secret)">
<div class="text-center">
<qrcode size="250" data="{{secret}}"></qrcode>
</div>
<div class="secret m10t">
{{secret}}
</div>
</div>
<div class="text-center m10t" ng-if="isCordova">
<span class="button outline dark-gray tiny"
ng-click="shareSecret(secret)">
<i class="fi-share"></i> Share secret
</span>
</div>
<div class="size-10 line-t text-center">
<h2 class="m10t">{{$root.wallet.getName()}}</h2>
<span class="text-gray">
[{{$root.wallet.requiredCopayers}} of {{$root.wallet.totalCopayers}} ]
</span>
<span ng-if="$root.wallet.isTestnet()"> in TESTNET</span>
</div>
</div>
</div>
</div>
<div class="large-4 columns">
<div class="panel oh">
<h3>Waiting for copayers</h3>
<div ng-include="'views/includes/copayers.html'"></div>
<div ng-if="!$root.wallet.isComplete()" class="m15t">
<div class="left m10r" ng-include="'views/includes/photo.html'"></div>
<p class="size-12 m0 m5t left mv">
<i class="fi-loop icon-rotate spinner"></i> <i class="fi-loop icon-rotate spinner"></i>
<span translate>Waiting...</span> <span translate>Waiting...</span>
</p> </p>
</div>
</div> </div>
</div> </div>
</div> </div>
<!-- end of row -->
</div> <div class="row">
<!-- end of row --> <div class="large-12 columns">
<div class="row"> <button class="small warning" ng-show="!confirmDelete" ng-click="confirmDelete=!confirmDelete">
<div class="large-12 columns"> <i class="fi-trash"></i> Cancel
<button class="small warning" ng-show="!confirmDelete" ng-click="confirmDelete=!confirmDelete"> </button>
<i class="fi-trash"></i> Cancel <div class="text-center" ng-show="confirmDelete">
</button> <h2>Are you sure you want to cancel and delete this wallet</h2>
<div class="text-center" ng-show="confirmDelete"> <div class="row">
<h2>Are you sure you want to cancel and delete this wallet</h2> <div class="large-6 medium-6 small-6 columns">
<div class="row"> <button class="gray" ng-disabled="loading"
<div class="large-6 medium-6 small-6 columns"> ng-click="confirmDelete=!confirmDelete">No</button>
<button class="gray" ng-disabled="loading" </div>
ng-click="confirmDelete=!confirmDelete">No</button> <div class="large-6 medium-6 small-6 columns">
</div> <button class="warning" ng-disabled="loading" ng-click="deleteWallet(); confirmDelete = !confirmDelete">
<div class="large-6 medium-6 small-6 columns"> <i class="fi-trash"></i> Yes
<button class="warning" ng-disabled="loading" ng-click="deleteWallet(); confirmDelete = !confirmDelete"> </button>
<i class="fi-trash"></i> Yes </div>
</button>
</div> </div>
</div> </div>
</div> </div>

40
views/history.html
View file

@ -11,38 +11,48 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row" ng-if="blockchain_txs[0].txid"> <div class="row m10b" ng-show="paging">
<div class="large-12 columns">
<div class="panel oh">
<span class="text-gray" translate>Getting transactions...</span>
</div>
</div>
</div>
<div ng-show="!paging" class="row" ng-if="blockchain_txs[0].txid">
<div class="large-12 columns"> <div class="large-12 columns">
<div class="panel oh"> <div class="panel oh">
<div ng-repeat="btx in blockchain_txs | orderBy:'-ts'" ng-click="openTxModal(btx)" ng-class="{'line-b':!$last}" class="last-transactions-content"> <div ng-repeat="btx in blockchain_txs | orderBy:'-ts'"
ng-click="openTxModal(btx)"
ng-class="{'line-b':!$last}"
class="row last-transactions-content">
<div class="row"> <div class="large-6 medium-6 small-5 columns">
<div class="large-6 medium-6 small-12 columns size-16"> <div class="ellipsis">
<div class="ellipsis m10b"> {{btx.comment || btx.labelTo}} &nbsp;
</div>
<div class="m5t size-14 text-gray">
<time ng-if="btx.ts">{{btx.ts | amTimeAgo}}</time> <time ng-if="btx.ts">{{btx.ts | amTimeAgo}}</time>
<span class="label alert" ng-show="!btx.ts && (!btx.confirmations || btx.confirmations == 0)"> <span translate class="text-warning"
<span translate>Unconfirmed</span> ng-show="!btx.ts && (!btx.confirmations || btx.confirmations == 0)">
Unconfirmed
</span> </span>
</div> </div>
</div> </div>
<div class="large-6 medium-6 small-12 columns"> <div class="large-6 medium-6 small-7 columns">
<div class="text-right" ng-class="{ <div ng-if="!$root.updatingBalance" class="text-right" ng-class="{
'text-primary' : btx.action == 'received', 'text-primary' : btx.action == 'received',
'text-warning': btx.action == 'sent', 'text-warning': btx.action == 'sent',
'text-gray': btx.action == 'moved'}"> 'text-gray': btx.action == 'moved'}">
<span class="size-21"> <span class="size-18">
<span ng-if="!$root.updatingBalance"> <span ng-if="btx.action == 'received'">+</span><span ng-if="btx.action == 'sent'">-</span>{{btx.amount}}
<span ng-if="btx.action == 'received'">+</span><span ng-if="btx.action == 'sent'">-</span>{{btx.amount}} {{$root.wallet.settings.unitName}}
</span>
{{$root.wallet.settings.unitName}}
</span> </span>
<span class="size-14 db m5t text-gray" ng-show="btx.alternativeAmount"> <span class="size-14 db m5t text-gray" ng-show="btx.alternativeAmount">
{{btx.alternativeAmount}} {{$root.wallet.settings.alternativeIsoCode}} {{btx.alternativeAmount}} {{$root.wallet.settings.alternativeIsoCode}}
</span> </span>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
</div> </div>

10
views/includes/copayers.html
View file

@ -6,12 +6,12 @@
</div> </div>
</div> </div>
<div class="left" tooltip="ID: {{copayer.peerId}}" tooltip-placement="bottom"> <div class="left" tooltip="ID: {{copayer.peerId}}" tooltip-placement="bottom">
<small class="text-gray" ng-show="copayer.index == 0"> <span class="size-12" ng-show="copayer.index == 0">
<i class="fi-check m5r"></i> {{'Me'|translate}} <i class="fi-check m5r"></i> {{'Me'|translate}}
</small> </span>
<small class="text-gray" ng-show="copayer.index > 0"> <span class="size-12 text-gray" ng-show="copayer.index > 0">
<i class="fi-check m5r"></i> {{copayer.nick}} <i class="fi-check m5r"></i> {{copayer.nick}}
</small> </span>
</div> </div>
</li> </li>
</ul> </ul>

24
views/modals/address-book.html
View file

@ -1,8 +1,7 @@
<nav class="tab-bar text-right hide-for-large-up"> <nav class="tab-bar text-right hide-for-large-up">
<span ng-click="close()" class="p10 text-white">Close</span> <span ng-click="close()" class="p10 text-white">Close</span>
</nav> </nav>
<div class="row modal-mobile"> <div class="modal-mobile">
<div class="large-12 columns">
<h1 ng-show="!showForm">Address Book</h1> <h1 ng-show="!showForm">Address Book</h1>
<h1 ng-show="showForm">Add a new entry</h1> <h1 ng-show="showForm">Add a new entry</h1>
<p translate class="text-gray m15b" ng-show="!showForm && !hasEntry()">Empty. Create an alias for your addresses</p> <p translate class="text-gray m15b" ng-show="!showForm && !hasEntry()">Empty. Create an alias for your addresses</p>
@ -18,7 +17,7 @@
<thead class="show-for-large-up"> <thead class="show-for-large-up">
<tr> <tr>
<th translate>Entry</th> <th translate>Entry</th>
<th ng-class="{'hide-for-small-only' : $root.wallet.isShared()}" ng-show="$root.wallet.isShared()" translate>Creator</th> <th class="show-for-large-up" ng-class="{'hide-for-small-only' : $root.wallet.isShared()}" ng-show="$root.wallet.isShared()" translate>Creator</th>
<th class="show-for-large-up" translate>Date</th> <th class="show-for-large-up" translate>Date</th>
<th class="show-for-large-up">Visible</th> <th class="show-for-large-up">Visible</th>
</tr> </tr>
@ -29,9 +28,9 @@
ng-class="{'addressbook-disabled': info.hidden}"> ng-class="{'addressbook-disabled': info.hidden}">
<td ng-click="copyToSend(addr)"> <td ng-click="copyToSend(addr)">
<b>{{info.label}}</b><br> <b>{{info.label}}</b><br>
<span class="address-size">{{::addr}}</span> <small class="address-size">{{::addr}}</small>
</td> </td>
<td ng-click="copyToSend(addr)" ng-show="$root.wallet.isShared()" ng-class="{'hide-for-small-only' : $root.wallet.isShared()}">{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td> <td class="show-for-large-up" ng-click="copyToSend(addr)" ng-show="$root.wallet.isShared()">{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td>
<td ng-click="copyToSend(addr)" class="show-for-large-up"><time>{{::info.createdTs | amCalendar}}</time></td> <td ng-click="copyToSend(addr)" class="show-for-large-up"><time>{{::info.createdTs | amCalendar}}</time></td>
<td class="show-for-large-up text-center"> <td class="show-for-large-up text-center">
<a ng-click="toggleAddressBookEntry(addr)" title="{{ info.hidden ? 'Enable' : 'Disable'}} address"> <a ng-click="toggleAddressBookEntry(addr)" title="{{ info.hidden ? 'Enable' : 'Disable'}} address">
@ -42,9 +41,9 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> <form ng-show="showForm" class="m0" name="addressBookForm"
<div class="large-6 medium-6 columns large-centered medium-centered" > ng-disabled="loading"
<form ng-show="showForm" class="m0" name="addressBookForm" ng-submit="submitAddressBook(addressBookForm)" novalidate> ng-submit="submitAddressBook(addressBookForm)" novalidate>
<div class="box-notification" ng-show="error"> <div class="box-notification" ng-show="error">
<div class="box-icon error"> <div class="box-icon error">
<i class="size-24 fi-x"></i> <i class="size-24 fi-x"></i>
@ -75,14 +74,13 @@
placeholder="{{'Label'|translate}}" ng-model="newlabel" required> placeholder="{{'Label'|translate}}" ng-model="newlabel" required>
</div> </div>
</label> </label>
<a translate class="button secondary default" ng-click="cancel(addressBookForm)">Cancel</a> <a translate class="button secondary default" ng-show="!loading" ng-click="cancel(addressBookForm)">Cancel</a>
<button class="primary right" <button class="primary right"
ng-disabled="addressBookForm.$invalid || loading" ng-disabled="addressBookForm.$invalid || loading"
ng-click="submitAddressBook(addressBookForm)">{{'Add'|translate}}</button> ng-click="submitAddressBook(addressBookForm)">{{'Add'|translate}}</button>
</form> </form>
</div> <a ng-show="!showForm" class="button primary expand" ng-disabled="loading" ng-click="toggleForm()">
<div class="large-12 columns" ng-show="!showForm"> <i class="fi-plus"></i> Add entry
<a class="button primary expand" ng-click="toggleForm()"><i class="fi-plus"></i> Add entry</a> </a>
</div>
<a class="close-reveal-modal show-for-large-up" ng-click="close()"><i class="fi-x size-18"></i></a> <a class="close-reveal-modal show-for-large-up" ng-click="close()"><i class="fi-x size-18"></i></a>
</div> </div>

2
views/modals/paypro.html
View file

@ -4,7 +4,7 @@
<div class="modal-mobile"> <div class="modal-mobile">
<div class="text-center"> <div class="text-center">
<div class="size-48"> <div class="size-48">
{{md.unitTotal}} {{$root.wallet.settings.unitName}} {{unitTotal}} {{$root.wallet.settings.unitName}}
</div> </div>
<div class="size-18 m5t text-gray"> <div class="size-18 m5t text-gray">
{{ alternative }} {{ alternativeIsoCode }} {{ alternative }} {{ alternativeIsoCode }}

12
views/modals/qr-address.html
View file

@ -4,14 +4,18 @@
<div class="modal-mobile text-center" ng-init="addr = address.address"> <div class="modal-mobile text-center" ng-init="addr = address.address">
<qrcode size="220" data="{{addr}}"></qrcode> <qrcode size="220" data="{{addr}}"></qrcode>
<div class="m10t" <div class="m20t"
ng-init="label = $root.wallet.addressBook[addr].label"> ng-init="label = $root.wallet.addressBook[addr].label">
<div class="size-12"> <div class="size-12">
{{addr}} <small class="label" ng-show="address.isChange">change</small> {{addr}}
</div> </div>
<b class="db m5t" ng-show="label"> <div class="m5t size-10 text-secondary" ng-show="address.isChange" translate>change</div>
<div class="m10t" ng-show="label">
({{label}}) ({{label}})
</b> </div>
<div class="m5t" ng-show="address.balance && address.balance > 0">
<b>{{address.balance}} {{$root.wallet.settings.unitName}}</b>
</div>
</div> </div>
<div class="text-center m10t" ng-if="isCordova"> <div class="text-center m10t" ng-if="isCordova">
<button class="primary expand" ng-click="copyAddress(addr)"> <button class="primary expand" ng-click="copyAddress(addr)">

88
views/modals/tx-details.html
View file

@ -16,7 +16,7 @@
</span> </span>
</span> </span>
</div> </div>
<div class="size-48" ng-class="{ <div class="size-42" ng-class="{
'text-primary' : btx.action == 'received', 'text-primary' : btx.action == 'received',
'text-warning': btx.action == 'sent', 'text-warning': btx.action == 'sent',
'text-gray': btx.action == 'moved'}"> 'text-gray': btx.action == 'moved'}">
@ -29,53 +29,53 @@
<a class="close-reveal-modal show-for-large-up" ng-click="cancel()"><i class="fi-x size-18"></i></a> <a class="close-reveal-modal show-for-large-up" ng-click="cancel()"><i class="fi-x size-18"></i></a>
</div> </div>
<div ng-if="btx.ts || btx.createdTs " class="m20v line-b"> <table>
<i>Date:</i> <tr ng-if="btx.ts || btx.createdTs">
<time >{{ (btx.ts || btx.createdTs ) | amCalendar}}</time> <td width="30"><i translate>Date:</i></td>
</div> <td><time>{{ (btx.ts || btx.createdTs ) | amCalendar}}</time></td>
</tr>
<div ng-show="btx.comment" class="line-b m20v lh140"> <tr ng-if="btx.comment">
<i>Note:</i> <td width="30"><i translate>Note:</i></td>
<span>{{btx.comment}}</span> <td class="">{{btx.comment}}</td>
</div> </tr>
<div ng-if="btx.merchant" class="lh140 m10v line-b"> <tr ng-if="btx.merchant">
<i>Merchant Message:</i> <td width="30"><i translate>Merchant Message:</i></td>
<p class="text-gray size-14">{{btx.merchant.pr.pd.memo}}</p> <td class="text-gray">{{btx.merchant.pr.pd.memo}}</td>
</div> </tr>
<div class="m10v line-b"> <tr ng-if="btx.ts">
<span class="label alert" ng-show="!btx.ts && (!btx.confirmations || btx.confirmations == 0)"> <td width="30"><i translate>Confirmations: </i></td>
<span translate>Unconfirmed</span> <td><span class="text-warning" ng-show="!btx.confirmations || btx.confirmations == 0" translate>
</span> Unconfirmed
<span ng-show="btx.confirmations>0" class="m10v">
<i translate>Confirmations: </i>
<p class="label radius">{{btx.confirmations}}</p>
</span>
</div>
<div ng-if="btx.actionList[0]" class="m10v">
<i>Signatures:</i>
<ul class="tx-copayers m10t" ng-if="btx.actionList[0]">
<li ng-repeat="c in btx.actionList" ng-class="{'bottom-line-copayers':!$last}" ng-if="c.actions.rejected || c.actions.sign || c.actions.create">
<span>
<i ng-if="c.actions.rejected" class="fi-x icon-sign x"></i>
<i ng-if="c.actions.sign" class="fi-check icon-sign check"></i>
</span> </span>
<span> <span class="text-secondary" ng-show="btx.confirmations>0">
<i ng-if="c.actions.create" class="fi-crown icon-status icon-active m10r"></i> {{btx.confirmations}}
</span> </span>
<span>{{c.cId === $root.wallet.getMyCopayerId() ? 'Me' : $root.wallet.publicKeyRing.nicknameForCopayer(c.cId)}}</span> </td>
</li> </tr>
</ul>
</div> <tr ng-if="btx.actionList[0]">
<td width="30"><i translate>Signatures:</i></td>
<small class="ellipsis text-gray m10v" ng-if="btx.txid" > ID: {{btx.txid}} </small> <td>
<ul class="no-bullet size-10 m0" ng-if="btx.actionList[0]">
<div class="oh"> <li ng-repeat="c in btx.actionList" ng-class="{'m5b':!$last}" ng-if="c.actions.rejected || c.actions.sign || c.actions.create">
<a class="button outline light-gray tiny right" ng-click="$root.openExternalLink('http://' + getShortNetworkName() + '.insight.is/tx/' + btx.txid)" ng-if="btx.txid"> <span>
See it on the blockchain <i class="icon-arrow-right2 vm"></i> <i ng-if="c.actions.rejected" class="fi-x icon-sign x"></i>
</a> <i ng-if="c.actions.sign" class="fi-check icon-sign check"></i>
</div> </span>
<span>{{c.cId === $root.wallet.getMyCopayerId() ? 'Me' : $root.wallet.publicKeyRing.nicknameForCopayer(c.cId)}}</span>
</li>
</ul>
</td>
</tr>
</table>
<small class="ellipsis text-gray m20b text-right" ng-if="btx.txid" > ID: {{btx.txid}} </small>
<a class="button outline light-gray tiny right" ng-click="$root.openExternalLink('http://' + getShortNetworkName() + '.insight.is/tx/' + btx.txid)" ng-if="btx.txid">
See it on the blockchain <i class="icon-arrow-right2 vm"></i>
</a>
</div> </div>

6
views/modals/txp-details.html
View file

@ -90,16 +90,14 @@
<div class="large-5 medium-5 small-5 columns"> <div class="large-5 medium-5 small-5 columns">
<button class="button warning m0 expand" ng-click="hideTxInfo = true; hideSign = true; reject(tx.ntxid);" <button class="button warning m0 expand" ng-click="hideTxInfo = true; hideSign = true; reject(tx.ntxid);"
ng-disabled="loading" ng-show="!hideReject"> ng-disabled="loading" ng-show="!hideReject">
<i class="fi-x icon-sign x" ng-show="!loading"></i> <i class="fi-x icon-sign x"></i>
<i class="fi-bitcoin-circle icon-rotate spinner" ng-show="loading"></i>
<span translate>Reject</span> <span translate>Reject</span>
</button> </button>
</div> </div>
<div class="large-5 medium-5 small-5 columns text-right"> <div class="large-5 medium-5 small-5 columns text-right">
<button class="button primary m0 expand" ng-click="hideTxInfo = true; hideReject = true; sign(tx.ntxid)" <button class="button primary m0 expand" ng-click="hideTxInfo = true; hideReject = true; sign(tx.ntxid)"
ng-disabled="loading" ng-show="!hideSign"> ng-disabled="loading" ng-show="!hideSign">
<i class="fi-check icon-sign check" ng-show="!loading"></i> <i class="fi-check icon-sign check"></i>
<i class="fi-bitcoin-circle icon-rotate spinner" ng-show="loading"></i>
<span translate>Sign</span> <span translate>Sign</span>
</button> </button>
</div> </div>

19
views/receive.html
View file

@ -33,19 +33,16 @@
<div ng-repeat="addr in addresses" ng-click="openAddressModal(addr)" class="pointer"> <div ng-repeat="addr in addresses" ng-click="openAddressModal(addr)" class="pointer">
<div class="panel"> <div class="panel">
<div class="row"> <div class="row">
<div class="large-7 medium-7 small-9 columns"> <div class="large-3 medium-4 small-5 columns">
<contact class="ellipsis" address="{{::addr.address}}"> <contact class="size-12 ellipsis" address="{{::addr.address}}"></contact>
</div> </div>
<div class="large-1 medium-2 small-3 columns text-right"> <div class="large-1 medium-1 small-2 columns">
<small translate class="label" ng-show="::addr.isChange">change</small> <span translate class="text-secondary size-10" ng-show="::addr.isChange">change</span>
</div> </div>
<div class="large-4 medium-3 small-12 columns text-right"> <div class="large-8 medium-7 small-5 columns text-right">
<span ng-show="$root.updatingBalance"> <span class="size-12" ng-show="!$root.updatingBalance">
<i class="fi-bitcoin-circle icon-rotate spinner"></i> <b>{{addr.balance || '0'}} {{$root.wallet.settings.unitName}}</b>
</span> </span>
<span class="size-14" ng-show="!$root.updatingBalance">
<b>{{addr.balance || '0'}} {{$root.wallet.settings.unitName}}</b>
</span>
</div> </div>
</div> </div>
<!-- end of panel mobile --> <!-- end of panel mobile -->

96
views/send.html
View file

@ -1,40 +1,42 @@
<div class="send" ng-controller="SendController" ng-init="init()"> <div class="send" ng-controller="SendController" ng-init="init()">
<div class="columns" ng-show="$root.wallet.balanceInfo.lockedBalance"> <div class="row" ng-show="$root.wallet.balanceInfo.lockedBalance">
<div class="panel">
<div class="left">
<i class="fi-info size-42 m10r"></i>
</div>
<div>
<p class="m0 size-14 text-bold">Available Balance: {{$root.wallet.balanceInfo.availableBalance}} {{$root.wallet.settings.unitName}}</p>
<span class="size-12 text-gray">{{$root.wallet.balanceInfo.lockedBalance}} {{$root.wallet.settings.unitName}} in pending transactions</span>
</div>
</div>
</div>
<div class="row show-for-large-up">
<div class="large-8 large-centered columns">
<h1>{{$root.title}}</h1>
</div>
</div>
<div class="row" ng-show="fetchingURL">
<div class="large-12 columns"> <div class="large-12 columns">
<div class="panel"> <div class="panel">
<div class="box-notification"> <div class="left">
<div class="box-icon secondary"> <i class="fi-info size-42 m10r"></i>
<i class="fi-bitcoin-circle icon-rotate spinner size-24"></i> </div>
</div> <div>
<span class="text-secondary size-14"> <p class="m0 size-14 text-bold">Available Balance: {{$root.wallet.balanceInfo.availableBalance}} {{$root.wallet.settings.unitName}}</p>
Fetching Payment Information... <span class="size-12 text-gray">{{$root.wallet.balanceInfo.lockedBalance}} {{$root.wallet.settings.unitName}} in pending transactions</span>
</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="row">
<div class="row" ng-show="!fetchingURL">
<div class="large-8 large-centered columns"> <div class="large-8 large-centered columns">
<form name="sendForm" ng-submit="submitForm(sendForm)" ng-disabled="loading" novalidate> <div class="row show-for-large-up">
<div class="large-7 columns">
<h1>{{$root.title}}</h1>
</div>
<div class="large-5 columns show-for-large-up text-right"
ng-show="(!lockAddress && !_merchantData && !fetchingURL)">
<div ng-hide="showScanner || disableScanner">
<a class="button radius black tiny m0" ng-click="openScanner()"><i class="fi-camera size-18 vm m5r"></i> Scan QR </a>
</div>
<div ng-show="showScanner">
<a translate class="button radius tiny warning m0" ng-click="cancelScanner()"><i class="fi-x size-18"></i> </a>
</div>
</div>
</div>
<div class="box-notification" ng-show="fetchingURL">
<div class="box-icon secondary">
<i class="fi-bitcoin-circle size-24"></i>
</div>
<span class="text-secondary size-14">
Fetching Payment Information...
</span>
</div>
<form ng-show="!fetchingURL" name="sendForm" ng-submit="submitForm(sendForm)" ng-disabled="loading" novalidate>
<div class="panel"> <div class="panel">
<div class="box-notification" ng-show="error && !hideForWP "> <div class="box-notification" ng-show="error && !hideForWP ">
<div class="box-icon error"> <div class="box-icon error">
@ -63,15 +65,15 @@
</label> </label>
<span ng-hide="sendForm.address.$pristine"> <span ng-hide="sendForm.address.$pristine">
<span translate class="has-error right size-12" ng-show="sendForm.address.$invalid && _address"> <span translate class="has-error right size-12" ng-show="sendForm.address.$invalid && _address">
<span class="icon-input"> <span class="icon-input">
<i class="fi-x"></i> <i class="fi-x"></i>
</span> </span>
Not valid Not valid
</span> </span>
<small class="icon-input right" ng-show="!sendForm.address.$invalid"> <small class="icon-input right" ng-show="!sendForm.address.$invalid">
<i class="fi-check"></i> <i class="fi-check"></i>
</small> </small>
</span> </span>
</div> </div>
@ -101,10 +103,10 @@
<div class="m5b right" ng-hide="sendForm.amount.$pristine"> <div class="m5b right" ng-hide="sendForm.amount.$pristine">
<span translate class="has-error right size-12" ng-show="sendForm.amount.$invalid"> <span translate class="has-error right size-12" ng-show="sendForm.amount.$invalid">
<span class="icon-input"><i class="fi-x"></i></span> <span class="icon-input"><i class="fi-x"></i></span>
Not valid Not valid
</span> </span>
<small class="icon-input right" ng-show="!sendForm.amount.$invalid"> <small class="icon-input right" ng-show="!sendForm.amount.$invalid">
<i class="fi-check"></i> <i class="fi-check"></i>
</small> </small>
</div> </div>
<div ng-show="!showAlternative"> <div ng-show="!showAlternative">
@ -141,21 +143,13 @@
</div> </div>
<div class="row"> <div class="row">
<div class="large-6 medium-6 small-12 columns text-right"> <div class="large-6 medium-6 small-12 columns">
<button type="submit" class="button primary expand" ng-disabled="sendForm.$invalid || loading"> <button type="submit" class="button primary expand" ng-disabled="sendForm.$invalid || loading">
Send Send
</button> </button>
</div> </div>
<div class="large-4 medium-4 small-12 columns text-left"> <div class="large-4 medium-4 small-12 columns text-right">
<div class="show-for-large-up text-right" ng-show="!lockAddress && !_merchantData"> <a ng-click="resetForm()" class="button expand warning"
<div ng-hide="showScanner || disableScanner">
<a class="button radius black size-12" ng-click="openScanner()"><i class="fi-camera size-18 vm m5r"></i> Scan QR </a>
</div>
<div ng-show="showScanner">
<a translate class="button radius tiny warning" ng-click="cancelScanner()"><i class="fi-x size-18"></i> </a>
</div>
</div>
<a ng-click="resetForm()" class="button expand warning m0"
ng-show="(_merchantData || lockAddress) && !loading">Cancel</a> ng-show="(_merchantData || lockAddress) && !loading">Cancel</a>
</div> </div>
</div> </div>

12
views/settings.html
View file

@ -39,23 +39,23 @@
<input type="text" ng-model="insightTestnet" class="form-control" name="insightTestnet" valid-url required> <input type="text" ng-model="insightTestnet" class="form-control" name="insightTestnet" valid-url required>
</div> </div>
<div translate class="small text-gray"> <small translate class="text-gray">
Insight API server is open-source software. You can run your own instances, check Insight API server is open-source software. You can run your own instances, check
<a href <a href
ng-click="$root.openExternalLink('https://insight.is')">Insight API Homepage</a> ng-click="$root.openExternalLink('https://insight.is')">Insight API Homepage</a>
</div> </small>
</fieldset> </fieldset>
<fieldset> <fieldset>
<legend translate>Storage</legend> <legend translate>Storage</legend>
<label for="insightTestnet">Read and Store Profiles:</label> <label for="insightTestnet">Read and Store Profiles:</label>
<select class="form-control" ng-model="selectedStorage" ng-options="o.name for o in availableStorages" required> <select class="form-control" ng-model="selectedStorage" ng-options="o.name for o in availableStorages" required>
</select> </select>
<div translate class="small text-gray"> <small translate class="text-gray">
Wallets and profiles are stored encrypted using your password as a key. You can store the encrypted data locally, on this device, or remotely on the cloud (Insight Server). Wallets and profiles are stored encrypted using your password as a key. You can store the encrypted data locally, on this device, or remotely on the cloud (Insight Server).
<a href <a href
ng-click="$root.openExternalLink('https://github.com/bitpay/copay/tree/master/js/plugins')"> ng-click="$root.openExternalLink('https://github.com/bitpay/copay/tree/master/js/plugins')">
More pluggins are welcomed!</a> More pluggins are welcomed!</a>
</div> </small>
</fieldset> </fieldset>
<fieldset> <fieldset>
<legend translate>Language</legend> <legend translate>Language</legend>
@ -66,9 +66,9 @@
<legend translate>Log level</legend> <legend translate>Log level</legend>
<select class="form-control" ng-model="selectedLogLevel" ng-options="o.name for o in availableLogLevels" required> <select class="form-control" ng-model="selectedLogLevel" ng-options="o.name for o in availableLogLevels" required>
</select> </select>
<div translate class="small text-gray"> <small translate class="text-gray">
Log level shows information on the console. This is useful to find bugs and to help users. 'debug' is the most verbose level while 'fatal' only shows unexpected errors Log level shows information on the console. This is useful to find bugs and to help users. 'debug' is the most verbose level while 'fatal' only shows unexpected errors
</div> </small>
</fieldset> </fieldset>
<button translate type="submit" class="button primary radius expand m0" ng-disabled="settingsForm.$invalid || loading" ng-click="save()"> <button translate type="submit" class="button primary radius expand m0" ng-disabled="settingsForm.$invalid || loading" ng-click="save()">
Save Save