| commit | author | age | ||
| 6b47de | 1 | /* |
| T | 2 | +-----------------------------------------------------------------------+ |
| 3 | | RoundCube List Widget | | |
| 4 | | | | |
| 5 | | This file is part of the RoundCube Webmail client | | |
| 0b7cd3 | 6 | | Copyright (C) 2006-2008, RoundCube Dev, - Switzerland | |
| 6b47de | 7 | | Licensed under the GNU GPL | |
| T | 8 | | | |
| 9 | +-----------------------------------------------------------------------+ | |
| 10 | | Authors: Thomas Bruederli <roundcube@gmail.com> | | |
| 11 | | Charles McNulty <charles@charlesmcnulty.com> | | |
| 12 | +-----------------------------------------------------------------------+ | |
| 13 | | Requires: common.js | | |
| 14 | +-----------------------------------------------------------------------+ | |
| 15 | ||
| 16 | $Id: list.js 344 2006-09-18 03:49:28Z thomasb $ | |
| 17 | */ | |
| 18 | ||
| 19 | ||
| 20 | /** | |
| 21 | * RoundCube List Widget class | |
| 22 | * @contructor | |
| 23 | */ | |
| 24 | function rcube_list_widget(list, p) | |
| 25 | { | |
| 26 | // static contants | |
| 27 | this.ENTER_KEY = 13; | |
| 28 | this.DELETE_KEY = 46; | |
| 6e6e89 | 29 | this.BACKSPACE_KEY = 8; |
| 6b47de | 30 | |
| T | 31 | this.list = list ? list : null; |
| 32 | this.frame = null; | |
| 33 | this.rows = []; | |
| 34 | this.selection = []; | |
| 0dbac3 | 35 | this.rowcount = 0; |
| 6b47de | 36 | |
| d24d20 | 37 | this.subject_col = -1; |
| 31c171 | 38 | this.shiftkey = false; |
| 6b47de | 39 | this.multiselect = false; |
| 21168d | 40 | this.multi_selecting = false; |
| 6b47de | 41 | this.draggable = false; |
| T | 42 | this.keyboard = false; |
| 68b6a9 | 43 | this.toggleselect = false; |
| 6b47de | 44 | |
| T | 45 | this.dont_select = false; |
| 46 | this.drag_active = false; | |
| 47 | this.last_selected = 0; | |
| b2fb95 | 48 | this.shift_start = 0; |
| 6b47de | 49 | this.in_selection_before = false; |
| T | 50 | this.focused = false; |
| 51 | this.drag_mouse_start = null; | |
| 52 | this.dblclick_time = 600; | |
| 53 | this.row_init = function(){}; | |
| f89f03 | 54 | this.events = { click:[], dblclick:[], select:[], keypress:[], dragstart:[], dragmove:[], dragend:[] }; |
| 6b47de | 55 | |
| T | 56 | // overwrite default paramaters |
| 57 | if (p && typeof(p)=='object') | |
| 58 | for (var n in p) | |
| 59 | this[n] = p[n]; | |
| 60 | } | |
| 61 | ||
| 62 | ||
| 63 | rcube_list_widget.prototype = { | |
| 64 | ||
| 65 | ||
| 66 | /** | |
| 67 | * get all message rows from HTML table and init each row | |
| 68 | */ | |
| 69 | init: function() | |
| 70 | { | |
| 71 | if (this.list && this.list.tBodies[0]) | |
| 72 | { | |
| 73 | this.rows = new Array(); | |
| 0dbac3 | 74 | this.rowcount = 0; |
| 6b47de | 75 | |
| T | 76 | var row; |
| 77 | for(var r=0; r<this.list.tBodies[0].childNodes.length; r++) | |
| 78 | { | |
| 79 | row = this.list.tBodies[0].childNodes[r]; | |
| 80 | while (row && (row.nodeType != 1 || row.style.display == 'none')) | |
| 81 | { | |
| 82 | row = row.nextSibling; | |
| 83 | r++; | |
| 84 | } | |
| 85 | ||
| 86 | this.init_row(row); | |
| 0dbac3 | 87 | this.rowcount++; |
| 6b47de | 88 | } |
| T | 89 | |
| 90 | this.frame = this.list.parentNode; | |
| 91 | ||
| 92 | // set body events | |
| 26f5b0 | 93 | if (this.keyboard) { |
| T | 94 | rcube_event.add_listener({element:document, event:'keyup', object:this, method:'key_press'}); |
| 9e7a1b | 95 | rcube_event.add_listener({element:document, event:'keydown', object:this, method:'key_down'}); |
| 26f5b0 | 96 | } |
| 6b47de | 97 | } |
| T | 98 | }, |
| 99 | ||
| 100 | ||
| 101 | /** | |
| 102 | * | |
| 103 | */ | |
| 104 | init_row: function(row) | |
| 105 | { | |
| 106 | // make references in internal array and set event handlers | |
| f11541 | 107 | if (row && String(row.id).match(/rcmrow([a-z0-9\-_=]+)/i)) |
| 6b47de | 108 | { |
| T | 109 | var p = this; |
| 110 | var uid = RegExp.$1; | |
| 111 | row.uid = uid; | |
| 112 | this.rows[uid] = {uid:uid, id:row.id, obj:row, classname:row.className}; | |
| 113 | ||
| 114 | // set eventhandlers to table row | |
| 115 | row.onmousedown = function(e){ return p.drag_row(e, this.uid); }; | |
| 116 | row.onmouseup = function(e){ return p.click_row(e, this.uid); }; | |
| 117 | ||
| 118 | if (document.all) | |
| 119 | row.onselectstart = function() { return false; }; | |
| 120 | ||
| 121 | this.row_init(this.rows[uid]); | |
| 122 | } | |
| 123 | }, | |
| 124 | ||
| 125 | ||
| 126 | /** | |
| 127 | * | |
| 128 | */ | |
| f11541 | 129 | clear: function(sel) |
| 6b47de | 130 | { |
| T | 131 | var tbody = document.createElement('TBODY'); |
| 132 | this.list.insertBefore(tbody, this.list.tBodies[0]); | |
| 133 | this.list.removeChild(this.list.tBodies[1]); | |
| f11541 | 134 | this.rows = new Array(); |
| 0dbac3 | 135 | this.rowcount = 0; |
| f11541 | 136 | |
| T | 137 | if (sel) this.clear_selection(); |
| 6b47de | 138 | }, |
| T | 139 | |
| 140 | ||
| 141 | /** | |
| 142 | * 'remove' message row from list (just hide it) | |
| 143 | */ | |
| b62656 | 144 | remove_row: function(uid, sel_next) |
| 6b47de | 145 | { |
| T | 146 | if (this.rows[uid].obj) |
| 147 | this.rows[uid].obj.style.display = 'none'; | |
| 148 | ||
| b62656 | 149 | if (sel_next) |
| T | 150 | this.select_next(); |
| 151 | ||
| 6b47de | 152 | this.rows[uid] = null; |
| 0dbac3 | 153 | this.rowcount--; |
| 6b47de | 154 | }, |
| T | 155 | |
| 156 | ||
| 157 | /** | |
| 158 | * | |
| 159 | */ | |
| 160 | insert_row: function(row, attop) | |
| 161 | { | |
| 162 | var tbody = this.list.tBodies[0]; | |
| 163 | ||
| 164 | if (attop && tbody.rows.length) | |
| 165 | tbody.insertBefore(row, tbody.firstChild); | |
| 166 | else | |
| 167 | tbody.appendChild(row); | |
| 168 | ||
| 169 | this.init_row(row); | |
| 0dbac3 | 170 | this.rowcount++; |
| 6b47de | 171 | }, |
| T | 172 | |
| 173 | ||
| 174 | ||
| 175 | /** | |
| 25c35c | 176 | * Set focus to the list |
| 6b47de | 177 | */ |
| T | 178 | focus: function(e) |
| 179 | { | |
| 180 | this.focused = true; | |
| 181 | for (var n=0; n<this.selection.length; n++) | |
| 182 | { | |
| 183 | id = this.selection[n]; | |
| e78864 | 184 | if (this.rows[id] && this.rows[id].obj) |
| 6b47de | 185 | { |
| T | 186 | this.set_classname(this.rows[id].obj, 'selected', true); |
| 187 | this.set_classname(this.rows[id].obj, 'unfocused', false); | |
| 188 | } | |
| 189 | } | |
| 190 | ||
| 191 | if (e || (e = window.event)) | |
| 192 | rcube_event.cancel(e); | |
| 193 | }, | |
| 194 | ||
| 195 | ||
| 196 | /** | |
| 197 | * remove focus from the list | |
| 198 | */ | |
| 199 | blur: function() | |
| 200 | { | |
| 201 | var id; | |
| 202 | this.focused = false; | |
| 203 | for (var n=0; n<this.selection.length; n++) | |
| 204 | { | |
| 205 | id = this.selection[n]; | |
| 206 | if (this.rows[id] && this.rows[id].obj) | |
| 207 | { | |
| 208 | this.set_classname(this.rows[id].obj, 'selected', false); | |
| 209 | this.set_classname(this.rows[id].obj, 'unfocused', true); | |
| 210 | } | |
| 211 | } | |
| 212 | }, | |
| 213 | ||
| 214 | ||
| 215 | /** | |
| 216 | * onmousedown-handler of message list row | |
| 217 | */ | |
| 218 | drag_row: function(e, id) | |
| 219 | { | |
| 220 | // don't do anything (another action processed before) | |
| a0ce2f | 221 | var evtarget = rcube_event.get_target(e); |
| T | 222 | if (this.dont_select || (evtarget && (evtarget.tagName == 'INPUT' || evtarget.tagName == 'IMG'))) |
| 6b47de | 223 | return false; |
| f89f03 | 224 | |
| T | 225 | // accept right-clicks |
| 226 | if (rcube_event.get_button(e) == 2) | |
| 227 | return true; | |
| 228 | ||
| bf36a9 | 229 | this.in_selection_before = this.in_selection(id) ? id : false; |
| T | 230 | |
| 6b47de | 231 | // selects currently unselected row |
| T | 232 | if (!this.in_selection_before) |
| 233 | { | |
| 234 | var mod_key = rcube_event.get_modifier(e); | |
| 235 | this.select_row(id, mod_key, false); | |
| 236 | } | |
| 237 | ||
| 238 | if (this.draggable && this.selection.length) | |
| 239 | { | |
| 240 | this.drag_start = true; | |
| b2fb95 | 241 | this.drag_mouse_start = rcube_event.get_mouse_pos(e); |
| 6b47de | 242 | rcube_event.add_listener({element:document, event:'mousemove', object:this, method:'drag_mouse_move'}); |
| T | 243 | rcube_event.add_listener({element:document, event:'mouseup', object:this, method:'drag_mouse_up'}); |
| 244 | } | |
| 245 | ||
| 246 | return false; | |
| 247 | }, | |
| 248 | ||
| 249 | ||
| 250 | /** | |
| 251 | * onmouseup-handler of message list row | |
| 252 | */ | |
| 253 | click_row: function(e, id) | |
| 254 | { | |
| 255 | var now = new Date().getTime(); | |
| 256 | var mod_key = rcube_event.get_modifier(e); | |
| a0ce2f | 257 | var evtarget = rcube_event.get_target(e); |
| 0b7cd3 | 258 | |
| a0ce2f | 259 | if ((evtarget && (evtarget.tagName == 'INPUT' || evtarget.tagName == 'IMG'))) |
| 0b7cd3 | 260 | return false; |
| T | 261 | |
| 6b47de | 262 | // don't do anything (another action processed before) |
| T | 263 | if (this.dont_select) |
| 264 | { | |
| 265 | this.dont_select = false; | |
| 266 | return false; | |
| 267 | } | |
| 268 | ||
| 269 | var dblclicked = now - this.rows[id].clicked < this.dblclick_time; | |
| 270 | ||
| 271 | // unselects currently selected row | |
| 272 | if (!this.drag_active && this.in_selection_before == id && !dblclicked) | |
| 273 | this.select_row(id, mod_key, false); | |
| 274 | ||
| 275 | this.drag_start = false; | |
| 276 | this.in_selection_before = false; | |
| 277 | ||
| 278 | // row was double clicked | |
| 279 | if (this.rows && dblclicked && this.in_selection(id)) | |
| 280 | this.trigger_event('dblclick'); | |
| 281 | else | |
| 282 | this.trigger_event('click'); | |
| 283 | ||
| 284 | if (!this.drag_active) | |
| 285 | rcube_event.cancel(e); | |
| 286 | ||
| 287 | this.rows[id].clicked = now; | |
| 288 | return false; | |
| 289 | }, | |
| 290 | ||
| 291 | ||
| 292 | /** | |
| 095d05 | 293 | * get next/previous/last rows that are not hidden |
| 6b47de | 294 | */ |
| T | 295 | get_next_row: function() |
| 296 | { | |
| 297 | if (!this.rows) | |
| 298 | return false; | |
| 299 | ||
| 300 | var last_selected_row = this.rows[this.last_selected]; | |
| a7d5c6 | 301 | var new_row = last_selected_row ? last_selected_row.obj.nextSibling : null; |
| 6b47de | 302 | while (new_row && (new_row.nodeType != 1 || new_row.style.display == 'none')) |
| T | 303 | new_row = new_row.nextSibling; |
| 304 | ||
| 305 | return new_row; | |
| 306 | }, | |
| 307 | ||
| 308 | get_prev_row: function() | |
| 309 | { | |
| 310 | if (!this.rows) | |
| 311 | return false; | |
| 312 | ||
| 313 | var last_selected_row = this.rows[this.last_selected]; | |
| a7d5c6 | 314 | var new_row = last_selected_row ? last_selected_row.obj.previousSibling : null; |
| 6b47de | 315 | while (new_row && (new_row.nodeType != 1 || new_row.style.display == 'none')) |
| T | 316 | new_row = new_row.previousSibling; |
| 317 | ||
| 318 | return new_row; | |
| 319 | }, | |
| 320 | ||
| 095d05 | 321 | get_last_row: function() |
| A | 322 | { |
| 323 | if (this.rowcount) | |
| 324 | { | |
| 325 | var rows = this.list.tBodies[0].rows; | |
| 6b47de | 326 | |
| 095d05 | 327 | for(var i=rows.length-1; i>=0; i--) |
| A | 328 | if(rows[i].id && String(rows[i].id).match(/rcmrow([a-z0-9\-_=]+)/i) && this.rows[RegExp.$1] != null) |
| 329 | return RegExp.$1; | |
| 330 | } | |
| 331 | ||
| 332 | return null; | |
| 333 | }, | |
| 334 | ||
| 335 | ||
| 336 | /** | |
| 337 | * selects or unselects the proper row depending on the modifier key pressed | |
| 338 | */ | |
| 6b47de | 339 | select_row: function(id, mod_key, with_mouse) |
| T | 340 | { |
| 341 | var select_before = this.selection.join(','); | |
| 342 | if (!this.multiselect) | |
| 343 | mod_key = 0; | |
| b2fb95 | 344 | |
| T | 345 | if (!this.shift_start) |
| 346 | this.shift_start = id | |
| 6b47de | 347 | |
| T | 348 | if (!mod_key) |
| 349 | { | |
| 350 | this.shift_start = id; | |
| 351 | this.highlight_row(id, false); | |
| 21168d | 352 | this.multi_selecting = false; |
| 6b47de | 353 | } |
| T | 354 | else |
| 355 | { | |
| 356 | switch (mod_key) | |
| 357 | { | |
| 358 | case SHIFT_KEY: | |
| b2fb95 | 359 | this.shift_select(id, false); |
| 6b47de | 360 | break; |
| T | 361 | |
| 362 | case CONTROL_KEY: | |
| 363 | if (!with_mouse) | |
| b2fb95 | 364 | this.highlight_row(id, true); |
| 6b47de | 365 | break; |
| T | 366 | |
| 367 | case CONTROL_SHIFT_KEY: | |
| 368 | this.shift_select(id, true); | |
| 369 | break; | |
| 370 | ||
| 371 | default: | |
| b2fb95 | 372 | this.highlight_row(id, false); |
| 6b47de | 373 | break; |
| T | 374 | } |
| 21168d | 375 | this.multi_selecting = true; |
| 6b47de | 376 | } |
| T | 377 | |
| 378 | // trigger event if selection changed | |
| 379 | if (this.selection.join(',') != select_before) | |
| 380 | this.trigger_event('select'); | |
| 381 | ||
| 382 | if (this.last_selected != 0 && this.rows[this.last_selected]) | |
| 383 | this.set_classname(this.rows[this.last_selected].obj, 'focused', false); | |
| a9dda5 | 384 | |
| T | 385 | // unselect if toggleselect is active and the same row was clicked again |
| 386 | if (this.toggleselect && this.last_selected == id) | |
| 387 | { | |
| 388 | this.clear_selection(); | |
| 389 | id = null; | |
| 390 | } | |
| 391 | else | |
| 392 | this.set_classname(this.rows[id].obj, 'focused', true); | |
| 393 | ||
| b2fb95 | 394 | if (!this.selection.length) |
| T | 395 | this.shift_start = null; |
| 6b47de | 396 | |
| T | 397 | this.last_selected = id; |
| 398 | }, | |
| 399 | ||
| 400 | ||
| 401 | /** | |
| 402 | * Alias method for select_row | |
| 403 | */ | |
| 404 | select: function(id) | |
| 405 | { | |
| 406 | this.select_row(id, false); | |
| 407 | this.scrollto(id); | |
| 408 | }, | |
| 409 | ||
| 410 | ||
| 411 | /** | |
| 412 | * Select row next to the last selected one. | |
| 413 | * Either below or above. | |
| 414 | */ | |
| 415 | select_next: function() | |
| 416 | { | |
| 417 | var next_row = this.get_next_row(); | |
| 418 | var prev_row = this.get_prev_row(); | |
| 419 | var new_row = (next_row) ? next_row : prev_row; | |
| 420 | if (new_row) | |
| 421 | this.select_row(new_row.uid, false, false); | |
| 422 | }, | |
| 423 | ||
| 424 | ||
| 425 | /** | |
| 426 | * Perform selection when shift key is pressed | |
| 427 | */ | |
| 428 | shift_select: function(id, control) | |
| 429 | { | |
| b00bd0 | 430 | if (!this.rows[this.shift_start] || !this.selection.length) |
| f2892d | 431 | this.shift_start = id; |
| A | 432 | |
| 6b47de | 433 | var from_rowIndex = this.rows[this.shift_start].obj.rowIndex; |
| T | 434 | var to_rowIndex = this.rows[id].obj.rowIndex; |
| 435 | ||
| 436 | var i = ((from_rowIndex < to_rowIndex)? from_rowIndex : to_rowIndex); | |
| 437 | var j = ((from_rowIndex > to_rowIndex)? from_rowIndex : to_rowIndex); | |
| 438 | ||
| 439 | // iterate through the entire message list | |
| 440 | for (var n in this.rows) | |
| 441 | { | |
| 442 | if ((this.rows[n].obj.rowIndex >= i) && (this.rows[n].obj.rowIndex <= j)) | |
| 443 | { | |
| 444 | if (!this.in_selection(n)) | |
| 445 | this.highlight_row(n, true); | |
| 446 | } | |
| 447 | else | |
| 448 | { | |
| 449 | if (this.in_selection(n) && !control) | |
| 450 | this.highlight_row(n, true); | |
| 451 | } | |
| 452 | } | |
| 453 | }, | |
| 454 | ||
| 455 | ||
| 456 | /** | |
| 457 | * Check if given id is part of the current selection | |
| 458 | */ | |
| 459 | in_selection: function(id) | |
| 460 | { | |
| 461 | for(var n in this.selection) | |
| 462 | if (this.selection[n]==id) | |
| 463 | return true; | |
| 464 | ||
| 465 | return false; | |
| 466 | }, | |
| 467 | ||
| 468 | ||
| 469 | /** | |
| 470 | * Select each row in list | |
| 471 | */ | |
| 472 | select_all: function(filter) | |
| 473 | { | |
| 474 | if (!this.rows || !this.rows.length) | |
| 475 | return false; | |
| 476 | ||
| 1094cd | 477 | // reset but remember selection first |
| T | 478 | var select_before = this.selection.join(','); |
| 6b47de | 479 | this.clear_selection(); |
| T | 480 | |
| 481 | for (var n in this.rows) | |
| 482 | { | |
| 483 | if (!filter || this.rows[n][filter]==true) | |
| 484 | { | |
| 485 | this.last_selected = n; | |
| 486 | this.highlight_row(n, true); | |
| 487 | } | |
| 488 | } | |
| 489 | ||
| 1094cd | 490 | // trigger event if selection changed |
| T | 491 | if (this.selection.join(',') != select_before) |
| 492 | this.trigger_event('select'); | |
| 493 | ||
| d7c226 | 494 | this.focus(); |
| A | 495 | |
| 1094cd | 496 | return true; |
| 6b47de | 497 | }, |
| T | 498 | |
| 499 | ||
| 500 | /** | |
| 095d05 | 501 | * Unselect selected row(s) |
| 6b47de | 502 | */ |
| 095d05 | 503 | clear_selection: function(id) |
| 6b47de | 504 | { |
| 1094cd | 505 | var num_select = this.selection.length; |
| 095d05 | 506 | |
| A | 507 | // one row |
| 508 | if (id) | |
| 6b47de | 509 | { |
| 095d05 | 510 | for (var n=0; n<this.selection.length; n++) |
| A | 511 | if (this.selection[n] == id) |
| 512 | { | |
| 513 | this.selection.splice(n,1); | |
| 514 | break; | |
| 515 | } | |
| 516 | } | |
| 517 | // all rows | |
| 518 | else | |
| 519 | { | |
| 520 | for (var n=0; n<this.selection.length; n++) | |
| 521 | if (this.rows[this.selection[n]]) | |
| 522 | { | |
| 523 | this.set_classname(this.rows[this.selection[n]].obj, 'selected', false); | |
| 524 | this.set_classname(this.rows[this.selection[n]].obj, 'unfocused', false); | |
| 525 | } | |
| 526 | ||
| 527 | this.selection = new Array(); | |
| 6b47de | 528 | } |
| T | 529 | |
| 095d05 | 530 | if (num_select && !this.selection.length) |
| 1094cd | 531 | this.trigger_event('select'); |
| 6b47de | 532 | }, |
| T | 533 | |
| 534 | ||
| 535 | /** | |
| 536 | * Getter for the selection array | |
| 537 | */ | |
| 538 | get_selection: function() | |
| 539 | { | |
| 540 | return this.selection; | |
| 541 | }, | |
| 542 | ||
| 543 | ||
| 544 | /** | |
| 545 | * Return the ID if only one row is selected | |
| 546 | */ | |
| 547 | get_single_selection: function() | |
| 548 | { | |
| 549 | if (this.selection.length == 1) | |
| 550 | return this.selection[0]; | |
| 551 | else | |
| 552 | return null; | |
| 553 | }, | |
| 554 | ||
| 555 | ||
| 556 | /** | |
| 557 | * Highlight/unhighlight a row | |
| 558 | */ | |
| 559 | highlight_row: function(id, multiple) | |
| 560 | { | |
| 561 | if (this.rows[id] && !multiple) | |
| 562 | { | |
| df015d | 563 | if (this.selection.length > 1 || !this.in_selection(id)) |
| T | 564 | { |
| 565 | this.clear_selection(); | |
| 566 | this.selection[0] = id; | |
| 567 | this.set_classname(this.rows[id].obj, 'selected', true); | |
| 568 | } | |
| 6b47de | 569 | } |
| T | 570 | else if (this.rows[id]) |
| 571 | { | |
| 572 | if (!this.in_selection(id)) // select row | |
| 573 | { | |
| 574 | this.selection[this.selection.length] = id; | |
| 575 | this.set_classname(this.rows[id].obj, 'selected', true); | |
| 576 | } | |
| 577 | else // unselect row | |
| 578 | { | |
| 579 | var p = find_in_array(id, this.selection); | |
| 580 | var a_pre = this.selection.slice(0, p); | |
| 581 | var a_post = this.selection.slice(p+1, this.selection.length); | |
| 582 | this.selection = a_pre.concat(a_post); | |
| 583 | this.set_classname(this.rows[id].obj, 'selected', false); | |
| 584 | this.set_classname(this.rows[id].obj, 'unfocused', false); | |
| 585 | } | |
| 586 | } | |
| 587 | }, | |
| 588 | ||
| 589 | ||
| 590 | /** | |
| 591 | * Handler for keyboard events | |
| 592 | */ | |
| 593 | key_press: function(e) | |
| 594 | { | |
| 26f5b0 | 595 | if (this.focused != true) |
| 6b47de | 596 | return true; |
| T | 597 | |
| 26f5b0 | 598 | var keyCode = rcube_event.get_keycode(e); |
| 6b47de | 599 | var mod_key = rcube_event.get_modifier(e); |
| T | 600 | switch (keyCode) |
| 601 | { | |
| 602 | case 40: | |
| 603 | case 38: | |
| 26f5b0 | 604 | case 63233: // "down", in safari keypress |
| T | 605 | case 63232: // "up", in safari keypress |
| 606 | // Stop propagation so that the browser doesn't scroll | |
| 607 | rcube_event.cancel(e); | |
| 6b47de | 608 | return this.use_arrow_key(keyCode, mod_key); |
| T | 609 | default: |
| 110748 | 610 | this.shiftkey = e.shiftKey; |
| 6b47de | 611 | this.key_pressed = keyCode; |
| T | 612 | this.trigger_event('keypress'); |
| 6e6e89 | 613 | |
| f89f03 | 614 | if (this.key_pressed == this.BACKSPACE_KEY) |
| 6e6e89 | 615 | return rcube_event.cancel(e); |
| 6b47de | 616 | } |
| T | 617 | |
| 618 | return true; | |
| 619 | }, | |
| 620 | ||
| 9e7a1b | 621 | /** |
| T | 622 | * Handler for keydown events |
| 623 | */ | |
| 624 | key_down: function(e) | |
| 625 | { | |
| 626 | switch (rcube_event.get_keycode(e)) | |
| 627 | { | |
| 628 | case 40: | |
| 629 | case 38: | |
| 630 | case 63233: | |
| 631 | case 63232: | |
| 632 | if (!rcube_event.get_modifier(e) && this.focused) | |
| 633 | return rcube_event.cancel(e); | |
| 634 | ||
| 635 | default: | |
| 636 | } | |
| 637 | ||
| 638 | return true; | |
| 639 | }, | |
| 640 | ||
| 6b47de | 641 | |
| T | 642 | /** |
| 643 | * Special handling method for arrow keys | |
| 644 | */ | |
| 645 | use_arrow_key: function(keyCode, mod_key) | |
| 646 | { | |
| 647 | var new_row; | |
| e9b57b | 648 | // Safari uses the nonstandard keycodes 63232/63233 for up/down, if we're |
| A | 649 | // using the keypress event (but not the keydown or keyup event). |
| 650 | if (keyCode == 40 || keyCode == 63233) // down arrow key pressed | |
| 6b47de | 651 | new_row = this.get_next_row(); |
| e9b57b | 652 | else if (keyCode == 38 || keyCode == 63232) // up arrow key pressed |
| 6b47de | 653 | new_row = this.get_prev_row(); |
| T | 654 | |
| 655 | if (new_row) | |
| 656 | { | |
| 657 | this.select_row(new_row.uid, mod_key, true); | |
| 658 | this.scrollto(new_row.uid); | |
| 659 | } | |
| 660 | ||
| 661 | return false; | |
| 662 | }, | |
| 663 | ||
| 664 | ||
| 665 | /** | |
| 666 | * Try to scroll the list to make the specified row visible | |
| 667 | */ | |
| 668 | scrollto: function(id) | |
| 669 | { | |
| 670 | var row = this.rows[id].obj; | |
| 671 | if (row && this.frame) | |
| 672 | { | |
| 673 | var scroll_to = Number(row.offsetTop); | |
| 674 | ||
| 675 | if (scroll_to < Number(this.frame.scrollTop)) | |
| 676 | this.frame.scrollTop = scroll_to; | |
| 677 | else if (scroll_to + Number(row.offsetHeight) > Number(this.frame.scrollTop) + Number(this.frame.offsetHeight)) | |
| 678 | this.frame.scrollTop = (scroll_to + Number(row.offsetHeight)) - Number(this.frame.offsetHeight); | |
| 679 | } | |
| 680 | }, | |
| 681 | ||
| 682 | ||
| 683 | /** | |
| 684 | * Handler for mouse move events | |
| 685 | */ | |
| 686 | drag_mouse_move: function(e) | |
| 687 | { | |
| 688 | if (this.drag_start) | |
| 689 | { | |
| 690 | // check mouse movement, of less than 3 pixels, don't start dragging | |
| 691 | var m = rcube_event.get_mouse_pos(e); | |
| 692 | 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)) | |
| 693 | return false; | |
| 694 | ||
| 695 | if (!this.draglayer) | |
| 633142 | 696 | this.draglayer = new rcube_layer('rcmdraglayer', {x:0, y:0, vis:0, zindex:2000}); |
| 6b47de | 697 | |
| T | 698 | // get subjects of selectedd messages |
| 699 | var names = ''; | |
| d24d20 | 700 | var c, i, node, subject, obj; |
| 6b47de | 701 | for(var n=0; n<this.selection.length; n++) |
| T | 702 | { |
| 703 | if (n>12) // only show 12 lines | |
| 704 | { | |
| 705 | names += '...'; | |
| 706 | break; | |
| 707 | } | |
| 708 | ||
| 709 | if (this.rows[this.selection[n]].obj) | |
| 710 | { | |
| 711 | obj = this.rows[this.selection[n]].obj; | |
| 712 | subject = ''; | |
| 713 | ||
| d24d20 | 714 | for(c=0, i=0; i<obj.childNodes.length; i++) |
| T | 715 | { |
| 716 | if (obj.childNodes[i].nodeName == 'TD') | |
| 6b47de | 717 | { |
| d24d20 | 718 | if (((node = obj.childNodes[i].firstChild) && (node.nodeType==3 || node.nodeName=='A')) && |
| T | 719 | (this.subject_col < 0 || (this.subject_col >= 0 && this.subject_col == c))) |
| 720 | { | |
| 721 | subject = node.nodeType==3 ? node.data : node.innerHTML; | |
| 722 | names += (subject.length > 50 ? subject.substring(0, 50)+'...' : subject) + '<br />'; | |
| 723 | break; | |
| 724 | } | |
| 725 | c++; | |
| 6b47de | 726 | } |
| d24d20 | 727 | } |
| 6b47de | 728 | } |
| T | 729 | } |
| 730 | ||
| 731 | this.draglayer.write(names); | |
| 732 | this.draglayer.show(1); | |
| 733 | ||
| 734 | this.drag_active = true; | |
| 735 | this.trigger_event('dragstart'); | |
| 736 | } | |
| 737 | ||
| 738 | if (this.drag_active && this.draglayer) | |
| 739 | { | |
| 740 | var pos = rcube_event.get_mouse_pos(e); | |
| 741 | this.draglayer.move(pos.x+20, pos.y-5); | |
| f89f03 | 742 | this.trigger_event('dragmove', e); |
| 6b47de | 743 | } |
| T | 744 | |
| 745 | this.drag_start = false; | |
| 746 | ||
| 747 | return false; | |
| 748 | }, | |
| 749 | ||
| 750 | ||
| 751 | /** | |
| 752 | * Handler for mouse up events | |
| 753 | */ | |
| 754 | drag_mouse_up: function(e) | |
| 755 | { | |
| 756 | document.onmousemove = null; | |
| 757 | ||
| 758 | if (this.draglayer && this.draglayer.visible) | |
| 759 | this.draglayer.show(0); | |
| 760 | ||
| 761 | this.drag_active = false; | |
| 762 | this.trigger_event('dragend'); | |
| 763 | ||
| 764 | rcube_event.remove_listener({element:document, event:'mousemove', object:this, method:'drag_mouse_move'}); | |
| 765 | rcube_event.remove_listener({element:document, event:'mouseup', object:this, method:'drag_mouse_up'}); | |
| 766 | ||
| 287227 | 767 | this.focus(); |
| A | 768 | |
| 6b47de | 769 | return rcube_event.cancel(e); |
| T | 770 | }, |
| 771 | ||
| 772 | ||
| 773 | ||
| 774 | /** | |
| 775 | * set/unset a specific class name | |
| 776 | */ | |
| 777 | set_classname: function(obj, classname, set) | |
| 778 | { | |
| 779 | var reg = new RegExp('\s*'+classname, 'i'); | |
| 780 | if (!set && obj.className.match(reg)) | |
| 781 | obj.className = obj.className.replace(reg, ''); | |
| 782 | else if (set && !obj.className.match(reg)) | |
| 783 | obj.className += ' '+classname; | |
| 784 | }, | |
| 785 | ||
| 786 | ||
| 787 | /** | |
| 788 | * Setter for object event handlers | |
| 789 | * | |
| 790 | * @param {String} Event name | |
| 791 | * @param {Function} Handler function | |
| 792 | * @return Listener ID (used to remove this handler later on) | |
| 793 | */ | |
| 794 | addEventListener: function(evt, handler) | |
| 795 | { | |
| 796 | if (this.events[evt]) { | |
| 797 | var handle = this.events[evt].length; | |
| 798 | this.events[evt][handle] = handler; | |
| 799 | return handle; | |
| 800 | } | |
| 801 | else | |
| 802 | return false; | |
| 803 | }, | |
| 804 | ||
| 805 | ||
| 806 | /** | |
| 807 | * Removes a specific event listener | |
| 808 | * | |
| 809 | * @param {String} Event name | |
| 810 | * @param {Int} Listener ID to remove | |
| 811 | */ | |
| 812 | removeEventListener: function(evt, handle) | |
| 813 | { | |
| 814 | if (this.events[evt] && this.events[evt][handle]) | |
| 815 | this.events[evt][handle] = null; | |
| 816 | }, | |
| 817 | ||
| 818 | ||
| 819 | /** | |
| 820 | * This will execute all registered event handlers | |
| 821 | * @private | |
| 822 | */ | |
| f89f03 | 823 | trigger_event: function(evt, p) |
| 6b47de | 824 | { |
| T | 825 | if (this.events[evt] && this.events[evt].length) { |
| 826 | for (var i=0; i<this.events[evt].length; i++) | |
| 827 | if (typeof(this.events[evt][i]) == 'function') | |
| f89f03 | 828 | this.events[evt][i](this, p); |
| 6b47de | 829 | } |
| T | 830 | } |
| 831 | ||
| 832 | ||
| 833 | }; | |
| 834 | ||
