From cb6a1cb3ed0d7661ab7720eda9f2ea671d6a0954 Mon Sep 17 00:00:00 2001 From: Maxim Stewart Date: Sat, 31 Oct 2020 00:30:34 -0500 Subject: [PATCH] adjusted scroll down detection zone --- README.md | 4 ++-- src/manifest.json | 2 +- src/scripts/dragContainersSetup.js | 24 +++++++++++++++++++++--- src/scripts/eventListeners.js | 17 +++++++++++++++-- 4 files changed, 39 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index c273890..44b826f 100644 --- a/README.md +++ b/README.md @@ -4,8 +4,8 @@ Search Firefox tabs and get a list or automatic direct to the searched tab. # Download https://addons.mozilla.org/en-US/firefox/addon/tab-search-and-manage/ -# Version: 1.3.11 -* Css change for control 1 +# Version: 1.3.13 +* adjusted scroll down detection zone ***Note: diff --git a/src/manifest.json b/src/manifest.json index 379324b..6968ce1 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 2, "name": "Tab Search and Manage", - "version": "1.3.11", + "version": "1.3.13", "description": "This plugin can search, drag-n-drop ordering, and (un)hide all or some tabs.", "applications": { diff --git a/src/scripts/dragContainersSetup.js b/src/scripts/dragContainersSetup.js index ae623bc..970f6f8 100644 --- a/src/scripts/dragContainersSetup.js +++ b/src/scripts/dragContainersSetup.js @@ -1,5 +1,6 @@ -var count = 2; toMoveID = 0, newIndex = 0;; -var insert = ""; +let count = 2; toMoveID = 0, newIndex = 0;; +let insert = ""; +let isDragging = false; var drake = dragula({ direction: 'horizontal', // X axis is considered when determining where an element would be dropped @@ -9,7 +10,8 @@ var drake = dragula({ removeOnSpill: false, // spilling will `.remove` the element, if this is true ignoreInputTextSelection: true // allows users to select input text, see details below }).on('drag', function (el) { - toMoveID = parseInt(el.getAttribute("tabID")); + isDragging = true; + toMoveID = parseInt(el.getAttribute("tabID")); el.className = el.className.replace('ex-moved', ''); }).on('drop', function (el, container) { var subCont = document.getElementById("listZone"); @@ -21,6 +23,7 @@ var drake = dragula({ } } + isDragging = false; tabsAction.move(toMoveID, {index: newIndex}).then(); el.className += ' ex-moved'; }).on('over', function (el, container) { @@ -29,5 +32,20 @@ var drake = dragula({ container.className = container.className.replace('ex-over', ''); }); + +drake.on("cancel", (el, container, source) => { + isDragging = false; + el.scrollIntoView(); + + let i = 0; + while( (el = el.previousSibling) != null ) { + i++; + } + + if (i < (container.children.length - 6)) { + container.scrollBy(0, -100); // Go up 100px + } +}); + // Connect to pre created containers drake.containers.push(document.querySelector('#listZone')); diff --git a/src/scripts/eventListeners.js b/src/scripts/eventListeners.js index 0ddb317..928c78c 100644 --- a/src/scripts/eventListeners.js +++ b/src/scripts/eventListeners.js @@ -6,6 +6,19 @@ window.onload = async () => { getTabs(); } +document.addEventListener("mousemove", (e) => { + if (isDragging) { + const elm = document.getElementById("listZone"); + if (e.pageY > 520) { + console.log("scrolling down..."); + elm.scrollBy(0, 50); // Scroll 50px downwards + } else if (e.pageY < 100) { + console.log("scrolling up..."); + elm.scrollBy(0, -50); // Scroll 50px upwards + } + } +}); + // Set click events for tab blocks document.addEventListener("click", (e) => { @@ -158,8 +171,8 @@ function setOldElm(target) { function scrollToView(time = 400) { setTimeout(function () { - // Go to selected and 100px up + const elm = document.getElementById("listZone"); oldElm.scrollIntoView(); - window.scrollBy(0, -100); + elm.scrollBy(0, -100); // Scroll 100px upwards }, time); }