Better fix for IE9 issue with document.activeElement error (#1489008)

Aleksander Machniak

2013-03-22 ad5cefeefc2dec285f9f9bb177e5bd190d0e6996

 program/js/list.js

@@ -3,8 +3,11 @@
 | Roundcube List Widget                                                 |
 |                                                                       |
 | This file is part of the Roundcube Webmail client                     |
 | Copyright (C) 2006-2009, Roundcube Dev, - Switzerland                 |
 | Licensed under the GNU GPL                                            |
 | Copyright (C) 2006-2009, The Roundcube Dev Team                       |
 |                                                                       |
 | Licensed under the GNU General Public License version 3 or            |
 | any later version with exceptions for skins & plugins.                |
 | See the README file for a full license statement.                     |
 |                                                                       |
 +-----------------------------------------------------------------------+
 | Authors: Thomas Bruederli <roundcube@gmail.com>                       |
@@ -12,8 +15,6 @@
 +-----------------------------------------------------------------------+
 | Requires: common.js                                                   |
 +-----------------------------------------------------------------------+

  $Id$
*/


@@ -36,7 +37,7 @@
  this.colcount = 0;

  this.subject_col = -1;
  this.shiftkey = false;
  this.modkey = 0;
  this.multiselect = false;
  this.multiexpand = false;
  this.multi_selecting = false;
@@ -58,7 +59,7 @@
  this.row_init = function(){};

  // overwrite default paramaters
  if (p && typeof(p) == 'object')
  if (p && typeof p === 'object')
    for (var n in p)
      this[n] = p[n];
};
@@ -87,10 +88,8 @@
    this.frame = this.list.parentNode;

    // set body events
    if (this.keyboard) {
      rcube_event.add_listener({event:bw.opera?'keypress':'keydown', object:this, method:'key_press'});
      rcube_event.add_listener({event:'keydown', object:this, method:'key_down'});
    }
    if (this.keyboard)
      rcube_event.add_listener({event:'keydown', object:this, method:'key_press'});
  }
},

