Merge pull request #96 from cmgustavo/ref/design-25
Address book as a view (not modal)
This commit is contained in:
commit
c90e58a958
14 changed files with 336 additions and 243 deletions
63
public/views/addressbook.add.html
Normal file
63
public/views/addressbook.add.html
Normal 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>
|
||||
52
public/views/addressbook.html
Normal file
52
public/views/addressbook.html
Normal 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>
|
||||
36
public/views/addressbook.view.html
Normal file
36
public/views/addressbook.view.html
Normal 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>
|
||||
|
|
@ -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>
|
||||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue