Merge pull request #96 from cmgustavo/ref/design-25

Address book as a view (not modal)
This commit is contained in:
Gustavo Maximiliano Cortez 2016-09-13 09:50:51 -03:00 committed by GitHub
commit c90e58a958
14 changed files with 336 additions and 243 deletions

View File

@ -0,0 +1,63 @@
<ion-view>
<ion-nav-bar class="bar-royal">
<ion-nav-buttons side="primary">
<button class="button button-clear" ui-sref="tabs.addressbook">
<i class="icon ion-ios-arrow-thin-left"></i>
</button>
</ion-nav-buttons>
<ion-nav-title>
<span translate>Add entry</span>
</ion-nav-title>
</ion-nav-bar>
<ion-content>
<form name="addressbookForm" no-validate>
<div class="card list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Name</span>
<input type="text"
id="name"
name="name"
ng-model="addressbookEntry.name"
required>
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Email</span>
<input type="text"
id="email"
name="email"
ng-model="addressbookEntry.email">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Address</span>
<div class="input-notification">
<i class="icon ion-checkmark-circled balanced"
ng-show="!addressbookForm.address.$invalid"></i>
<i class="icon ion-close-circled assertive"
ng-show="addressbookForm.address.$invalid && addressbookEntry.address"></i>
</div>
<div class="qr-scan-icon">
<qr-scanner on-scan="onQrCodeScanned(data, addressbookForm)"></qr-scanner>
<input type="text"
id="address"
name="address"
ng-model="addressbookEntry.address"
valid-address required>
</div>
</label>
</div>
<div class="padding">
<button type="submit"
class="button button-block button-positive"
ng-click="add(addressbookEntry)"
ng-disabled="!addressbookForm.$valid" translate>
Save
</button>
</div>
</form>
</ion-content>
</ion-view>

View File

@ -0,0 +1,52 @@
<ion-view>
<ion-nav-bar class="bar-royal">
<ion-nav-buttons side="primary">
<button class="button button-clear" ui-sref="tabs.settings">
<i class="icon ion-ios-arrow-thin-left"></i>
</button>
</ion-nav-buttons>
<ion-nav-title>
<span translate>Addressbook</span>
</ion-nav-title>
<ion-nav-buttons side="secondary">
<button class="button button-clear" ui-sref="tabs.addressbook.add">
<i class="icon ion-ios-plus-empty"></i>
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-content ng-init="initAddressbook()">
<div class="bar bar-header item-input-inset" ng-show="!isEmptyList">
<label class="item-input-wrapper">
<i class="icon ion-ios-search placeholder-icon"></i>
<input type="search"
placeholder="Search"
ng-model="addrSearch"
ng-change="findAddressbook(addrSearch)" ng-model-onblur>
</label>
</div>
<ion-list>
<ion-item ng-repeat="addrEntry in addressbook"
class="item-icon-left item-icon-right"
ui-sref="tabs.addressbook.view({address:addrEntry.address})">
<i class="icon ion-ios-person-outline"></i>
{{addrEntry.name}}
<i class="icon nav-item-arrow-right"></i>
<ion-option-button class="button-assertive" ng-click="remove(addrEntry.address)">
<i class="icon ion-minus-circled"></i>
</ion-option-button>
</ion-item>
</ion-list>
<div class="list" ng-show="isEmptyList">
<a class="item item-icon-left" ui-sref="tabs.addressbook.add">
<i class="icon ion-person-add"></i>
<span translate>Add a new entry</span>
</a>
</div>
</ion-content>
</ion-view>

View File