@@ -101,17 +100,17 @@
init_row: function(row)
{
  // make references in internal array and set event handlers
  if (row && String(row.id).match(/rcmrow([a-z0-9\-_=\+\/]+)/i)) {
    var self = this;
    var uid = RegExp.$1;
  if (row && String(row.id).match(/^rcmrow([a-z0-9\-_=\+\/]+)/i)) {
    var self = this,
      uid = RegExp.$1;
    row.uid = uid;
    this.rows[uid] = {uid:uid, id:row.id, obj:row};

    // set eventhandlers to table row
    row.onmousedown = function(e){ return self.drag_row(e, this.uid); };
    row.onmouseup = function(e){ return self.click_row(e, this.uid); };
    
    if (bw.iphone || bw.ipad) {

    if (bw.mobile) {
      row.addEventListener('touchstart', function(e) {
        if (e.touches.length == 1) {
          if (!self.drag_row(rcube_event.touchevent(e.touches[0]), this.uid))
@@ -170,6 +169,10 @@

  if (sel)
    this.clear_selection();

  // reset scroll position (in Opera)
  if (this.frame)
    this.frame.scrollTop = 0;
},


@@ -178,8 +181,12 @@
 */
remove_row: function(uid, sel_next)
{
  if (this.rows[uid].obj)
    this.rows[uid].obj.style.display = 'none';
  var obj = this.rows[uid] ? this.rows[uid].obj : null;

  if (!obj)
    return;

  obj.style.display = 'none';

  if (sel_next)
    this.select_next();
@@ -212,18 +219,19 @@
 */
focus: function(e)
{
  var id;
  var n, id;
  this.focused = true;

  for (var n in this.selection) {
  for (n in this.selection) {
    id = this.selection[n];
    if (this.rows[id] && this.rows[id].obj) {
      $(this.rows[id].obj).addClass('selected').removeClass('unfocused');
    }
  }

  // Un-focus already focused elements
  $('*:focus', window).blur();
  // Un-focus already focused elements (#1487123, #1487316, #1488600, #1488620)
  $(':focus:not(body)').blur();
  $('iframe').each(function() { this.blur(); });

  if (e || (e = window.event))
    rcube_event.cancel(e);
@@ -235,12 +243,12 @@
 */
blur: function()
{
  var id;
  var n, id;
  this.focused = false;
  for (var n in this.selection) {
  for (n in this.selection) {
    id = this.selection[n];
    if (this.rows[id] && this.rows[id].obj) {
      $(this.rows[id].obj).removeClass('selected').addClass('unfocused');
      $(this.rows[id].obj).removeClass('selected focused').addClass('unfocused');
    }
  }
},
@@ -303,7 +311,7 @@
    this.drag_mouse_start = rcube_event.get_mouse_pos(e);
    rcube_event.add_listener({event:'mousemove', object:this, method:'drag_mouse_move'});
    rcube_event.add_listener({event:'mouseup', object:this, method:'drag_mouse_up'});
    if (bw.iphone || bw.ipad) {
    if (bw.mobile) {
      rcube_event.add_listener({event:'touchmove', object:this, method:'drag_mouse_move'});
      rcube_event.add_listener({event:'touchend', object:this, method:'drag_mouse_up'});
    }
@@ -345,8 +353,10 @@
  this.in_selection_before = false;

  // row was double clicked
  if (this.rows && dblclicked && this.in_selection(id))
  if (this.rows && dblclicked && this.in_selection(id)) {
    this.triggerEvent('dblclick');
    now = 0;
  }
  else
    this.triggerEvent('click');

@@ -405,7 +415,7 @@
collapse: function(row)
{
  row.expanded = false;
  this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded });
  this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded, obj:row.obj });
  var depth = row.depth;
  var new_row = row ? row.obj.nextSibling : null;
  var r;
@@ -418,7 +428,7 @@
      $(new_row).css('display', 'none');
      if (r.expanded) {
        r.expanded = false;
        this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded });
        this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded, obj:new_row });
      }
    }
    new_row = new_row.nextSibling;
@@ -429,15 +439,14 @@

expand: function(row)
{
  var depth, new_row;
  var last_expanded_parent_depth;
  var r, p, depth, new_row, last_expanded_parent_depth;

  if (row) {
    row.expanded = true;
    depth = row.depth;
    new_row = row.obj.nextSibling;
    this.update_expando(row.uid, true);
    this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded });
    this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded, obj:row.obj });
  }
  else {
    var tbody = this.list.tBodies[0];
@@ -448,19 +457,19 @@

  while (new_row) {
    if (new_row.nodeType == 1) {
      var r = this.rows[new_row.uid];
      r = this.rows[new_row.uid];
      if (r) {
        if (row && (!r.depth || r.depth <= depth))
          break;

        if (r.parent_uid) {
          var p = this.rows[r.parent_uid];
          p = this.rows[r.parent_uid];
          if (p && p.expanded) {
            if ((row && p == row) || last_expanded_parent_depth >= p.depth - 1) {
              last_expanded_parent_depth = p.depth;
              $(new_row).css('display', '');
              r.expanded = true;
              this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded });
              this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded, obj:new_row });
            }
          }
          else
@@ -485,7 +494,7 @@
    depth = row.depth;
    new_row = row.obj.nextSibling;
    this.update_expando(row.uid);
    this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded });
    this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded, obj:row.obj });

    // don't collapse sub-root tree in multiexpand mode 
    if (depth && this.multiexpand)
@@ -507,7 +516,7 @@
        if (r.has_children && r.expanded) {
          r.expanded = false;
          this.update_expando(r.uid, false);
          this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded });
          this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded, obj:new_row });
        }
      }
    }
@@ -516,6 +525,7 @@

  return false;
},


expand_all: function(row)
{
@@ -526,7 +536,7 @@
    depth = row.depth;
    new_row = row.obj.nextSibling;
    this.update_expando(row.uid, true);
    this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded });
    this.triggerEvent('expandcollapse', { uid:row.uid, expanded:row.expanded, obj:row.obj });
  }
  else {
    new_row = this.list.tBodies[0].firstChild;
@@ -543,7 +553,7 @@
        if (r.has_children && !r.expanded) {
          r.expanded = true;
          this.update_expando(r.uid, true);
          this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded });
          this.triggerEvent('expandcollapse', { uid:r.uid, expanded:r.expanded, obj:new_row });
        }
      }
    }
@@ -551,6 +561,7 @@
  }
  return false;
},


