Changeset 5496 in subversion

Timestamp:

Nov 27, 2011 10:11:20 AM (18 months ago)

Author:

alec

Message:

• Fix fit_string_to_size() renders browser and ui unresponsive (#1488207): 1) improve its performance by half, 2) don't call it on UI init, it's called after getunread action 3) don't call it for big number of folders (limit is 100 for IE and 500 for others)

Location:

trunk/roundcubemail

Files:

• CHANGELOG (modified) (1 diff)
• skins/default/functions.js (modified) (3 diffs)

trunk/roundcubemail/CHANGELOG

@@ -2 +2 @@
 ===========================
 
+- Fix fit_string_to_size() renders browser and ui unresponsive (#1488207)
 - Fix handling of invalid characters in request (#1488124)
 - Fix merging some configuration options in update.sh script (#1485864)

trunk/roundcubemail/skins/default/functions.js

@@ -571 +571 @@
       rcmail.addEventListener('responseaftercheck-recent', rcube_render_mailboxlist);
       rcmail.addEventListener('aftercollapse-folder', rcube_render_mailboxlist);
-      rcube_render_mailboxlist();
     }
 
@@ -593 +592 @@
 function rcube_render_mailboxlist()
 {
-  if (bw.ie6)  // doesn't work well on IE6
+  var list = $('#mailboxlist > li a, #mailboxlist ul:visible > li a');
+
+  // it's too slow with really big number of folders, especially on IE
+  if (list.length > 500 * (bw.ie ? 0.2 : 1))
     return;
 
-  $('#mailboxlist > li a, #mailboxlist ul:visible > li a').each(function(){
-    var elem = $(this);
-    var text = elem.data('text');
+  list.each(function(){
+    var elem = $(this),
+      text = elem.data('text');
+
     if (!text) {
       text = elem.text().replace(/\s+\(.+$/, '');
@@ -616 +619 @@
 function fit_string_to_size(str, elem, len)
 {
-    var result = str;
-    var ellip = '...';
-    var span = $('<b>').css({ visibility:'hidden', padding:'0px' }).appendTo(elem).get(0);
-
-    // on first run, check if string fits into the length already.
-    span.innerHTML = result;
-    if (span.offsetWidth > len) {
-        var cut = Math.max(1, Math.floor(str.length * ((span.offsetWidth - len) / span.offsetWidth) / 2)),
-          mid = Math.floor(str.length / 2);
-        var offLeft = mid, offRight = mid;
-        while (true) {
-            offLeft = mid - cut;
-            offRight = mid + cut;
-            span.innerHTML = str.substring(0,offLeft) + ellip + str.substring(offRight);
-
-            // break loop if string fits size
-            if (span.offsetWidth <= len || offLeft < 3)
-              break;
-
-            cut++;
-        }
-
-        // build resulting string
-        result = str.substring(0,offLeft) + ellip + str.substring(offRight);
-    }
-    
-    span.parentNode.removeChild(span);
-    return result;
+  var w, span, result = str, ellip = '...';
+
+  if (!rcmail.env.tmp_span) {
+    // it should be appended to elem to use the same css style
+    // but for performance reasons we'll append it to body (once)
+    span = $('<b>').css({visibility: 'hidden', padding: '0px'})
+      .appendTo($('body', document)).get(0);
+    rcmail.env.tmp_span = span;
+  }
+  else {
+    span = rcmail.env.tmp_span;
+  }
+  span.innerHTML = result;
+
+  // on first run, check if string fits into the length already.
+  w = span.offsetWidth;
+  if (w > len) {
+    var cut = Math.max(1, Math.floor(str.length * ((w - len) / w) / 2)),
+      mid = Math.floor(str.length / 2),
+      offLeft = mid,
+      offRight = mid;
+
+    while (true) {
+      offLeft = mid - cut;
+      offRight = mid + cut;
+      span.innerHTML = str.substring(0,offLeft) + ellip + str.substring(offRight);
+
+      // break loop if string fits size
+      if (offLeft < 3 || span.offsetWidth)
+        break;
+
+      cut++;
+    }
+
+    // build resulting string
+    result = str.substring(0,offLeft) + ellip + str.substring(offRight);
+  }
+
+  return result;
 }