@ -0,0 +1,36 @@
<ion-view>
<ion-nav-bar class="bar-royal">
<ion-nav-buttons side="primary">
<button class="button button-clear" ui-sref="tabs.addressbook">
<i class="icon ion-ios-arrow-thin-left"></i>
</button>
</ion-nav-buttons>
<ion-nav-title>
<span translate>Addressbook</span>
</ion-nav-title>
</ion-nav-bar>
<ion-content>
<div class="card">
<div class="item item-text-wrap">
<h3 translate>Name</h3>
<strong>{{addressbookEntry.name}}</strong>
</div>
<div class="item item-text-wrap">
<h3 translate>Email</h3>
<strong>{{addressbookEntry.email}}</strong>
</div>
<div class="item item-text-wrap">
<h3 translate>Address</h3>
<strong>{{addressbookEntry.address}}</strong>
</div>
</div>
<button class="button button-block button-positive"
ng-click="sendTo()" translate>
Send Money
</button>
</ion-content>
</ion-view>

View File

@ -1,96 +0,0 @@
<ion-modal-view ng-controller="addressbookModalController" ng-init="initAddressbook()">
<ion-header-bar align-title="center" class="bar-royal">
<button class="button button-clear" ng-click="closeAddressbookModal()">
Close
</button>
<div class="h1 title">
<span ng-show="!addAddressbookEntry" translate>Addressbook</span>
<span ng-show="addAddressbookEntry" translate>Add entry</span>
</div>
<button class="button button-clear"
ng-click="toggleAddAddressbookEntry()">
<i ng-show="!addAddressbookEntry" class="icon ion-ios-plus-empty"></i>
<span ng-show="addAddressbookEntry" translate>Cancel</span>
</button>
</ion-header-bar>
<ion-content>
<div class="bar bar-header item-input-inset" ng-show="!addAddressbookEntry && !isEmptyList">
<label class="item-input-wrapper">
<i class="icon ion-ios-search placeholder-icon"></i>
<input type="search"
placeholder="Search"
ng-model="addrSearch"
ng-change="findAddressbook(addrSearch)" ng-model-onblur>
</label>
</div>
<div ng-show="!addAddressbookEntry">
<ion-list>
<ion-item ng-repeat="addrEntry in addressbook"
class="item-icon-left"
ng-show="!addrEntry.isWallet"
ng-click="sendTo(addrEntry)">
<i class="icon ion-ios-person-outline"></i>
<h2>{{addrEntry.label}}</h2>
<p>{{addrEntry.address}}</p>
<ion-option-button class="button-assertive" ng-click="remove(addrEntry.address)">
<i class="icon ion-minus-circled"></i>
</ion-option-button>
</ion-item>
<ion-list>
<div class="list" ng-show="isEmptyList">
<a class="item item-icon-left" ng-click="toggleAddAddressbookEntry()">
<i class="icon ion-person-add"></i>
<span translate>Add a new entry</span>
</a>
</div>
</div>
<form name="addressbookForm" ng-show="addAddressbookEntry" no-validate>
<div class="list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Address</span>
<div class="input-notification">
<i class="icon ion-checkmark-circled balanced"
ng-show="!addressbookForm.address.$invalid"></i>
<i class="icon ion-close-circled assertive"
ng-show="addressbookForm.address.$invalid && addressbookEntry.address"></i>
</div>
<div class="qr-scan-icon">
<qr-scanner on-scan="onQrCodeScanned(data, addressbookForm)"></qr-scanner>
<input type="text"
id="address"
name="address"
ng-model="addressbookEntry.address"
valid-address required>
</div>
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Label</span>
<input type="text"
id="label"
name="label"
ng-model="addressbookEntry.label"
required>
</label>
</div>
<div class="padding">
<button type="submit"
class="button button-block button-positive"
ng-click="add(addressbookEntry)"
ng-disabled="!addressbookForm.$valid" translate>
Save
</button>
</div>
</form>
</ion-content>
</ion-modal-view>

View File

