Also removed explicit settings and defaults that were imported in various app modules. We now always use the Preferences ng service.
454 lines
21 KiB
XML
454 lines
21 KiB
XML
<?xml version='1.0' standalone='yes'?>
|
|
<!DOCTYPE var:component>
|
|
<var:component
|
|
xmlns="http://www.w3.org/1999/xhtml"
|
|
xmlns:var="http://www.skyrix.com/od/binding"
|
|
xmlns:const="http://www.skyrix.com/od/constant"
|
|
xmlns:rsrc="OGo:url"
|
|
xmlns:label="OGo:label"
|
|
className="UIxPageFrame"
|
|
title="title"
|
|
const:userDefaultsKeys="SOGoContactsCategories"
|
|
const:jsFiles="Common.js, Preferences.services.js, Contacts.js, Contacts.services.js">
|
|
<script type="text/javascript">
|
|
var contactFolders = <var:string value="contactFolders" const:escapeHTML="NO" />;
|
|
</script>
|
|
|
|
<!--
|
|
<div id="uploadDialog" style="display: none" class="dialog left">
|
|
<div>
|
|
<h3><var:string label:value="Import Cards"/></h3>
|
|
<p class="prompt"><var:string label:value="Select a vCard or LDIF file."/></p>
|
|
<form const:href="" name="uploadForm" id="uploadForm" method="post"
|
|
enctype="multipart/form-data"
|
|
onsubmit="return AIM.submit(this, {'onStart' : validateUploadForm,
|
|
'onComplete' : uploadCompleted})">
|
|
<p class="prompt"><input type="file" name="contactsFile" id="contactsFile" class="textField" required="required" />
|
|
<a href="#" class="button actionButton" id="uploadSubmit"
|
|
onclick="if($('uploadForm').onsubmit()) $('uploadForm').submit()">
|
|
<span><var:string label:value="Upload" /></span></a>
|
|
<a href="#" class="button" const:id="uploadCancel">
|
|
<span><var:string label:value="Cancel" /></span></a></p>
|
|
</form>
|
|
<hr/>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="uploadResults" dropdown-content="dropdown-content" class="f-dropdown">
|
|
<div>
|
|
<h3><var:string label:value="Import Cards"/></h3>
|
|
<p id="uploadResultsContent">!- empty -</p>
|
|
<p><a href="#" class="button" const:id="uploadOK">
|
|
<span><var:string label:value="Done" /></span></a></p>
|
|
<hr/>
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="f-dropdown" dropdown-content="dropdown-content" id="contactMenu">
|
|
<li><var:string label:value="Properties" /></li>
|
|
<li><var:string label:value="Categories" /></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Write" /></li>
|
|
<li><var:string label:value="Instant Message" /></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Delete" /></li>
|
|
<li>!- separator -</li>
|
|
<li><var:string label:value="Move To" /></li>
|
|
<li><var:string label:value="Copy To" /></li>
|
|
<li><var:string label:value="Export" /></li>
|
|
<li><var:string label:value="View Raw Source" /></li>
|
|
</ul>
|
|
-->
|
|
<!--
|
|
MAIN CONTENT ROW
|
|
Content of the application view injected injected in the element bellow
|
|
MUST be the first html element after body
|
|
SHOULD be a main tag (with role="main")
|
|
|
|
Templates script tag wrappers goes next
|
|
-->
|
|
<main class="view md-layout-fill" ui-view="addressbooks" layout="row" ng-controller="navController"><!-- addressbooks list --></main>
|
|
|
|
<!-- TEMPLATE SCRIPT WRAPPER -->
|
|
<script type="text/ng-template" id="UIxContactFoldersView">
|
|
|
|
<!-- dropdown menu for addressbook options button -->
|
|
<div id="addressbookProperties" class="f-dropdown icons-dropdown" ng-hide="true">
|
|
<ul class="button-group">
|
|
<li label:tooltip="Links to this Address Book"
|
|
tooltip-popup-delay="500">
|
|
<span class="button"
|
|
sg-dropdown-content-toggle="#addressbookLinks">
|
|
<i class="icon-hyperlink"><!-- links --></i>
|
|
</span>
|
|
</li>
|
|
<li label:tooltip="Rename"
|
|
tooltip-popup-delay="500">
|
|
<span class="button" ng-click="edit()">
|
|
<i class="icon-pencil"><!-- rename --></i>
|
|
</span>
|
|
</li>
|
|
<li label:tooltip="Import Cards"
|
|
tooltip-popup-delay="500">
|
|
<span class="button" ng-click="importCards()">
|
|
<i class="icon-file"><!-- import --></i>
|
|
</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- dropdown menu for new card split button
|
|
<ul id="newListDrop" class="f-dropdown">
|
|
<li><a class="tiny" ui-sref="addressbook.new({addressbookId: addressbook.id, contactType: 'list'})"><var:string label:value="New List"/></a></li>
|
|
</ul>
|
|
-->
|
|
|
|
<!-- dropdown menu for addressbook links
|
|
<div id="addressbookLinks" class="sg-dropdown-content joyride-tip-guide">
|
|
<span class="joyride-nub left">!- dropdown nub -</span>
|
|
<div class="joyride-content-wrapper">
|
|
<ul>
|
|
<li class="title"><var:string label:value="Links to this Address Book"/></li>
|
|
<li class="subtitle"><var:string label:value="CardDAV URL for Authenticated User Access"/></li>
|
|
<li class="value">{{addressbook.cardDavURL}}</li>
|
|
<var:if condition="isPublicAccessEnabled">
|
|
<li class="subtitle"><var:string label:value="CardDAV URL for Public Access"/></li>
|
|
<li class="value">{{addressbook.publicCardDavURL}}</li>
|
|
</var:if>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
-->
|
|
|
|
<!-- dropdown menu for subscriptions
|
|
<div id="folderSubscribe" class="sg-dropdown-content"
|
|
sg-subscribe="contact"
|
|
sg-subscribe-on-select="subscribeToFolder">!- subscription dropdown -</div>
|
|
-->
|
|
<!-- Sidenav -->
|
|
<md-sidenav id="left-sidenav" class="md-sidenav-left md-whiteframe-z1" md-component-id="left" md-is-locked-open="isGtMedium" layout="column">
|
|
<var:component className="UIxSidenavToolbarTemplate" />
|
|
<!-- <div style="position: relative; display: flex;"> -->
|
|
<md-content md-scroll-y="md-scroll-y">
|
|
<!-- User's addressbooks -->
|
|
<section>
|
|
<md-subheader class="sg-md-subheader">
|
|
<div layout="row" layout-align="space-between center">
|
|
<span><var:string label:value="AddressBooks"/></span>
|
|
<md-button class="sg-icon-button"
|
|
label:aria-label="New Addressbook..."
|
|
ng-click="app.newAddressbook()">
|
|
<md-icon>add_circle_outline</md-icon>
|
|
</md-button>
|
|
</div>
|
|
</md-subheader>
|
|
<md-list>
|
|
<md-list-item ng-repeat="folder in app.service.$addressbooks track by folder.id"
|
|
ng-click="app.select(folder)"
|
|
ng-dblclick="app.edit(folder)"
|
|
ui-sref="app.addressbook({addressbookId: folder.id})"
|
|
ui-sref-active="sg-active">
|
|
<md-icon>contacts</md-icon>
|
|
<p class="sg-item-name"
|
|
ng-show="app.editMode!=folder.id">{{folder.name}}</p>
|
|
<md-input-container class="md-flex md-tile-content"
|
|
ng-show="app.editMode == folder.id">
|
|
<input class="folder-name" type="text"
|
|
label:aria-label="Name of the Address Book"
|
|
ng-model="folder.name"
|
|
ng-cloak="ng-cloak"
|
|
ng-blur="app.save(folder)"
|
|
sg-focus-on="addressBookName_{{folder.id}}"
|
|
sg-enter="app.save(folder)"
|
|
sg-escape="app.revertEditing(folder)"/>
|
|
</md-input-container>
|
|
<md-menu class="md-secondary"
|
|
ng-show="app.service.selectedFolder.id == folder.id">
|
|
<md-icon label:aria-label="Options"
|
|
ng-click="$mdOpenMenu()"
|
|
md-menu-origin="md-menu-origin">more_vert</md-icon>
|
|
<md-menu-content width="2">
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="app.confirmDelete()">
|
|
<var:string label:value="Delete"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="app.exportCards()">
|
|
<var:string label:value="Export"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider><!-- divider --></md-menu-divider>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="app.showLinks(folder)">
|
|
<var:string label:value="Links to this Address Book"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="app.share(folder)">
|
|
<var:string label:value="Sharing..."/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
</md-menu>
|
|
</md-list-item>
|
|
</md-list>
|
|
</section>
|
|
<!-- Subscriptions -->
|
|
<section>
|
|
<md-subheader class="sg-md-subheader">
|
|
<div layout="row" layout-align="space-between center">
|
|
<span><var:string label:value="Subscriptions"/></span>
|
|
<md-button class="sg-icon-button"
|
|
label:aria-label="Subscribe to an Addressbook..."
|
|
sg-subscribe="contact"
|
|
sg-subscribe-on-select="app.subscribeToFolder(folderData)">
|
|
<md-icon>add_circle_outline</md-icon>
|
|
</md-button>
|
|
</div>
|
|
</md-subheader>
|
|
<md-list>
|
|
<md-list-item ng-repeat="folder in app.service.$subscriptions track by folder.id"
|
|
ng-click="app.select(folder)"
|
|
ng-dblclick="app.edit(folder)"
|
|
ui-sref="app.addressbook({addressbookId: folder.id})"
|
|
ui-sref-active="sg-active">
|
|
<md-icon>contacts</md-icon>
|
|
<p class="sg-item-name"
|
|
ng-show="editMode!=folder.id">{{folder.name}}</p>
|
|
<md-input-container class="md-flex md-tile-content"
|
|
ng-show="app.editMode==folder.id">
|
|
<input class="folder-name" type="text"
|
|
label:aria-label="Name of the Address Book"
|
|
ng-model="folder.name"
|
|
ng-cloak="ng-cloak"
|
|
ng-blur="app.save(folder)"
|
|
sg-focus-on="addressBookName_{{folder.id}}"
|
|
sg-enter="app.save(folder)"
|
|
sg-escape="app.revertEditing(folder)"/>
|
|
</md-input-container>
|
|
<md-menu class="md-secondary"
|
|
ng-show="app.service.selectedFolder.id==folder.id">
|
|
<md-icon label:aria-label="Options"
|
|
ng-click="$mdOpenMenu()"
|
|
md-menu-origin="md-menu-origin">more_vert</md-icon>
|
|
<md-menu-content width="2">
|
|
<md-menu-item>
|
|
<md-button type="button" ng-click="app.confirmDelete(folder)">
|
|
<var:string label:value="Delete"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
</md-menu>
|
|
</md-list-item>
|
|
</md-list>
|
|
</section>
|
|
<!-- Remote/domain addressbooks -->
|
|
<section>
|
|
<md-subheader class="sg-md-subheader md-padding">
|
|
<var:string label:value="Global Addressbooks"/>
|
|
</md-subheader>
|
|
<md-list>
|
|
<md-list-item ng-repeat="folder in app.service.$remotes track by folder.id"
|
|
ng-click="app.select(folder)"
|
|
ui-sref="app.addressbook({addressbookId: folder.id})"
|
|
ui-sref-active="sg-active">
|
|
<md-icon>public</md-icon>
|
|
<p class="sg-item-name">{{folder.name}}</p>
|
|
</md-list-item>
|
|
</md-list>
|
|
</section>
|
|
</md-content>
|
|
<!-- </div> -->
|
|
</md-sidenav>
|
|
|
|
<section layout="column" class="sg-app-content md-layout-fill" ui-view="addressbook"><!-- contacts list --></section>
|
|
</script>
|
|
|
|
<script type="text/ng-template" id="addressbook">
|
|
<md-toolbar layout="column" layout-align="space-between start" class="md-tall toolbar-main">
|
|
<div class="md-toolbar-tools md-toolbar-tools-top sg-padded" layout="row" layout-align="space-between start">
|
|
<var:component className="UIxTopnavToolbarTemplate" />
|
|
</div>
|
|
<div class="md-toolbar-tools" layout="row" layout-align="space-between center"
|
|
ng-show="addressbook.selectedFolder.$selectedCount() == 0">
|
|
|
|
<div class="view-list" layout="row" layout-align="space-between center"
|
|
ng-hide="addressbook.mode.search">
|
|
<div class="sg-toolbar-group">
|
|
<md-button class="sg-icon-button" label:aria-label="Search"
|
|
ng-click="addressbook.mode.search = true">
|
|
<md-icon>search</md-icon>
|
|
</md-button>
|
|
</div>
|
|
<div class="sg-toolbar-group-last">
|
|
<md-menu>
|
|
<md-button class="sg-icon-button" label:aria-label="Sort"
|
|
ng-click="$mdOpenMenu()">
|
|
<md-icon>sort</md-icon>
|
|
</md-button>
|
|
<md-menu-content>
|
|
<md-menu-item>
|
|
<md-button ng-click="addressbook.sort('c_cn')">
|
|
<md-icon ng-class="{ 'icon-check': addressbook.sortedBy('c_cn') }">
|
|
<!-- selected --></md-icon> <var:string label:value="Name"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button ng-click="addressbook.sort('c_mail')">
|
|
<md-icon ng-class="{ 'icon-check': addressbook.sortedBy('c_mail') }">
|
|
<!-- selected --></md-icon> <var:string label:value="Email"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button ng-click="addressbook.sort('c_screenname')">
|
|
<md-icon ng-class="{ 'icon-check': addressbook.sortedBy('c_screenname') }">
|
|
<!-- selected --></md-icon> <var:string
|
|
label:value="Screen Name"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button ng-click="addressbook.sort('c_o')">
|
|
<md-icon ng-class="{ 'icon-check': addressbook.sortedBy('c_o') }">
|
|
<!-- selected --></md-icon> <var:string
|
|
label:value="Organization"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-item>
|
|
<md-button ng-click="addressbook.sort('c_telephonenumber')">
|
|
<md-icon ng-class="{ 'icon-check': addressbook.sortedBy('c_telephonenumber') }">
|
|
<!-- selected --></md-icon> <var:string
|
|
label:value="Preferred Phone"/>
|
|
</md-button>
|
|
</md-menu-item>
|
|
<md-menu-divider> <!-- divider --></md-menu-divider>
|
|
<md-menu-item >
|
|
<md-button ng-click="addressbook.sort()">
|
|
<md-checkbox
|
|
ng-model="addressbook.selectedFolder.$query.asc"
|
|
ng-true-value="0"
|
|
ng-false-value="1"><var:string label:value="Descending Order"/></md-checkbox>
|
|
</md-button>
|
|
</md-menu-item>
|
|
</md-menu-content>
|
|
</md-menu>
|
|
<md-button class="sg-icon-button" aria-label="Refresh" ng-click="addressbook.selectedFolder.$reload()" >
|
|
<md-icon>refresh</md-icon>
|
|
</md-button>
|
|
</div>
|
|
</div>
|
|
<!-- search mode -->
|
|
<div class="view-list sg-padded--right sg-toolbar-search" layout="row" layout-align="space-between center"
|
|
ng-show="addressbook.mode.search"
|
|
sg-search="addressbook.selectedFolder.$filter(searchText, { search: searchField })">
|
|
<md-button class="sg-icon-button"
|
|
sg-search-cancel="addressbook.cancelSearch()"
|
|
label:aria-label="Back">
|
|
<md-icon>arrow_back</md-icon>
|
|
</md-button>
|
|
<md-input-container>
|
|
<input name="folderSearch" type="search" />
|
|
</md-input-container>
|
|
<md-input-container>
|
|
<md-select>
|
|
<md-option value="name_or_address" selected="selected"><var:string label:value="Name or Email"/></md-option>
|
|
<md-option value="category"><var:string label:value="Category"/></md-option>
|
|
<md-option value="organization"><var:string label:value="Organization"/></md-option>
|
|
</md-select>
|
|
</md-input-container>
|
|
</div>
|
|
</div>
|
|
|
|
<div layout="row" layout-align="start center" ng-show="addressbook.selectedFolder.$selectedCount() > 0">
|
|
<md-button class="sg-icon-button" ng-click="addressbook.unselectCards()">
|
|
<md-icon>arrow_back</md-icon>
|
|
</md-button>
|
|
<label>{{addressbook.selectedFolder.$selectedCount()}} selected</label>
|
|
<md-button class="sg-icon-button" ng-click="addressbook.confirmDeleteSelectedCards()">
|
|
<md-icon>delete</md-icon>
|
|
</md-button>
|
|
<md-button class="sg-icon-button">
|
|
<md-icon>email</md-icon>
|
|
</md-button>
|
|
</div>
|
|
</md-toolbar>
|
|
<div layout="row" class="md-flex" layout-align="space-between">
|
|
<div class="view-list" layout="column">
|
|
<md-content id="contactsList" layout="column" class="md-flex">
|
|
<header class="sg-md-subheader sg-md-subheader--fixed">
|
|
<h2 class="md-default-theme sg-md-subhead-solo fg-sogoBlue-700">
|
|
<span ng-show="addressbook.selectedFolder.cards.length > 0">{{addressbook.selectedFolder.cards.length}} <var:string label:value="contacts"/></span>
|
|
<span ng-show="addressbook.selectedFolder.cards.length == 0"><var:string label:value="No contact"/></span>
|
|
</h2>
|
|
</header>
|
|
<!-- Search field & special results
|
|
<input type="text" placeholder="Search" ng-model="search.filter" ng-keyup="doSearch($event)" />
|
|
<div ng-switch="search.status">
|
|
<div ng-switch-when="min-char" class="alert-bg">
|
|
<i class="icon-warning"></i><var:string label:value="Please enter at least three characters"/>
|
|
</div>
|
|
<div ng-switch-when="no-result" class="alert-bg">
|
|
<i class="icon-ion-search"></i><var:string label:value="No matching card"/>
|
|
</div>
|
|
<div ng-switch-when="remote-addressbook" ng-show="addressbook.cards.length == 0" class="alert-bg">
|
|
<i class="icon-ion-search"></i><var:string label:value="Initiate a search"/>
|
|
</div>
|
|
</div>
|
|
-->
|
|
<md-virtual-repeat-container class="md-flex">
|
|
<md-list>
|
|
<div md-virtual-repeat="currentCard in addressbook.selectedFolder.cards">
|
|
<md-list-item
|
|
ng-class="{'sg-active': currentCard.id == addressbook.selectedFolder.selectedCard}"
|
|
ng-click="addressbook.selectCard(currentCard)"
|
|
ui-sref="app.addressbook.card.view({addressbookId: addressbook.selectedFolder.id, cardId: currentCard.id})">
|
|
<!-- ui-sref-active="sg-active" -->
|
|
<div class="sg-selected-avatar" ng-show="currentCard.selected"
|
|
ng-click="currentCard.selected = !currentCard.selected">
|
|
<!-- selected avatar -->
|
|
</div>
|
|
<sg-avatar-image class="md-tile-left"
|
|
ng-show="addressbook.notSelectedComponent(currentCard, 'vcard')"
|
|
ng-click="currentCard.selected = !currentCard.selected"
|
|
sg-email="currentCard.$preferredEmail(addressbook.selectedFolder.$query)"
|
|
size="48">
|
|
<!-- contact avatar -->
|
|
</sg-avatar-image>
|
|
<div class="sg-list-avatar"
|
|
ng-show="addressbook.notSelectedComponent(currentCard, 'vlist')"
|
|
ng-click="currentCard.selected = !currentCard.selected">
|
|
<!-- list avatar -->
|
|
</div>
|
|
<div class="sg-tile-content">
|
|
<div class="sg-md-subhead-multi" ng-bind-html="currentCard.$fullname()"><!-- cn --></div>
|
|
<div class="sg-md-body-multi">{{currentCard.$preferredEmail(addressbook.selectedFolder.$query)}}</div>
|
|
</div>
|
|
</md-list-item>
|
|
</div>
|
|
</md-list>
|
|
</md-virtual-repeat-container>
|
|
<md-button class="md-fab md-fab-bottom-right md-accent"
|
|
label:aria-label="New Contact"
|
|
ng-click="addressbook.newComponent($event)">
|
|
<md-icon>add</md-icon>
|
|
</md-button>
|
|
</md-content>
|
|
</div>
|
|
|
|
<div id="detailView" class="view-detail ng-cloak" layout="column" ui-view="card"
|
|
ng-show="addressbook.selectedFolder.selectedCard"><!-- card view --></div>
|
|
|
|
</div>
|
|
</script>
|
|
|
|
<!-- modal for addressbook sharing options -->
|
|
<script type="text/ng-template" id="UIxUserRightsEditor">
|
|
<var:component className="UIxContactsUserRightsEditor" />
|
|
</script>
|
|
|
|
<script type="text/ng-template" id="UIxContactViewTemplate">
|
|
<var:component className="UIxContactViewTemplate" />
|
|
</script>
|
|
|
|
</var:component>
|