amorfo77/sogo
1
0
Fork 0
mirror of https://github.com/inverse-inc/sogo.git synced 2026-04-04 21:08:51 +00:00
Code Issues Projects Releases Wiki Activity

Initial popup view for messages

Browse Source
This commit is contained in:
Francis Lachapelle
2015-09-04 17:31:16 -04:00
parent bf02b3046f
commit 2720aebf04
10 changed files with 316 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
UI/Common/UIxPageFrame.m
View File

@@ -249,14 +249,7 @@
- (NSString *) commonLocalizableStrings
{
NSString *rc;
if (isPopup)
rc = @"";
else
rc = [NSString stringWithFormat: @"var clabels = %@;", [self _stringsForFramework: nil]];
return rc;
return [NSString stringWithFormat: @"var clabels = %@;", [self _stringsForFramework: nil]];
}
- (NSString *) productLocalizableStrings

4
UI/MailerUI/product.plist
View File

@@ -351,6 +351,10 @@
// protectedBy = "View";
// pageName = "UIxMailViewTemplate";
// };
UIxMailPopupView = {
protectedBy = "View";
pageName = "UIxMailPopupView";
};
UIxMailEditor = {
protectedBy = "View";
pageName = "UIxMailEditor";

45
UI/Templates/MailerUI/UIxMailPopupView.wox
View File

@@ -1,29 +1,32 @@
<?xml version="1.0" standalone="yes"?>
<var:component xmlns="http://www.w3.org/1999/xhtml"
<!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"
className="UIxPageFrame"
title="title"
const:jsFiles="SOGoAutoCompletion.js"
const:userDefaultsKeys="SOGoMailDisplayRemoteInlineImages"
const:popup="YES">
<script type="text/javascript">
var messageName = '<var:string value="clientObject.relativeImap4Name"/>';
var mailboxName = '/<var:string value="clientObject.container.container.nameInContainer"/>/<var:string value="clientObject.container.nameInContainer"/>';
</script>
<var:component className="UIxMailView" />
<div class="menu" id="addressMenu">
<ul>
<li id="add_to_addressbook"><var:string label:value="Add to Address Book..."/></li>
<li id="compose_mailto"><var:string label:value="Compose Mail To"/></li>
<li id="create_filter"><var:string label:value="Create Filter From Message..."/></li>
</ul>
const:popup="YES"
const:jsFiles="Common.js, Contacts.services.js, Preferences.services.js, Mailer.app.popup.js, Mailer.services.js, vendor/ckeditor/ckeditor.js, vendor/ckeditor/ck.js, vendor/angular-file-upload.min.js">
<main class="layout-fill" ng-controller="navController">
<div id="detailView" class="view-detail" layout="column" layout-align="start center"
ui-view="message">
<div class="sg-progress-circular-floating">
<md-progress-circular class="md-accent ng-cloak"
md-mode="indeterminate"
md-diameter="32"><!-- progress --></md-progress-circular>
</div>
</div>
<div class="menu" id="imageMenu">
<ul>
<li id="save_image"><var:string label:value="Save Image"/></li>
</ul>
</div>
</var:component>
</main>
<script type="text/ng-template" id="UIxMailViewTemplate">
<var:component className="UIxMailViewTemplate" />
</script>
<script type="text/ng-template" id="UIxMailEditor">
<var:component className="UIxMailEditor" />
</script>
</var:component>

26
UI/Templates/MailerUI/UIxMailViewTemplate.wox
View File

@@ -10,11 +10,24 @@
<div layout="column" class="layout-fill">
<md-toolbar>
<div class="md-toolbar-tools">
<md-button class="sg-icon-button"
ng-if="isPopup"
label:aria-label="Close"
ng-click="viewer.closePopup()">
<md-icon>close</md-icon>
</md-button>
<md-button class="sg-icon-button hide show-sm"
ng-hide="isPopup"
label:aria-label="Close"
ng-click="viewer.close()">
<md-icon>arrow_back</md-icon>
</md-button>
<div class="md-flex hide show-sm"><!-- spacer --></div>
<md-button class="sg-icon-button" label:aria-label="flagged" ng-click="viewer.message.toggleFlag()">
<md-icon ng-class="{'icon-star': viewer.message.isflagged,
'icon-star-border': !viewer.message.isflagged}"><!-- flag --></md-icon>
</md-button>
<div class="md-flex"><!-- spacer --></div>
<div class="md-flex hide-sm"><!-- spacer --></div>
<md-button class="sg-icon-button"
ng-hide="viewer.message.isDraft"
ng-click="viewer.reply($event)"
@@ -38,6 +51,12 @@
<md-tooltip md-direction="bottom"><var:string label:value="Delete selected message or folder"/></md-tooltip>
<md-icon>delete</md-icon>
</md-button>
<md-button class="sg-icon-button" label:aria-label="Delete"
ng-hide="isPopup"
ng-click="viewer.openPopup()">
<md-tooltip md-direction="bottom"><var:string label:value="Open in New Mail Window"/></md-tooltip>
<md-icon>open_in_new</md-icon>
</md-button>
<md-menu>
<md-button label:aria-label="More mail options" class="sg-icon-button" ng-click="$mdOpenMenu($event)">
<md-icon>more_vert</md-icon>
@@ -63,11 +82,6 @@
</md-menu-item>
</md-menu-content>
</md-menu>
<md-button class="sg-icon-button hide show-sm"
label:aria-label="Close"
ng-click="viewer.close()">
<md-icon>close</md-icon>
</md-button>
</div>
</md-toolbar>
<md-content class="md-flex md-static">