@ -17,15 +17,15 @@
</div>
<div class="card" ng-if="list[0]">
<div class="item item-heading item-icon-right">
<div class="item item-heading item-icon-right" ui-sref="tabs.addressbook">
<span translate>Contacts & Wallets</span>
<i class="icon ion-person-add" ng-click="openAddressbookModal()"></i>
<i class="icon nav-item-arrow-right"></i>
</div>
<div class="item text-center" ng-show="!list[0]" translate>No Wallet - Contact</div>
<a class="item item-icon-left" ng-repeat="item in list" ng-click="goToAmount(item)">
<i ng-show="item.isWallet" class="icon ion-briefcase size-21" ng-style="{'color':item.color}"></i>
<i ng-show="!item.isWallet" class="icon ion-ios-person-outline"></i>
{{item.label}}
{{item.name}}
</a>
</div>
</ion-content>

View File

@ -6,9 +6,10 @@
<ion-content ng-controller="tabSettingsController" ng-init="init()">
<div class="list">
<div class="item item-divider"></div>
<a class="item item-icon-left" ng-click="openAddressbookModal()">
<a class="item item-icon-left item-icon-right" ui-sref="tabs.addressbook">
<i class="icon ion-ios-book-outline"></i>
<span translate>Address Book</span>
<i class="icon nav-item-arrow-right"></i>
</a>
<div class="item item-divider" translate>Preferences</div>

View File

@ -0,0 +1,56 @@
'use strict';
angular.module('copayApp.controllers').controller('addressbookListController', function($scope, $log, $timeout, addressbookService, lodash, popupService) {
var contacts;
$scope.initAddressbook = function() {
addressbookService.list(function(err, ab) {
if (err) $log.error(err);
$scope.isEmptyList = lodash.isEmpty(ab);
contacts = [];
lodash.each(ab, function(v, k) {
contacts.push({
name: lodash.isObject(v) ? v.name : v,
address: k,
email: lodash.isObject(v) ? v.email : null
});
});
$scope.addressbook = lodash.clone(contacts);
});
};
$scope.findAddressbook = function(search) {
if (!search || search.length < 2) {
$scope.addressbook = contacts;
$timeout(function() {
$scope.$apply();
}, 10);
return;
}
var result = lodash.filter(contacts, function(item) {
var val = item.name;
return lodash.includes(val.toLowerCase(), search.toLowerCase());
});
$scope.addressbook = result;
};
$scope.remove = function(addr) {
$timeout(function() {
addressbookService.remove(addr, function(err, ab) {
if (err) {
popupService.showAlert(err);
return;
}
$scope.initAddressbook();
$scope.$digest();
});
}, 100);
};
});

View File

@ -0,0 +1,36 @@
'use strict';
angular.module('copayApp.controllers').controller('addressbookAddController', function($scope, $state, $timeout, addressbookService, popupService) {
$scope.addressbookEntry = {
'address': '',
'name': '',
'email': ''
};
$scope.onQrCodeScanned = function(data, addressbookForm) {
$timeout(function() {
var form = addressbookForm;
if (data && form) {
data = data.replace('bitcoin:', '');
form.address.$setViewValue(data);
form.address.$isValid = true;
form.address.$render();
}
$scope.$digest();
}, 100);
};
$scope.add = function(addressbook) {
$timeout(function() {
addressbookService.add(addressbook, function(err, ab) {
if (err) {
popupService.showAlert(err);
return;
}
$state.go('tabs.addressbook');
});
}, 100);
};
});

View File

@ -0,0 +1,37 @@
'use strict';
angular.module('copayApp.controllers').controller('addressbookViewController', function($scope, $state, $timeout, $stateParams, lodash, addressbookService, popupService) {
var address = $stateParams.address;
if (!address) {
$state.go('tabs.addressbook');
return;
}
addressbookService.get(address, function(err, obj) {
if (err) {
popupService.showAlert(err);
return;
}
if (!lodash.isObject(obj)) {
var name = obj;
obj = {
'name': name,
'address': address,
'email': ''
};
}
$scope.addressbookEntry = obj;
});
$scope.sendTo = function() {
$timeout(function() {
$state.transitionTo('send.amount', {
toAddress: $scope.addressbookEntry.address,
toName: $scope.addressbookEntry.name
});
}, 100);
};
});

