Improve contact module models

- Fixed reset behavior
- Created an abstract state for the card viewer and editor
- Moved the card instance from the $rootScope.addressbook to the $scope
This commit is contained in:
Francis Lachapelle
2014-09-29 11:06:46 -04:00
parent 33179bbfb9
commit caa920e0ff
7 changed files with 227 additions and 219 deletions

View File

@@ -12,21 +12,6 @@
className="UIxPageFrame"
title="name"
var:popup="isPopup">
<!--<style type="text/css">
<var:if condition="horizontalDragHandleStyle">
DIV#dragHandle, DIV#rightPanel
{ left: <var:string value="horizontalDragHandleStyle" />; }
DIV#contactFoldersList
{ width: <var:string value="horizontalDragHandleStyle" />; }
</var:if><var:if condition="verticalDragHandleStyle">
DIV#rightDragHandle, DIV#contactView
{ top: <var:string value="verticalDragHandleStyle" />; }
</var:if><var:if condition="contactsListContentStyle">
DIV#contactsListContent
{ height: <var:string value="contactsListContentStyle" />; }
</var:if><var:if condition="isPopup">
</var:if>
</style>-->
<script type="text/javascript">
var contactFolders = <var:string value="contactFolders" const:escapeHTML="NO"/>;
</script>
@@ -177,22 +162,22 @@
</div>
</div>
<ul>
<li data-ng-repeat="card in addressbook.cards"
data-ng-class="{_selected: addressbook.card.id == card.id}">
<li data-ng-repeat="currentCard in addressbook.cards"
data-ng-class="{_selected: card.id == currentCard.id}">
<!-- <input type="checkbox" class="card-picture left"/> -->
<a data-ui-sref="addressbook.card({addressbookId: addressbook.id, cardId: card.id})">
<span class="card-picture" data-ng-switch="card.tag">
<a data-ui-sref="addressbook.card.view({addressbookId: addressbook.id, cardId: currentCard.id})">
<span class="card-picture" data-ng-switch="currentCard.tag">
<i data-ng-switch-when="vcard" class="icon-ion-ios7-person"><!-- card --></i>
<i data-ng-switch-when="vlist" class="icon-ion-ios7-people"><!-- list --></i>
</span>
<div class="name" data-ng-bind-html="card.$fullname()"><!-- cn --></div>
<div><span data-ng-show="card.emails"><i class="icon-ion-ios7-email-outline"><!-- email --></i> {{card.$preferredEmail()}}</span><var:entity const:name="nbsp" /></div>
<div class="name" data-ng-bind-html="currentCard.$fullname()"><!-- cn --></div>
<div><span data-ng-show="currentCard.emails"><i class="icon-ion-ios7-email-outline"><!-- email --></i> {{currentCard.$preferredEmail()}}</span><var:entity const:name="nbsp" /></div>
</a>
</li>
</ul>
</div>
<div id="contactView" data-ui-view="card"><!-- card state view --></div>>
<div id="contactView" data-ui-view="card"><!-- card state view --></div>
</div>
</script>
@@ -201,35 +186,35 @@
<div class="viewer">
<div class="header">
<h1 data-ng-bind-html="addressbook.card.$fullname()"><!-- fullname --></h1>
<h6>{{addressbook.card.$description()}}
<span class="label radius" data-ng-repeat="category in addressbook.card.categories">{{category.value}}</span>
<h1 data-ng-bind-html="card.$fullname()"><!-- fullname --></h1>
<h6>{{card.$description()}}
<span class="label radius" data-ng-repeat="category in card.categories">{{category.value}}</span>
</h6>
</div>
<div class="buttonsToolbar">
<span data-ng-show="addressbook.isEditable">
<a class="button tiny radius" data-ui-sref="addressbook.editor({addressbookId: addressbook.id, cardId: addressbook.card.id})"><i class="icon-pencil"><!-- edit --></i></a>
<span class="button tiny radius alert" data-ng-click="confirmDelete(addressbook.card)"><i class="icon-trash"><!-- delete --></i></span>
<a class="button tiny radius" data-ui-sref="addressbook.card.editor({addressbookId: addressbook.id, cardId: card.id})"><i class="icon-pencil"><!-- edit --></i></a>
<span class="button tiny radius alert" data-ng-click="confirmDelete(card)"><i class="icon-trash"><!-- delete --></i></span>
</span>
</div>
<div class="attr" data-ng-show="addressbook.card.birthday">
<div class="attr" data-ng-show="card.birthday">
<div class="key">
<label class="right"><var:string label:value="Birthday"/></label>
</div>
<div class="value">
<span>{{addressbook.card.$birthday() | date}}</span>
<span>{{card.$birthday() | date}}</span>
</div>
</div>
<div class="section" data-ng-show="addressbook.card.refs.length > 0">
<div class="section" data-ng-show="card.refs.length > 0">
<!-- list members -->
<div class="attr" data-ng-repeat="ref in addressbook.card.refs">
<div class="attr" data-ng-repeat="ref in card.refs">
<div class="value single">
<a href="mailto:{{ref.email}}">{{ref.fn || ref.email}}</a>
</div>
</div>
</div>
<div class="section" data-ng-show="addressbook.card.emails.length > 0">
<div class="attr" data-ng-repeat="email in addressbook.card.emails">
<div class="section" data-ng-show="card.emails.length > 0">
<div class="attr" data-ng-repeat="email in card.emails">
<div class="key">
<label class="right"><var:entity const:name="nbsp" />{{email.type}}</label>
</div>
@@ -238,8 +223,8 @@
</div>
</div>
</div>
<div class="section" data-ng-show="addressbook.card.phones.length > 0">
<div class="attr" data-ng-repeat="phone in addressbook.card.phones">
<div class="section" data-ng-show="card.phones.length > 0">
<div class="attr" data-ng-repeat="phone in card.phones">
<div class="key">
<label class="right">{{phone.type}}</label>
</div>
@@ -248,8 +233,8 @@
</div>
</div>
</div>
<div class="section" data-ng-show="addressbook.card.urls">
<div class="attr" data-ng-repeat="url in addressbook.card.urls">
<div class="section" data-ng-show="card.urls">
<div class="attr" data-ng-repeat="url in card.urls">
<div class="key">
<label class="right"><var:entity const:name="nbsp" />{{url.type}}</label>
</div>
@@ -258,8 +243,8 @@
</div>
</div>
</div>
<div class="section" data-ng-show="addressbook.card.addresses">
<div class="attr" data-ng-repeat="address in addressbook.card.addresses">
<div class="section" data-ng-show="card.addresses">
<div class="attr" data-ng-repeat="address in card.addresses">
<div class="key">
<label class="right">{{address.type}}</label>
</div>
@@ -268,12 +253,12 @@
</div>
</div>
</div>
<div class="attr" data-ng-show="addressbook.card.note">
<div class="attr" data-ng-show="card.note">
<div class="key">
<label class="right"><var:string label:value="Note"/></label>
</div>
<div class="value">
<div data-ng-bind-html="addressbook.card.note"><!-- note --></div>
<div data-ng-bind-html="card.note"><!-- note --></div>
</div>
</div>
</div>
@@ -283,7 +268,7 @@
<script type="text/ng-template" id="cardEditor.html">
<div class="editor">
<form name="cardForm" data-ng-show="addressbook.card.$isCard()" data-ng-submit="save(cardForm)">
<form name="cardForm" data-ng-show="card.$isCard()" data-ng-submit="save(cardForm)">
<div class="buttonsToolbar">
<span class="button tiny radius secondary" data-ng-click="cancel()"><i class="icon-arrow-left"><!-- cancel --></i> <var:string label:value="Cancel"/></span>
<span class="button tiny radius secondary" data-ng-click="reset()"><i class="icon-undo"><!-- reset --></i> <var:string label:value="Reset"/></span>
@@ -295,7 +280,7 @@
<label class="right inline"><var:string label:value="Display"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.fn"/>
<input type="text" data-ng-model="card.fn"/>
</div>
</div>
<div class="attr">
@@ -304,7 +289,7 @@
<label class="right inline"><var:string label:value="Firstname"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.givenname"/>
<input type="text" data-ng-model="card.givenname"/>
</div>
</div>
<div class="attr">
@@ -313,7 +298,7 @@
<label class="right inline"><var:string label:value="Lastname"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.sn"/>
<input type="text" data-ng-model="card.sn"/>
</div>
</div>
<div class="attr">
@@ -322,7 +307,7 @@
<label class="right inline"><var:string label:value="Nickname"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.nickname"/>
<input type="text" data-ng-model="card.nickname"/>
</div>
</div>
<div class="attr">
@@ -331,7 +316,7 @@
<label class="right inline"><var:string label:value="Organization"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.org"/>
<input type="text" data-ng-model="card.org"/>
</div>
</div>
<div class="attr">
@@ -340,14 +325,14 @@
<label class="right inline"><var:string label:value="Title"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.title"/>
<input type="text" data-ng-model="card.title"/>
</div>
</div>
<!-- org units -->
<div class="section">
<div class="attr" data-ng-repeat="unit in addressbook.card.orgUnits">
<div class="attr" data-ng-repeat="unit in card.orgUnits">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('orgUnits', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('orgUnits', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<label class="right inline"><var:string label:value="Organization Unit"/></label>
@@ -369,20 +354,20 @@
<label class="right inline"><var:string label:value="Birthday"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.birthday"/>
<input type="text" data-ng-model="card.birthday"/>
</div>
</div>
<!-- categories -->
<div class="section">
<div class="attr" data-ng-repeat="category in addressbook.card.categories">
<div class="attr" data-ng-repeat="category in card.categories">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('categories', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('categories', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<label class="right inline"><var:string label:value="Category"/></label>
</div>
<div class="value">
<input type="text" label:placeholder="category" data-ng-model="category.value" data-sg-focus-on="category_{{$index}}" data-typeahead="cat for cat in addressbook.card.allCategories | filter:$viewValue"/>
<input type="text" label:placeholder="category" data-ng-model="category.value" data-sg-focus-on="category_{{$index}}" data-typeahead="cat for cat in card.allCategories | filter:$viewValue"/>
</div>
</div>
<div class="attr">
@@ -393,9 +378,9 @@
</div>
<!-- emails -->
<div class="section">
<div class="attr" data-ng-repeat="email in addressbook.card.emails">
<div class="attr" data-ng-repeat="email in card.emails">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('emails', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('emails', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<select class="text-right" data-ng-model="email.type" data-ng-options="type for type in allEmailTypes">
@@ -414,9 +399,9 @@
</div>
<!-- phones -->
<div class="section">
<div class="attr" data-ng-repeat="phone in addressbook.card.phones">
<div class="attr" data-ng-repeat="phone in card.phones">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('phones', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('phones', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<select class="text-right" data-ng-model="phone.type" data-ng-options="type for type in allTelTypes">
@@ -435,9 +420,9 @@
</div>
<!-- urls -->
<div class="section">
<div class="attr" data-ng-repeat="url in addressbook.card.urls">
<div class="attr" data-ng-repeat="url in card.urls">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('urls', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('urls', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<select class="text-right" data-ng-model="url.type" data-ng-options="type for type in allUrlTypes">
@@ -456,9 +441,9 @@
</div>
<!-- addresses -->
<div class="section">
<div class="attr" data-ng-repeat="address in addressbook.card.addresses">
<div class="attr" data-ng-repeat="address in card.addresses">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('addresses', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('addresses', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<select class="text-right" data-ng-model="address.type" data-ng-options="type for type in allAddressTypes">
@@ -488,11 +473,11 @@
<label class="right inline"><var:string label:value="Note"/></label>
</div>
<div class="value">
<textarea data-ng-model="addressbook.card.note"><!-- note --></textarea>
<textarea data-ng-model="card.note"><!-- note --></textarea>
</div>
</div>
</form>
<form name="listForm" data-ng-show="addressbook.card.$isList()" data-ng-submit="save(listForm)">
<form name="listForm" data-ng-show="card.$isList()" data-ng-submit="save(listForm)">
<div class="buttonsToolbar">
<span class="button tiny radius secondary" data-ng-click="cancel()"><i class="icon-arrow-left"><!-- cancel --></i> <var:string label:value="Cancel"/></span>
<span class="button tiny radius secondary" data-ng-click="reset()"><i class="icon-undo"><!-- reset --></i> <var:string label:value="Reset"/></span>
@@ -505,7 +490,7 @@
<label class="right inline"><var:string label:value="Display"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.fn"/>
<input type="text" data-ng-model="card.fn"/>
</div>
</div>
<div class="attr">
@@ -514,15 +499,15 @@
<label class="right inline"><var:string label:value="Nickname"/></label>
</div>
<div class="value">
<input type="text" data-ng-model="addressbook.card.nickname"/>
<input type="text" data-ng-model="card.nickname"/>
</div>
</div>
</div>
<!-- list members -->
<div class="section">
<div class="attr" data-ng-repeat="ref in addressbook.card.refs">
<div class="attr" data-ng-repeat="ref in card.refs">
<div class="action">
<span class="button alert icon" data-ng-click="addressbook.card.$delete('refs', $index)"><i class="icon-minus"><!-- remove --></i></span>
<span class="button alert icon" data-ng-click="card.$delete('refs', $index)"><i class="icon-minus"><!-- remove --></i></span>
</div>
<div class="key">
<label class="right inline"><var:string label:value="Member"/></label>
@@ -532,7 +517,7 @@
data-ng-model="ref.email"
data-sg-focus-on="ref_{{$index}}"
data-typeahead="card.$preferredEmail($viewValue) as card.$shortFormat($viewValue) for card in addressbook.$filter($viewValue, {dry: true, excludeLists: true})"
data-typeahead-on-select="addressbook.card.$updateMember($index, $model, $item)"/>
data-typeahead-on-select="card.$updateMember($index, $model, $item)"/>
</div>
</div>
<div class="attr">

View File

@@ -101,60 +101,60 @@
<a class="button button-clear button-positive" data-ng-click="edit()"><var:string label:value="Edit"/></a>
</ion-nav-buttons>
<ion-content padding="10" class="has-header">
<h4 data-ng-bind-html="addressbook.card.$fullname()"><!-- fullname --></h4>
<h4 data-ng-bind-html="card.$fullname()"><!-- fullname --></h4>
<p>
{{addressbook.card.$description()}}
<span class="label" data-ng-repeat="category in addressbook.card.categories">{{category.value}}</span>
{{card.$description()}}
<span class="label" data-ng-repeat="category in card.categories">{{category.value}}</span>
</p>
<ion-list class="list-clear" data-ng-show="addressbook.card.birthday">
<ion-list class="list-clear" data-ng-show="card.birthday">
<ion-item class="item-icon-right">
<i class="icon ion-calendar"><!-- icon --></i>
<small><var:string label:value="Birthday"/></small> {{addressbook.card.$birthday() | date}}
<small><var:string label:value="Birthday"/></small> {{card.$birthday() | date}}
</ion-item>
</ion-list>
<ion-list class="list-clear" data-ng-show="addressbook.card.refs.length > 0">
<ion-item ng-repeat="ref in addressbook.card.refs"
<ion-list class="list-clear" data-ng-show="card.refs.length > 0">
<ion-item ng-repeat="ref in card.refs"
href="{{UserFolderURL}}Mail/Compose/{{ref.email}}"
class="item-icon-right">
<i class="icon ion-person"><!-- icon --></i>
{{ref.fn || ref.email}}
</ion-item>
</ion-list>
<ion-list class="list-clear" data-ng-show="addressbook.card.emails">
<ion-item ng-repeat="email in addressbook.card.emails"
<ion-list class="list-clear" data-ng-show="card.emails">
<ion-item ng-repeat="email in card.emails"
href="{{UserFolderURL}}Mail/Compose/{{email.value}}"
class="item-icon-right">
<i class="icon ion-email"><!-- icon --></i>
<small>{{email.type}}</small> {{email.value}}
</ion-item>
</ion-list>
<ion-list class="list-clear" data-ng-show="addressbook.card.phones">
<ion-item ng-repeat="phone in addressbook.card.phones"
<ion-list class="list-clear" data-ng-show="card.phones">
<ion-item ng-repeat="phone in card.phones"
href="tel:{{phone.value}}"
class="item-icon-right">
<i class="icon ion-ios7-telephone-outline"><!-- icon --></i>
<small>{{phone.type}}</small> {{phone.value}}
</ion-item>
</ion-list>
<ion-list class="list-clear" data-ng-show="addressbook.card.urls">
<ion-item ng-repeat="url in addressbook.card.urls"
<ion-list class="list-clear" data-ng-show="card.urls">
<ion-item ng-repeat="url in card.urls"
href="{{url.value}}"
class="item-icon-right">
<i class="icon ion-link"><!-- icon --></i>
<small>{{url.type}}</small> {{url.value}}
</ion-item>
</ion-list>
<ion-list class="list-clear" data-ng-show="addressbook.card.addresses">
<ion-item class="item-icon-right" ng-repeat="address in addressbook.card.addresses">
<ion-list class="list-clear" data-ng-show="card.addresses">
<ion-item class="item-icon-right" ng-repeat="address in card.addresses">
<i class="icon ion-location"><!-- icon --></i>
<small>{{address.type}}</small>
<address data-sg-address="address"><!-- address --></address>
</ion-item>
</ion-list>
<ion-list class="list-clear" data-ng-show="addressbook.card.note">
<ion-list class="list-clear" data-ng-show="card.note">
<ion-item>
<small><var:string label:value="note"/></small>
{{addressbook.card.note}}
{{card.note}}
</ion-item>
</ion-list>
</ion-content>
@@ -163,7 +163,7 @@
<script type="text/ng-template" id="cardEditor.html">
<ion-modal-view>
<form name="cardForm" data-ng-show="addressbook.card.$isCard()">
<form name="cardForm" data-ng-show="card.$isCard()">
<ion-header-bar class="bar-positive">
<button class="button button-clear" ng-click="cancel()"><var:string label:value="Cancel"/></button>
<button class="button button-clear" ng-click="save(cardForm)"><var:string label:value="Save"/></button>
@@ -171,28 +171,28 @@
<ion-content padding="10">
<ion-list class="list-clear">
<ion-item class="item-input">
<input type="text" label:placeholder="Display" ng-model="addressbook.card.fn"/>
<input type="text" label:placeholder="Display" ng-model="card.fn"/>
</ion-item>
<ion-item class="item-input">
<input type="text" label:placeholder="Givenname" ng-model="addressbook.card.givenname"/>
<input type="text" label:placeholder="Givenname" ng-model="card.givenname"/>
</ion-item>
<ion-item class="item-input">
<input type="text" label:placeholder="Lastname" ng-model="addressbook.card.sn"/>
<input type="text" label:placeholder="Lastname" ng-model="card.sn"/>
</ion-item>
<ion-item class="item-input">
<input type="text" label:placeholder="Nickname" ng-model="addressbook.card.nickname"/>
<input type="text" label:placeholder="Nickname" ng-model="card.nickname"/>
</ion-item>
<ion-item class="item-input">
<input type="text" label:placeholder="Organization" ng-model="addressbook.card.org"/>
<input type="text" label:placeholder="Organization" ng-model="card.org"/>
</ion-item>
<ion-item class="item-input">
<input type="text" label:placeholder="Title" ng-model="addressbook.card.title"/>
<input type="text" label:placeholder="Title" ng-model="card.title"/>
</ion-item>
</ion-list>
<ion-list class="list-clear">
<ion-item ng-repeat="unit in addressbook.card.orgUnits"
<ion-item ng-repeat="unit in card.orgUnits"
class="item-input">
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="addressbook.card.$delete('orgUnits', $index)"><!-- remove --></button>
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="card.$delete('orgUnits', $index)"><!-- remove --></button>
<input type="text" label:placeholder="organization unit"
ng-model="unit.value"/>
</ion-item>
@@ -208,9 +208,9 @@
</ion-item>
</ion-list>
<ion-list class="list-clear">
<ion-item ng-repeat="category in addressbook.card.categories"
<ion-item ng-repeat="category in card.categories"
class="item-input">
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="addressbook.card.$delete('categories', $index)"><!-- remove --></button>
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="card.$delete('categories', $index)"><!-- remove --></button>
<input type="text" label:placeholder="category"
ng-model="category.value"/>
</ion-item>
@@ -220,9 +220,9 @@
</ion-item>
</ion-list>
<ion-list class="list-clear">
<ion-item ng-repeat="email in addressbook.card.emails"
<ion-item ng-repeat="email in card.emails"
class="item-input item-select">
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="addressbook.card.$delete('emails', $index)"><!-- remove --></button>
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="card.$delete('emails', $index)"><!-- remove --></button>
<input type="text" label:placeholder="email address"
ng-model="email.value"/>
<select data-ng-model="email.type"
@@ -234,9 +234,9 @@
</ion-item>
</ion-list>
<ion-list class="list-clear">
<ion-item ng-repeat="phone in addressbook.card.phones"
<ion-item ng-repeat="phone in card.phones"
class="item-input item-select">
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="addressbook.card.$delete('phones', $index)"><!-- remove --></button>
<button class="button button-small button-assertive button-icon icon ion-minus-circled" data-ng-click="card.$delete('phones', $index)"><!-- remove --></button>
<input type="text" label:placeholder="phone number"
ng-model="phone.value"/>
<select data-ng-model="phone.type"
@@ -248,10 +248,10 @@
</ion-item>
</ion-list>
<ion-list class="list-clear">
<ion-item ng-repeat="url in addressbook.card.urls"
<ion-item ng-repeat="url in card.urls"
class="item-input item-select">
<button class="button button-small button-assertive button-icon icon ion-minus-circled"
data-ng-click="addressbook.card.$delete('urls', $index)"><!-- remove --></button>
data-ng-click="card.$delete('urls', $index)"><!-- remove --></button>
<input type="text" label:placeholder="URL"
ng-model="url.value"/>
<select data-ng-model="url.type"
@@ -264,10 +264,10 @@
</ion-item>
</ion-list>
<ion-list class="list-clear"
ng-repeat="address in addressbook.card.addresses">
ng-repeat="address in card.addresses">
<ion-item class="item-input">
<button class="button button-small button-assertive button-icon icon ion-minus-circled"
data-ng-click="addressbook.card.$delete('addresses', $index)"><!-- remove --></button>
data-ng-click="card.$delete('addresses', $index)"><!-- remove --></button>
<ion-list class="list-address">
<ion-item class="item-input">
<input type="text" label:placeholder="street" data-ng-model="address.street"/>
@@ -298,12 +298,12 @@
</ion-list>
<ion-list class="list-clear">
<ion-item class="item-input">
<input type="text" label:placeholder="Note" data-ng-model="addressbook.card.note"/>
<input type="text" label:placeholder="Note" data-ng-model="card.note"/>
</ion-item>
</ion-list>
<button class="button button-block button-assertive"
ng-hide="addressbook.card.isNew"
ng-click="confirmDelete(addressbook.card)"><var:string label:value="Delete"/></button>
ng-hide="card.isNew"
ng-click="confirmDelete(card)"><var:string label:value="Delete"/></button>
</ion-content>
</form>
</ion-modal-view>

View File

@@ -18,7 +18,7 @@
* @param {string} content
*/
Dialog.alert = function(title, content) {
var modal = this.$modal.open({
this.$modal.open({
template:
'<h2 data-ng-bind-html="title"></h2>' +
'<p data-ng-bind-html="content"></p>' +

View File

@@ -65,12 +65,12 @@
* @returns the list of addressbooks
*/
AddressBook.$findAll = function(data) {
var self = this;
var _this = this;
if (data) {
this.$addressbooks = data;
// Instanciate AddressBook objects
angular.forEach(this.$addressbooks, function(o, i) {
self.$addressbooks[i] = new AddressBook(o);
_this.$addressbooks[i] = new AddressBook(o);
});
}
return this.$addressbooks;
@@ -105,7 +105,7 @@
* @returns a collection of Cards instances
*/
AddressBook.prototype.$filter = function(search, options) {
var self = this;
var _this = this;
var params = { 'search': 'name_or_address',
'value': search,
'sort': 'c_cn',
@@ -124,8 +124,8 @@
cards = data.cards;
}
else {
self.cards = data.cards;
cards = self.cards;
_this.cards = data.cards;
cards = _this.cards;
}
// Instanciate Card objects
angular.forEach(cards, function(o, i) {
@@ -152,11 +152,11 @@
};
AddressBook.prototype.$delete = function() {
var self = this;
var _this = this;
var d = AddressBook.$q.defer();
AddressBook.$$resource.remove(this.id)
.then(function() {
var i = _.indexOf(_.pluck(AddressBook.$addressbooks, 'id'), self.id);
var i = _.indexOf(_.pluck(AddressBook.$addressbooks, 'id'), _this.id);
AddressBook.$addressbooks.splice(i, 1);
d.resolve(true);
}, function(data, status) {
@@ -172,40 +172,38 @@
};
AddressBook.prototype.$getCard = function(card_id) {
var self = this;
return this.$id().then(function(addressbook_id) {
self.card = AddressBook.$Card.$find(addressbook_id, card_id);
return self.card;
return AddressBook.$Card.$find(addressbook_id, card_id);
});
};
AddressBook.prototype.$resetCard = function() {
this.$getCard(this.card.id);
};
// Unwrap a promise
AddressBook.prototype.$unwrap = function(futureAddressBookData) {
var self = this;
var _this = this;
// Expose the promise
this.$futureAddressBookData = futureAddressBookData;
// Resolve the promise
this.$futureAddressBookData.then(function(data) {
AddressBook.$timeout(function() {
angular.extend(self, data);
angular.extend(_this, data);
// Also extend AddressBook instance from data of addressbooks list.
// Will inherit attributes such as isEditable and isRemote.
angular.forEach(AddressBook.$findAll(), function(o, i) {
if (o.id == self.id) {
angular.extend(self, o);
if (o.id == _this.id) {
angular.extend(_this, o);
}
});
// Instanciate Card objects
angular.forEach(self.cards, function(o, i) {
self.cards[i] = new AddressBook.$Card(o);
angular.forEach(_this.cards, function(o, i) {
_this.cards[i] = new AddressBook.$Card(o);
});
});
}, function(data) {
angular.extend(self, data);
self.isError = true;
AddressBook.$timeout(function() {
angular.extend(_this, data);
_this.isError = true;
});
});
};
@@ -214,7 +212,6 @@
var addressbook = {};
angular.forEach(this, function(value, key) {
if (key != 'constructor' &&
key != 'card' &&
key != 'cards' &&
key[0] != '$') {
addressbook[key] = value;

View File

@@ -34,7 +34,7 @@
/**
* @memberof Card
* @desc The factory we'll use to register with Angular
* @desc The factory we'll use to register with Angular.
* @returns the Card constructor
*/
Card.$factory = ['$timeout', 'sgSettings', 'sgResource', function($timeout, Settings, Resource) {
@@ -48,7 +48,7 @@
/**
* @module SOGo.ContactsUI
* @desc Factory registration of Card in Angular module
* @desc Factory registration of Card in Angular module.
*/
angular.module('SOGo.ContactsUI')
.factory('sgCard', Card.$factory)
@@ -56,7 +56,7 @@
/**
* @name sgAddress
* @memberof ContactsUI
* @desc Directive to format a postal address
* @desc Directive to format a postal address.
*/
.directive('sgAddress', function() {
return {
@@ -83,7 +83,7 @@
/**
* @memberof Card
* @desc Fetch a card from a specific addressbook
* @desc Fetch a card from a specific addressbook.
* @param {string} addressbook_id - the addressbook ID
* @param {string} card_id - the card ID
* @see {@link AddressBook.$getCard}
@@ -98,7 +98,7 @@
/**
* @memberof Card
* @desc Unwrap to a collection of Card instances
* @desc Unwrap to a collection of Card instances.
* @param {Object} futureCardData
*/
Card.$unwrapCollection = function(futureCardData) {
@@ -120,7 +120,7 @@
/**
* @function $id
* @memberof Card.prototype
* @desc Return the card ID
* @desc Return the card ID.
* @returns the card ID
*/
Card.prototype.$id = function() {
@@ -132,7 +132,7 @@
/**
* @function $save
* @memberof Card.prototype
* @desc Save the card to the server
* @desc Save the card to the server.
*/
Card.prototype.$save = function() {
var action = 'saveAsContact';
@@ -202,7 +202,7 @@
/**
* @function $preferredEmail
* @memberof Card.prototype
* @desc Get the preferred email address
* @desc Get the preferred email address.
* @param {string} [partial] - a partial string that the email must match
* @returns the first email address of type "pref" or the first address if none found
*/
@@ -355,6 +355,22 @@
return this.refs.length - 1;
};
/**
* @function $reset
* @memberof Card.prototype
* @desc Reset the original state the card's data.
*/
Card.prototype.$reset = function() {
var _this = this;
angular.forEach(this, function(value, key) {
if (key != 'constructor' && key[0] != '$') {
delete _this[key];
}
});
angular.extend(this, this.$shadowData);
this.$shadowData = this.$omit(true);
};
/**
* @function $updateMember
* @memberof Card.prototype
@@ -372,30 +388,44 @@
this.refs[index] = ref;
};
// Unwrap a promise
/**
* @function $unwrap
* @memberof Card.prototype
* @desc Unwrap a promise and make a copy of the resolved data.
* @param {Object} futureCardData - a promise of the Card's data
*/
Card.prototype.$unwrap = function(futureCardData) {
var _this = this;
if (futureCardData) {
// Expose the promise
this.$futureCardData = futureCardData;
}
return this.$futureCardData.then(function(data) {
// The success callback. Calling _.extend from $timeout will wrap it into a try/catch call and return
// a promise resolved immediately.
return Card.$timeout(function() {
// Resolve the promise
this.$futureCardData.then(function(data) {
// Calling $timeout will force Angular to refresh the view
Card.$timeout(function() {
angular.extend(_this, data);
console.debug(angular.toJson(data));
return _this;
// Make a copy of the data in order for an eventual reset.
_this.$shadowData = _this.$omit(true);
});
});
};
// Return a sanitized object used to send to the server
Card.prototype.$omit = function() {
/**
* @function $omit
* @memberof Card.prototype
* @desc Return a sanitized object used to send to the server.
* @param {boolean} deep - make a deep copy if true
* @return an object literal copy of the Card instance
*/
Card.prototype.$omit = function(deep) {
var card = {};
angular.forEach(this, function(value, key) {
if (key != 'constructor' && key[0] != '$') {
card[key] = value;
if (deep)
card[key] = angular.copy(value);
else
card[key] = value;
}
});
return card;

View File

@@ -31,20 +31,6 @@
}]
}
})
.state('addressbook.card', {
url: '/:cardId',
views: {
card: {
templateUrl: 'card.html',
controller: 'CardCtrl'
}
},
resolve: {
stateCard: ['$stateParams', 'stateAddressbook', function($stateParams, stateAddressbook) {
return stateAddressbook.$getCard($stateParams.cardId);
}]
}
})
.state('addressbook.new', {
url: '/:contactType/new',
views: {
@@ -55,25 +41,36 @@
},
resolve: {
stateCard: ['$stateParams', 'stateAddressbook', 'sgCard', function($stateParams, stateAddressbook, Card) {
var tag = 'v' + $stateParams.contactType;
stateAddressbook.card = new Card({ pid: $stateParams.addressbookId, tag: tag });
return stateAddressbook.card;
var tag = 'v' + $stateParams.contactType,
card = new Card({ pid: $stateParams.addressbookId, tag: tag });
return card;
}]
}
})
.state('addressbook.editor', {
url: '/:cardId/edit',
.state('addressbook.card', {
url: '/:cardId',
abstract: true,
views: {
card: {
templateUrl: 'cardEditor.html',
controller: 'CardCtrl'
template: '<ui-view/>',
}
},
resolve: {
stateCard: ['$stateParams', 'stateAddressbook', function($stateParams, stateAddressbook) {
console.debug('resovle');
return stateAddressbook.$getCard($stateParams.cardId);
}]
}
})
.state('addressbook.card.view', {
url: '/view',
templateUrl: 'card.html',
controller: 'CardCtrl'
})
.state('addressbook.card.editor', {
url: '/edit',
templateUrl: 'cardEditor.html',
controller: 'CardCtrl'
});
// if none of the above states are matched, use this as the fallback
@@ -211,76 +208,78 @@
};
}])
.controller('CardCtrl', ['$scope', '$rootScope', 'sgAddressBook', 'sgCard', 'sgDialog', 'sgFocus', '$state', '$stateParams', function($scope, $rootScope, AddressBook, Card, Dialog, focus, $state, $stateParams) {
/**
* Controller to view and edit a card
*/
.controller('CardCtrl', ['$scope', '$rootScope', '$timeout', 'sgAddressBook', 'sgCard', 'sgDialog', 'sgFocus', '$state', '$stateParams', 'stateCard', function($scope, $rootScope, $timeout, AddressBook, Card, Dialog, focus, $state, $stateParams, stateCard) {
$scope.card = stateCard;
$scope.allEmailTypes = Card.$EMAIL_TYPES;
$scope.allTelTypes = Card.$TEL_TYPES;
$scope.allUrlTypes = Card.$URL_TYPES;
$scope.allAddressTypes = Card.$ADDRESS_TYPES;
$rootScope.masterCard = angular.copy($rootScope.addressbook.card);
$scope.addOrgUnit = function() {
var i = $rootScope.addressbook.card.$addOrgUnit('');
var i = $scope.card.$addOrgUnit('');
focus('orgUnit_' + i);
};
$scope.addCategory = function() {
var i = $rootScope.addressbook.card.$addCategory('');
var i = $scope.card.$addCategory('');
focus('category_' + i);
};
$scope.addEmail = function() {
var i = $rootScope.addressbook.card.$addEmail('');
var i = $scope.card.$addEmail('');
focus('email_' + i);
};
$scope.addPhone = function() {
var i = $rootScope.addressbook.card.$addPhone('');
var i = $scope.card.$addPhone('');
focus('phone_' + i);
};
$scope.addUrl = function() {
var i = $rootScope.addressbook.card.$addUrl('', '');
var i = $scope.card.$addUrl('', '');
focus('url_' + i);
};
$scope.addAddress = function() {
var i = $rootScope.addressbook.card.$addAddress('', '', '', '', '', '', '', '');
var i = $scope.card.$addAddress('', '', '', '', '', '', '', '');
focus('address_' + i);
};
$scope.addMember = function() {
var i = $rootScope.addressbook.card.$addMember('');
var i = $scope.card.$addMember('');
focus('ref_' + i);
};
$scope.save = function(form) {
if (form.$valid) {
$rootScope.addressbook.card.$save()
$scope.card.$save()
.then(function(data) {
var i = _.indexOf(_.pluck($rootScope.addressbook.cards, 'id'), $rootScope.addressbook.card.id);
var i = _.indexOf(_.pluck($rootScope.addressbook.cards, 'id'), $scope.card.id);
if (i < 0) {
// Reload contacts list and show addressbook in which the card has been created
$rootScope.addressbook = AddressBook.$find(data.pid);
}
else {
// Update contacts list with new version of the Card object
$rootScope.addressbook.cards[i] = angular.copy($rootScope.addressbook.card);
$rootScope.addressbook.cards[i] = angular.copy($scope.card);
}
$state.go('addressbook.card');
$state.go('addressbook.card.view', { cardId: $scope.card.id });
}, function(data, status) {
console.debug('failed');
});
}
};
$scope.reset = function() {
$scope.card.reset();
};
$scope.cancel = function() {
$scope.reset();
delete $rootScope.masterCard;
if ($scope.addressbook.card.id) {
// Cancelling the edition of an existing card
$state.go('addressbook.card', { cardId: $scope.addressbook.card.id });
}
else {
$scope.card.reset();
if ($scope.card.isNew) {
// Cancelling the creation of a card
delete $rootScope.addressbook.card;
delete $scope.card;
$state.go('addressbook', { addressbookId: $scope.addressbook.id });
}
};
$scope.reset = function() {
$rootScope.addressbook.card = angular.copy($rootScope.masterCard);
else {
// Cancelling the edition of an existing card
$state.go('addressbook.card.view', { cardId: $scope.card.id });
}
};
$scope.confirmDelete = function(card) {
Dialog.confirm(l('Warning'),
@@ -293,7 +292,7 @@
$rootScope.addressbook.cards = _.reject($rootScope.addressbook.cards, function(o) {
return o.id == card.id;
});
delete $rootScope.addressbook.card;
delete $scope.card;
}, function(data, status) {
Dialog.alert(l('Warning'), l('An error occured while deleting the card "%{0}".',
card.$fullname()));

View File

@@ -204,7 +204,7 @@
}])
.controller('CardCtrl', ['$scope', '$rootScope', '$state', '$stateParams', '$ionicModal', 'sgDialog', 'sgAddressBook', 'sgCard', 'stateCard', function($scope, $rootScope, $state, $stateParams, $ionicModal, Dialog, AddressBook, Card, stateCard) {
$rootScope.addressbook.card = stateCard;
$scope.card = stateCard;
$scope.UserFolderURL = UserFolderURL;
$scope.allEmailTypes = Card.$EMAIL_TYPES;
@@ -213,8 +213,6 @@
$scope.allAddressTypes = Card.$ADDRESS_TYPES;
$scope.edit = function() {
// Copy card to be able to cancel changes later
$scope.masterCard = angular.copy($rootScope.addressbook.card);
// Build modal editor
$ionicModal.fromTemplateUrl('cardEditor.html', {
scope: $scope,
@@ -230,62 +228,61 @@
});
};
$scope.cancel = function() {
if ($rootScope.addressbook.card.isNew) {
if ($scope.card.isNew) {
$scope.$cardEditorModal.hide().then(function() {
// Go back to addressbook
$state.go('app.addressbook', { addressbookId: $rootScope.addressbook.id });
});
}
else {
$rootScope.addressbook.card = angular.copy($scope.masterCard);
$scope.card.$reset();
$scope.$cardEditorModal.hide()
}
};
$scope.addOrgUnit = function() {
var i = $rootScope.addressbook.card.$addOrgUnit('');
var i = $scope.card.$addOrgUnit('');
focus('orgUnit_' + i);
};
$scope.addCategory = function() {
var i = $rootScope.addressbook.card.$addCategory('');
var i = $scope.card.$addCategory('');
focus('category_' + i);
};
$scope.addEmail = function() {
var i = $rootScope.addressbook.card.$addEmail('');
var i = $scope.card.$addEmail('');
focus('email_' + i);
};
$scope.addPhone = function() {
var i = $rootScope.addressbook.card.$addPhone('');
var i = $scope.card.$addPhone('');
focus('phone_' + i);
};
$scope.addUrl = function() {
var i = $rootScope.addressbook.card.$addUrl('', '');
var i = $scope.card.$addUrl('', '');
focus('url_' + i);
};
$scope.addAddress = function() {
var i = $rootScope.addressbook.card.$addAddress('', '', '', '', '', '', '', '');
var i = $scope.card.$addAddress('', '', '', '', '', '', '', '');
focus('address_' + i);
};
$scope.addMember = function() {
var i = $rootScope.addressbook.card.$addMember('');
var i = $scope.card.$addMember('');
focus('ref_' + i);
};
$scope.save = function(form) {
if (form.$valid) {
$rootScope.addressbook.card.$save()
$scope.card.$save()
.then(function(data) {
var i, card;
delete $rootScope.addressbook.card.isNew;
i = _.indexOf(_.pluck($rootScope.addressbook.cards, 'id'), $rootScope.addressbook.card.id);
var i;
delete $scope.card.isNew;
i = _.indexOf(_.pluck($rootScope.addressbook.cards, 'id'), $scope.card.id);
if (i < 0) {
// New card
// Reload contacts list and show addressbook in which the card has been created
card = angular.copy($rootScope.addressbook.card);
$rootScope.addressbook = AddressBook.$find(data.pid);
$rootScope.addressbook.card = card;
$state.go('app.addressbook', { addressbookId: data.pid });
}
else {
// Update contacts list with new version of the Card object
$rootScope.addressbook.cards[i] = angular.copy($rootScope.addressbook.card);
$rootScope.addressbook.cards[i] = angular.copy($scope.card);
}
// Close editor
$scope.$cardEditorModal.hide();
@@ -305,7 +302,7 @@
return o.id == card.id;
});
// Delete card object
delete $rootScope.addressbook.card;
delete $scope.card;
// Delete modal editor
$scope.$cardEditorModal.remove();
// Go back to addressbook
@@ -318,7 +315,7 @@
});
};
if ($scope.addressbook.card && $scope.addressbook.card.isNew) {
if ($scope.card && $scope.card.isNew) {
// New contact
$scope.edit();
}