5
UI/WebServerResources/Gruntfile.js
View File

@@ -6,8 +6,9 @@ module.exports = function(grunt) {
'js/Scheduler.js': ['js/Scheduler/Scheduler.app.js', 'js/Scheduler/*Controller.js', 'js/Scheduler/*.directive.js'],
'js/Contacts.services.js': ['js/Contacts/*.service.js'],
'js/Contacts.js': ['js/Contacts/Contacts.app.js', 'js/Contacts/*Controller.js', 'js/Contacts/*.directive.js'],
'js/Mailer.services.js': ['js/Mailer/*.service.js', 'js/Mailer/*Controller.js'],
'js/Mailer.js': ['js/Mailer/Mailer.app.js', 'js/Mailer/*.directive.js'],
'js/Mailer.services.js': ['js/Mailer/*.service.js', 'js/Mailer/*Controller.js', 'js/Mailer/*.directive.js'],
'js/Mailer.js': ['js/Mailer/Mailer.app.js'],
'js/Mailer.app.popup.js': ['js/Mailer/Mailer.popup.js'],
'js/Preferences.services.js': ['js/Preferences/*.service.js'],
'js/Preferences.js': ['js/Preferences/Preferences.app.js', 'js/Preferences/*Controller.js']
};

3
UI/WebServerResources/js/Common/Common.app.js
View File