View File

@ -1,111 +0,0 @@
'use strict';
angular.module('copayApp.controllers').controller('addressbookModalController', function($scope, $log, $state, $timeout, $ionicPopup, addressbookService, lodash, popupService) {
var contacts;
$scope.initAddressbook = function() {
addressbookService.list(function(err, ab) {
if (err) $log.error(err);
$scope.isEmptyList = lodash.isEmpty(ab);
contacts = [];
lodash.each(ab, function(v, k) {
contacts.push({
label: v,
address: k
});
});
$scope.addressbook = lodash.clone(contacts);
});
};
$scope.findAddressbook = function(search) {
if (!search || search.length < 2) {
$scope.addressbook = contacts;
$timeout(function() {
$scope.$apply();
}, 10);
return;
}
var result = lodash.filter(contacts, function(item) {
var val = item.label;
return lodash.includes(val.toLowerCase(), search.toLowerCase());
});
$scope.addressbook = result;
};
$scope.sendTo = function(item) {
$scope.closeAddressbookModal();
$timeout(function() {
$state.transitionTo('send.amount', { toAddress: item.address, toName: item.label})
}, 100);
};
$scope.closeAddressbookModal = function() {
$scope.cleanAddressbookEntry();
$scope.addAddressbookEntry = false;
$scope.addressbookModal.hide();
};
$scope.onQrCodeScanned = function(data, addressbookForm) {
$timeout(function() {
var form = addressbookForm;
if (data && form) {
data = data.replace('bitcoin:', '');
form.address.$setViewValue(data);
form.address.$isValid = true;
form.address.$render();
}
$scope.$digest();
}, 100);
};
$scope.cleanAddressbookEntry = function() {
$scope.addressbookEntry = {
'address': '',
'label': ''
};
};
$scope.toggleAddAddressbookEntry = function() {
$scope.cleanAddressbookEntry();
$scope.addAddressbookEntry = !$scope.addAddressbookEntry;
};
$scope.add = function(addressbook) {
$timeout(function() {
addressbookService.add(addressbook, function(err, ab) {
if (err) {
popupService.showAlert(err);
return;
}
$scope.initAddressbook();
$scope.toggleAddAddressbookEntry();
$scope.$digest();
});
}, 100);
};
$scope.remove = function(addr) {
$timeout(function() {
addressbookService.remove(addr, function(err, ab) {
if (err) {
popupService.showAlert(err);
return;
}
$scope.initAddressbook();
$scope.$digest();
});
}, 100);
};
$scope.$on('$destroy', function() {
$scope.addressbookModal.remove();
});
});

View File

