RefractTrack Board and List Views - Revision history

Nerdofepic at 22:42, 11 September 2026

2026-09-11T22:42:58Z

← Older revision		Revision as of 22:42, 11 September 2026
Line 2:		Line 2:

	RefractTrack gives you two different ways to look at a project's tasks, depending on what you're trying to do.		RefractTrack gives you two different ways to look at a project's tasks, depending on what you're trying to do.

			[[File:RefractTrack_Board_View.png\|border\|center\|700px\|The board view, with tasks arranged in columns.]]

	=== Board view ===		=== Board view ===

Nerdofepic at 03:32, 3 September 2026

2026-09-03T03:32:15Z

← Older revision		Revision as of 03:32, 3 September 2026
Line 24:		Line 24:
	* [[RefractTrack_Stages\|Stages]]		* [[RefractTrack_Stages\|Stages]]
	* [[RefractTrack_Projects\|Projects]]		* [[RefractTrack_Projects\|Projects]]

			[[Category:RefractTrack]]

Nerdofepic at 13:49, 28 August 2026

2026-08-28T13:49:24Z

← Older revision		Revision as of 13:49, 28 August 2026
Line 1:		Line 1:
	== Board and List Views ==		== Board and List Views ==

	RefractTrack ~~offers~~ two ways to ~~browse~~ a project's tasks.		RefractTrack gives you two different ways to look at a project's tasks, depending on what you're trying to do.

	=== Board view ===		=== Board view ===

	~~<code><nowiki>~~board~~.php</nowiki></code> shows~~ tasks as cards in ~~swimlanes, one lane per visible~~ [[RefractTrack_Stages\|~~Stage~~]] in ~~that project~~, ~~in the order stages are configured~~.		The board is the classic kanban layout — tasks as cards, arranged in columns (called [[RefractTrack_Stages\|Stages]]) that represent steps in your workflow, like ''Not Started'', ''In Progress'', and ''Done''.

	* '''Drag-and-drop''' ~~(<code><nowiki>js/board.js</nowiki></code>) moves~~ a ~~task between stages~~. ~~This calls~~ the ~~<code><nowiki>api/update_stage.php</nowiki></code> AJAX endpoint~~, ~~which independently re-verifies that the dragged~~ task~~'s project matches the target stage's project before applying the move (rejecting mismatches rather than trusting the client)~~.		* '''Drag and drop''' a card to a different column to move it along. RefractTrack always double-checks the move makes sense before saving it, so you can't accidentally drop a task somewhere invalid.
	* ~~Dropping~~ a task into a ~~stage flagged <code><nowiki>requires_assignee</nowiki></code> prompts for~~ an assignee (~~an optional~~ due-date ~~prompt can also appear)~~ before the move ~~is committed — see [[RefractTrack_Tasks\|Tasks]]~~.		* If you drop a task into a column that requires an assignee (In Progress and In Review, by default), you'll be prompted to pick one — and optionally set a due date — before the move goes through.
	* ~~Hidden stages~~ (see [[RefractTrack_Stages\|Stages]]) ~~don~~'t ~~get their own lane~~, but ~~their~~ tasks ~~remain~~ reachable from ~~List~~ view or the task ~~detail~~ page.		* Columns that have been hidden from the board (see [[RefractTrack_Stages\|Stages]]) won't show up as lanes, but any tasks sitting in them are still fully reachable from the list view or the task's own page.

	=== List view ===		=== List view ===

	~~<code><nowiki>~~list~~.php</nowiki></code>~~ shows ~~tasks~~ in a sortable, filterable table ~~rather than lanes~~ — ~~useful~~ for scanning ~~or filtering~~ a ~~large~~ project by search text, sort order, group, assignee, or ~~stage~~.		The list view shows every task in a sortable, filterable table instead of columns — handy for scanning a big project, or narrowing things down by search text, sort order, group, assignee, or column.

	~~Switching projects while~~ on ~~List (or~~ any other top-level project-scoped page) returns to the equivalent page on the new project rather than bouncing to the board — see "Switching projects" in [[RefractTrack_Projects\|Projects]]. View filters, however, are intentionally dropped on switch, since a filter like a specific stage could point at something meaningless in the new project.		=== Works well on any screen ===

	~~=== Responsive layout ===~~		The whole interface, including the navigation bar, is designed to adapt smoothly down to phone-sized screens — no awkward horizontal scrolling required, even on a small screen.

	The ~~site header (<code><nowiki>.topbar</nowiki></code>~~, ~~in <code><nowiki>includes/header.php</nowiki></code> / <code><nowiki>css/style.css</nowiki></code>)~~ is designed to ~~stay usable at any width~~ down to phone ~~size with~~ no horizontal ~~scrollbar:~~

	* Below 900px, the nav links wrap onto extra rows instead of scrolling ~~horizontally.~~
	* Below 600px, ~~the whole topbar switches to~~ a ~~stacked column layout, with the brand, project switcher, nav links, Bulk Create/+New Task actions, and the user chip/logout each on their own full-width row.~~

	The topbar uses <code><nowiki>position: sticky</nowiki></code> rather than <code><nowiki>fixed</nowiki></code>, so it growing taller at narrow widths simply pushes page content down instead of clipping or covering it.

	=== Related pages ===		=== Related pages ===

