Aleksander Machniak
2016-04-27 877b911dc4c6d0bbeb18a32bbd10f3669007c0fd
commit | author | age
c7dcb3 1 /**
T 2  * Roundcube functions for default skin interface
74d4c7 3  *
f5aecf 4  * Copyright (c) 2013, The Roundcube Dev Team
74d4c7 5  *
T 6  * The contents are subject to the Creative Commons Attribution-ShareAlike
7  * License. It is allowed to copy, distribute, transmit and to adapt the work
8  * by keeping credits to the original autors in the README file.
9  * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
190ae4 10  *
TB 11  * @license magnet:?xt=urn:btih:90dc5c0be029de84e523b9b3922520e79e0e6f08&dn=cc0.txt CC0-1.0
c7dcb3 12  */
T 13
14 function rcube_mail_ui()
15 {
68e13c 16   var env = {};
c7dcb3 17   var popups = {};
T 18   var popupconfig = {
19     forwardmenu:        { editable:1 },
20     searchmenu:         { editable:1, callback:searchmenu },
bc2c43 21     attachmentmenu:     { },
c7dcb3 22     listoptions:        { editable:1 },
T 23     groupmenu:          { above:1 },
24     mailboxmenu:        { above:1 },
4be86f 25     spellmenu:          { callback: spellmenu },
6789bf 26     'folder-selector':  { iconized:1 }
c7dcb3 27   };
T 28
29   var me = this;
918bb9 30   var mailviewsplit;
74d4c7 31   var compose_headers = {};
f52efb 32   var prefs;
c7dcb3 33
T 34   // export public methods
68e13c 35   this.set = setenv;
c7dcb3 36   this.init = init;
bab043 37   this.init_tabs = init_tabs;
68e13c 38   this.show_about = show_about;
c7dcb3 39   this.show_popup = show_popup;
e8bcf0 40   this.toggle_popup = toggle_popup;
443b92 41   this.add_popup = add_popup;
c7dcb3 42   this.set_searchmod = set_searchmod;
1bbf8c 43   this.set_searchscope = set_searchscope;
74d4c7 44   this.show_uploadform = show_uploadform;
T 45   this.show_header_row = show_header_row;
46   this.hide_header_row = hide_header_row;
de1584 47   this.update_quota = update_quota;
6d6725 48   this.get_pref = get_pref;
TB 49   this.save_pref = save_pref;
66233b 50   this.folder_search_init = folder_search_init;
68e13c 51
T 52
542415 53   // set minimal mode on small screens (don't wait for document.ready)
TB 54   if (window.$ && document.body) {
6d6725 55     var minmode = get_pref('minimalmode');
542415 56     if (parseInt(minmode) || (minmode === null && $(window).height() < 850)) {
TB 57       $(document.body).addClass('minimal');
58     }
4910b0 59
TB 60     if (bw.tablet) {
61       $('#viewport').attr('content', "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0");
62     }
542415 63   }
TB 64
65
68e13c 66   /**
T 67    *
68    */
69   function setenv(key, val)
70   {
71     env[key] = val;
72   }
c7dcb3 73
T 74   /**
6d6725 75    * Get preference stored in browser
TB 76    */
77   function get_pref(key)
78   {
f52efb 79     if (!prefs) {
b0b9cf 80       prefs = rcmail.local_storage_get_item('prefs.larry', {});
f52efb 81     }
TB 82
83     // fall-back to cookies
84     if (prefs[key] == null) {
85       var cookie = rcmail.get_cookie(key);
86       if (cookie != null) {
87         prefs[key] = cookie;
88
b0b9cf 89         // copy value to local storage and remove cookie (if localStorage is supported)
AM 90         if (rcmail.local_storage_set_item('prefs.larry', prefs)) {
f52efb 91           rcmail.set_cookie(key, cookie, new Date());  // expire cookie
TB 92         }
93       }
94     }
95
96     return prefs[key];
6d6725 97   }
TB 98
99   /**
100    * Saves preference value to browser storage
101    */
102   function save_pref(key, val)
103   {
f52efb 104     prefs[key] = val;
TB 105
b0b9cf 106     // write prefs to local storage (if supported)
AM 107     if (!rcmail.local_storage_set_item('prefs.larry', prefs)) {
f52efb 108       // store value in cookie
TB 109       var exp = new Date();
110       exp.setYear(exp.getFullYear() + 1);
111       rcmail.set_cookie(key, val, exp);
112     }
6d6725 113   }
TB 114
115   /**
5ff7ba 116    * Initialize UI
T 117    * Called on document.ready
c7dcb3 118    */
T 119   function init()
120   {
0e530b 121     rcmail.addEventListener('message', message_displayed);
5ff7ba 122
542415 123     /*** prepare minmode functions ***/
TB 124     $('#taskbar a').each(function(i,elem){
125       $(elem).append('<span class="tooltip">' + $('.button-inner', this).html() + '</span>')
126     });
127
128     $('#taskbar .minmodetoggle').click(function(e){
129       var ismin = $(document.body).toggleClass('minimal').hasClass('minimal');
6d6725 130       save_pref('minimalmode', ismin?1:0);
542415 131       $(window).resize();
TB 132     });
133
5ff7ba 134     /***  mail task  ***/
c7dcb3 135     if (rcmail.env.task == 'mail') {
b2992d 136       rcmail.addEventListener('menu-open', menu_toggle)
TB 137         .addEventListener('menu-close', menu_toggle)
138         .addEventListener('menu-save', save_listoptions)
1d6082 139         .addEventListener('responseafterlist', function(e){ switch_view_mode(rcmail.env.threading ? 'thread' : 'list', true) })
TB 140         .addEventListener('responseaftersearch', function(e){ switch_view_mode(rcmail.env.threading ? 'thread' : 'list', true) });
74d4c7 141
T 142       var dragmenu = $('#dragmessagemenu');
143       if (dragmenu.length) {
a45f9b 144         rcmail.gui_object('dragmenu', 'dragmessagemenu');
AM 145         popups.dragmenu = dragmenu;
74d4c7 146       }
918bb9 147
c7dcb3 148       if (rcmail.env.action == 'show' || rcmail.env.action == 'preview') {
772bec 149         rcmail.addEventListener('enable-command', enable_command)
AM 150           .addEventListener('aftershow-headers', function() { layout_messageview(); })
151           .addEventListener('afterhide-headers', function() { layout_messageview(); });
b80f4b 152         $('#previewheaderstoggle').click(function(e) {
TB 153             toggle_preview_headers();
154             if (this.blur && !rcube_event.is_keyboard(e))
155                 this.blur();
156             return false;
157         });
bc2c43 158
AM 159         // add menu link for each attachment
160         $('#attachment-list > li').each(function() {
d2bf33 161           $(this).append($('<a class="drop" tabindex="0" aria-haspopup="true">Show options</a>')
b2992d 162               .bind('click keypress', function(e) {
TB 163                   if (e.type != 'keypress' || rcube_event.get_keycode(e) == 13) {
164                       attachmentmenu(this, e);
165                       return false;
166                   }
167               })
d2bf33 168           );
bc2c43 169         });
6e5bf9 170
P 171         if (get_pref('previewheaders') == '1') {
172           toggle_preview_headers();
173         }
74d4c7 174       }
T 175       else if (rcmail.env.action == 'compose') {
772bec 176         rcmail.addEventListener('aftersend-attachment', show_uploadform)
AM 177           .addEventListener('aftertoggle-editor', function(e){
178             window.setTimeout(function(){ layout_composeview() }, 200);
179             if (e && e.mode)
180               $("select[name='editorSelector']").val(e.mode);
181           });
74d4c7 182
b4e41f 183         // Show input elements with non-empty value
15482b 184         var f, v, field, fields = ['cc', 'bcc', 'replyto', 'followupto'];
AM 185         for (f=0; f < fields.length; f++) {
186           v = fields[f]; field = $('#_'+v);
187           if (field.length) {
188             field.on('change', {v: v}, function(e) { if (this.value) show_header_row(e.data.v, true); });
189             if (field.val() != '')
190               show_header_row(v, true);
191           }
b4e41f 192         }
T 193
ea0866 194         $('#composeoptionstoggle').click(function(e){
d0d7f4 195           var expanded = $('#composeoptions').toggle().is(':visible');
TB 196           $('#composeoptionstoggle').toggleClass('remove').attr('aria-expanded', expanded ? 'true' : 'false');
74d4c7 197           layout_composeview();
d0d7f4 198           save_pref('composeoptions', expanded ? '1' : '0');
ea0866 199           if (!rcube_event.is_keyboard(e))
TB 200             this.blur();
74d4c7 201           return false;
bab043 202         }).css('cursor', 'pointer');
6d6725 203
TB 204         if (get_pref('composeoptions') !== '0') {
205           $('#composeoptionstoggle').click();
206         }
786392 207
TB 208         // adjust hight when textarea starts to scroll
209         $("textarea[name='_to'], textarea[name='_cc'], textarea[name='_bcc']").change(function(e){ adjust_compose_editfields(this); }).change();
210         rcmail.addEventListener('autocomplete_insert', function(p){ adjust_compose_editfields(p.field); });
74d4c7 211
eb5147 212         // toggle compose options if opened in new window and they were visible before
32da69 213         var opener_rc = rcmail.opener();
AM 214         if (opener_rc && opener_rc.env.action == 'compose' && $('#composeoptionstoggle', opener.document).hasClass('remove'))
eb5147 215           $('#composeoptionstoggle').click();
TB 216
74d4c7 217         new rcube_splitter({ id:'composesplitterv', p1:'#composeview-left', p2:'#composeview-right',
a292e4 218           orientation:'v', relative:true, start:206, min:170, size:12, render:layout_composeview }).init();
918bb9 219       }
T 220       else if (rcmail.env.action == 'list' || !rcmail.env.action) {
5ff7ba 221         var previewframe = $('#mailpreviewframe').is(':visible');
f331da 222
AM 223         $('#mailpreviewtoggle').addClass(previewframe ? 'enabled' : 'closed').attr('aria-expanded', previewframe ? 'true' : 'false')
224           .click(function(e) { toggle_preview_pane(e); return false; });
225         $('#maillistmode').addClass(rcmail.env.threading ? '' : 'selected').click(function(e) { switch_view_mode('list'); return false; });
226         $('#mailthreadmode').addClass(rcmail.env.threading ? 'selected' : '').click(function(e) { switch_view_mode('thread'); return false; });
847d31 227
5ff7ba 228         mailviewsplit = new rcube_splitter({ id:'mailviewsplitter', p1:'#mailview-top', p2:'#mailview-bottom',
c8dc07 229           orientation:'h', relative:true, start:310, min:150, size:12, offset:4 });
5ff7ba 230         if (previewframe)
T 231           mailviewsplit.init();
232
772bec 233         rcmail.addEventListener('setquota', update_quota)
AM 234           .addEventListener('enable-command', enable_command)
235           .addEventListener('afterimport-messages', show_uploadform);
918bb9 236       }
049428 237       else if (rcmail.env.action == 'get') {
AM 238         new rcube_splitter({ id:'mailpartsplitterv', p1:'#messagepartheader', p2:'#messagepartcontainer',
239           orientation:'v', relative:true, start:226, min:150, size:12}).init();
240       }
847d31 241
918bb9 242       if ($('#mailview-left').length) {
T 243         new rcube_splitter({ id:'mailviewsplitterv', p1:'#mailview-left', p2:'#mailview-right',
a292e4 244           orientation:'v', relative:true, start:206, min:150, size:12, callback:render_mailboxlist, render:resize_leftcol }).init();
c7dcb3 245       }
28e18c 246     }
5ff7ba 247     /***  settings task  ***/
28e18c 248     else if (rcmail.env.task == 'settings') {
4f1b7a 249       rcmail.addEventListener('init', function(){
T 250         var tab = '#settingstabpreferences';
251         if (rcmail.env.action)
252           tab = '#settingstab' + (rcmail.env.action.indexOf('identity')>0 ? 'identities' : rcmail.env.action.replace(/\./g, ''));
28e18c 253
4f1b7a 254         $(tab).addClass('selected')
T 255           .children().first().removeAttr('onclick').click(function() { return false; });
256       });
918bb9 257
T 258       if (rcmail.env.action == 'folders') {
259         new rcube_splitter({ id:'folderviewsplitter', p1:'#folderslist', p2:'#folder-details',
f45a97 260           orientation:'v', relative:true, start:266, min:180, size:12 }).init();
fe8374 261
A 262         rcmail.addEventListener('setquota', update_quota);
66233b 263
AM 264         folder_search_init($('#folderslist'));
918bb9 265       }
7c2a93 266       else if (rcmail.env.action == 'identities') {
918bb9 267         new rcube_splitter({ id:'identviewsplitter', p1:'#identitieslist', p2:'#identity-details',
f45a97 268           orientation:'v', relative:true, start:266, min:180, size:12 }).init();
918bb9 269       }
64f40e 270       else if (rcmail.env.action == 'responses') {
AM 271         new rcube_splitter({ id:'responseviewsplitter', p1:'#identitieslist', p2:'#identity-details',
272           orientation:'v', relative:true, start:266, min:180, size:12 }).init();
273       }
eac1b7 274       else if (rcmail.env.action == 'preferences' || !rcmail.env.action) {
389fa1 275         new rcube_splitter({ id:'prefviewsplitter', p1:'#sectionslist', p2:'#preferences-box',
AM 276           orientation:'v', relative:true, start:266, min:180, size:12 }).init();
277       }
7be8a9 278       else if (rcmail.env.action == 'edit-prefs') {
64ed17 279         var legend = $('#preferences-details fieldset.advanced legend'),
AM 280           toggle = $('<a href="#toggle"></a>')
77043f 281             .text(env.toggleoptions)
TB 282             .attr('title', env.toggleoptions)
64ed17 283             .addClass('advanced-toggle');
7be8a9 284
64ed17 285         legend.click(function(e) {
AM 286           toggle.html($(this).hasClass('collapsed') ? '&#9650;' : '&#9660;');
287
288           $(this).toggleClass('collapsed')
289             .closest('fieldset').children('.propform').toggle()
290         }).append(toggle).addClass('collapsed')
291
292         // this magically fixes incorrect position of toggle link created above in Firefox 3.6
293         if (bw.mz)
294           legend.parents('form').css('display', 'inline');
7be8a9 295       }
c7dcb3 296     }
5ff7ba 297     /***  addressbook task  ***/
bab043 298     else if (rcmail.env.task == 'addressbook') {
772bec 299       rcmail.addEventListener('afterupload-photo', show_uploadform)
AM 300         .addEventListener('beforepushgroup', push_contactgroup)
877b91 301         .addEventListener('beforepopgroup', pop_contactgroup)
AM 302         .addEventListener('menu-open', menu_toggle)
303         .addEventListener('menu-close', menu_toggle);
68e13c 304
T 305       if (rcmail.env.action == '') {
306         new rcube_splitter({ id:'addressviewsplitterd', p1:'#addressview-left', p2:'#addressview-right',
a292e4 307           orientation:'v', relative:true, start:206, min:150, size:12, render:resize_leftcol }).init();
68e13c 308         new rcube_splitter({ id:'addressviewsplitter', p1:'#addresslist', p2:'#contacts-box',
a292e4 309           orientation:'v', relative:true, start:266, min:260, size:12 }).init();
68e13c 310       }
a45f9b 311
AM 312       var dragmenu = $('#dragcontactmenu');
313       if (dragmenu.length) {
314         rcmail.gui_object('dragmenu', 'dragcontactmenu');
315         popups.dragmenu = dragmenu;
316       }
822a1e 317     }
bab043 318
T 319     // turn a group of fieldsets into tabs
320     $('.tabbed').each(function(idx, elem){ init_tabs(elem); })
c7dcb3 321
7a32e9 322     // decorate select elements
85f11f 323     $('select.decorated').each(function(){
A 324       if (bw.opera) {
325         $(this).removeClass('decorated');
326         return;
327       }
7a32e9 328
3d122f 329       var select = $(this),
12e69c 330         parent = select.parent(),
c8dc07 331         height = Math.max(select.height(), 26) - 2,
3d122f 332         width = select.width() - 22,
AM 333         title = $('option', this).first().text();
334
85f11f 335       if ($('option:selected', this).val() != '')
A 336         title = $('option:selected', this).text();
7a32e9 337
3445ca 338       var overlay = $('<a class="menuselector" tabindex="-1"><span class="handle">' + title + '</span></a>')
85f11f 339         .css('position', 'absolute')
A 340         .offset(select.position())
3d122f 341         .insertAfter(select);
85f11f 342
77fad1 343       overlay.children().width(width).height(height).css('line-height', (height - 1) + 'px');
3d122f 344
77fad1 345       if (parent.css('position') != 'absolute')
TB 346         parent.css('position', 'relative');
3d122f 347
8ba01c 348       // re-set original select width to fix click action and options width in some browsers
12e69c 349       select.width(overlay.width())
3445ca 350         .on(bw.mz ? 'change keyup' : 'change', function() {
12e69c 351           var val = $('option:selected', this).text();
AM 352           $(this).next().children().text(val);
353         });
e8bcf0 354
TB 355       select
356         .on('focus', function(e){ overlay.addClass('focus'); })
357         .on('blur', function(e){ overlay.removeClass('focus'); });
85f11f 358     });
7a32e9 359
3a0f82 360     // set min-width to show all toolbar buttons
f8a9c2 361     var screen = $('body.minwidth');
3a0f82 362     if (screen.length) {
AM 363       screen.css('min-width', $('.toolbar').width() + $('#quicksearchbar').width() + $('#searchfilter').width() + 30);
364     }
365
8ce602 366     // don't use $(window).resize() due to some unwanted side-effects
TB 367     window.onresize = resize;
98d096 368     resize();
14a3f2 369   }
T 370
371   /**
28e18c 372    * Update UI on window resize
T 373    */
d227ed 374   function resize(e)
28e18c 375   {
d227ed 376     // resize in intervals to prevent lags and double onresize calls in Chrome (#1489005)
AM 377     var interval = e ? 10 : 0;
98d096 378
d227ed 379     if (rcmail.resize_timeout)
AM 380       window.clearTimeout(rcmail.resize_timeout);
bbbacd 381
d227ed 382     rcmail.resize_timeout = window.setTimeout(function() {
AM 383       if (rcmail.env.task == 'mail') {
384         if (rcmail.env.action == 'show' || rcmail.env.action == 'preview')
385           layout_messageview();
386         else if (rcmail.env.action == 'compose')
387           layout_composeview();
98d096 388       }
d227ed 389
AM 390       // make iframe footer buttons float if scrolling is active
391       $('body.iframe .footerleft').each(function(){
392         var footer = $(this),
393           body = $(document.body),
394           floating = footer.hasClass('floating'),
395           overflow = body.outerHeight(true) > $(window).height();
396
397         if (overflow != floating) {
398           var action = overflow ? 'addClass' : 'removeClass';
399           footer[action]('floating');
400           body[action]('floatingbuttons');
401         }
402       });
403     }, interval);
c7dcb3 404   }
T 405
406   /**
0e530b 407    * Triggered when a new user message is displayed
T 408    */
409   function message_displayed(p)
410   {
34003c 411     var siblings = $(p.object).siblings('div');
TB 412     if (siblings.length)
413       $(p.object).insertBefore(siblings.first());
414
0e530b 415     // show a popup dialog on errors
30eb9e 416     if (p.type == 'error' && rcmail.env.task != 'login') {
c50eee 417       // hide original message object, we don't want both
AM 418       rcmail.hide_message(p.object);
419
464a0f 420       if (me.message_timer) {
TB 421         window.clearTimeout(me.message_timer);
422       }
2a8912 423
0e530b 424       if (!me.messagedialog) {
464a0f 425         me.messagedialog = $('<div>').addClass('popupdialog').hide();
0e530b 426       }
T 427
464a0f 428       var msg = p.message,
c50eee 429         dialog_close = function() {
AM 430           // check if dialog is still displayed, to prevent from js error
431           me.messagedialog.is(':visible') && me.messagedialog.dialog('destroy').hide();
432         };
464a0f 433
2a8912 434       if (me.messagedialog.is(':visible') && me.messagedialog.text() != msg)
464a0f 435         msg = me.messagedialog.html() + '<p>' + p.message + '</p>';
TB 436
437       me.messagedialog.html(msg)
0e530b 438         .dialog({
T 439           resizable: false,
440           closeOnEscape: true,
441           dialogClass: 'popupmessage ' + p.type,
71e9ef 442           title: env.errortitle,
c50eee 443           close: dialog_close,
AM 444           position: ['center', 'center'],
445           hide: {effect: 'fadeOut'},
0e530b 446           width: 420,
T 447           minHeight: 90
448         }).show();
e493c8 449
a539ce 450       me.messagedialog.closest('div[role=dialog]').attr('role', 'alertdialog');
TB 451
d981aa 452       if (p.timeout > 0)
TB 453         me.message_timer = window.setTimeout(dialog_close, p.timeout);
0e530b 454     }
T 455   }
456
457
458   /**
c7dcb3 459    * Adjust UI objects of the mail view screen
T 460    */
28e18c 461   function layout_messageview()
c7dcb3 462   {
dd5258 463     $('#messagecontent').css('top', ($('#messageheader').outerHeight() + 1) + 'px');
c7dcb3 464     $('#message-objects div a').addClass('button');
76248c 465
c7dcb3 466     if (!$('#attachment-list li').length) {
d2bf33 467       $('div.rightcol').hide().attr('aria-hidden', 'true');
b540ed 468       $('div.leftcol').css('margin-right', '0');
c7dcb3 469     }
T 470   }
918bb9 471
T 472
473   function render_mailboxlist(splitter)
474   {
0e530b 475     // TODO: implement smart shortening of long folder names
918bb9 476   }
T 477
478
479   function resize_leftcol(splitter)
480   {
c8dc07 481     // STUB
74d4c7 482   }
T 483
786392 484   function adjust_compose_editfields(elem)
TB 485   {
486     if (elem.nodeName == 'TEXTAREA') {
487       var $elem = $(elem), line_height = 14,  // hard-coded because some browsers only provide the outer height in elem.clientHeight
488         content_height = elem.scrollHeight,
489         rows = elem.value.length > 80 && content_height > line_height*1.5 ? 2 : 1;
490       $elem.css('height', (line_height*rows) + 'px');
491       layout_composeview();
492     }
493   }
74d4c7 494
T 495   function layout_composeview()
496   {
497     var body = $('#composebody'),
071c78 498       form = $('#compose-content'),
74d4c7 499       bottom = $('#composeview-bottom'),
edfe79 500       w, h, bh, ovflw, btns = 0,
TB 501       minheight = 300,
74d4c7 502
6fa5b4 503     bh = form.height() - bottom.position().top;
edfe79 504     ovflw = minheight - bh;
TB 505     btns = ovflw > -100 ? 0 : 40;
6fa5b4 506     bottom.height(Math.max(minheight, bh));
edfe79 507     form.css('overflow', ovflw > 0 ? 'auto' : 'hidden');
74d4c7 508
4be86f 509     w = body.parent().width() - 5;
6fa5b4 510     h = body.parent().height() - 8;
74d4c7 511     body.width(w).height(h);
T 512
b21f8b 513     $('#composebodycontainer > div').width(w+8);
89d6ce 514     $('#composebody_ifr').height(h + 4 - $('div.mce-toolbar').height());
421ed1 515     $('#googie_edit_layer').width(w).height(h);
edfe79 516 //    $('#composebodycontainer')[(btns ? 'addClass' : 'removeClass')]('buttons');
TB 517 //    $('#composeformbuttons')[(btns ? 'show' : 'hide')]();
fe8374 518
071c78 519     var abooks = $('#directorylist');
d1cd22 520     if (abooks.length)
TB 521       $('#compose-contacts .scroller').css('top', abooks.position().top + abooks.outerHeight());
918bb9 522   }
T 523
c7dcb3 524
847d31 525   function update_quota(p)
T 526   {
c5f068 527     var element = $('#quotadisplay'), menu = $('#quotamenu'),
AM 528       step = 24, step_count = 20,
3d122f 529       y = p.total ? Math.ceil(p.percent / 100 * step_count) * step : 0;
AM 530
531     // never show full-circle if quota is close to 100% but below.
532     if (p.total && y == step * step_count && p.percent < 100)
533       y -= step;
534
c5f068 535     element.css('background-position', '0 -' + y + 'px');
AM 536
537     if (p.table) {
538       if (!menu.length)
539         menu = $('<div id="quotamenu" class="popupmenu">').appendTo($('body'));
540
541       menu.html(p.table);
542       element.css('cursor', 'pointer').off('click').on('click', function(e) {
543         return rcmail.command('menu-open', 'quotamenu', e.target, e);
544       });
545     }
847d31 546   }
T 547
66233b 548   function folder_search_init(container)
AM 549   {
550     // animation to unfold list search box
551     $('.boxtitle a.search', container).click(function(e) {
552       var title = $('.boxtitle', container),
553         box = $('.listsearchbox', container),
e9ecd4 554         dir = box.is(':visible') ? -1 : 1,
0fddf7 555         height = 34 + ($('select', box).length ? 22 : 0);
66233b 556
AM 557       box.slideToggle({
558         duration: 160,
559         progress: function(animation, progress) {
560           if (dir < 0) progress = 1 - progress;
e9ecd4 561             $('.scroller', container).css('top', (title.outerHeight() + height * progress) + 'px');
66233b 562         },
AM 563         complete: function() {
564           box.toggleClass('expanded');
565           if (box.is(':visible')) {
566             box.find('input[type=text]').focus();
0fddf7 567             height = 34 + ($('select', box).length ? $('select', box).outerHeight() + 4 : 0);
TB 568             $('.scroller', container).css('top', (title.outerHeight() + height) + 'px');
66233b 569           }
AM 570           else {
571             $('a.reset', box).click();
572           }
573           // TODO: save state in localStorage
574         }
575       });
576
577       return false;
578     });
579   }
847d31 580
235504 581   function enable_command(p)
AM 582   {
b972b4 583     if (p.command == 'reply-list' && rcmail.env.reply_all_mode == 1) {
235504 584       var label = rcmail.gettext(p.status ? 'replylist' : 'replyall');
AM 585       if (rcmail.env.action == 'preview')
586         $('a.button.replyall').attr('title', label);
587       else
588         $('a.button.reply-all').text(label).attr('title', label);
589     }
590   }
591
592
c7dcb3 593   /**
443b92 594    * Register a popup menu
AM 595    */
596   function add_popup(popup, config)
597   {
598     var obj = popups[popup] = $('#'+popup);
599     obj.appendTo(document.body);  // move it to top for proper absolute positioning
600
601     if (obj.length)
602       popupconfig[popup] = $.extend(popupconfig[popup] || {}, config || {});
603   }
604
605   /**
c7dcb3 606    * Trigger for popup menus
T 607    */
e8bcf0 608   function toggle_popup(popup, e, config)
TB 609   {
6789bf 610     // auto-register menu object
TB 611     if (config || !popupconfig[popup])
612       add_popup(popup, config);
613
614     return rcmail.command('menu-open', popup, e.target, e);
e8bcf0 615   }
TB 616
617   /**
618    * (Deprecated) trigger for popup menus
619    */
c7dcb3 620   function show_popup(popup, show, config)
T 621   {
622     // auto-register menu object
623     if (config || !popupconfig[popup])
443b92 624       add_popup(popup, config);
c7dcb3 625
6789bf 626     config = popupconfig[popup] || {};
TB 627     var ref = $(config.link ? config.link : '#'+popup+'link'),
c7dcb3 628       pos = ref.offset();
6789bf 629     if (ref.has('.inner'))
TB 630       ref = ref.children('.inner');
c7dcb3 631
6789bf 632     // fire command with simulated mouse click event
TB 633     return rcmail.command('menu-open',
634       { menu:popup, show:show },
635       ref.get(0),
636       $.Event('click', { target:ref.get(0), pageX:pos.left, pageY:pos.top, clientX:pos.left, clientY:pos.top }));
c7dcb3 637   }
T 638
639
918bb9 640   /**
T 641    * Show/hide the preview pane
642    */
c7dcb3 643   function toggle_preview_pane(e)
T 644   {
b540ed 645     var button = $(e.target),
T 646       frame = $('#mailpreviewframe'),
647       visible = !frame.is(':visible'),
6d6725 648       splitter = mailviewsplit.pos || parseInt(get_pref('mailviewsplitter') || 320),
b540ed 649       topstyles, bottomstyles, uid;
T 650
651     frame.toggle();
f331da 652     button.toggleClass('enabled closed').attr('aria-expanded', visible ? 'true' : 'false');
c7dcb3 653
b540ed 654     if (visible) {
77fad1 655       $('#mailview-top').removeClass('fullheight').css({ bottom:'auto' });
34003c 656       $('#mailview-bottom').css({ height:'auto' }).show();
918bb9 657
b540ed 658       rcmail.env.contentframe = 'messagecontframe';
T 659       if (uid = rcmail.message_list.get_single_selection())
660         rcmail.show_message(uid, false, true);
918bb9 661
T 662       // let the splitter set the correct size and position
663       if (mailviewsplit.handle) {
664         mailviewsplit.handle.show();
665         mailviewsplit.resize();
666       }
667       else
668         mailviewsplit.init();
b540ed 669     }
T 670     else {
671       rcmail.env.contentframe = null;
672       rcmail.show_contentframe(false);
673
34003c 674       $('#mailview-top').addClass('fullheight').css({ height:'auto', bottom:'0px' });
TB 675       $('#mailview-bottom').css({ top:'auto', height:'0px' }).hide();
918bb9 676
T 677       if (mailviewsplit.handle)
678         mailviewsplit.handle.hide();
679     }
b540ed 680
73ad4f 681     if (rcmail.message_list) {
TB 682       if (visible && uid)
683           rcmail.message_list.scrollto(uid);
684       rcmail.message_list.resize();
685     }
b540ed 686
T 687     rcmail.command('save-pref', { name:'preview_pane', value:(visible?1:0) });
c7dcb3 688   }
T 689
690
918bb9 691   /**
f4aaf8 692    * Switch between short and full headers display in message preview
T 693    */
ef3f1d 694   function toggle_preview_headers()
f4aaf8 695   {
T 696     $('#preview-shortheaders').toggle();
9bd97c 697     var full = $('#preview-allheaders').toggle(),
c23aad 698       button = $('a#previewheaderstoggle');
9bd97c 699
f4aaf8 700     // add toggle button to full headers table
c23aad 701     if (full.is(':visible'))
d0d7f4 702       button.attr('href', '#hide').removeClass('add').addClass('remove').attr('aria-expanded', 'true');
c23aad 703     else
d0d7f4 704       button.attr('href', '#details').removeClass('remove').addClass('add').attr('aria-expanded', 'false');
6e5bf9 705
P 706     save_pref('previewheaders', full.is(':visible') ? '1' : '0');
f4aaf8 707   }
T 708
709
710   /**
918bb9 711    *
T 712    */
1d6082 713   function switch_view_mode(mode, force)
a4be51 714   {
1d6082 715     if (force || !$('#mail'+mode+'mode').hasClass('disabled')) {
e8bcf0 716       $('#maillistmode, #mailthreadmode').removeClass('selected').attr('tabindex', '0').attr('aria-disabled', 'false');
TB 717       $('#mail'+mode+'mode').addClass('selected').attr('tabindex', '-1').attr('aria-disabled', 'true');
1bbf8c 718     }
a4be51 719   }
T 720
721
6789bf 722   /**** popup menu callbacks ****/
c7dcb3 723
6789bf 724   /**
TB 725    * Handler for menu-open and menu-close events
726    */
b2992d 727   function menu_toggle(p)
bc2c43 728   {
6789bf 729     if (p && p.name == 'messagelistmenu') {
b2992d 730       show_listoptions(p);
6789bf 731     }
TB 732     else if (p) {
733       // adjust menu position according to config
734       var config = popupconfig[p.name] || {},
735         ref = $(config.link || '#'+p.name+'link'),
736         visible = p.obj && p.obj.is(':visible'),
737         above = config.above;
bc2c43 738
6789bf 739       // fix position according to config
TB 740       if (p.obj && visible && ref.length) {
741         var parent = ref.parent(),
742           win = $(window), pos;
743
744         if (parent.hasClass('dropbutton'))
745           ref = parent;
746
747         if (config.above || ref.hasClass('dropbutton')) {
748           pos = ref.offset();
749           p.obj.css({ left:pos.left+'px', top:(pos.top + (config.above ? -p.obj.height() : ref.outerHeight()))+'px' });
750         }
751       }
752
753       // add the right classes
754       if (p.obj && config.iconized) {
755         p.obj.children('ul').addClass('iconized');
756       }
757
758       // apply some data-attributes from menu config
759       if (p.obj && config.editable)
760         p.obj.attr('data-editable', 'true');
761
762       // trigger callback function
763       if (typeof config.callback == 'function') {
764         config.callback(visible, p);
765       }
766     }
bc2c43 767   }
AM 768
c7dcb3 769   function searchmenu(show)
T 770   {
771     if (show && rcmail.env.search_mods) {
772       var n, all,
773         obj = popups['searchmenu'],
774         list = $('input:checkbox[name="s_mods[]"]', obj),
775         mbox = rcmail.env.mailbox,
1bbf8c 776         mods = rcmail.env.search_mods,
TB 777         scope = rcmail.env.search_scope || 'base';
c7dcb3 778
T 779       if (rcmail.env.task == 'mail') {
1bbf8c 780         if (scope == 'all')
TB 781           mbox = '*';
c7dcb3 782         mods = mods[mbox] ? mods[mbox] : mods['*'];
T 783         all = 'text';
c83535 784         $('input:radio[name="s_scope"]').prop('checked', false).filter('#s_scope_'+scope).prop('checked', true);
c7dcb3 785       }
T 786       else {
787         all = '*';
788       }
789
790       if (mods[all])
791         list.map(function() {
792           this.checked = true;
793           this.disabled = this.value != all;
794         });
795       else {
796         list.prop('disabled', false).prop('checked', false);
797         for (n in mods)
798           $('#s_mod_' + n).prop('checked', true);
799       }
800     }
801   }
802
d2bf33 803   function attachmentmenu(elem, event)
bc2c43 804   {
AM 805     var id = elem.parentNode.id.replace(/^attach/, '');
806
807     $('#attachmenuopen').unbind('click').attr('onclick', '').click(function(e) {
808       return rcmail.command('open-attachment', id, this);
809     });
810
811     $('#attachmenudownload').unbind('click').attr('onclick', '').click(function() {
812       rcmail.command('download-attachment', id, this);
813     });
814
815     popupconfig.attachmentmenu.link = elem;
d2bf33 816     rcmail.command('menu-open', {menu: 'attachmentmenu', id: id}, elem, event);
bc2c43 817   }
c7dcb3 818
6789bf 819   function spellmenu(show, p)
4be86f 820   {
b2992d 821     var k, link, li,
4be86f 822       lang = rcmail.spellcheck_lang(),
6789bf 823       ul = $('ul', p.obj);
4be86f 824
A 825     if (!ul.length) {
b2992d 826       ul = $('<ul class="toolbarmenu selectable" role="menu">');
4be86f 827
b2992d 828       for (k in rcmail.env.spell_langs) {
TB 829         li = $('<li role="menuitem">');
830         link = $('<a href="#'+k+'" tabindex="0"></a>').text(rcmail.env.spell_langs[k])
831           .addClass('active').data('lang', k)
832           .bind('click keypress', function(e) {
833               if (e.type != 'keypress' || rcube_event.get_keycode(e) == 13) {
834                   rcmail.spellcheck_lang_set($(this).data('lang'));
6789bf 835                   rcmail.hide_menu('spellmenu', e);
b2992d 836                   return false;
TB 837               }
4be86f 838           });
A 839
840         link.appendTo(li);
841         li.appendTo(ul);
842       }
843
6789bf 844       ul.appendTo(p.obj);
4be86f 845     }
A 846
847     // select current language
848     $('li', ul).each(function() {
849       var el = $('a', this);
850       if (el.data('lang') == lang)
b2992d 851         el.addClass('selected').attr('aria-selected', 'true');
4be86f 852       else if (el.hasClass('selected'))
b2992d 853         el.removeClass('selected').removeAttr('aria-selected');
4be86f 854     });
A 855   }
856
857
918bb9 858   /**
T 859    *
860    */
b2992d 861   function show_listoptions(p)
74d4c7 862   {
T 863     var $dialog = $('#listoptions');
864
865     // close the dialog
866     if ($dialog.is(':visible')) {
b2992d 867       $dialog.dialog('close', p.originalEvent);
74d4c7 868       return;
T 869     }
870
871     // set form values
872     $('input[name="sort_col"][value="'+rcmail.env.sort_col+'"]').prop('checked', true);
873     $('input[name="sort_ord"][value="DESC"]').prop('checked', rcmail.env.sort_order == 'DESC');
874     $('input[name="sort_ord"][value="ASC"]').prop('checked', rcmail.env.sort_order != 'DESC');
875
e0efd8 876     // set checkboxes
AM 877     $('input[name="list_col[]"]').each(function() {
c83535 878       $(this).prop('checked', $.inArray(this.value, rcmail.env.listcols) != -1);
e0efd8 879     });
74d4c7 880
T 881     $dialog.dialog({
882       modal: true,
883       resizable: false,
884       closeOnEscape: true,
885       title: null,
b2992d 886       open: function(e) {
TB 887         setTimeout(function(){ $dialog.find('a, input:not(:disabled)').not('[aria-disabled=true]').first().focus(); }, 100);
888       },
889       close: function(e) {
74d4c7 890         $dialog.dialog('destroy').hide();
b2992d 891         if (e.originalEvent && rcube_event.is_keyboard(e.originalEvent))
TB 892           $('#listmenulink').focus();
74d4c7 893       },
36adaf 894       minWidth: 500,
AM 895       width: $dialog.width()+25
74d4c7 896     }).show();
T 897   }
898
899
900   /**
901    *
902    */
b2992d 903   function save_listoptions(p)
c7dcb3 904   {
74d4c7 905     $('#listoptions').dialog('close');
c7dcb3 906
b2992d 907     if (rcube_event.is_keyboard(p.originalEvent))
TB 908       $('#listmenulink').focus();
c7dcb3 909
T 910     var sort = $('input[name="sort_col"]:checked').val(),
911       ord = $('input[name="sort_ord"]:checked').val(),
912       cols = $('input[name="list_col[]"]:checked')
913         .map(function(){ return this.value; }).get();
914
ec5323 915     rcmail.set_list_options(cols, sort, ord, rcmail.env.threading);
c7dcb3 916   }
T 917
918
918bb9 919   /**
T 920    *
921    */
c7dcb3 922   function set_searchmod(elem)
T 923   {
924     var all, m, task = rcmail.env.task,
925       mods = rcmail.env.search_mods,
1bbf8c 926       mbox = rcmail.env.mailbox,
TB 927       scope = $('input[name="s_scope"]:checked').val();
928
929     if (scope == 'all')
930       mbox = '*';
c7dcb3 931
T 932     if (!mods)
933       mods = {};
934
935     if (task == 'mail') {
936       if (!mods[mbox])
937         mods[mbox] = rcube_clone_object(mods['*']);
938       m = mods[mbox];
939       all = 'text';
940     }
941     else { //addressbook
942       m = mods;
943       all = '*';
944     }
945
946     if (!elem.checked)
947       delete(m[elem.value]);
948     else
949       m[elem.value] = 1;
950
951     // mark all fields
c83535 952     if (elem.value == all) {
TB 953       $('input:checkbox[name="s_mods[]"]').map(function() {
954         if (this == elem)
955           return;
c7dcb3 956
c83535 957         this.checked = true;
TB 958         if (elem.checked) {
959           this.disabled = true;
960           delete m[this.value];
961         }
962         else {
963           this.disabled = false;
964           m[this.value] = 1;
965         }
966       });
967     }
c7dcb3 968
c83535 969     rcmail.set_searchmods(m);
c7dcb3 970   }
74d4c7 971
1bbf8c 972   function set_searchscope(elem)
TB 973   {
c83535 974     rcmail.set_searchscope(elem.value);
1bbf8c 975   }
TB 976
de98a8 977   function push_contactgroup(p)
TB 978   {
979     // lets the contacts list swipe to the left, nice!
980     var table = $('#contacts-table'),
981       scroller = table.parent().css('overflow', 'hidden');
982
983     table.clone()
984       .css({ position:'absolute', top:'0', left:'0', width:table.width()+'px', 'z-index':10 })
985       .appendTo(scroller)
986       .animate({ left: -(table.width()+5) + 'px' }, 300, 'swing', function(){
987         $(this).remove();
988         scroller.css('overflow', 'auto')
989       });
990   }
991
992   function pop_contactgroup(p)
993   {
994     // lets the contacts list swipe to the left, nice!
995     var table = $('#contacts-table'),
996       scroller = table.parent().css('overflow', 'hidden'),
997       clone = table.clone().appendTo(scroller);
998
999       table.css({ position:'absolute', top:'0', left:-(table.width()+5) + 'px', width:table.width()+'px', height:table.height()+'px', 'z-index':10 })
1000         .animate({ left:'0' }, 300, 'linear', function(){
1001         clone.remove();
1002         $(this).css({ position:'relative', left:'0', width:'100%', height:'auto', 'z-index':1 });
1003         scroller.css('overflow', 'auto')
1004       });
1005   }
74d4c7 1006
ea0866 1007   function show_uploadform(e)
74d4c7 1008   {
T 1009     var $dialog = $('#upload-dialog');
1010
1011     // close the dialog
1012     if ($dialog.is(':visible')) {
1013       $dialog.dialog('close');
1014       return;
1015     }
de98a8 1016
f5521a 1017     // add icons to clone file input field
354bf1 1018     if (rcmail.env.action == 'compose' && !$dialog.data('extended')) {
f5521a 1019       $('<a>')
T 1020         .addClass('iconlink add')
1021         .attr('href', '#add')
1022         .html('Add')
1023         .appendTo($('input[type="file"]', $dialog).parent())
1024         .click(add_uploadfile);
1025       $dialog.data('extended', true);
1026     }
74d4c7 1027
T 1028     $dialog.dialog({
1029       modal: true,
1030       resizable: false,
1031       closeOnEscape: true,
1032       title: $dialog.attr('title'),
ea0866 1033       open: function(e) {
TB 1034         if (!document.all)
1035           $('input[type=file]', $dialog).first().click();
1036       },
74d4c7 1037       close: function() {
T 1038         try { $('#upload-dialog form').get(0).reset(); }
1039         catch(e){ }  // ignore errors
1040
1041         $dialog.dialog('destroy').hide();
f5521a 1042         $('div.addline', $dialog).remove();
74d4c7 1043       },
T 1044       width: 480
1045     }).show();
1046   }
1047
f5521a 1048   function add_uploadfile(e)
T 1049   {
1050     var div = $(this).parent();
1051     var clone = div.clone().addClass('addline').insertAfter(div);
1052     clone.children('.iconlink').click(add_uploadfile);
1053     clone.children('input').val('');
1054
1055     if (!document.all)
1056       $('input[type=file]', clone).click();
1057   }
1058
1059
74d4c7 1060   /**
T 1061    *
1062    */
7961f8 1063   function show_header_row(which, updated)
74d4c7 1064   {
7961f8 1065     var row = $('#compose-' + which);
T 1066     if (row.is(':visible'))
1067       return;  // nothing to be done here
1068
1069     if (compose_headers[which] && !updated)
74d4c7 1070       $('#_' + which).val(compose_headers[which]);
7961f8 1071
T 1072     row.show();
74d4c7 1073     $('#' + which + '-link').hide();
a7343c 1074
68e13c 1075     layout_composeview();
a7343c 1076     $('input,textarea', row).focus();
AM 1077
74d4c7 1078     return false;
T 1079   }
1080
1081   /**
1082    *
1083    */
1084   function hide_header_row(which)
1085   {
1086     // copy and clear field value
1087     var field = $('#_' + which);
1088     compose_headers[which] = field.val();
1089     field.val('');
1090
1091     $('#compose-' + which).hide();
1092     $('#' + which + '-link').show();
68e13c 1093     layout_composeview();
T 1094     return false;
74d4c7 1095   }
bab043 1096
T 1097
1098   /**
1099    * Fieldsets-to-tabs converter
1100    */
1101   function init_tabs(elem, current)
1102   {
a4e71c 1103     var content = $(elem),
T 1104       id = content.get(0).id,
bab043 1105       fs = content.children('fieldset');
T 1106
1107     if (!fs.length)
1108       return;
1109
1110     if (!id) {
1111       id = 'rcmtabcontainer';
a4e71c 1112       content.attr('id', id);
bab043 1113     }
T 1114
1115     // create tabs container
5cf77e 1116     var tabs = $('<ul>').addClass('tabsbar').prependTo(content);
bab043 1117
T 1118     // convert fildsets into tabs
1119     fs.each(function(idx) {
5cf77e 1120       var tab, a, elm = $(this),
TB 1121         legend = elm.children('legend'),
1122         tid = id + '-t' + idx;
bab043 1123
T 1124       // create a tab
5cf77e 1125       a   = $('<a>').text(legend.text()).attr('href', '#' + tid);
TB 1126       tab = $('<li>').addClass('tablink');
bab043 1127
T 1128       // remove legend
1129       legend.remove();
5cf77e 1130
TB 1131       // link fieldset with tab item
1132       elm.attr('id', tid);
bab043 1133
T 1134       // add the tab to container
1135       tab.append(a).appendTo(tabs);
1136     });
1137
5cf77e 1138     // use jquery UI tabs widget to do the interaction and styling
TB 1139     content.tabs({
1140       active: current || 0,
1141       heightStyle: 'content',
1142       activate: function(e, ui) {resize(); }
bab043 1143     });
T 1144   }
68e13c 1145
T 1146   /**
1147    * Show about page as jquery UI dialog
1148    */
1149   function show_about(elem)
1150   {
63e498 1151     var frame = $('<iframe>').attr({id: 'aboutframe', src: rcmail.url('settings/about'), frameborder: '0'});
AM 1152       h = Math.floor($(window).height() * 0.75),
1153       buttons = {},
1154       supportln = $('#supportlink');
68e13c 1155
T 1156     if (supportln.length && (env.supporturl = supportln.attr('href')))
1157       buttons[supportln.html()] = function(e){ env.supporturl.indexOf('mailto:') < 0 ? window.open(env.supporturl) : location.href = env.supporturl };
1158
1159     frame.dialog({
1160       modal: true,
1161       resizable: false,
1162       closeOnEscape: true,
1163       title: elem ? elem.title || elem.innerHTML : null,
1164       close: function() {
1165         frame.dialog('destroy').remove();
1166       },
1167       buttons: buttons,
1168       width: 640,
1169       height: h
1170     }).width(640);
1171   }
c7dcb3 1172 }
T 1173
918bb9 1174
efaf2e 1175 /**
A 1176  * Roundcube Scroller class
c6447e 1177  *
AM 1178  * @deprecated Use treelist widget
efaf2e 1179  */
A 1180 function rcube_scroller(list, top, bottom)
1181 {
1182   var ref = this;
1183
1184   this.list = $(list);
1185   this.top = $(top);
1186   this.bottom = $(bottom);
1187   this.step_size = 6;
1188   this.step_time = 20;
1189   this.delay = 500;
1190
1191   this.top
f5aecf 1192     .mouseenter(function() { if (rcmail.drag_active) ref.ts = window.setTimeout(function() { ref.scroll('down'); }, ref.delay); })
efaf2e 1193     .mouseout(function() { if (ref.ts) window.clearTimeout(ref.ts); });
A 1194
1195   this.bottom
f5aecf 1196     .mouseenter(function() { if (rcmail.drag_active) ref.ts = window.setTimeout(function() { ref.scroll('up'); }, ref.delay); })
efaf2e 1197     .mouseout(function() { if (ref.ts) window.clearTimeout(ref.ts); });
A 1198
1199   this.scroll = function(dir)
1200   {
1201     var ref = this, size = this.step_size;
1202
1203     if (!rcmail.drag_active)
1204       return;
1205
1206     if (dir == 'down')
1207       size *= -1;
1208
1209     this.list.get(0).scrollTop += size;
1210     this.ts = window.setTimeout(function() { ref.scroll(dir); }, this.step_time);
1211   };
1212 };
1213
918bb9 1214
T 1215 /**
a4e71c 1216  * Roundcube UI splitter class
918bb9 1217  *
T 1218  * @constructor
1219  */
1220 function rcube_splitter(p)
1221 {
1222   this.p = p;
1223   this.id = p.id;
1224   this.horizontal = (p.orientation == 'horizontal' || p.orientation == 'h');
1225   this.halfsize = (p.size !== undefined ? p.size : 10) / 2;
1226   this.pos = p.start || 0;
1227   this.min = p.min || 20;
1228   this.offset = p.offset || 0;
1229   this.relative = p.relative ? true : false;
1230   this.drag_active = false;
1231   this.render = p.render;
1232   this.callback = p.callback;
1233
1234   var me = this;
3a86e2 1235   rcube_splitter._instances[this.id] = me;
918bb9 1236
T 1237   this.init = function()
1238   {
1239     this.p1 = $(this.p.p1);
1240     this.p2 = $(this.p.p2);
4d6180 1241     this.parent = this.p1.parent();
918bb9 1242
a4e71c 1243     // check if referenced elements exist, otherwise abort
T 1244     if (!this.p1.length || !this.p2.length)
1245       return;
1246
918bb9 1247     // create and position the handle for this splitter
T 1248     this.p1pos = this.relative ? this.p1.position() : this.p1.offset();
1249     this.p2pos = this.relative ? this.p2.position() : this.p2.offset();
1250     this.handle = $('<div>')
1251       .attr('id', this.id)
1252       .attr('unselectable', 'on')
5cf77e 1253       .attr('role', 'presentation')
918bb9 1254       .addClass('splitter ' + (this.horizontal ? 'splitter-h' : 'splitter-v'))
4d6180 1255       .appendTo(this.parent)
918bb9 1256       .bind('mousedown', onDragStart);
T 1257
1258     if (this.horizontal) {
1259       var top = this.p1pos.top + this.p1.outerHeight();
1260       this.handle.css({ left:'0px', top:top+'px' });
1261     }
1262     else {
1263       var left = this.p1pos.left + this.p1.outerWidth();
1264       this.handle.css({ left:left+'px', top:'0px' });
1265     }
1266
1267     // listen to window resize on IE
1268     if (bw.ie)
a4e71c 1269       $(window).resize(onResize);
918bb9 1270
T 1271     // read saved position from cookie
6d6725 1272     var cookie = this.get_cookie();
918bb9 1273     if (cookie && !isNaN(cookie)) {
T 1274       this.pos = parseFloat(cookie);
1275       this.resize();
1276     }
1277     else if (this.pos) {
1278       this.resize();
1279       this.set_cookie();
1280     }
1281   };
1282
1283   /**
1284    * Set size and position of all DOM objects
1285    * according to the saved splitter position
1286    */
1287   this.resize = function()
1288   {
1289     if (this.horizontal) {
13bbcd 1290       this.p1.css('height', Math.floor(this.pos - this.p1pos.top - Math.floor(this.halfsize)) + 'px');
TB 1291       this.p2.css('top', Math.ceil(this.pos + Math.ceil(this.halfsize) + 2) + 'px');
918bb9 1292       this.handle.css('top', Math.round(this.pos - this.halfsize + this.offset)+'px');
T 1293       if (bw.ie) {
4d6180 1294         var new_height = parseInt(this.parent.outerHeight(), 10) - parseInt(this.p2.css('top'), 10) - (bw.ie8 ? 2 : 0);
822a1e 1295         this.p2.css('height', (new_height > 0 ? new_height : 0) + 'px');
918bb9 1296       }
T 1297     }
1298     else {
13bbcd 1299       this.p1.css('width', Math.floor(this.pos - this.p1pos.left - Math.floor(this.halfsize)) + 'px');
TB 1300       this.p2.css('left', Math.ceil(this.pos + Math.ceil(this.halfsize)) + 'px');
918bb9 1301       this.handle.css('left', Math.round(this.pos - this.halfsize + this.offset + 3)+'px');
T 1302       if (bw.ie) {
4d6180 1303         var new_width = parseInt(this.parent.outerWidth(), 10) - parseInt(this.p2.css('left'), 10) ;
918bb9 1304         this.p2.css('width', (new_width > 0 ? new_width : 0) + 'px');
T 1305       }
1306     }
1307
1308     this.p2.resize();
1309     this.p1.resize();
1310
5fea6b 1311     // also resize iframe covers
T 1312     if (this.drag_active) {
1313       $('iframe').each(function(i, elem) {
1314         var pos = $(this).offset();
1315         $('#iframe-splitter-fix-'+i).css({ top: pos.top+'px', left: pos.left+'px', width:elem.offsetWidth+'px', height: elem.offsetHeight+'px' });
1316       });
1317     }
1318
918bb9 1319     if (typeof this.render == 'function')
T 1320       this.render(this);
1321   };
1322
1323   /**
1324    * Handler for mousedown events
1325    */
1326   function onDragStart(e)
1327   {
1328     // disable text selection while dragging the splitter
1329     if (bw.konq || bw.chrome || bw.safari)
1330       document.body.style.webkitUserSelect = 'none';
1331
1332     me.p1pos = me.relative ? me.p1.position() : me.p1.offset();
1333     me.p2pos = me.relative ? me.p2.position() : me.p2.offset();
1334     me.drag_active = true;
1335
1336     // start listening to mousemove events
1337     $(document).bind('mousemove.'+this.id, onDrag).bind('mouseup.'+this.id, onDragStop);
1338
1339     // enable dragging above iframes
5fea6b 1340     $('iframe').each(function(i, elem) {
T 1341       $('<div>')
1342         .attr('id', 'iframe-splitter-fix-'+i)
1343         .addClass('iframe-splitter-fix')
918bb9 1344         .css({ background: '#fff',
5fea6b 1345           width: elem.offsetWidth+'px', height: elem.offsetHeight+'px',
918bb9 1346           position: 'absolute', opacity: '0.001', zIndex: 1000
T 1347         })
1348         .css($(this).offset())
1349         .appendTo('body');
1350       });
1351   };
1352
1353   /**
1354    * Handler for mousemove events
1355    */
1356   function onDrag(e)
1357   {
1358     if (!me.drag_active)
1359       return false;
1360
571c10 1361     // with timing events dragging action is more responsive
AM 1362     window.clearTimeout(me.ts);
1363     me.ts = window.setTimeout(function() { onDragAction(e); }, 1);
1364
1365     return false;
1366   };
1367
1368   /**
1369    * Dragging action (see onDrag())
1370    */
1371   function onDragAction(e)
1372   {
918bb9 1373     var pos = rcube_event.get_mouse_pos(e);
T 1374
1375     if (me.relative) {
4d6180 1376       var parent = me.parent.offset();
918bb9 1377       pos.x -= parent.left;
T 1378       pos.y -= parent.top;
1379     }
1380
1381     if (me.horizontal) {
1382       if (((pos.y - me.halfsize) > me.p1pos.top) && ((pos.y + me.halfsize) < (me.p2pos.top + me.p2.outerHeight()))) {
13bbcd 1383         me.pos = Math.max(me.min, pos.y - Math.max(0, me.offset));
4d6180 1384         if (me.pos > me.min)
AM 1385           me.pos = Math.min(me.pos, me.parent.height() - me.min);
1386
918bb9 1387         me.resize();
T 1388       }
1389     }
1390     else {
1391       if (((pos.x - me.halfsize) > me.p1pos.left) && ((pos.x + me.halfsize) < (me.p2pos.left + me.p2.outerWidth()))) {
13bbcd 1392         me.pos = Math.max(me.min, pos.x - Math.max(0, me.offset));
4d6180 1393         if (me.pos > me.min)
AM 1394           me.pos = Math.min(me.pos, me.parent.width() - me.min);
1395
918bb9 1396         me.resize();
T 1397       }
1398     }
1399
1400     me.p1pos = me.relative ? me.p1.position() : me.p1.offset();
1401     me.p2pos = me.relative ? me.p2.position() : me.p2.offset();
1402   };
1403
1404   /**
1405    * Handler for mouseup events
1406    */
1407   function onDragStop(e)
1408   {
1409     // resume the ability to highlight text
1410     if (bw.konq || bw.chrome || bw.safari)
1411       document.body.style.webkitUserSelect = 'auto';
1412
1413     // cancel the listening for drag events
1414     $(document).unbind('.'+me.id);
1415     me.drag_active = false;
1416
1417     // remove temp divs
5fea6b 1418     $('div.iframe-splitter-fix').remove();
918bb9 1419
T 1420     me.set_cookie();
1421
1422     if (typeof me.callback == 'function')
1423       me.callback(me);
1424
1425     return bw.safari ? true : rcube_event.cancel(e);
1426   };
1427
1428   /**
1429    * Handler for window resize events
1430    */
1431   function onResize(e)
1432   {
1433     if (me.horizontal) {
4d6180 1434       var new_height = parseInt(me.parent.outerHeight(), 10) - parseInt(me.p2[0].style.top, 10) - (bw.ie8 ? 2 : 0);
918bb9 1435       me.p2.css('height', (new_height > 0 ? new_height : 0) +'px');
T 1436     }
1437     else {
4d6180 1438       var new_width = parseInt(me.parent.outerWidth(), 10) - parseInt(me.p2[0].style.left, 10);
918bb9 1439       me.p2.css('width', (new_width > 0 ? new_width : 0) + 'px');
T 1440     }
1441   };
1442
1443   /**
6d6725 1444    * Get saved splitter position from cookie
TB 1445    */
1446   this.get_cookie = function()
1447   {
1448     return window.UI ? UI.get_pref(this.id) : null;
1449   };
1450
1451   /**
918bb9 1452    * Saves splitter position in cookie
T 1453    */
1454   this.set_cookie = function()
1455   {
6d6725 1456     if (window.UI)
TB 1457       UI.save_pref(this.id, this.pos);
918bb9 1458   };
T 1459
1460 } // end class rcube_splitter
1461
1462
3a86e2 1463 // static getter for splitter instances
T 1464 rcube_splitter._instances = {};
1465
1466 rcube_splitter.get_instance = function(id)
1467 {
1468   return rcube_splitter._instances[id];
1469 };
b34d67 1470
731d19 1471 // @license-end