Add mobile version to webmail and improvements

pull/91/head
Francis Lachapelle 2014-11-27 08:58:33 -05:00
parent cdd1131699
commit 1ca1a8c249
9 changed files with 327 additions and 27 deletions

View File

@ -1,6 +1,5 @@
/*
Copyright (C) 2004-2005 SKYRIX Software AG
Copyright (C) 2006-2013 Inverse inc.
Copyright (C) 2006-2014 Inverse inc.
This file is part of SOGo
@ -32,8 +31,10 @@
#import <Foundation/NSDictionary.h>
#import <Foundation/NSEnumerator.h>
#import <Foundation/NSTimeZone.h>
#import <Foundation/NSUserDefaults.h> /* for locale string constants */
#import <Foundation/NSValue.h>
#import <NGObjWeb/WOApplication.h>
#import <NGObjWeb/WOContext+SoObjects.h>
#import <NGObjWeb/WOResponse.h>
#import <NGObjWeb/WORequest.h>
@ -59,6 +60,7 @@
#import <SOGo/SOGoUser.h>
#import <SOGo/SOGoUserDefaults.h>
#import <SOGo/SOGoUserSettings.h>
#import <SOGo/WOResourceManager+SOGo.h>
#import <UI/Common/WODirectAction+SOGo.h>
#import <UI/MailPartViewers/UIxMailSizeFormatter.h>
@ -128,11 +130,20 @@
}
else if ([now dayOfCommonEra] - [messageDate dayOfCommonEra] == 1)
{
// Yesterday
return [self labelForKey: @"Yesterday"];
}
else if ([now dayOfCommonEra] - [messageDate dayOfCommonEra] < 7)
{
// Same week
WOResourceManager *resMgr = [[WOApplication application] resourceManager];
NSString *language = [[[context activeUser] userDefaults] language];
NSDictionary *locale = [resMgr localeForLanguageNamed: language];
return [[locale objectForKey: NSWeekDayNameArray] objectAtIndex: [messageDate dayOfWeek]];
}
else
{
return [dateFormatter formattedDate: messageDate];
return [dateFormatter shortFormattedDate: messageDate];
}
}
@ -690,7 +701,7 @@
msgsList = [[msgs objectForKey: @"fetch"] objectEnumerator];
[self setMessage: [msgsList nextObject]];
msg = [NSMutableArray arrayWithObjects: @"To", @"hasAttachment", @"isFlagged", @"Subject", @"From", @"isRead", @"Priority", @"Date", @"Size", @"Flags", @"uid", nil];
msg = [NSMutableArray arrayWithObjects: @"To", @"hasAttachment", @"isFlagged", @"Subject", @"From", @"isRead", @"Priority", @"RelativeDate", @"Size", @"Flags", @"uid", nil];
[headers addObject: msg];
while (message)
{
@ -748,7 +759,7 @@
// Priority
[msg addObject: [self messagePriority]];
// Date
// Relative Date
msgDate = [self messageDate];
if (msgDate == nil)
msgDate = @"";

View File

@ -1,6 +1,5 @@
/*
Copyright (C) 2004-2005 SKYRIX Software AG
Copyright (C) 2005-2013 Inverse inc.
Copyright (C) 2005-2014 Inverse inc.
This file is part of SOGo.
@ -15,7 +14,7 @@
License for more details.
You should have received a copy of the GNU Lesser General Public
License along with OGo; see the file COPYING. If not, write to the
License along with SOGo; see the file COPYING. If not, write to the
Free Software Foundation, 59 Temple Place - Suite 330, Boston, MA
02111-1307, USA.
*/
@ -194,17 +193,23 @@ static NSString *mailETag = nil;
- (NSArray *) formattedAddresses: (NSArray *) theAddresses
{
NSMutableArray *addresses;
NSFormatter *formatter;
NGImap4EnvelopeAddress *address;
NSMutableDictionary *metaAddress;
NSString *name, *address;
NGImap4EnvelopeAddress *envelopeAddress;
int count, i;
formatter = [[self context] mailEnvelopeFullAddressFormatter];
count = [theAddresses count];
addresses = [NSMutableArray arrayWithCapacity: count];
for (i = 0; i < count; i++)
{
address = [theAddresses objectAtIndex: i];
[addresses addObject: [formatter stringForObjectValue: address]];
envelopeAddress = [theAddresses objectAtIndex: i];
address = [envelopeAddress baseEMail];
name = [envelopeAddress personalName];
metaAddress = [NSMutableDictionary dictionaryWithObject: address forKey: @"address"];
if (name)
[metaAddress setObject: name forKey: @"name"];
[addresses addObject: metaAddress];
}
return addresses;

View File

@ -254,7 +254,7 @@
<a name="{{}}" data-ui-sref="mail.account.mailbox.message({accountId: account.id, mailboxId: mailbox.path, messageId: currentMessage.uid})">
<div class="name">
{{currentMessage.from}}
<span class="right" data-ng-bind-html="currentMessage.date"><!-- date --></span>
<span class="right" data-ng-bind-html="currentMessage.relativedate"><!-- date --></span>
</div>
<div class="subject">{{currentMessage.subject}}</div>
<i class="icon-ion-refresh"
@ -268,19 +268,18 @@
<script type="text/ng-template" id="message.html">
<div class="header">
<h1 data-ng-bind-html="message.from"><!-- sender --></h1>
<h4 data-ng-bind="message.subject"><!-- subject --></h4>
<h6><var:string label:value="From"/> <a
data-ng-href="mailto:{{message.fromAddresses[0].address}}"
data-ng-bind="message.fromAddresses[0].full"><!-- from --></a></h6>
<h6>
<var:string label:value="To"/> <a
data-ng-href="mailto:{{message.toAddresses[0].address}}"
data-ng-bind="message.toAddresses[0].full"><!-- to --></a>
</h6>
<h6>
{{message.subject}}
<span class="label radius" data-ng-repeat="flag in message.flags">{{flag}}</span>
</h6>
<div class="attr">
<div class="key">
<label class="right"><var:string label:value="To"/></label>
</div>
<div class="value">
<span class="label radius" data-ng-repeat="addr in message.toAddresses">{{addr}}</span>
</div>
</div>
</div>
<div class="buttonsToolbar">
<span>

View File

@ -0,0 +1,93 @@
<?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:uix="OGo:uix"
xmlns:label="OGo:label"
xmlns:rsrc="OGo:url"
const:jsFiles="Common/resource.js, Common/ui-common.js, Mailer/account-model.js, Mailer/mailbox-model.js, Mailer/message-model.js"
className="UIxPageFrame"
title="name">
<script type="text/javascript">
var mailAccounts = <var:string value="mailAccounts" const:escapeHTML="NO"/>;
var userNames = <var:string value="userNames" const:escapeHTML="NO" />;
var unseenCountFolders = <var:string value="unseenCountFolders" const:escapeHTML="NO"/>;
</script>
<ion-nav-view><!-- main view --></ion-nav-view>
<script type="text/ng-template" id="mailboxes.html">
<ion-view title="Mailboxes">
<ion-nav-buttons side="left">
<button menu-toggle="left" class="button button-icon icon ion-navicon"><!-- menu toggle --></button>
</ion-nav-buttons>
<ion-nav-buttons side="right">
<a class="button button-clear button-positive button-icon icon ion-ios7-plus-empty" ng-click="newMailbox()"><!-- new --></a>
</ion-nav-buttons>
<ion-content class="has-header">
<!-- sgFamilyTree -->
<ion-list ng-repeat="account in accounts">
<ion-item class="item-divider">{{account.name}}</ion-item>
<sg-folder-tree ng-repeat="folder in account.mailboxes track by folder.id"
sg-root="account"
sg-folder="folder"
sg-set-folder="setCurrentFolder"><!-- tree --></sg-folder-tree>
</ion-list>
</ion-content>
</ion-view>
</script>
<script type="text/ng-template" id="mailbox.html">
<ion-view title="{{mailbox.name}}">
<ion-nav-buttons side="right">
<a class="button button-clear button-positive button-icon icon ion-ios7-plus-empty"><!-- edit --></a>
</ion-nav-buttons>
<ion-content class="has-header">
<ion-list>
<ion-item class="item-input">
<i class="icon ion-search placeholder-icon"><!-- search --></i>
<input type="text"
placeholder="Search"
data-ng-model="search.filter"
data-ng-keyup="doSearch($event)"/>
</ion-item>
</ion-list>
<div class="scroll">
<ion-list class="small">
<ion-item class="item-icon-right" option-buttons="buttons"
collection-repeat="message in mailbox.$messages"
collection-item-height="52"
ui-sref="app.mail.account.mailbox.message({accountId: account.id, mailboxId: mailbox.path, messageId: message.uid})">
<small class="right">{{message.relativedate}}</small>
<h2>{{message.from}}</h2>
<p>{{message.subject}}</p>
<i class="icon ion-ios7-arrow-right"><!-- right arrow icon --></i>
</ion-item>
</ion-list>
</div>
</ion-content>
</ion-view>
</script>
<script type="text/ng-template" id="message.html">
<ion-view title="">
<ion-nav-buttons side="right">
<a class="button button-clear button-positive button-icon icon ion-ios7-plus-empty"><!-- new --></a>
</ion-nav-buttons>
<ion-content class="has-header" padding="10">
<h5>{{message.subject}}</h5>
<small><var:string label:value="From"/> <b><a data-ng-href="mailto:{{message.fromAddresses[0].address}}">{{message.fromAddresses[0].name}}</a></b>
<br/>
<var:string label:value="To"/> <b><a data-ng-href="mailto:{{message.toAddresses[0].address}}">{{message.toAddresses[0].name}}</a></b>
<br />
{{message.date}}</small>
<hr/>
<div data-ng-bind-html="message.$content()"><!-- msg --></div>
</ion-content>
</ion-view>
</script>
</var:component>

View File

@ -101,6 +101,15 @@
Message.$timeout(function() {
angular.extend(_this, data);
_this.id = _this.$absolutePath();
// Build long representation of email addresses
_.each(['from', 'to', 'cc', 'bcc', 'replyTo'], function(type) {
_.each(_this[type + 'Addresses'], function(data, i) {
if (data.name != data.address)
data.full = data.name + ' <' + data.address + '>';
else
data.full = '<' + data.address + '>';
});
});
deferred.resolve(_this.content);
});
}, function(data) {

View File

@ -144,7 +144,6 @@
$scope.setCurrentFolder = function(account, folder) {
$rootScope.currentFolder = folder;
console.debug('setCurrentFolder ' + folder.type + ' ' + account.id + ' ' + encodeUriFilter(folder.path))
$state.go('mail.account.mailbox', { accountId: account.id, mailboxId: encodeUriFilter(folder.path) });
};
@ -156,7 +155,6 @@
}])
.controller('MailboxCtrl', ['$scope', '$rootScope', '$stateParams', 'stateAccount', 'stateMailbox', '$timeout', '$modal', 'sgFocus', 'sgDialog', 'sgAccount', 'sgMailbox', function($scope, $rootScope, $stateParams, stateAccount, stateMailbox, $timeout, $modal, focus, Dialog, Account, Mailbox) {
console.debug('MailboxCtrl ' + stateMailbox.path);
$scope.account = stateAccount;
$scope.mailbox = stateMailbox;
$rootScope.currentFolder = stateMailbox;

View File

@ -0,0 +1,157 @@
/* -*- Mode: javascript; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* JavaScript for SOGo.Mailer (mobile) */
(function() {
'use strict';
angular.module('SOGo.Common', []);
angular.module('SOGo.MailerUI', ['ionic', 'SOGo.Common', 'SOGo.UICommon', 'SOGo.UIMobile'])
.constant('sgSettings', {
baseURL: ApplicationBaseURL
})
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if (window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
// org.apache.cordova.statusbar required
StatusBar.styleDefault();
}
});
})
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: '/app',
abstract: true,
templateUrl: 'menu.html',
controller: 'AppCtrl'
})
.state('app.mail', {
url: '/mail',
views: {
menuContent: {
templateUrl: 'mailboxes.html',
controller: 'MailboxesCtrl',
}
},
resolve: {
stateAccounts: ['$q', 'sgAccount', function($q, Account) {
var accounts = Account.$findAll(mailAccounts);
var promises = [];
// Resolve mailboxes of each account
angular.forEach(accounts, function(account, i) {
var mailboxes = account.$getMailboxes();
promises.push(mailboxes.then(function(objects) {
accounts[i].mailboxes = objects;
return account;
}));
});
return $q.all(promises);
}]
}
})
.state('app.mail.account', {
url: '/:accountId',
abstract: true,
resolve: {
stateAccount: ['$stateParams', 'stateAccounts', function($stateParams, stateAccounts) {
return _.find(stateAccounts, function(account) {
return account.id == $stateParams.accountId;
});
}]
}
})
.state('app.mail.account.mailbox', {
url: '/:mailboxId',
views: {
'menuContent@app': {
templateUrl: 'mailbox.html',
controller: 'MailboxCtrl'
}
},
resolve: {
stateMailbox: ['$stateParams', 'stateAccount', 'decodeUriFilter', function($stateParams, stateAccount, decodeUriFilter) {
var mailboxId = decodeUriFilter($stateParams.mailboxId);
// Recursive find function
var _find = function(mailboxes) {
var mailbox = _.find(mailboxes, function(o) {
return o.path == mailboxId;
});
if (!mailbox) {
angular.forEach(mailboxes, function(o) {
if (!mailbox && o.children && o.children.length > 0) {
mailbox = _find(o.children);
}
});
}
return mailbox;
};
return _find(stateAccount.mailboxes);
}],
stateMessages: ['stateMailbox', function(stateMailbox) {
return stateMailbox.$update();
}]
}
})
.state('app.mail.account.mailbox.message', {
url: "/:messageId",
views: {
'menuContent@app': {
templateUrl: "message.html",
controller: 'MessageCtrl'
}
},
resolve: {
stateMessage: ['$stateParams', 'stateMailbox', 'stateMessages', function($stateParams, stateMailbox, stateMessages) {
var message = _.find(stateMessages, function(messageObject) {
return messageObject.uid == $stateParams.messageId;
});
return message;
}]
}
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/app/mail');
})
.controller('AppCtrl', ['$scope', '$http', function($scope, $http) {
$scope.UserLogin = UserLogin;
$scope.UserFolderURL = UserFolderURL;
$scope.ApplicationBaseURL = ApplicationBaseURL;
}])
.controller('MailboxesCtrl', ['$scope', '$http', '$state', 'sgAccount', 'sgMailbox', 'encodeUriFilter', 'stateAccounts', function($scope, $http, $state, Account, Mailbox, encodeUriFilter, stateAccounts) {
$scope.accounts = stateAccounts
angular.forEach($scope.accounts, function(account, i) {
var mailboxes = account.$getMailboxes();
mailboxes.then(function(objects) {
$scope.accounts[i].mailboxes = objects;
});
});
$scope.setCurrentFolder = function(account, folder) {
$state.go('app.mail.account.mailbox', { accountId: account.id, mailboxId: encodeUriFilter(folder.path) });
};
}])
.controller('MailboxCtrl', ['$scope', 'stateAccount', 'stateMailbox', function($scope, stateAccount, stateMailbox) {
$scope.account = stateAccount;
$scope.mailbox = stateMailbox;
}])
.controller('MessageCtrl', ['$scope', '$stateParams', 'stateMessage', function($scope, $stateParams, stateMessage) {
$scope.message = stateMessage;
}]);
})();

View File

@ -240,6 +240,7 @@ $column-gutter: 0;
h1, h2, h3, h4, h5, h6 {
margin-left: rem-calc(12);
margin-top: 0;
padding-top: rem-calc(12);
}
h1 {
margin-bottom: 0;
@ -247,7 +248,7 @@ $column-gutter: 0;
.header {
background-color: $secondary-color;
padding-bottom: 0.2em;
h1, h6 {
h1, h4, h6 {
color: #fff;
}
.label {

View File

@ -57,11 +57,38 @@ ion-content {
}
}
ion-list {
&.small {
a {
padding-top: $padding-small-vertical !important;
padding-bottom: $padding-small-vertical !important;
}
h2, p {
font-size: $font-size-base;
}
p {
margin: 0 !important;
}
}
}
ion-item {
small {
display: block;
color: $positive !important;
}
.right {
float: right;
}
&[collection-repeat] {
width: 100%;
}
}
$i: 1;
@while $i < 12 {
.item-complex.item-icon-left.childLevel#{$i} { padding-left: 10px * $i; }
$i: $i + 1;
}
/* Additional styles */