update_expando: function(uid, expanded)
{
@@ -597,8 +608,8 @@
    var i, len, rows = this.list.tBodies[0].rows;

    for (i=0, len=rows.length-1; i<len; i++)
      if (rows[i].id && String(rows[i].id).match(/rcmrow([a-z0-9\-_=\+\/]+)/i) && this.rows[RegExp.$1] != null)
       return RegExp.$1;
      if (rows[i].id && String(rows[i].id).match(/^rcmrow([a-z0-9\-_=\+\/]+)/i) && this.rows[RegExp.$1] != null)
        return RegExp.$1;
  }

  return null;
@@ -610,7 +621,7 @@
    var i, rows = this.list.tBodies[0].rows;

    for (i=rows.length-1; i>=0; i--)
      if (rows[i].id && String(rows[i].id).match(/rcmrow([a-z0-9\-_=\+\/]+)/i) && this.rows[RegExp.$1] != null)
      if (rows[i].id && String(rows[i].id).match(/^rcmrow([a-z0-9\-_=\+\/]+)/i) && this.rows[RegExp.$1] != null)
        return RegExp.$1;
  }

@@ -644,7 +655,7 @@
      case CONTROL_KEY:
        if (!with_mouse)
          this.highlight_row(id, true);
        break; 
        break;

      case CONTROL_SHIFT_KEY:
        this.shift_select(id, true);
@@ -695,11 +706,12 @@
 */
select_next: function()
{
  var next_row = this.get_next_row();
  var prev_row = this.get_prev_row();
  var new_row = (next_row) ? next_row : prev_row;
  var next_row = this.get_next_row(),
    prev_row = this.get_prev_row(),
    new_row = (next_row) ? next_row : prev_row;

  if (new_row)
    this.select_row(new_row.uid, false, false);  
    this.select_row(new_row.uid, false, false);
},


