Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| e63c179e3b | |||
| cdec9d1b3b | |||
| 7005720efd | |||
| ccca2a6a2c | |||
| 7e472c388c | |||
| 8373fe2637 |
@@ -39,3 +39,18 @@ body.td-drag-scroll #board-container .task-board {
|
|||||||
.task-board-sort-handle i {
|
.task-board-sort-handle i {
|
||||||
font-size: var(--td-handle-size, 20px);
|
font-size: var(--td-handle-size, 20px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Enlarge the subtask-row first-cell icons to the same touch-friendly size as the board
|
||||||
|
* handle above, reusing --td-handle-size (falls back to 20px if Tweak Drag is disabled).
|
||||||
|
* Unlike the board handle (mobile-only, display:none on desktop), these icons show on every
|
||||||
|
* device, so this applies everywhere: the drag arrows (.draggable-row-handle), the gear/caret
|
||||||
|
* menu (.subtask-submenu i) and the status-toggle checkbox (.js-subtask-toggle-status i).
|
||||||
|
* Enlarging all three together keeps the row vertically aligned. Scoped to .subtasks-table so
|
||||||
|
* the Columns/Swimlanes config tables (which share these classes) are left untouched.
|
||||||
|
*/
|
||||||
|
.subtasks-table .draggable-row-handle,
|
||||||
|
.subtasks-table .subtask-submenu i,
|
||||||
|
.subtasks-table .js-subtask-toggle-status i {
|
||||||
|
font-size: var(--td-handle-size, 20px);
|
||||||
|
}
|
||||||
|
|||||||
@@ -28,6 +28,7 @@
|
|||||||
var EDGE_ZONE_MAX = 160; // ...and at most 160px.
|
var EDGE_ZONE_MAX = 160; // ...and at most 160px.
|
||||||
var MAX_SPEED = 22; // px per animation frame at the very edge
|
var MAX_SPEED = 22; // px per animation frame at the very edge
|
||||||
var EASE = 1; // 1 = linear ramp, 2 = gentle-then-fast
|
var EASE = 1; // 1 = linear ramp, 2 = gentle-then-fast
|
||||||
|
var SCROLL_SAFETY = 200; // px of page we may scroll past the bottom of the columns
|
||||||
|
|
||||||
var jq = window.jQuery;
|
var jq = window.jQuery;
|
||||||
if (!jq) {
|
if (!jq) {
|
||||||
@@ -116,6 +117,20 @@
|
|||||||
vspeed = speedFor(dBottom, zoneV);
|
vspeed = speedFor(dBottom, zoneV);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Cap downward scrolling to just past the bottom of the columns, so a drag held at
|
||||||
|
// the bottom edge cannot scroll the page forever. #board is the columns table, so
|
||||||
|
// its height is the tallest column; allow SCROLL_SAFETY px beyond it.
|
||||||
|
if (vspeed > 0) {
|
||||||
|
var boardEl = document.getElementById("board");
|
||||||
|
if (boardEl) {
|
||||||
|
var boardBottomPage = boardEl.getBoundingClientRect().bottom + window.pageYOffset;
|
||||||
|
var maxScrollY = boardBottomPage + SCROLL_SAFETY - window.innerHeight;
|
||||||
|
if (window.pageYOffset >= maxScrollY) {
|
||||||
|
vspeed = 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (vspeed !== 0) {
|
if (vspeed !== 0) {
|
||||||
var beforeY = window.pageYOffset;
|
var beforeY = window.pageYOffset;
|
||||||
window.scrollBy(0, vspeed);
|
window.scrollBy(0, vspeed);
|
||||||
@@ -125,12 +140,17 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
// When the board/page actually moved, nudge jQuery UI to recompute drop positions
|
// When the board/page actually moved, nudge jQuery UI to recompute drop positions
|
||||||
// so the placeholder follows onto the newly revealed area (either axis).
|
// so the placeholder follows onto the newly revealed area (either axis). Dispatch
|
||||||
|
// through jQuery with EXPLICIT page coordinates: a raw synthetic MouseEvent does not
|
||||||
|
// carry a correct pageY on mobile browsers, which made jQuery UI drop the dragged
|
||||||
|
// card to a wrong vertical position (X right, Y jumping up).
|
||||||
if (moved) {
|
if (moved) {
|
||||||
document.dispatchEvent(new MouseEvent("mousemove", {
|
jq(document).trigger(jq.Event("mousemove", {
|
||||||
|
which: 1,
|
||||||
clientX: lastX,
|
clientX: lastX,
|
||||||
clientY: lastY,
|
clientY: lastY,
|
||||||
bubbles: true
|
pageX: lastX + window.pageXOffset,
|
||||||
|
pageY: lastY + window.pageYOffset
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -50,7 +50,7 @@ class Plugin extends Base
|
|||||||
|
|
||||||
public function getPluginVersion()
|
public function getPluginVersion()
|
||||||
{
|
{
|
||||||
return '1.2.0';
|
return '1.2.5';
|
||||||
}
|
}
|
||||||
|
|
||||||
public function getPluginHomepage()
|
public function getPluginHomepage()
|
||||||
|
|||||||
31
README.md
31
README.md
@@ -34,6 +34,12 @@ movement threshold so ending a drag does not open the task) without bloating tha
|
|||||||
is hard to grab. FontAwesome icons are sized by `font-size`, so a single rule scales the
|
is hard to grab. FontAwesome icons are sized by `font-size`, so a single rule scales the
|
||||||
handle from the `--td-handle-size` CSS variable. It is inert on desktop, where Kanboard
|
handle from the `--td-handle-size` CSS variable. It is inert on desktop, where Kanboard
|
||||||
keeps the handle hidden.
|
keeps the handle hidden.
|
||||||
|
- **Subtask row icon size**: the same `--td-handle-size` variable also enlarges the subtask
|
||||||
|
row's first-cell icons on the task view -- the drag arrows (`.draggable-row-handle`), the
|
||||||
|
gear/caret menu (`.subtask-submenu`) and the status-toggle checkbox -- so they are usable
|
||||||
|
touch targets. Unlike the board handle, these icons are visible on every device, so this
|
||||||
|
applies on desktop too. Scoped to `.subtasks-table` (the Columns/Swimlanes config tables,
|
||||||
|
which share the same classes, are left untouched).
|
||||||
- **Drag auto-scroll**: a script (`Asset/js/drag-autoscroll.js`) listens for jQuery UI
|
- **Drag auto-scroll**: a script (`Asset/js/drag-autoscroll.js`) listens for jQuery UI
|
||||||
sortable's `sortstart`/`sortstop` (which also fire on touch via Kanboard's bundled Touch
|
sortable's `sortstart`/`sortstop` (which also fire on touch via Kanboard's bundled Touch
|
||||||
Punch) and, while a card drag is active, scrolls toward whichever edge the pointer nears:
|
Punch) and, while a card drag is active, scrolls toward whichever edge the pointer nears:
|
||||||
@@ -63,9 +69,30 @@ These settings are global (per Kanboard instance) and admin-only. Go to
|
|||||||
- **Widen the gap between columns** -- toggles the wider gap. Default: on.
|
- **Widen the gap between columns** -- toggles the wider gap. Default: on.
|
||||||
- **Drag the board background to scroll horizontally** -- toggles the Trello-style
|
- **Drag the board background to scroll horizontally** -- toggles the Trello-style
|
||||||
click-and-drag panning. Desktop (mouse) for now. Default: on.
|
click-and-drag panning. Desktop (mouse) for now. Default: on.
|
||||||
- **Mobile drag handle size in pixels** -- size of the mobile card drag handle
|
- **Mobile drag handle size in pixels** -- size of the mobile card drag handle AND the subtask
|
||||||
(`--td-handle-size`). No effect on desktop. Default: 20.
|
row's first-cell icons (`--td-handle-size`). The card handle is mobile-only; the subtask icons
|
||||||
|
show on every device (desktop too). Default: 20.
|
||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
AGPL-3.0. See LICENSE.
|
AGPL-3.0. See LICENSE.
|
||||||
|
|
||||||
|
## More Kanboard plugins by Dr. Beco
|
||||||
|
|
||||||
|
All free and AGPL-3.0, at [code.beco.cc](https://code.beco.cc/beco):
|
||||||
|
|
||||||
|
- **[RecoReco](https://code.beco.cc/beco/RecoReco)** -- calendar-scheduled recurring cards (yearly,
|
||||||
|
monthly, weekly, daily), driven by the card due date.
|
||||||
|
- **[FinanceBuddy](https://code.beco.cc/beco/FinanceBuddy)** -- attach a money value (debit/credit
|
||||||
|
and installments) to cards, shown on the card and totalled per column.
|
||||||
|
- **[QualKard](https://code.beco.cc/beco/QualKard)** -- flashcard spaced repetition: grade a card by
|
||||||
|
dragging it to a column, and it comes back when due (needs RecoReco).
|
||||||
|
- **[WorkspaceOrg](https://code.beco.cc/beco/WorkspaceOrg)** -- group your projects into personal
|
||||||
|
per-user workspaces, shown on a "My workspaces" dashboard page with a badge on each project.
|
||||||
|
- **[OrganonTweaks](https://code.beco.cc/beco/OrganonTweaks)** -- an umbrella of small
|
||||||
|
quality-of-life board tweaks: remove an empty column, always show the comment icon, emphasize due
|
||||||
|
dates, extra search keywords and shared board filters, and more.
|
||||||
|
- **[BulkMoveTasks](https://code.beco.cc/beco/BulkMoveTasks)** -- move every task from one board
|
||||||
|
column to another in a single action.
|
||||||
|
- **[ShrinkVertically](https://code.beco.cc/beco/ShrinkVertically)** -- shrink vertically-collapsed
|
||||||
|
board columns so the horizontal scrollbar stays within reach.
|
||||||
|
|||||||
Reference in New Issue
Block a user