-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
partially addresses #130
- Loading branch information
Showing
6 changed files
with
113 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| /* global document, window */ | ||
|
|
||
| import SortDirectives from '../../../scripts/SortDirectives.js' | ||
|
|
||
| const directivesOrder = [null, `ascending`, `descending`, null] | ||
|
|
||
| export default class Table { | ||
|
|
||
| initialize() { | ||
| this.el = document.getElementById(`results`) | ||
| if (!this.el) return | ||
| this.el.addEventListener(`click`, this.sort.bind(this)) | ||
| } | ||
|
|
||
| sort(ev) { | ||
|
|
||
| const button = ev.target.closest(`button`) | ||
|
|
||
| if (!button) return | ||
|
|
||
| const { field } = button.dataset | ||
| const th = button.parentNode | ||
| const direction = th.ariaSort | ||
| const url = new URL(window.location.href) | ||
| let sort = url.searchParams.get(`sort`) | ||
| const directives = new SortDirectives(sort) | ||
| const directive = directivesOrder[directivesOrder.indexOf(direction) + 1] | ||
|
|
||
| directives.add(field, directive) | ||
| sort = directives.serialize() | ||
| url.searchParams.set(`sort`, sort) | ||
| window.location = url.href | ||
|
|
||
| } | ||
|
|
||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| export default class SortDirectives extends Map { | ||
|
|
||
| constructor(directives = ``) { | ||
|
|
||
| super() | ||
|
|
||
| if (!directives) return | ||
|
|
||
| directives.split(`,`) | ||
| .filter(Boolean) | ||
| .forEach(directive => { | ||
|
|
||
| const field = directive.replace(/^-/v, ``) | ||
| const direction = directive.startsWith(`-`) ? `descending` : `ascending` | ||
|
|
||
| this.set(field, direction) | ||
|
|
||
| }) | ||
|
|
||
| } | ||
|
|
||
| /** | ||
| * Add a new sort directive to the list of directives. NOTE: The directive will be set as first in the insertion order. | ||
| * @param {String} field The field to set a new sort direction for. | ||
| * @param {"ascending"|"descending"} direction The sort direction to use for the field. | ||
| */ | ||
| add(field, direction) { | ||
|
|
||
| this.delete(field) | ||
|
|
||
| const entries = Array.from(this.entries()) | ||
|
|
||
| if (direction) { | ||
| entries.unshift([field, direction]) | ||
| } | ||
|
|
||
| this.clear() | ||
|
|
||
| for (const [f, d] of entries) { | ||
| this.set(f, d) | ||
| } | ||
|
|
||
| } | ||
|
|
||
| serialize() { | ||
| return Array.from(this.entries()) | ||
| .map(([field, direction]) => `${ direction === `descending` ? `-` : `` }${ field }`) | ||
| .join(`,`) | ||
| } | ||
|
|
||
| } |