@ -1,6 +1,6 @@
'use strict';
angular.module('copayApp.controllers').controller('tabSendController', function($scope, $ionicModal, $log, $timeout, addressbookService, profileService, lodash, $state, walletService, incomingData) {
angular.module('copayApp.controllers').controller('tabSendController', function($scope, $log, $timeout, addressbookService, profileService, lodash, $state, walletService, incomingData ) {
var originalList;
@ -14,7 +14,7 @@ angular.module('copayApp.controllers').controller('tabSendController', function(
lodash.each(wallets, function(v) {
originalList.push({
color: v.color,
label: v.name,
name: v.name,
isWallet: true,
getAddress: function(cb) {
walletService.getAddress(v, false, cb);
@ -28,7 +28,7 @@ angular.module('copayApp.controllers').controller('tabSendController', function(
var contacts = [];
lodash.each(ab, function(v, k) {
contacts.push({
label: v,
name: lodash.isObject(v) ? v.name : v,
address: k,
getAddress: function(cb) {
return cb(null, k);
@ -60,7 +60,7 @@ angular.module('copayApp.controllers').controller('tabSendController', function(
}
var result = lodash.filter(originalList, function(item) {
var val = item.label || item.alias || item.name;
var val = item.name;
return lodash.includes(val.toLowerCase(), search.toLowerCase());
});
@ -73,23 +73,14 @@ angular.module('copayApp.controllers').controller('tabSendController', function(
$log.error(err);
return;
}
$log.debug('Got toAddress:' + addr + ' | ' + item.label);
$log.debug('Got toAddress:' + addr + ' | ' + item.name);
return $state.transitionTo('send.amount', {
toAddress: addr,
toName: item.label
toName: item.name
})
});
};
$scope.openAddressbookModal = function() {
$ionicModal.fromTemplateUrl('views/modals/addressbook.html', {
scope: $scope
}).then(function(modal) {
$scope.addressbookModal = modal;
$scope.addressbookModal.show();
});
};
$scope.$on('modal.hidden', function() {
$scope.init();
});

View File

@ -1,6 +1,6 @@
'use strict';
angular.module('copayApp.controllers').controller('tabSettingsController', function($scope, $rootScope, $log, $ionicModal, $window, lodash, configService, uxLanguage, platformInfo, pushNotificationsService, profileService, feeService) {
angular.module('copayApp.controllers').controller('tabSettingsController', function($scope, $rootScope, $log, $window, lodash, configService, uxLanguage, platformInfo, pushNotificationsService, profileService, feeService) {
$scope.init = function() {
@ -38,17 +38,6 @@ angular.module('copayApp.controllers').controller('tabSettingsController', funct
$scope.wallets = profileService.getWallets();
};
$scope.openAddressbookModal = function() {
$ionicModal.fromTemplateUrl('views/modals/addressbook.html', {
scope: $scope
}).then(function(modal) {
$scope.addressbookModal = modal;
$scope.addressbookModal.show();
});
};
$scope.openSettings = function() {
cordova.plugins.diagnostic.switchToSettings(function() {
$log.debug('switched to settings');

View File

@ -490,6 +490,41 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
}
})
/*
*
* Addressbook
*
*/
.state('tabs.addressbook', {
url: '/addressbook',
views: {
'tab-settings': {
templateUrl: 'views/addressbook.html',
controller: 'addressbookListController'
}
}
})
.state('tabs.addressbook.add', {
url: '/add',
views: {
'tab-settings@tabs': {
templateUrl: 'views/addressbook.add.html',
controller: 'addressbookAddController'
}
}
})
.state('tabs.addressbook.view', {
url: '/view/:address',
views: {
'tab-settings@tabs': {
templateUrl: 'views/addressbook.view.html',
controller: 'addressbookViewController'
}
}
})
/*
*
*TO DO

View File

@ -3,12 +3,16 @@
angular.module('copayApp.services').factory('addressbookService', function(bitcore, storageService, lodash) {
var root = {};
root.getLabel = function(addr, cb) {
root.get = function(addr, cb) {
storageService.getAddressbook('testnet', function(err, ab) {
if (ab && ab[addr]) return cb(ab[addr]);
if (err) return cb(err);
if (ab) ab = JSON.parse(ab);
if (ab && ab[addr]) return cb(null, ab[addr]);
storageService.getAddressbook('livnet', function(err, ab) {
if (ab && ab[addr]) return cb(ab[addr]);
storageService.getAddressbook('livenet', function(err, ab) {
if (err) return cb(err);
if (ab) ab = JSON.parse(ab);
if (ab && ab[addr]) return cb(null, ab[addr]);
return cb();
});
});
@ -38,7 +42,7 @@ angular.module('copayApp.services').factory('addressbookService', function(bitco
ab = ab || {};
if (lodash.isArray(ab)) ab = {}; // No array
if (ab[entry.address]) return cb('Entry already exist');
ab[entry.address] = entry.label;
ab[entry.address] = entry;
storageService.setAddressbook(network, JSON.stringify(ab), function(err, ab) {
if (err) return cb('Error adding new entry');
root.list(function(err, ab) {