149 commits

Author	SHA1	Message	Date
alistair3149	6ad24645e9	feat: use button elements instead of div for header navigations	2024-05-25 02:42:22 -04:00
alistair3149	6d09429849	fix: attach tabber--live class after tabber has finished init	2024-05-25 00:42:40 -04:00
alistair3149	bb110c6d98	feat: rewrite Javascript implementation ... To ensure easier development and maintenance, IE support is dropped to allow modern Javascript features. The old tabber module is rewritten into newer standard and using classes to ensure proper scoping.	2024-05-25 00:33:22 -04:00
alistair3149	177c67681e	refactor: use data-mw- prefix for data attribute	2024-05-23 22:05:28 -04:00
alistair3149	7c760e9593	refactor: make some function reusuable ... Plus various improvements and docs	2024-05-23 21:57:55 -04:00
alistair3149	7b1c319e24	feat: allow tab name to be parsed ... This is an experimental config and can lead to performance issue and unexpected behavior. Closes: #35	2024-04-24 15:13:08 -04:00
alistair3149	6e67dd2abb	fix: deprecate mobile target ... Closes: #120	2024-04-24 14:04:06 -04:00
github-actions	fcc47b044f	ci: 👷 lint code to MediaWiki standards ... Check commit and GitHub actions for more details	2024-04-24 18:01:30 +00:00
alistair3149	99413c7854	fix: always round scrollLeft ... Hopefully that will fix all the subpixel-related issues. Closes: #124, #81	2024-04-24 14:01:16 -04:00
alistair3149	f82b5555f6	refactor: remove unused method	2023-08-31 15:36:20 -04:00
alistair3149	ca4df6d884	refactor: remove console log	2023-08-31 15:35:44 -04:00
alistair3149	5a2735121f	feat: use wikipage.content hook to init scripts	2023-08-31 15:35:22 -04:00
alistair3149	576918d32e	refactor: simplify header buttons implementation	2023-07-28 17:46:58 -04:00
alistair3149	420754d185	refactor: use one event listener for all tabs ... TIL about event delegation	2023-07-28 17:18:15 -04:00
alistair3149	7c95e570a8	fix: aria-hidden return string instead of boolean	2023-07-28 03:27:42 -04:00
alistair3149	f6435de56a	refactor: check for active panel at update height function instead	2023-07-28 02:47:59 -04:00
alistair3149	54166529cb	fix: only resize section when it is the active panel	2023-07-28 02:43:26 -04:00
github-actions	a7660375fc	ci: 👷 lint code to MediaWiki standards ... Check commit and GitHub actions for more details	2023-07-12 02:07:37 +00:00
H. C. Kruse	7f75899995	feat: add support for nested tabbers in Codex (#95) ... * refactor: Apply some code cleanup * feat: WIP dynamic nested tabber in codex * feat: Make deeply nested tabbers work * doc: fix comment position --------- Co-authored-by: alistair3149 <alistair3149@users.noreply.github.com>	2023-07-11 22:06:57 -04:00
alistair3149	857f6f1f9f	feat: allow nested Tabber to be shown in VE preview	2023-07-05 22:57:05 -04:00
alistair3149	a29e3a22c0	feat: reinitialize Tabber after VE edit part 2	2023-07-05 22:10:58 -04:00
github-actions	dcfc693834	ci: 👷 lint code to MediaWiki standards ... Check commit and GitHub actions for more details	2023-07-06 02:10:01 +00:00
alistair3149	cbf6ca0c1f	feat: reinitalize Tabber after VE edit	2023-07-05 22:09:39 -04:00
alistair3149	a4e59057bf	feat: add Vue component for tab content	2023-07-05 20:00:59 -04:00
alistair3149	5f856a1a73	fix: override default MW list styles	2023-07-05 18:33:04 -04:00
alistair3149	cd63b6c10f	refactor: remove noscript message ... Tabber already shows content without JS, and noscript handling is a bit tricky in MW	2023-07-05 18:32:18 -04:00
alistair3149	0fbfefcb87	fix: avoid using noscript as it is disallowed by VE	2023-07-05 18:03:00 -04:00
alistair3149	f8e3b758b2	fix: fix var scope in VE scripts	2023-07-05 17:51:24 -04:00
alistair3149	49d4e8ec29	refactor: various eslint cleanups	2023-07-05 17:43:41 -04:00
github-actions	597f976e7e	ci: 👷 lint code to MediaWiki standards ... Check commit and GitHub actions for more details	2023-07-05 21:28:55 +00:00
alistair3149	89e90af034	feat: add experimental support of Codex ... It can be enabled by setting `$wgTabberNeueEnableLegacyMode` to `true`. It is the first implementation and a WIP with numerous caveats: - Nested Tabber does not work - Tabber Transclue does not work	2023-07-05 17:26:33 -04:00
alistair3149	365777eae3	feat: improve noscript support ... 1. Allow other tabs to be shown 2. Put noscript message in warning box	2023-02-16 14:02:04 -05:00
alistair3149	7b61ca663e	feat(core): use data-title instead of title attribute for tab panel ... Title attribute produces a tooltip over the whole tab panel. That is not ideal and the a11y need is already fulfilled by aria-label.	2022-11-02 19:55:46 -04:00
alistair3149	e124e8170a	feat: do not animate indicator when scrolling	2022-10-23 18:06:52 -04:00
alistair3149	ce35fb8908	refactor: reduce variable scope	2022-10-23 17:33:39 -04:00
alistair3149	656f3967f9	refactor: use aria attribute instead of class to select panels	2022-10-23 17:11:18 -04:00
alistair3149	9349bc334e	refactor: use aria attribute instead of class to select tabs	2022-10-23 17:07:19 -04:00
alistair3149	1cb5cfb6c7	fix: indicator should not expand header height	2022-10-22 16:38:46 -04:00
alistair3149	852256a75d	fix: typo in variable	2022-10-21 23:10:38 -04:00
alistair3149	57257cd1ba	refactor: simpler indicator update ... False alert, no need to use IntersectionObserver so yeahhh	2022-10-21 23:07:56 -04:00
alistair3149	62cb545642	fix: indicator should be visible for nested tabs ... This commit also drops support for IE. The script will be rewritten in ES6 and bumping MW requirement	2022-10-21 22:43:14 -04:00
alistair3149	f1e0df2112	feat: separate indicator from active tab ... This will allow us to animate the indicator separately. Which will be needed to make the indicator scroll with the panel.	2022-10-21 18:01:48 -04:00
alistair3149	cb1dbb239f	chore: ci cleanup	2022-10-21 15:54:44 -04:00
alistair3149	1ff78cd0b2	feat: add scroll snap to section ... This is required for anchor links to scroll to the correct tab. However this might re-trigger the bug mentioned in #47 and #38, need some alternative to fix those.	2022-10-21 15:54:24 -04:00
alex4401	787fede532	fix: jumping to a tabber when no hash specified (#63) ... Sorry for this oversight on my end.	2022-09-29 02:13:56 -04:00
alex4401	5b4f9adc15	feat: scroll target hash tabber into view (#62) ... This might not happen automatically to a simple race condition: browser may try to look up the anchor before the extension initialises.	2022-09-28 09:53:14 -04:00
chixvv1	d70049f67b	fix: one pixel offset on tab panels (#47)	2022-08-13 18:38:49 -04:00
alistair3149	6a40de7b37	feat: do not set title attribute for tab panel ... This should prevent tooltip from showing up when hovering over the tab panel container. Title doesn't really do much accessibility wise since ARIA attributes are already set	2022-07-06 03:07:17 -04:00
alistair3149	380d52e24c	fix: more accurate selector for duplicated MF images	2022-06-29 17:14:55 -04:00
alistair3149	047ba17d1b	fix: hide duplicate images generated by MobileFrontend ... When a thumb is placed inside tabber under an article section, MobileFrontend duplicates the image for some reason. So the hacky way to fix this is to hide the duplicated image. Since it is an upstream issue, there are not much I can do. Closes: #2	2022-06-29 17:01:57 -04:00
alistair3149	7762a0e9f4	fix: panel should adjust to content height	2022-06-18 20:02:26 -04:00
alistair3149	8ab7b8330d	fix: tab panel going out of bound	2022-06-16 00:36:05 -04:00
ArdWar	52baab566b	feat: allow for identical tab header (#28)	2022-06-05 15:16:48 -04:00
alistair3149	122df779e7	feat: add config to toggle Tabber animation and default to false ... Add a config to enable/disable Tabber scrolling animation. It is currently default to false as smooth scrolling is broken on Safari, as tabs would not scroll at all with it on. It is an upstream browser bug that is being tracked here: https://bugs.webkit.org/show_bug.cgi?id=238497	2022-06-03 16:46:42 -04:00
auburnsummer	e54a313de4	fix: run script after document is ready (#25) ... * Wait until document ready before main * More robust ready state handling Co-authored-by: alistair3149 <alistair3149@users.noreply.github.com>	2022-05-31 03:21:17 -04:00
alistair3149	1f4436843f	feat: improve loading behavior before module is added ... * Add skeleton screen to avoid layout shift * Hide other sections before the module is loaded to avoid layout shift * Add noscript message * Header container is now saved in parser instead of being generated. If you have any issues with the script, try clearing out the parser cache or do an empty edit.	2022-05-06 17:53:52 -04:00
alistair3149	b9eda4c4e7	fix: incorrect aria attribute label	2022-04-30 17:14:44 -04:00
alistair3149	5df6a0f772	feat: add link to documentation in VE context item ... Also make the text label for tabbertransclude different so that it does not get mixed up with regular tabber	2022-04-22 22:22:44 -04:00
alistair3149	5a5e9eecaf	refactor: clean up Javascript according to ESLint	2022-04-22 20:00:32 -04:00
alistair3149	d0be57a629	feat: add basic VE support for tabbertransclude tag ... * Add basic inspector tool for tabbertransclude * Add custom icon for Tabber * Fix an issue where Tabber VE dialog is triggered when selecting mapframe	2022-04-22 19:34:06 -04:00
alistair3149	5410a1496f	feat: add Tabber icon in VisualEditor	2022-04-22 16:31:21 -04:00
alistair3149	84273da412	feat: generate tab header in visual edit mode	2022-04-22 00:38:16 -04:00
alistair3149	3454f7b2ce	feat: do not run Tabber script if it is already activated	2022-04-21 16:35:23 -04:00
alistair3149	6165b06f28	feat: add basic VisualEditor support for tabber tags ... Adding some basic support for visual editing in VisualEditor. Currently it is nothing fancy, just the ability to recognize <tabber/> tags and a simple dialog with code editor to edit the Tabber code. It would be iterated upon in the future.	2022-04-21 15:14:52 -04:00
alistair3149	466573741e	refactor: clean up unused CSS ... It also fixes the somewhat weird bug (#13) where you can not scroll when the cursor is inside the tab panel for some browsers.	2022-04-19 18:33:11 -04:00
alistair3149	750dd273be	feat: add background fade to indicate scrollable tab header	2022-04-19 16:34:04 -04:00
alistair3149	c045490a01	feat: tweak styles of tab header ... * Tab header bottom line is now full width instead of the width of the tabs. It aligns with the previous and current Tabber behavior on Fandom wikis * Increase padding for tab buttons for bigger click area	2022-04-19 10:53:08 -04:00
alistair3149	69c638330d	feat: use CSS instead of __NOEDITSECTION__ to hide edit buttons ... * Appending __NOEDITSECTION__ to tab body seems to break the table markup (#12) * Edit buttons still work for transcluded tabs so it should be visible Closes #12	2022-04-19 10:36:38 -04:00
alistair3149	38a47307d7	feat: add HTTP status code to error message ... Also use default MediaWiki message 'error' instead of self-defined one.	2022-04-19 10:24:49 -04:00
alistair3149	7504ce5cd2	feat: add proper ARIA attributes to lazyloaded transclusions	2022-04-18 23:09:13 -04:00
alistair3149	893611e41d	feat: replace loading message with animation	2022-04-18 22:46:40 -04:00
ciencia	d8c3db4e59	feat: allow tab content to be transclusions of other pages ... * Initial merge of the TabberTransclude extension from Ciencia * Tab content can now be fetched from other pages on the wiki. The content is lazy-loaded when the tab is selected through a XHR request. * Add a config option to disable setting URL hash on tab change	2022-04-18 21:56:03 -04:00
ciencia	1959fb2928	feat: use replaceState instead of pushState on tab click ... This replaces the current history context instead of adding a new entry. The previous behavior was undesired when you switch tabs and you want to go back to the previous page.	2022-04-18 20:01:02 -04:00
ciencia	2d4d4121fd	feat: use the ResizeObserver api to detect content size changes ... This catches every possible size change of the active tab panel contents: * Window resize, will update also the offsetLeft property * Inner size changes like a collapsible element being opened or closed * And even tabber inside tabber, when the inner tabber is changed and they have different sizes ResizeObserver may not be supported by some old browsers, but that shouldn't be too bad for them. If something looks displaced they can simply switch tabs to force a resize.	2022-04-18 19:59:38 -04:00
ciencia	f1aee0bdf6	refactor: CSS.escape may not be supported by some browsers	2022-04-18 19:50:20 -04:00
ciencia	f9b3892604	refactor: NodeList.prototype.forEach may not be supported by some browsers	2022-04-18 19:34:43 -04:00
alistair3149	c46b918b04	refactor: lower JS requirements to ES5 ... * Improve compatibility with older browsers * Preparation to merge changes from TabberTransclude	2022-04-18 19:10:58 -04:00
nobbyfix	9395d641a9	fix: DOMException caused by invalid selector (#10) ... * fix for DOMException caused by invalid selector * use CSS.escape function	2022-02-01 23:04:05 -05:00
nobbyfix	5c40e1fb05	feat: update header buttons when scrolling without them (#7)	2022-01-31 01:35:36 -05:00
alistair3149	09715dcef6	feat: use Tabber count instead of MD5 as identifier	2021-10-23 00:47:49 -04:00
alistair3149	5e4471d23f	fix: incorrect character trimming for tab IDs	2021-10-23 00:29:38 -04:00
alistair3149	dae448ab5a	refactor: change md5 config name to be more clear	2021-10-01 12:23:57 -04:00
alistair3149	d44cbbf6b9	feat: add config to disable MD5 hash (#6)	2021-10-01 12:20:00 -04:00
alistair3149	331b0bea2b	feat: use clone element to get tab height when needed ... Sometimes the tab element is hidden by its parent and a cloned element will be able to get its actual height. This should also fix #4.	2021-10-01 11:11:27 -04:00
alistair3149	0dc1b34965	fix: stricter selectors for activePanel selection	2021-06-23 10:45:14 -04:00
alistair3149	342cc2aa85	fix: stricter selector to prevent issues with nested Tabber	2021-06-23 10:29:42 -04:00
alistair3149	530cdfa1b8	feat: add hover and active states to the arrow buttons	2021-06-21 20:37:28 -04:00
alistair3149	2580c82d06	refactor: rename Tabber classes to be more semantic	2021-06-21 19:46:17 -04:00
alistair3149	c8aa336530	refactor: remove unnessecary quotation marks	2021-06-21 19:38:59 -04:00
alistair3149	46596e450f	feat: add aria-selected support	2021-06-21 19:32:15 -04:00
alistair3149	45fb952d2d	refactor: use documentFragment for buildTabs	2021-06-21 19:28:47 -04:00
alistair3149	775d38e36a	feat: only smooth scroll in viewport larger than tablet	2021-06-21 18:48:56 -04:00
alistair3149	4d79292616	refactor: drop all jQuery	2021-06-21 17:14:33 -04:00
alistair3149	31eb88ca52	refactor: convert HTML generation into ES6	2021-06-21 16:56:00 -04:00
alistair3149	2ee7bea7e9	fix: recalculate height based on tab content	2021-06-21 15:42:29 -04:00
alistair3149	8d980ce8ff	refactor: replace some jQuery with ES6	2021-06-21 15:22:35 -04:00
alistair3149	1ee66a0a94	refactor: lint scripts with ESLint	2021-06-21 14:54:31 -04:00
alistair3149	e9fcf81043	refactor: lint styles with stylelint	2021-06-21 14:45:06 -04:00
alistair3149	eb9564509b	feat: initial refactor into TabberNeue	2021-06-21 13:49:47 -04:00