| | |
| | | |
| | | /** |
| | | * Roundcube List Widget class |
| | | * @contructor |
| | | * @constructor |
| | | */ |
| | | function rcube_list_widget(list, p) |
| | | { |
| | |
| | | this.list = list ? list : null; |
| | | this.tagname = this.list ? this.list.nodeName.toLowerCase() : 'table'; |
| | | this.id_regexp = /^rcmrow([a-z0-9\-_=\+\/]+)/i; |
| | | this.thead; |
| | | this.tbody; |
| | | this.fixed_header; |
| | | this.frame = null; |
| | | this.rows = {}; |
| | | this.selection = []; |
| | | this.rowcount = 0; |
| | |
| | | var r, len, rows = this.tbody.childNodes; |
| | | |
| | | for (r=0, len=rows.length; r<len; r++) { |
| | | this.init_row(rows[r]); |
| | | this.rowcount++; |
| | | this.rowcount += this.init_row(rows[r]) ? 1 : 0; |
| | | } |
| | | |
| | | this.init_header(); |
| | |
| | | |
| | | this.row_init(this.rows[uid]); // legacy support |
| | | this.triggerEvent('initrow', this.rows[uid]); |
| | | |
| | | return true; |
| | | } |
| | | }, |
| | | |
| | |
| | | // reset scroll position (in Opera) |
| | | if (this.frame) |
| | | this.frame.scrollTop = 0; |
| | | |
| | | // fix list header after removing any rows |
| | | this.resize(); |
| | | }, |
| | | |
| | | |
| | |
| | | */ |
| | | remove_row: function(uid, sel_next) |
| | | { |
| | | var node = this.rows[uid] ? this.rows[uid].obj : null; |
| | | var self = this, node = this.rows[uid] ? this.rows[uid].obj : null; |
| | | |
| | | if (!node) |
| | | return; |
| | |
| | | |
| | | delete this.rows[uid]; |
| | | this.rowcount--; |
| | | |
| | | // fix list header after removing any rows |
| | | clearTimeout(this.resize_timeout) |
| | | this.resize_timeout = setTimeout(function() { self.resize(); }, 50); |
| | | }, |
| | | |
| | | |
| | |
| | | */ |
| | | insert_row: function(row, before) |
| | | { |
| | | var tbody = this.tbody; |
| | | var self = this, tbody = this.tbody; |
| | | |
| | | // create a real dom node first |
| | | if (row.nodeName === undefined) { |
| | |
| | | |
| | | this.init_row(row); |
| | | this.rowcount++; |
| | | |
| | | // fix list header after adding any rows |
| | | clearTimeout(this.resize_timeout) |
| | | this.resize_timeout = setTimeout(function() { self.resize(); }, 50); |
| | | }, |
| | | |
| | | /** |
| | |
| | | |
| | | collapse: function(row) |
| | | { |
| | | var r, depth = row.depth, |
| | | new_row = row ? row.obj.nextSibling : null; |
| | | |
| | | row.expanded = false; |
| | | 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; |
| | | |
| | | while (new_row) { |
| | | if (new_row.nodeType == 1) { |
| | | var r = this.rows[new_row.uid]; |
| | | r = this.rows[new_row.uid]; |
| | | if (r && r.depth <= depth) |
| | | break; |
| | | |
| | | $(new_row).css('display', 'none'); |
| | | if (r.expanded) { |
| | | r.expanded = false; |
| | |
| | | |
| | | this.resize(); |
| | | this.triggerEvent('listupdate'); |
| | | |
| | | return false; |
| | | }, |
| | | |
| | |
| | | |
| | | for (i=0; i<len; i++) |
| | | if (!this.in_selection(children[i])) |
| | | this.select_row(children[i], CONTROL_KEY); |
| | | this.select_row(children[i], CONTROL_KEY, true); |
| | | }, |
| | | |
| | | |
| | |
| | | in_selection: function(id) |
| | | { |
| | | for (var n in this.selection) |
| | | if (this.selection[n]==id) |
| | | if (this.selection[n] == id) |
| | | return true; |
| | | |
| | | return false; |
| | |
| | | /** |
| | | * Getter for the selection array |
| | | */ |
| | | get_selection: function() |
| | | get_selection: function(deep) |
| | | { |
| | | return this.selection; |
| | | var res = $.merge([], this.selection); |
| | | |
| | | // return children of selected threads even if only root is selected |
| | | if (deep !== false && res.length) { |
| | | for (var uid, uids, i=0, len=res.length; i<len; i++) { |
| | | uid = res[i]; |
| | | if (this.rows[uid].has_children && !this.rows[uid].expanded) { |
| | | uids = this.row_children(uid); |
| | | for (var j=0, uids_len=uids.length; j<uids_len; j++) { |
| | | uid = uids[j]; |
| | | if (!this.in_selection(uid)) |
| | | res.push(uid); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | return res; |
| | | }, |
| | | |
| | | |
| | |
| | | // Stop propagation so that the browser doesn't scroll |
| | | rcube_event.cancel(e); |
| | | return this.use_arrow_key(keyCode, mod_key); |
| | | |
| | | case 32: |
| | | rcube_event.cancel(e); |
| | | return this.select_row(this.last_selected, mod_key, true); |
| | | |
| | | case 37: // Left arrow key |
| | | case 39: // Right arrow key |
| | | case 107: // Plus sign on a numeric keypad |
| | | case 109: // Minus sign on a numeric keypad |
| | | case 109: // Minus sign on a numeric keypad |
| | | // Stop propagation |
| | | rcube_event.cancel(e); |
| | | var ret = this.use_plusminus_key(keyCode, mod_key); |
| | |
| | | this.triggerEvent('keypress'); |
| | | this.modkey = 0; |
| | | return ret; |
| | | |
| | | case 36: // Home |
| | | this.select_first(mod_key); |
| | | return rcube_event.cancel(e); |
| | | |
| | | 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.key_pressed = keyCode; |
| | | this.modkey = mod_key; |
| | |
| | | |
| | | if (this.drag_start) { |
| | | // check mouse movement, of less than 3 pixels, don't start dragging |
| | | var m = rcube_event.get_mouse_pos(e); |
| | | var m = rcube_event.get_mouse_pos(e), |
| | | limit = 10, selection = [], self = this; |
| | | |
| | | if (!this.drag_mouse_start || (Math.abs(m.x - this.drag_mouse_start.x) < 3 && Math.abs(m.y - this.drag_mouse_start.y) < 3)) |
| | | return false; |
| | | |
| | | // remember dragging start position |
| | | this.drag_start_pos = {left: m.x, top: m.y}; |
| | | |
| | | // initialize drag layer |
| | | if (!this.draglayer) |
| | | this.draglayer = $('<div>').attr('id', 'rcmdraglayer') |
| | | .css({ position:'absolute', display:'none', 'z-index':2000 }) |
| | | .css({position: 'absolute', display: 'none', 'z-index': 2000}) |
| | | .appendTo(document.body); |
| | | else |
| | | this.draglayer.html(''); |
| | | |
| | | // also select childs of (collapsed) threads for dragging |
| | | var n, uid, selection = $.merge([], this.selection); |
| | | for (n in selection) { |
| | | uid = selection[n]; |
| | | if (!this.rows[uid].expanded) |
| | | this.select_children(uid); |
| | | } |
| | | // get selected rows (in display order), don't use this.selection here |
| | | $(this.row_tagname() + '.selected', this.tbody).each(function() { |
| | | if (!String(this.id).match(self.id_regexp)) |
| | | return; |
| | | |
| | | // reset content |
| | | this.draglayer.html(''); |
| | | var uid = RegExp.$1, row = self.rows[uid]; |
| | | |
| | | // get subjects of selected messages |
| | | var i, n, obj, me; |
| | | for (n=0; n<this.selection.length; n++) { |
| | | // only show 12 lines |
| | | if (n>12) { |
| | | this.draglayer.append('...'); |
| | | break; |
| | | } |
| | | if ($.inArray(uid, selection) > -1) |
| | | return; |
| | | |
| | | me = this; |
| | | if (obj = this.rows[this.selection[n]].obj) { |
| | | $('> '+this.col_tagname(), obj).each(function(i,elem){ |
| | | if (n == 0) |
| | | me.drag_start_pos = $(elem).offset(); |
| | | selection.push(uid); |
| | | |
| | | if (me.subject_col < 0 || (me.subject_col >= 0 && me.subject_col == i)) { |
| | | var subject = $(elem).text(); |
| | | |
| | | if (subject) { |
| | | // remove leading spaces |
| | | subject = $.trim(subject); |
| | | // truncate line to 50 characters |
| | | subject = (subject.length > 50 ? subject.substring(0, 50) + '...' : subject); |
| | | |
| | | var entry = $('<div>').text(subject); |
| | | me.draglayer.append(entry); |
| | | } |
| | | |
| | | return false; // break |
| | | } |
| | | // also handle children of (collapsed) trees for dragging (they might be not selected) |
| | | if (row.has_children && !row.expanded) |
| | | $.each(self.row_children(uid), function() { |
| | | if ($.inArray(this, selection) > -1) |
| | | return; |
| | | selection.push(this); |
| | | }); |
| | | |
| | | // break the loop asap |
| | | if (selection.length > limit + 1) |
| | | return false; |
| | | }); |
| | | |
| | | // append subject (of every row up to the limit) to the drag layer |
| | | $.each(selection, function(i, uid) { |
| | | if (i > limit) { |
| | | self.draglayer.append('...'); |
| | | return false; |
| | | } |
| | | } |
| | | |
| | | $('> ' + self.col_tagname(), self.rows[uid].obj).each(function(n, cell) { |
| | | if (self.subject_col < 0 || (self.subject_col >= 0 && self.subject_col == n)) { |
| | | var subject = $(cell).text(); |
| | | |
| | | if (subject) { |
| | | // remove leading spaces |
| | | subject = $.trim(subject); |
| | | // truncate line to 50 characters |
| | | subject = (subject.length > 50 ? subject.substring(0, 50) + '...' : subject); |
| | | |
| | | self.draglayer.append($('<div>').text(subject)); |
| | | return false; |
| | | } |
| | | } |
| | | }); |
| | | }); |
| | | |
| | | this.draglayer.show(); |
| | | this.drag_active = true; |
| | |
| | | if (!this.col_draglayer) { |
| | | var lpos = $(this.list).offset(), |
| | | cells = this.thead.rows[0].cells; |
| | | |
| | | // fix layer position when list is scrolled |
| | | lpos.top += this.list.scrollTop + this.list.parentNode.scrollTop; |
| | | |
| | | // create dragging layer |
| | | this.col_draglayer = $('<div>').attr('id', 'rcmcoldraglayer') |
| | |
| | | |
| | | while (row) { |
| | | if (row.nodeType == 1) { |
| | | if ((r = this.rows[row.uid])) { |
| | | if (r = this.rows[row.uid]) { |
| | | if (!r.depth || r.depth <= depth) |
| | | break; |
| | | res.push(r.uid); |
| | |
| | | */ |
| | | del_dragfix: function() |
| | | { |
| | | $('div.iframe-dragdrop-fix').each(function() { this.parentNode.removeChild(this); }); |
| | | $('div.iframe-dragdrop-fix').remove(); |
| | | }, |
| | | |
| | | |