Skip to content
This repository was archived by the owner on Nov 8, 2018. It is now read-only.

Commit 34a14ce

Browse files
ChristophWurstChristophWurst
committed
Merge pull request #1411 from owncloud/message-loadingview
Use LoadingView when loading messages
2 parents 793aec9 + 5f2eed8 commit 34a14ce

File tree

9 files changed

+175
-104
lines changed

9 files changed

+175
-104
lines changed

‎js/app.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ define(function(require) {
1818
// Load controllers/services
1919
require('controller/accountcontroller');
2020
require('controller/foldercontroller');
21+
require('controller/messagecontroller');
2122
require('service/accountservice');
2223
require('service/folderservice');
2324
require('notification');

‎js/controller/accountcontroller.js‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ define(function(require) {
1212
'use strict';
1313

1414
var $ = require('jquery');
15+
var FolderController = require('controller/foldercontroller');
1516
var Radio = require('radio');
1617
var UPDATE_INTERVAL = 5 * 60 * 1000; // 5 minutes
1718

@@ -32,14 +33,22 @@ define(function(require) {
3233

3334
function loadAccounts() {
3435
var fetchingAccounts = Radio.account.request('entities');
36+
Radio.ui.trigger('content:loading');
3537

3638
$.when(fetchingAccounts).done(function(accounts) {
3739
if (accounts.length === 0) {
3840
addAccount();
3941
} else {
4042
var firstAccount = accounts.at(0);
41-
accounts.each(function(account) {
42-
Radio.folder.trigger('init', account, firstAccount);
43+
var loadingAccounts = accounts.map(function(account) {
44+
return FolderController.loadFolder(account, firstAccount);
45+
});
46+
$.when.apply($, loadingAccounts).done(function() {
47+
$('#app-navigation').removeClass('icon-loading');
48+
Radio.ui.trigger('messagecontent:show');
49+
50+
// Start fetching messages in background
51+
require('background').messageFetcher.start();
4352
});
4453
}
4554

‎js/controller/foldercontroller.js‎

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,6 @@ define(function(require) {
1616
var Radio = require('radio');
1717
var FolderService = require('service/folderservice');
1818

19-
Radio.folder.on('init', loadFolder);
20-
2119
function urldecode(str) {
2220
return decodeURIComponent((str + '').replace(/\+/g, '%20'));
2321
}
@@ -77,16 +75,10 @@ define(function(require) {
7775
function loadFolder(account, active) {
7876
var fetchingFolders = FolderService.getFolderEntities(account);
7977

80-
// TODO: create loading-view
81-
$('#mail-messages').addClass('icon-loading');
82-
$('#mail-message').addClass('icon-loading');
83-
8478
Radio.ui.trigger('messagesview:messages:reset');
8579
$('#app-navigation').addClass('icon-loading');
8680

8781
$.when(fetchingFolders).done(function(accountFolders) {
88-
$('#app-navigation').removeClass('icon-loading');
89-
9082
if (account === active) {
9183
var folder = accountFolders.at(0);
9284

@@ -99,14 +91,13 @@ define(function(require) {
9991
Radio.folder.trigger('setactive', account, folder);
10092
require('state').currentAccount = account;
10193
require('state').currentFolder = folder;
102-
103-
// Start fetching messages in background
104-
require('background').messageFetcher.start();
10594
}
10695
});
10796
$.when(fetchingFolders).fail(function() {
10897
Radio.ui.trigger('error:show', t('mail', 'Error while loading the selected account.'));
10998
});
99+
100+
return fetchingFolders.promise();
110101
}
111102

112103
return {

‎js/controller/messagecontroller.js‎

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
/**
2+
* @author Christoph Wurst <[email protected]>
3+
*
4+
* ownCloud - Mail
5+
*
6+
* This code is free software: you can redistribute it and/or modify
7+
* it under the terms of the GNU Affero General Public License, version 3,
8+
* as published by the Free Software Foundation.
9+
*
10+
* This program is distributed in the hope that it will be useful,
11+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
12+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
13+
* GNU Affero General Public License for more details.
14+
*
15+
* You should have received a copy of the GNU Affero General Public License, version 3,
16+
* along with this program. If not, see <http://www.gnu.org/licenses/>
17+
*
18+
*/
19+
20+
define(function(require) {
21+
'use strict';
22+
23+
var $ = require('jquery');
24+
var _ = require('underscore');
25+
var Radio = require('radio');
26+
27+
Radio.message.on('load', function(account, folder, messageId, options) {
28+
//FIXME: don't rely on global state vars
29+
load(account, messageId, options);
30+
});
31+
32+
/**
33+
* @param {Account} account
34+
* @param {number} messageId
35+
* @param {object} options
36+
* @returns {undefined}
37+
*/
38+
function load(account, messageId, options) {
39+
options = options || {};
40+
var defaultOptions = {
41+
force: false
42+
};
43+
_.defaults(options, defaultOptions);
44+
45+
// Do not reload email when clicking same again
46+
if (require('state').currentMessageId === messageId) {
47+
return;
48+
}
49+
50+
Radio.ui.trigger('composer:leave');
51+
52+
if (!options.force && require('ui').isComposerVisible()) {
53+
return;
54+
}
55+
// Abort previous loading requests
56+
if (require('state').messageLoading !== null) {
57+
require('state').messageLoading.abort();
58+
}
59+
60+
// check if message is a draft
61+
var draftsFolder = account.get('specialFolders').drafts;
62+
var draft = draftsFolder === require('state').currentFolder.get('id');
63+
64+
// close email first
65+
// Check if message is open
66+
if (require('state').currentMessageId !== null) {
67+
var lastMessageId = require('state').currentMessageId;
68+
Radio.ui.trigger('messagesview:message:setactive', null);
69+
if (lastMessageId === messageId) {
70+
return;
71+
}
72+
}
73+
74+
Radio.ui.trigger('message:loading');
75+
76+
// Set current Message as active
77+
Radio.ui.trigger('messagesview:message:setactive', messageId);
78+
require('state').currentMessageBody = '';
79+
80+
// Fade out the message composer
81+
$('#mail_new_message').prop('disabled', false);
82+
83+
require('communication').fetchMessage(
84+
require('state').currentAccount,
85+
require('state').currentFolder,
86+
messageId,
87+
{
88+
onSuccess: function(message) {
89+
if (draft) {
90+
Radio.ui.trigger('composer:show', message);
91+
} else {
92+
require('cache').addMessage(require('state').currentAccount,
93+
require('state').currentFolder,
94+
message);
95+
Radio.ui.trigger('message:show', message);
96+
}
97+
},
98+
onError: function(jqXHR, textStatus) {
99+
if (textStatus !== 'abort') {
100+
Radio.ui.trigger('error:show', t('mail', 'Error while loading the selected message.'));
101+
}
102+
}
103+
});
104+
}
105+
});

‎js/ui.js‎

Lines changed: 6 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -19,11 +19,6 @@ define(function(require) {
1919
require('views/helper');
2020

2121
Radio.ui.on('folder:show', loadFolder);
22-
Radio.ui.on('message:load', function(account, folder, messageId,
23-
options) {
24-
//FIXME: don't rely on global state vars
25-
loadMessage(account, messageId, options);
26-
});
2722

2823
var composerVisible = false;
2924

@@ -35,7 +30,6 @@ define(function(require) {
3530
*/
3631
function loadFolder(account, folder, noSelect) {
3732
Radio.ui.trigger('composer:leave');
38-
Radio.ui.trigger('messagecontent:show');
3933

4034
if (require('state').messagesLoading !== null) {
4135
require('state').messagesLoading.abort();
@@ -46,29 +40,26 @@ define(function(require) {
4640

4741
// Set folder active
4842
Radio.folder.trigger('setactive', account, folder);
43+
Radio.ui.trigger('content:loading');
4944
Radio.ui.trigger('messagesview:messages:reset');
50-
$('#mail-messages')
51-
.addClass('icon-loading');
5245

5346
$('#load-new-mail-messages').hide();
5447
$('#load-more-mail-messages').hide();
5548

5649
if (noSelect) {
5750
$('#emptycontent').show();
58-
$('#mail-message').removeClass('icon-loading');
5951
require('state').currentAccount = account;
6052
require('state').currentFolder = folder;
6153
Radio.ui.trigger('messagesview:message:setactive', null);
62-
$('#mail-messages').removeClass('icon-loading');
6354
require('state').currentlyLoading = null;
6455
} else {
6556
require('communication').fetchMessageList(account, folder, {
6657
onSuccess: function(messages, cached) {
58+
Radio.ui.trigger('messagecontent:show');
6759
require('state').currentlyLoading = null;
6860
require('state').currentAccount = account;
6961
require('state').currentFolder = folder;
7062
Radio.ui.trigger('messagesview:message:setactive', null);
71-
$('#mail-messages').removeClass('icon-loading');
7263

7364
// Fade out the message composer
7465
$('#mail_new_message').prop('disabled', false);
@@ -83,7 +74,7 @@ define(function(require) {
8374
});
8475

8576
var messageId = messages[0].id;
86-
loadMessage(account, messageId);
77+
Radio.message.trigger('load', account, folder, messageId);
8778
// Show 'Load More' button if there are
8879
// more messages than the pagination limit
8980
if (messages.length > 20) {
@@ -93,7 +84,6 @@ define(function(require) {
9384
}
9485
} else {
9586
$('#emptycontent').show();
96-
$('#mail-message').removeClass('icon-loading');
9787
}
9888
$('#load-new-mail-messages')
9989
.fadeIn()
@@ -204,83 +194,13 @@ define(function(require) {
204194
Radio.ui.trigger('composer:show', data);
205195
}
206196

207-
/**
208-
* @param {Account} account
209-
* @param {number} messageId
210-
* @param {object} options
211-
* @returns {undefined}
212-
*/
213-
function loadMessage(account, messageId, options) {
214-
options = options || {};
215-
var defaultOptions = {
216-
force: false
217-
};
218-
_.defaults(options, defaultOptions);
219-
220-
// Do not reload email when clicking same again
221-
if (require('state').currentMessageId === messageId) {
222-
return;
223-
}
224-
225-
Radio.ui.trigger('composer:leave');
226-
227-
if (!options.force && composerVisible) {
228-
return;
229-
}
230-
// Abort previous loading requests
231-
if (require('state').messageLoading !== null) {
232-
require('state').messageLoading.abort();
233-
}
234-
235-
// check if message is a draft
236-
var draftsFolder = account.get('specialFolders').drafts;
237-
var draft = draftsFolder === require('state').currentFolder.get('id');
238-
239-
// close email first
240-
// Check if message is open
241-
if (require('state').currentMessageId !== null) {
242-
var lastMessageId = require('state').currentMessageId;
243-
Radio.ui.trigger('messagesview:message:setactive', null);
244-
if (lastMessageId === messageId) {
245-
return;
246-
}
247-
}
248-
249-
Radio.ui.trigger('message:loading');
250-
251-
// Set current Message as active
252-
Radio.ui.trigger('messagesview:message:setactive', messageId);
253-
require('state').currentMessageBody = '';
254-
255-
// Fade out the message composer
256-
$('#mail_new_message').prop('disabled', false);
257-
258-
require('communication').fetchMessage(
259-
require('state').currentAccount,
260-
require('state').currentFolder,
261-
messageId,
262-
{
263-
onSuccess: function(message) {
264-
if (draft) {
265-
Radio.ui.trigger('composer:show', message);
266-
} else {
267-
require('cache').addMessage(require('state').currentAccount,
268-
require('state').currentFolder,
269-
message);
270-
Radio.ui.trigger('message:show', message);
271-
}
272-
},
273-
onError: function(jqXHR, textStatus) {
274-
if (textStatus !== 'abort') {
275-
Radio.ui.trigger('error:show', t('mail', 'Error while loading the selected message.'));
276-
}
277-
}
278-
});
197+
function isComposerVisible() {
198+
return composerVisible;
279199
}
280200

281201
return {
282202
saveAttachment: saveAttachment,
283203
openForwardComposer: openForwardComposer,
284-
loadMessage: loadMessage
204+
isComposerVisible: isComposerVisible
285205
};
286206
});

‎js/views/app.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,12 @@ define(function(require) {
1818
var MessageContentView = require('views/messagecontent');
1919
var NavigationAccountsView = require('views/navigation-accounts');
2020
var SettingsView = require('views/settings');
21+
var LoadingView = require('views/loadingview');
2122
var NavigationView = require('views/navigation');
2223
var SetupView = require('views/setup');
2324

2425
var ContentType = Object.freeze({
26+
LOADING: -1,
2527
MESSAGE_CONTENT: 0,
2628
SETUP: 1
2729
});
@@ -44,6 +46,7 @@ define(function(require) {
4446
this.listenTo(Radio.ui, 'error:show', this.showError);
4547
this.listenTo(Radio.ui, 'setup:show', this.showSetup);
4648
this.listenTo(Radio.ui, 'messagecontent:show', this.showMessageContent);
49+
this.listenTo(Radio.ui, 'content:loading', this.showContentLoading);
4750

4851
// Hide notification favicon when switching back from
4952
// another browser tab
@@ -118,7 +121,6 @@ define(function(require) {
118121
OC.Notification.showTemporary(message);
119122
$('#app-navigation').removeClass('icon-loading');
120123
$('#app-content').removeClass('icon-loading');
121-
$('#mail-message').removeClass('icon-loading');
122124
$('#mail_message').removeClass('icon-loading');
123125
},
124126
showSetup: function() {
@@ -141,6 +143,12 @@ define(function(require) {
141143
accountsView.changeUnseen);
142144
this.content.show(messageContentView);
143145
}
146+
},
147+
showContentLoading: function() {
148+
if (this.activeContent !== ContentType.LOADING) {
149+
this.activeContent = ContentType.LOADING;
150+
this.content.show(new LoadingView());
151+
}
144152
}
145153
});
146154

0 commit comments

Comments
 (0)