Nerdofepic: Created page with "== Board and List Views == RefractTrack offers two ways to browse a project's tasks. === Board view === `board.php` shows tasks as cards in swimlanes, one lane per visible Stage in that project, in the order stages are configured. * '''Drag-and-drop''' (`js/board.js`) moves a task between stages. This calls the `api/update_stage.php` AJAX endpoint, which indepe..."

2026-08-27T23:19:04Z

Created page with "== Board and List Views == RefractTrack offers two ways to browse a project's tasks. === Board view === <code><nowiki>board.php</nowiki></code> shows tasks as cards in swimlanes, one lane per visible Stage in that project, in the order stages are configured. * '''Drag-and-drop''' (<code><nowiki>js/board.js</nowiki></code>) moves a task between stages. This calls the <code><nowiki>api/update_stage.php</nowiki></code> AJAX endpoint, which indepe..."

New page

== Board and List Views ==

RefractTrack offers two ways to browse a project's tasks.

=== Board view ===

<code><nowiki>board.php</nowiki></code> shows tasks as cards in swimlanes, one lane per visible [[RefractTrack_Stages|Stage]] in that project, in the order stages are configured.

* '''Drag-and-drop''' (<code><nowiki>js/board.js</nowiki></code>) moves a task between stages. This calls the <code><nowiki>api/update_stage.php</nowiki></code> AJAX endpoint, which independently re-verifies that the dragged task's project matches the target stage's project before applying the move (rejecting mismatches rather than trusting the client).
* Dropping a task into a stage flagged <code><nowiki>requires_assignee</nowiki></code> prompts for an assignee (an optional due-date prompt can also appear) before the move is committed — see [[RefractTrack_Tasks|Tasks]].
* Hidden stages (see [[RefractTrack_Stages|Stages]]) don't get their own lane, but their tasks remain reachable from List view or the task detail page.

=== List view ===

<code><nowiki>list.php</nowiki></code> shows tasks in a sortable, filterable table rather than lanes — useful for scanning or filtering a large project by search text, sort order, group, assignee, or stage.

Switching projects while on List (or any other top-level project-scoped page) returns to the equivalent page on the new project rather than bouncing to the board — see "Switching projects" in [[RefractTrack_Projects|Projects]]. View filters, however, are intentionally dropped on switch, since a filter like a specific stage could point at something meaningless in the new project.

=== Responsive layout ===

The site header (<code><nowiki>.topbar</nowiki></code>, in <code><nowiki>includes/header.php</nowiki></code> / <code><nowiki>css/style.css</nowiki></code>) is designed to stay usable at any width down to phone size with no horizontal scrollbar:

* Below 900px, the nav links wrap onto extra rows instead of scrolling horizontally.
* Below 600px, the whole topbar switches to a stacked column layout, with the brand, project switcher, nav links, Bulk Create/+New Task actions, and the user chip/logout each on their own full-width row.

The topbar uses <code><nowiki>position: sticky</nowiki></code> rather than <code><nowiki>fixed</nowiki></code>, so it growing taller at narrow widths simply pushes page content down instead of clipping or covering it.

=== Related pages ===

* [[RefractTrack_Tasks|Tasks]]
* [[RefractTrack_Stages|Stages]]
* [[RefractTrack_Projects|Projects]]