From 72975e14970ec4eeac927b80754ee3a5c6ada58e Mon Sep 17 00:00:00 2001
From: Thomas Bruederli <thomas@roundcube.net>
Date: Sun, 05 Jan 2014 09:45:43 -0500
Subject: [PATCH] Move folder/directory list auto-scrolling functionality to treelist widget (same as auto-expand) and make it work without list header/footer blocks
---
skins/larry/templates/mail.html | 1
program/js/treelist.js | 60 +++++++++++++++++++++++++++++-
skins/classic/functions.js | 5 --
skins/larry/mail.css | 6 ---
skins/larry/ui.js | 4 --
5 files changed, 58 insertions(+), 18 deletions(-)
diff --git a/program/js/treelist.js b/program/js/treelist.js
index 5913f44..d940e39 100644
--- a/program/js/treelist.js
+++ b/program/js/treelist.js
@@ -28,6 +28,9 @@
id_prefix: '',
autoexpand: 1000,
selectable: false,
+ scroll_delay: 500,
+ scroll_step: 5,
+ scroll_speed: 20,
check_droptarget: function(node){ return !node.virtual }
}, p || {});
@@ -42,6 +45,7 @@
autoexpand_item,
body_scroll_top = 0,
list_scroll_top = 0,
+ scroll_timer,
me = this;
@@ -461,6 +465,7 @@
body_scroll_top = bw.ie ? 0 : window.pageYOffset;
list_scroll_top = container.parent().scrollTop();
+ pos.top += list_scroll_top;
drag_active = true;
box_coords = {
@@ -476,6 +481,7 @@
item = li.children().first().get(0);
if (height = item.offsetHeight) {
pos = $(item).offset();
+ pos.top += list_scroll_top;
item_coords[id] = {
x1: pos.left,
y1: pos.top,
@@ -485,6 +491,38 @@
};
}
}
+
+ // enable auto-scrolling of list container
+ if (container.height() > container.parent().height()) {
+ container.parent()
+ .mousemove(function(e) {
+ var scroll = 0,
+ mouse = rcube_event.get_mouse_pos(e);
+ mouse.y -= container.parent().offset().top;
+
+ if (mouse.y < 25 && list_scroll_top > 0) {
+ scroll = -1; // up
+ }
+ else if (mouse.y > container.parent().height() - 25) {
+ scroll = 1; // down
+ }
+
+ if (drag_active && scroll != 0) {
+ if (!scroll_timer)
+ scroll_timer = window.setTimeout(function(){ drag_scroll(scroll); }, p.scroll_delay);
+ }
+ else if (scroll_timer) {
+ window.clearTimeout(scroll_timer);
+ scroll_timer = null;
+ }
+ })
+ .mouseleave(function() {
+ if (scroll_timer) {
+ window.clearTimeout(scroll_timer);
+ scroll_timer = null;
+ }
+ });
+ }
}
/**
@@ -493,6 +531,7 @@
function drag_end()
{
drag_active = false;
+ scroll_timer = null;
if (autoexpand_timer) {
clearTimeout(autoexpand_timer);
@@ -504,16 +543,33 @@
}
/**
+ * Scroll list container in the given direction
+ */
+ function drag_scroll(dir)
+ {
+ if (!drag_active)
+ return;
+
+ var old_top = list_scroll_top;
+ container.parent().get(0).scrollTop += p.scroll_step * dir;
+ list_scroll_top = container.parent().scrollTop();
+ scroll_timer = null;
+
+ if (list_scroll_top != old_top)
+ scroll_timer = window.setTimeout(function(){ drag_scroll(dir); }, p.scroll_speed);
+ }
+
+ /**
* Determine if the given mouse coords intersect the list and one if its items
*/
function intersects(mouse, highlight)
{
// offsets to compensate for scrolling while dragging a message
var boffset = bw.ie ? -document.documentElement.scrollTop : body_scroll_top,
- moffset = list_scroll_top - container.parent().scrollTop(),
+ moffset = container.parent().scrollTop(),
result = null;
- mouse.top = mouse.y + -moffset - boffset;
+ mouse.top = mouse.y + moffset - boffset;
// no intersection with list bounding box
if (mouse.x < box_coords.x1 || mouse.x >= box_coords.x2 || mouse.top < box_coords.y1 || mouse.top >= box_coords.y2) {
diff --git a/skins/classic/functions.js b/skins/classic/functions.js
index 4312d57..049e4d5 100644
--- a/skins/classic/functions.js
+++ b/skins/classic/functions.js
@@ -976,8 +976,6 @@
rcmail.addEventListener('responseaftercheck-recent', rcube_render_mailboxlist);
rcmail.addEventListener('responseafterrefresh', rcube_render_mailboxlist);
rcmail.addEventListener('afterimport-messages', function(){ rcmail_ui.show_popup('uploadform', false); });
-
- new rcmail_scroller('#mailboxlist-content', '#mailboxlist-title', '#mailboxlist-footer');
}
if (rcmail.env.action == 'compose')
@@ -990,9 +988,6 @@
}
else if (rcmail.env.task == 'addressbook') {
rcmail.addEventListener('afterupload-photo', function(){ rcmail_ui.show_popup('uploadform', false); });
-
- if (rcmail.gui_objects.folderlist)
- new rcmail_scroller('#directorylist-content', '#directorylist-title', '#directorylist-footer');
rcmail.gui_object('dragmenu', 'dragmenu');
}
diff --git a/skins/larry/mail.css b/skins/larry/mail.css
index d3b09c0..8e6e78e 100644
--- a/skins/larry/mail.css
+++ b/skins/larry/mail.css
@@ -55,12 +55,6 @@
border-radius: 0 0 4px 4px;
}
-#folderlist-header {
- width: 100%;
- height: 12px;
- top: 32px;
-}
-
#mailboxcontainer,
#messagelistcontainer {
position: absolute;
diff --git a/skins/larry/templates/mail.html b/skins/larry/templates/mail.html
index 8f19b9f..ff5f754 100644
--- a/skins/larry/templates/mail.html
+++ b/skins/larry/templates/mail.html
@@ -27,7 +27,6 @@
<div id="mailview-left">
<!-- folders list -->
-<div id="folderlist-header"></div>
<div id="mailboxcontainer" class="uibox listbox">
<div id="folderlist-content" class="scroller withfooter">
<roundcube:object name="mailboxlist" id="mailboxlist" class="treelist listing" folder_filter="mail" unreadwrap="%s" />
diff --git a/skins/larry/ui.js b/skins/larry/ui.js
index add6910..44fc727 100644
--- a/skins/larry/ui.js
+++ b/skins/larry/ui.js
@@ -216,8 +216,6 @@
if (previewframe)
mailviewsplit.init();
- new rcube_scroller('#folderlist-content', '#folderlist-header', '#folderlist-footer');
-
rcmail.addEventListener('setquota', update_quota)
.addEventListener('enable-command', enable_command)
.addEventListener('afterimport-messages', show_uploadform);
@@ -284,8 +282,6 @@
orientation:'v', relative:true, start:226, min:150, size:12, render:resize_leftcol }).init();
new rcube_splitter({ id:'addressviewsplitter', p1:'#addresslist', p2:'#contacts-box',
orientation:'v', relative:true, start:286, min:270, size:12 }).init();
-
- new rcube_scroller('#directorylist-content', '#directorylist-header', '#directorylist-footer');
}
var dragmenu = $('#dragcontactmenu');
--
Gitblit v1.9.1