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