@@ -709,53 +721,48 @@
select_first: function(mod_key)
{
  var row = this.get_first_row();
  if (row && mod_key) {
    this.shift_select(row, mod_key);
    this.triggerEvent('select');
    this.scrollto(row);
  if (row) {
    if (mod_key) {
      this.shift_select(row, mod_key);
      this.triggerEvent('select');
      this.scrollto(row);
    }
    else {
      this.select(row);
    }
  }
  else if (row)
    this.select(row);
},


/**
 * Select last row 
 * Select last row
 */
select_last: function(mod_key)
{
  var row = this.get_last_row();
  if (row && mod_key) {
    this.shift_select(row, mod_key);
    this.triggerEvent('select');
    this.scrollto(row);    
  if (row) {
    if (mod_key) {
      this.shift_select(row, mod_key);
      this.triggerEvent('select');
      this.scrollto(row);
    }
    else {
      this.select(row);
    }
  }
  else if (row)
    this.select(row);
},


/**
 * Add all childs of the given row to selection
 */
select_childs: function(uid)
select_children: function(uid)
{
  if (!this.rows[uid] || !this.rows[uid].has_children)
    return;
  var i, children = this.row_children(uid), len = children.length;

  var depth = this.rows[uid].depth;
  var row = this.rows[uid].obj.nextSibling;
  while (row) {
    if (row.nodeType == 1) {
      if ((r = this.rows[row.uid])) {
        if (!r.depth || r.depth <= depth)
          break;
        if (!this.in_selection(r.uid))
          this.select_row(r.uid, CONTROL_KEY);
      }
    }
    row = row.nextSibling;
  }
  for (i=0; i<len; i++)
    if (!this.in_selection(children[i]))
      this.select_row(children[i], CONTROL_KEY);
},


@@ -767,20 +774,20 @@
  if (!this.rows[this.shift_start] || !this.selection.length)
    this.shift_start = id;

  var from_rowIndex = this.rows[this.shift_start].obj.rowIndex,
  var n, from_rowIndex = this.rows[this.shift_start].obj.rowIndex,
    to_rowIndex = this.rows[id].obj.rowIndex,
    i = ((from_rowIndex < to_rowIndex)? from_rowIndex : to_rowIndex),
    j = ((from_rowIndex > to_rowIndex)? from_rowIndex : to_rowIndex);

  // iterate through the entire message list
  for (var n in this.rows) {
  for (n in this.rows) {
    if (this.rows[n].obj.rowIndex >= i && this.rows[n].obj.rowIndex <= j) {
      if (!this.in_selection(n)) {
        this.highlight_row(n, true);
      }
    }
    else {
      if  (this.in_selection(n) && !control) {
      if (this.in_selection(n) && !control) {
        this.highlight_row(n, true);
      }
    }
@@ -793,7 +800,7 @@
 */
in_selection: function(id)
{
  for(var n in this.selection)
  for (var n in this.selection)
    if (this.selection[n]==id)
      return true;

@@ -810,10 +817,10 @@
    return false;

  // reset but remember selection first
  var select_before = this.selection.join(',');
  var n, select_before = this.selection.join(',');
  this.selection = [];

  for (var n in this.rows) {
  for (n in this.rows) {
    if (!filter || this.rows[n][filter] == true) {
      this.last_selected = n;
      this.highlight_row(n, true);
@@ -842,9 +849,9 @@
    return false;

  // remember old selection
  var select_before = this.selection.join(',');
  var n, select_before = this.selection.join(',');

  for (var n in this.rows)
  for (n in this.rows)
    this.highlight_row(n, true);

  // trigger event if selection changed
@@ -862,11 +869,11 @@
 */
clear_selection: function(id)
{
  var num_select = this.selection.length;
  var n, num_select = this.selection.length;

  // one row
  if (id) {
    for (var n in this.selection)
    for (n in this.selection)
      if (this.selection[n] == id) {
        this.selection.splice(n,1);
        break;
@@ -874,7 +881,7 @@
  }
  // all rows
  else {
    for (var n in this.selection)
    for (n in this.selection)
      if (this.rows[this.selection[n]]) {
        $(this.rows[this.selection[n]].obj).removeClass('selected').removeClass('unfocused');
      }
@@ -913,25 +920,49 @@
 */
highlight_row: function(id, multiple)
{
  if (this.rows[id] && !multiple) {
  if (!this.rows[id])
    return;

  if (!multiple) {
    if (this.selection.length > 1 || !this.in_selection(id)) {
      this.clear_selection();
      this.selection[0] = id;
      $(this.rows[id].obj).addClass('selected');
    }
  }
  else if (this.rows[id]) {
  else {
    if (!this.in_selection(id)) { // select row
      this.selection[this.selection.length] = id;
      this.selection.push(id);
      $(this.rows[id].obj).addClass('selected');
      if (!this.rows[id].expanded)
        this.highlight_children(id, true);
    }
    else { // unselect row
      var p = $.inArray(id, this.selection);
      var a_pre = this.selection.slice(0, p);
      var a_post = this.selection.slice(p+1, this.selection.length);
      var p = $.inArray(id, this.selection),
        a_pre = this.selection.slice(0, p),
        a_post = this.selection.slice(p+1, this.selection.length);

      this.selection = a_pre.concat(a_post);
      $(this.rows[id].obj).removeClass('selected').removeClass('unfocused');
      if (!this.rows[id].expanded)
        this.highlight_children(id, false);
    }
  }
},


/**
 * Highlight/unhighlight all childs of the given row
 */
highlight_children: function(id, status)
{
  var i, selected,
    children = this.row_children(id), len = children.length;

  for (i=0; i<len; i++) {
    selected = this.in_selection(children[i]);
    if ((status && !selected) || (!status && selected))
      this.highlight_row(children[i], true);
  }
},

@@ -941,15 +972,16 @@
 */
key_press: function(e)
{
  if (this.focused != true)
  var target = e.target || {};
  if (this.focused != true || target.nodeName == 'INPUT' || target.nodeName == 'TEXTAREA' || target.nodeName == 'SELECT')
    return true;

  var keyCode = rcube_event.get_keycode(e);
  var mod_key = rcube_event.get_modifier(e);
  var keyCode = rcube_event.get_keycode(e),
    mod_key = rcube_event.get_modifier(e);

  switch (keyCode) {
    case 40:
    case 38: 
    case 38:
    case 63233: // "down", in safari keypress
    case 63232: // "up", in safari keypress
      // Stop propagation so that the browser doesn't scroll
@@ -963,7 +995,9 @@
      rcube_event.cancel(e);
      var ret = this.use_plusminus_key(keyCode, mod_key);
      this.key_pressed = keyCode;
      this.modkey = mod_key;
      this.triggerEvent('keypress');
      this.modkey = 0;
      return ret;
    case 36: // Home
      this.select_first(mod_key);
@@ -971,44 +1005,22 @@
    case 35: // End
      this.select_last(mod_key);
      return rcube_event.cancel(e);
    case 27:
      if (this.drag_active)
        return this.drag_mouse_up(e);
      if (this.col_drag_active) {
        this.selected_column = null;
        return this.column_drag_mouse_up(e);
      }
      return rcube_event.cancel(e);
    default:
      this.shiftkey = e.shiftKey;
      this.key_pressed = keyCode;
      this.modkey = mod_key;
      this.triggerEvent('keypress');
      this.modkey = 0;

      if (this.key_pressed == this.BACKSPACE_KEY)
        return rcube_event.cancel(e);
  }

  return true;
},

/**
 * Handler for keydown events
 */
key_down: function(e)
{
  switch (rcube_event.get_keycode(e)) {
    case 27:
      if (this.drag_active)
       return this.drag_mouse_up(e);
      if (this.col_drag_active) {
        this.selected_column = null;
       return this.column_drag_mouse_up(e);
      }

    case 40:
    case 38: 
    case 63233:
    case 63232:
    case 61:
    case 107:
    case 109:
    case 32:
      if (!rcube_event.get_modifier(e) && this.focused)
        return rcube_event.cancel(e);

    default:
  }

  return true;
@@ -1029,7 +1041,7 @@
    new_row = this.get_prev_row();

  if (new_row) {
    this.select_row(new_row.uid, mod_key, true);
    this.select_row(new_row.uid, mod_key, false);
    this.scrollto(new_row.uid);
  }

@@ -1101,7 +1113,7 @@
    else
      return rcube_event.cancel(e);
  }
  

  if (this.drag_start) {
    // check mouse movement, of less than 3 pixels, don't start dragging
    var m = rcube_event.get_mouse_pos(e);
@@ -1118,8 +1130,8 @@
    var n, uid, selection = $.merge([], this.selection);
    for (n in selection) {
      uid = selection[n];
      if (this.rows[uid].has_children && !this.rows[uid].expanded)
        this.select_childs(uid);
      if (!this.rows[uid].expanded)
        this.select_children(uid);
    }

    // reset content
@@ -1192,7 +1204,7 @@
drag_mouse_up: function(e)
{
  document.onmousemove = null;
  

  if (e.type == 'touchend') {
    if (e.changedTouches.length != 1)
      return rcube_event.cancel(e);
@@ -1211,8 +1223,8 @@

  rcube_event.remove_listener({event:'mousemove', object:this, method:'drag_mouse_move'});
  rcube_event.remove_listener({event:'mouseup', object:this, method:'drag_mouse_up'});
  
  if (bw.iphone || bw.ipad) {

  if (bw.mobile) {
    rcube_event.remove_listener({event:'touchmove', object:this, method:'drag_mouse_move'});
    rcube_event.remove_listener({event:'touchend', object:this, method:'drag_mouse_up'});
  }
@@ -1340,6 +1352,32 @@


/**
 * Returns IDs of all rows in a thread (except root) for specified root
 */
row_children: function(uid)
{
  if (!this.rows[uid] || !this.rows[uid].has_children)
    return [];

  var res = [], depth = this.rows[uid].depth,
    row = this.rows[uid].obj.nextSibling;

  while (row) {
    if (row.nodeType == 1) {
      if ((r = this.rows[row.uid])) {
        if (!r.depth || r.depth <= depth)
          break;
        res.push(r.uid);
      }
    }
    row = row.nextSibling;
  }

  return res;
},


/**
 * Creates a layer for drag&drop over iframes
 */
add_dragfix: function()
@@ -1370,7 +1408,7 @@
 */
column_replace: function(from, to)
{
  var cells = this.list.tHead.rows[0].cells,
  var len, cells = this.list.tHead.rows[0].cells,
    elem = cells[from],
    before = cells[to],
    td = document.createElement('td');
@@ -1383,7 +1421,7 @@
  cells[0].parentNode.replaceChild(elem, td);

  // replace list cells
  for (r=0; r<this.list.tBodies[0].rows.length; r++) {
  for (r=0, len=this.list.tBodies[0].rows.length; r<len; r++) {
    row = this.list.tBodies[0].rows[r];

    elem = row.cells[from];