diff --git a/css/mail.css b/css/mail.css
index afa90f6c51..138725537a 100755
--- a/css/mail.css
+++ b/css/mail.css
@@ -115,11 +115,6 @@
display: none;
}
-#app-navigation .special-inbox,
-#app-navigation .special-all {
- display: block;
-}
-
/* do not overlap collapse icon with special use icon */
#app-navigation .special-inbox .collapse,
@@ -148,11 +143,6 @@
z-index: 1;
}
-#app-navigation-accounts {
- height: calc(100% - 65px);
- overflow-x: hidden;
-}
-
#app-navigation ul ul {
display: block;
}
@@ -161,14 +151,6 @@
display: none;
}
-#app-navigation .navigation-account {
- position: relative;
-}
-#app-navigation .navigation-account .app-navigation-entry-utils-menu-button {
- /* show the account menu toggle (three dots) by default */
- display: inline-block;
-}
-
#app-navigation ul ul li > a {
padding-left: 32px;
}
@@ -219,13 +201,12 @@
}
.mail-account-color {
- display: inline-block;
+ position: absolute;
width: 14px;
height: 14px;
border-radius: 50%;
- position: relative;
left: 15px;
- top: -12px;
+ top: 15px;
}
/* color dot position fix for Safari */
@media not all and (min-resolution:.001dpcm) { @media
diff --git a/js/templates/account.html b/js/templates/account.html
index 4c592cc6ed..be2b1b7447 100644
--- a/js/templates/account.html
+++ b/js/templates/account.html
@@ -1,34 +1,41 @@
-{{#if emailAddress}}
-
-{{/if}}
-{{emailAddress}}
-
-{{#if hasMenu}}
-
+{{#unless isUnifiedInbox}}
+
+{{/unless}}
-
+
{{#unless isUnifiedInbox}}
{{#if hasFolders}}
-{{toggleCollapseMessage}}
+{{toggleCollapseMessage}}
{{/if}}
{{/unless}}
diff --git a/js/templates/folder.html b/js/templates/folder.html
index 2c0cd9df16..27a537e19e 100644
--- a/js/templates/folder.html
+++ b/js/templates/folder.html
@@ -6,8 +6,10 @@
{{#if noSelect}} no-select {{/if}}"
href="{{#if noSelect}}#{{else}}{{url}}{{/if}}">
{{name}}
- {{#if count}}
- {{count}}
- {{/if}}
+
\ No newline at end of file
diff --git a/js/views/accountview.js b/js/views/accountview.js
index d7bb000c0b..692c70ce23 100644
--- a/js/views/accountview.js
+++ b/js/views/accountview.js
@@ -18,7 +18,9 @@ define(function(require) {
var AccountTemplate = require('templates/account.html');
return Marionette.View.extend({
+
template: AccountTemplate,
+
templateContext: function() {
var toggleCollapseMessage = this.collapsed ? t('mail', 'Show all folders') : t('mail', 'Collapse folders');
return {
@@ -26,9 +28,10 @@ define(function(require) {
toggleCollapseMessage: toggleCollapseMessage,
hasMenu: this.model.get('accountId') !== -1,
hasFolders: this.model.folders.length > 0,
- isDeletable: this.model.get('accountId') !== -2,
+ isDeletable: this.model.get('accountId') !== -2
};
},
+
events: {
'click .account-toggle-collapse': 'toggleCollapse',
'click .app-navigation-entry-utils-menu-button button': 'toggleMenu',
@@ -36,33 +39,67 @@ define(function(require) {
'click @ui.settingsButton': 'showAccountSettings',
'click @ui.email': 'onClick'
},
+
regions: {
- folders: '.folders'
+ folders: {
+ el: '.folders',
+ replaceElement: true
+ }
},
+
ui: {
email: '.mail-account-email',
menu: '.app-navigation-entry-menu',
settingsButton: '.action-settings',
deleteButton: '.action-delete'
},
+
+ /** @type {string} */
className: 'navigation-account',
+
+ /** @type {bool} */
menuShown: false,
+
+ /** @type {bool} */
collapsed: true,
+
+ /**
+ * @param {array} options
+ * @returns {undefined}
+ */
initialize: function(options) {
this.model = options.model;
},
+
+ /**
+ * @returns {undefined}
+ */
toggleCollapse: function() {
this.collapsed = !this.collapsed;
this.render();
},
+
+ /**
+ * @param {Event} e
+ * @returns {undefined}
+ */
toggleMenu: function(e) {
e.preventDefault();
this.menuShown = !this.menuShown;
this.toggleMenuClass();
},
+
+ /**
+ * @returns {undefined}
+ */
toggleMenuClass: function() {
this.getUI('menu').toggleClass('open', this.menuShown);
},
+
+ /**
+ * @param {Event} e
+ * @returns {undefined}
+ */
onDelete: function(e) {
e.stopPropagation();
@@ -78,6 +115,11 @@ define(function(require) {
OC.Notification.show(t('mail', 'Error while deleting account.'));
});
},
+
+ /**
+ * @param {Event} e
+ * @returns {undefined}
+ */
onClick: function(e) {
e.preventDefault();
if (this.model.folders.length > 0) {
@@ -86,6 +128,10 @@ define(function(require) {
Radio.navigation.trigger('folder', accountId, folderId);
}
},
+
+ /**
+ * @returns {undefined}
+ */
onRender: function() {
this.listenTo(Radio.ui, 'document:click', function(event) {
var target = $(event.target);
@@ -101,10 +147,16 @@ define(function(require) {
collapsed: this.collapsed
}));
},
+
+ /**
+ * @param {Event} e
+ * @returns {undefined}
+ */
showAccountSettings: function(e) {
this.toggleMenu(e);
Radio.navigation.trigger('accountsettings', this.model.get('accountId'));
}
+
});
});
diff --git a/js/views/folderlistview.js b/js/views/folderlistview.js
index 71d60252f9..fdb48d4615 100644
--- a/js/views/folderlistview.js
+++ b/js/views/folderlistview.js
@@ -22,12 +22,17 @@ define(function(require) {
]);
var FolderListView = Marionette.CollectionView.extend({
- tagName: 'ul',
+
childView: FolderView,
+
+ className: 'folders',
+
collapsed: true,
+
initialize: function(options) {
this.collapsed = options.collapsed;
},
+
filter: function(child) {
if (!this.collapsed) {
return true;
diff --git a/js/views/folderview.js b/js/views/folderview.js
index 3704b54f21..d3929d31fd 100644
--- a/js/views/folderview.js
+++ b/js/views/folderview.js
@@ -22,7 +22,9 @@ define(function(require) {
tagName: 'li',
updateElClasses: function() {
- var classes = [];
+ var classes = [
+ 'with-counter'
+ ];
if (this.model.get('unseen')) {
classes.push('unseen');
}
diff --git a/js/views/navigation-accounts.js b/js/views/navigation-accounts.js
index 916034c29e..ec86329145 100644
--- a/js/views/navigation-accounts.js
+++ b/js/views/navigation-accounts.js
@@ -5,7 +5,7 @@
* later. See the COPYING file.
*
* @author Christoph Wurst
- * @copyright Christoph Wurst 2015
+ * @copyright Christoph Wurst
*/
define(function(require) {
@@ -21,8 +21,19 @@ define(function(require) {
* @class NavigationAccountsView
*/
return Marionette.CollectionView.extend({
+
+ tagName: 'ul',
+
+ id: 'app-navigation-accounts',
+
+ className: 'with-icon',
+
+ /** @type {AccountCollection} */
collection: null,
+
+ /** @type {AccountView} */
childView: AccountView,
+
/**
* @returns {undefined}
*/
@@ -30,6 +41,7 @@ define(function(require) {
this.listenTo(Radio.ui, 'folder:changed', this.onFolderChanged);
this.listenTo(Radio.folder, 'setactive', this.setFolderActive);
},
+
/**
* @param {Account} account
* @param {Folder} folder
@@ -53,6 +65,7 @@ define(function(require) {
folder.set('active', true);
}
},
+
/**
* @returns {undefined}
*/
diff --git a/js/views/navigation.js b/js/views/navigation.js
index 7e7bc3dffa..3d2f96ea15 100644
--- a/js/views/navigation.js
+++ b/js/views/navigation.js
@@ -17,12 +17,18 @@ define(function(require) {
var NewMessageView = require('views/newmessage');
return Marionette.View.extend({
+
el: '#app-navigation',
+
regions: {
newMessage: '#mail-new-message-fixed',
- accounts: '#app-navigation-accounts',
+ accounts: {
+ el: '#app-navigation-accounts',
+ replaceElement: true
+ },
settings: '#app-settings-content'
},
+
initialize: function() {
this.bindUIElements();
@@ -30,13 +36,16 @@ define(function(require) {
this.listenTo(Radio.ui, 'navigation:hide', this.hide);
this.listenTo(Radio.ui, 'navigation:newmessage:show', this.onShowNewMessage);
},
+
render: function() {
// This view doesn't need rendering
},
+
show: function() {
this.$el.show();
$('#app-navigation-toggle').css('background-image', '');
},
+
hide: function() {
// TODO: move if or rename function
if (require('state').accounts.length === 0) {
@@ -44,6 +53,7 @@ define(function(require) {
$('#app-navigation-toggle').css('background-image', 'none');
}
},
+
onShowNewMessage: function() {
this.showChildView('newMessage', new NewMessageView({
accounts: this.options.accounts
diff --git a/package.json b/package.json
index b5065c9343..43359b626a 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
"autosize": "^4.0.0",
"backbone": "^1.3.3",
"backbone.babysitter": "^0.1.12",
- "backbone.marionette": "^3.0.0",
+ "backbone.marionette": "^3.4.0",
"backbone.radio": "^2.0.0",
"backbone.wreqr": "^1.3.7",
"davclient.js": "0.1.0",
diff --git a/templates/index.php b/templates/index.php
index 12ab64af2b..0e78e12367 100644
--- a/templates/index.php
+++ b/templates/index.php
@@ -39,7 +39,7 @@