From c4b819e9b9792c8819ef60136aa4945884f4f84d Mon Sep 17 00:00:00 2001
From: alecpl <alec@alec.pl>
Date: Tue, 21 Apr 2009 05:04:49 -0400
Subject: [PATCH] - Speed up message list displaying on IE (initialize list in background) - use DOM methods instead of jQuery for messages list object
---
program/js/list.js | 33 ++++++++++++----
CHANGELOG | 1
program/steps/mail/func.inc | 22 ++++++++--
program/js/app.js | 63 +++++++++++++++++++------------
4 files changed, 81 insertions(+), 38 deletions(-)
diff --git a/CHANGELOG b/CHANGELOG
index 3e0fce8..798c332 100644
--- a/CHANGELOG
+++ b/CHANGELOG
@@ -1,6 +1,7 @@
CHANGELOG RoundCube Webmail
===========================
+- Speed up message list displaying on IE
- Fix read/write database recognition (#1485811)
- Fix quicksearchbox look in Chrome and Konqueror (#1484841)
- Fix UTF-8 byte-order mark removing (#1485514)
diff --git a/program/js/app.js b/program/js/app.js
index bd14d8a..24e871a 100644
--- a/program/js/app.js
+++ b/program/js/app.js
@@ -418,7 +418,7 @@
}
// set eventhandler to message icon
- if ((row.icon = row.obj.cells[0].childNodes[0]) && row.icon.nodeName=='IMG')
+ if (row.icon = row.obj.getElementsByTagName('TD')[0].getElementsByTagName('IMG')[0])
{
var p = this;
row.icon.id = 'msgicn_'+row.uid;
@@ -431,12 +431,11 @@
{
var found;
if((found = find_in_array('flag', this.env.coltypes)) >= 0)
- this.set_env('flagged_col', found+1);
+ this.set_env('flagged_col', found+1);
}
// set eventhandler to flag icon, if icon found
- if (this.env.flagged_col && (row.flagged_icon = row.obj.cells[this.env.flagged_col].childNodes[0])
- && row.flagged_icon.nodeName=='IMG')
+ if (this.env.flagged_col && (row.flagged_icon = row.obj.getElementsByTagName('TD')[this.env.flagged_col].getElementsByTagName('IMG')[0]))
{
var p = this;
row.flagged_icon.id = 'flaggedicn_'+row.uid;
@@ -3512,7 +3511,11 @@
if (!this.gui_objects.messagelist || !this.message_list)
return false;
- var tbody = this.gui_objects.messagelist.tBodies[0];
+ if (this.message_list.background)
+ var tbody = this.message_list.background;
+ else
+ var tbody = this.gui_objects.messagelist.tBodies[0];
+
var rowcount = tbody.rows.length;
var even = rowcount%2;
@@ -3528,13 +3531,14 @@
+ (even ? ' even' : ' odd')
+ (flags.unread ? ' unread' : '')
+ (flags.deleted ? ' deleted' : '')
- + (flags.flagged ? ' flagged' : '');
+ + (flags.flagged ? ' flagged' : '')
+ + (this.message_list.in_selection(uid) ? ' selected' : '');
- var row = $('<tr>').attr('id', 'rcmrow'+uid).attr('class', css_class);
-
- if (this.message_list.in_selection(uid))
- row.addClass('selected');
-
+ // for performance use DOM instead of jQuery here
+ var row = document.createElement('TR');
+ row.id = 'rcmrow'+uid;
+ row.className = css_class;
+
var icon = this.env.messageicon;
if (flags.deleted && this.env.deletedicon)
icon = this.env.deletedicon;
@@ -3551,25 +3555,29 @@
icon = this.env.unreadicon;
// add icon col
- $('<td>').addClass('icon').html(icon ? '<img src="'+icon+'" alt="" />' : '').appendTo(row);
-
+ var col = document.createElement('TD');
+ col.className = 'icon';
+ col.innerHTML = icon ? '<img src="'+icon+'" alt="" />' : '';
+ row.appendChild(col);
+
// add each submitted col
for (var n = 0; n < this.coltypes.length; n++) {
var c = this.coltypes[n];
- col = $('<td>').addClass(String(c).toLowerCase());
-
+ col = document.createElement('TD');
+ col.className = String(c).toLowerCase();
+
if (c=='flag') {
if (flags.flagged && this.env.flaggedicon)
- col.html('<img src="'+this.env.flaggedicon+'" alt="" />');
+ col.innerHTML = '<img src="'+this.env.flaggedicon+'" alt="" />';
else if(!flags.flagged && this.env.unflaggedicon)
- col.html('<img src="'+this.env.unflaggedicon+'" alt="" />');
- }
+ col.innerHTML = '<img src="'+this.env.unflaggedicon+'" alt="" />';
+ }
else if (c=='attachment')
- col.html(attachment && this.env.attachmenticon ? '<img src="'+this.env.attachmenticon+'" alt="" />' : ' ');
+ col.innerHTML = (attachment && this.env.attachmenticon ? '<img src="'+this.env.attachmenticon+'" alt="" />' : ' ');
else
- col.html(cols[c]);
+ col.innerHTML = cols[c];
- col.appendTo(row);
+ row.appendChild(col);
}
this.message_list.insert_row(row, attop);
@@ -3579,8 +3587,15 @@
var uid = this.message_list.get_last_row();
this.message_list.remove_row(uid);
this.message_list.clear_selection(uid);
- }
- };
+ }
+ };
+
+ // messages list handling in background (for performance)
+ this.offline_message_list = function(flag)
+ {
+ if (this.message_list)
+ this.message_list.set_background_mode(flag);
+ };
// replace content of row count display
this.set_rowcount = function(text)
@@ -3848,7 +3863,7 @@
console.log(response.exec);
eval(response.exec);
}
-
+
// process the response data according to the sent action
switch (response.action) {
case 'delete':
diff --git a/program/js/list.js b/program/js/list.js
index dabcecb..5f017df 100644
--- a/program/js/list.js
+++ b/program/js/list.js
@@ -98,7 +98,7 @@
/**
- *
+ * Init list row and set mouse events on it
*/
init_row: function(row)
{
@@ -123,7 +123,7 @@
/**
- *
+ * Remove all list rows
*/
clear: function(sel)
{
@@ -154,20 +154,21 @@
/**
- *
+ * Add row to the list and initialize it
*/
insert_row: function(row, attop)
{
- var tbody = this.list.tBodies[0];
- if (!row.jquery)
- row = $(row);
+ if (this.background)
+ var tbody = this.background;
+ else
+ var tbody = this.list.tBodies[0];
if (attop && tbody.rows.length)
- row.prependTo(tbody)
+ tbody.insertBefore(row, tbody.firstChild);
else
- row.appendTo(tbody);
+ tbody.appendChild(row);
- this.init_row(row[0]);
+ this.init_row(row);
this.rowcount++;
},
@@ -828,6 +829,20 @@
}
return rcube_event.cancel(e);
+},
+
+
+/**
+ * Creating the list in background
+ */
+set_background_mode: function(flag)
+{
+ if (flag) {
+ this.background = document.createElement('TBODY');
+ } else if (this.background) {
+ this.list.replaceChild(this.background, this.list.tBodies[0]);
+ this.background = null;
+ }
}
};
diff --git a/program/steps/mail/func.inc b/program/steps/mail/func.inc
index 28ae70c..d8fc3ab 100644
--- a/program/steps/mail/func.inc
+++ b/program/steps/mail/func.inc
@@ -391,7 +391,11 @@
&& (($f = array_search('from', $a_show_cols)) !== false) && array_search('to', $a_show_cols) === false)
$a_show_cols[$f] = 'to';
+ $browser = new rcube_browser;
+
$OUTPUT->command('set_message_coltypes', $a_show_cols);
+ if ($browser->ie)
+ $OUTPUT->command('offline_message_list', true);
// loop through message headers
foreach ($a_headers as $n => $header)
@@ -433,11 +437,16 @@
$a_msg_cols[$col] = $cont;
}
- $a_msg_flags['deleted'] = $header->deleted ? 1 : 0;
- $a_msg_flags['unread'] = $header->seen ? 0 : 1;
- $a_msg_flags['replied'] = $header->answered ? 1 : 0;
- $a_msg_flags['forwarded'] = $header->forwarded ? 1 : 0;
- $a_msg_flags['flagged'] = $header->flagged ? 1 : 0;
+ if ($header->deleted)
+ $a_msg_flags['deleted'] = 1;
+ if (!$header->seen)
+ $a_msg_flags['unread'] = 1;
+ if ($header->answered)
+ $a_msg_flags['replied'] = 1;
+ if ($header->forwarded)
+ $a_msg_flags['forwarded'] = 1;
+ if ($header->flagged)
+ $a_msg_flags['flagged'] = 1;
$OUTPUT->command('add_message_row',
$header->uid,
@@ -446,6 +455,9 @@
preg_match("/multipart\/m/i", $header->ctype),
$insert_top);
}
+
+ if ($browser->ie)
+ $OUTPUT->command('offline_message_list', false);
}
--
Gitblit v1.9.1