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