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>