@@ -3,8 +3,9 @@
(function() {
'use strict';
angular.module('SOGo.Common', ['ngMaterial'])
angular.module('SOGo.Common', ['ngAnimate', 'ngMaterial'])
.value('sgSettings', {
isPopup: document.body.classList.contains('popup'),
baseURL: function() {
return ApplicationBaseURL || null;
},

1
UI/WebServerResources/js/Common/navController.js
View File

@@ -12,6 +12,7 @@
navController.$inject = ['$scope', '$timeout', '$interval', '$http', '$mdSidenav', '$mdBottomSheet', '$mdMedia', '$log', 'sgConstant', 'sgSettings', 'Alarm'];
function navController($scope, $timeout, $interval, $http, $mdSidenav, $mdBottomSheet, $mdMedia, $log, sgConstant, sgSettings, Alarm) {
$scope.isPopup = sgSettings.isPopup;
$scope.activeUser = sgSettings.activeUser();
$scope.baseURL = sgSettings.baseURL();

215
UI/WebServerResources/js/Mailer/Mailer.popup.js Normal file
View File

@@ -0,0 +1,215 @@
/* -*- Mode: javascript; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* JavaScript for SOGo.MailerUI module */
(function() {
'use strict';
angular.module('SOGo.MailerUI', ['ngSanitize', 'ui.router', 'ck', 'angularFileUpload', 'SOGo.Common', 'SOGo.ContactsUI', 'ngAnimate', 'SOGo.PreferencesUI'])
.config(configure)
.run(runBlock)
.controller('MessageEditorControllerPopup', MessageEditorControllerPopup);
/**
* @ngInject
*/
configure.$inject = ['$stateProvider', '$urlRouterProvider'];
function configure($stateProvider, $urlRouterProvider) {
$stateProvider
.state('mail', {
url: '/Mail',
abstract: true,
views: {
message: {
template: '<ui-view/>'
}
},
resolve: {
stateAccounts: stateAccounts
}
})
.state('mail.account', {
url: '/:accountId',
abstract: true,
template: '<ui-view id="account"/>',
resolve: {
stateAccount: stateAccount
}
})
.state('mail.account.mailbox', {
url: '/:mailboxId',
abstract: true,
template: '<ui-view id="mailbox"/>',
resolve: {
stateMailbox: stateMailbox
}
})
.state('mail.account.mailbox.newMessage', {
url: '/new',
views: {
'message@': {
template: '<ui-view/>',
controller: 'MessageEditorControllerPopup'
}
},
resolve: {
stateMessage: stateNewMessage
}
})
.state('mail.account.mailbox.message', {
url: '/:messageId',
views: {
'message@': {
templateUrl: 'UIxMailViewTemplate', // UI/Templates/MailerUI/UIxMailViewTemplate.wox
controller: 'MessageController',
controllerAs: 'viewer'
}
},
resolve: {
stateMessage: stateMessage
}
})
.state('mail.account.mailbox.message.edit', {
url: '/edit',
views: {
'message@': {
templateUrl: 'UIxMailEditor', // UI/Templates/MailerUI/UIxMailEditor.wox
controller: 'MessageEditorController',
controllerAs: 'editor'
}
},
resolve: {
stateContent: stateContent
}
})
.state('mail.account.mailbox.message.action', {
url: '/{actionName:(?:reply|replyall|forward)}',
views: {
message: {
templateUrl: 'UIxMailEditor', // UI/Templates/MailerUI/UIxMailEditor.wox
controller: 'MessageEditorController',
controllerAs: 'editor'
}
}
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/Mail/0/folderINBOX/new');
}
/**
* @ngInject
*/
stateAccounts.$inject = ['$q', 'Account'];
function stateAccounts($q, Account) {
var promise = Account.$findAll();
// Fetch list of mailboxes for each account
return promise.then(function(accounts) {
var promises = [];
angular.forEach(accounts, function(account, i) {
var mailboxes = account.$getMailboxes();
promises.push(mailboxes.then(function(objects) {
return account;
}));
});
return $q.all(promises);
});
}
/**
* @ngInject
*/
stateAccount.$inject = ['$stateParams', 'stateAccounts'];
function stateAccount($stateParams, stateAccounts) {
return _.find(stateAccounts, function(account) {
return account.id == $stateParams.accountId;
});
}
/**
* @ngInject
*/
stateMailbox.$inject = ['$stateParams', 'stateAccount', 'decodeUriFilter'];
function stateMailbox($stateParams, stateAccount, decodeUriFilter) {
var mailboxId = decodeUriFilter($stateParams.mailboxId),
_find;
// Recursive find function
_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);
}
/**
* @ngInject
*/
stateNewMessage.$inject = ['stateAccount'];
function stateNewMessage(stateAccount) {
return stateAccount.$newMessage();
}
/**
* @ngInject
*/
stateMessage.$inject = ['encodeUriFilter', '$stateParams', '$state', 'stateMailbox', 'Message'];
function stateMessage(encodeUriFilter, $stateParams, $state, stateMailbox, Message) {
var data = { uid: $stateParams.messageId.toString() },
message = new Message(stateMailbox.$account.id, stateMailbox, data);
return message.$reload();
}
/**
* @ngInject
*/
stateContent.$inject = ['stateMessage'];
function stateContent(stateMessage) {
return stateMessage.$editableContent();
}
/**
* @ngInject
*/
runBlock.$inject = ['$rootScope'];
function runBlock($rootScope) {
$rootScope.$on('$routeChangeError', function(event, current, previous, rejection) {
console.error(event, current, previous, rejection);
});
}
/**
* @ngInject
*/
MessageEditorControllerPopup.$inject = ['$window', '$mdDialog', 'stateAccounts', 'stateMessage'];
function MessageEditorControllerPopup($window, $mdDialog, stateAccounts, stateMessage) {
$mdDialog
.show({
hasBackdrop: false,
disableParentScroll: false,
clickOutsideToClose: false,
escapeToClose: false,
templateUrl: 'UIxMailEditor',
controller: 'MessageEditorController',
controllerAs: 'editor',
locals: {
stateAccounts: stateAccounts,
stateMessage: stateMessage,
stateRecipients: []
}
})
.finally(function() {
if ($window.opener)
$window.close();
});
}
})();

35
UI/WebServerResources/js/Mailer/MessageController.js
View File

@@ -6,9 +6,9 @@
/**
* @ngInject
*/
MessageController.$inject = ['$scope', '$state', '$mdDialog', 'stateAccounts', 'stateAccount', 'stateMailbox', 'stateMessage', 'encodeUriFilter', 'sgFocus', 'Dialog', 'Account', 'Mailbox', 'Message'];
function MessageController($scope, $state, $mdDialog, stateAccounts, stateAccount, stateMailbox, stateMessage, encodeUriFilter, focus, Dialog, Account, Mailbox, Message) {
var vm = this, messageDialog = null;
MessageController.$inject = ['$window', '$scope', '$state', '$mdDialog', 'stateAccounts', 'stateAccount', 'stateMailbox', 'stateMessage', 'encodeUriFilter', 'sgSettings', 'sgFocus', 'Dialog', 'Account', 'Mailbox', 'Message'];
function MessageController($window, $scope, $state, $mdDialog, stateAccounts, stateAccount, stateMailbox, stateMessage, encodeUriFilter, sgSettings, focus, Dialog, Account, Mailbox, Message) {
var vm = this, messageDialog = null, popupWindow = null;
vm.accounts = stateAccounts;
vm.account = stateAccount;
@@ -22,6 +22,8 @@
vm.replyAll = replyAll;
vm.forward = forward;
vm.edit = edit;
vm.openPopup = openPopup;
vm.closePopup = closePopup;
vm.newMessage = newMessage;
vm.saveMessage = saveMessage;
vm.viewRawSource = viewRawSource;
@@ -103,6 +105,33 @@
});
}
function openPopup() {
var url = [sgSettings.baseURL(),
'UIxMailPopupView#/Mail',
vm.message.accountId,
// The double-encoding is necessary
encodeUriFilter(encodeUriFilter(vm.message.$mailbox.path)),
vm.message.uid]
.join('/'),
wId = vm.message.$absolutePath();
popupWindow = $window.open(url, wId,
["width=680",
"height=520",
"resizable=1",
"scrollbars=1",
"toolbar=0",
"location=0",
"directories=0",
"status=0",
"menubar=0",
"copyhistory=0"]
.join(','));
}
function closePopup() {
$window.close();
}
function newMessage($event, recipient) {
var message = vm.account.$newMessage();
showMailEditor($event, message, [recipient]);

14
UI/WebServerResources/scss/views/_view.scss
View File

@@ -11,6 +11,20 @@
max-height: 100%;
}
body.popup {
.viewer {
width: 100%;
}
.view-detail {
max-width: 100%;
}
@include from(md) {
[class|="view"] {
position: static;
}
}
}
// We make intensive use of the list/detail view pattern, here are some base
// definitions for this
// ----------------------------------------------------------------------------