Template:LocaleDate: Difference between revisions

← Older edit

Template:LocaleDate (view source)

Revision as of 18:49, 5 May 2025

355 bytes removed , 5 May

made code more readable; added docs; deleted stashed JS code now that it is being deployed

Iritscen

Bureaucrats, Interface administrators, Suppressors, Administrators

19,477

edits

@@ Line 1: / Line 1: @@
-<includeonly><templatestyles src="LocaleDate/styles.css" /><span class="date-wrapper"><span class="date-day">{{{day}}}</span><span class="date-month">{{{month}}}</span><span class="date-year">{{{year}}}</span></span></includeonly><noinclude>This template was an experiment in using [[Template:LocaleDate/styles.css|template CSS]] via the TemplateStyles extension to dynamically reformat dates as mdy or dmy based on the user's locale*. This hacky attempt failed because the sanitizer used by TemplateStyles to safety-check the CSS does not allow CSS variables. Amazingly MediaWiki still lacks the ability for a template to directly read the user's locale.
+<includeonly><templatestyles src="LocaleDate/styles.css" /><!--
+--><span class="date-wrapper"><!--
+--><span class="date-month">{{{2}}}</span><!--
+--><span class="date-day">{{{3}}}</span><!--
+--><span class="date-year">{{{1}}}</span><!--
+--></span></includeonly><noinclude>
+This template (in tandem with the extensions TemplateStyles and TemplateStylesExtender, the [[Template:LocaleDate/styles.css|styles.css]] subpage, and JS code in [[MediaWiki:Common.js]] that taps into the browser locale) allows a date to dynamically re-format as MDY or DMY based on the user's locale. This somewhat hacky approach is necessary because MediaWiki still lacks the ability for a template to directly read the user's locale.
-<nowiki>*</nowiki>The locale would need to be read via JavaScript, which would then set some CSS variables accordingly. The JS code was never written, but it would look something like:
+Simply call the template and pass it the components of the date in YMD order:
- function getLang() {
-  if (navigator.languages !== undefined)
+<code><nowiki>Oni released on {{LocaleDate|2001|1|29}}.</nowiki></code><br>
-    return navigator.languages[0];
+yields:<br>
-  return navigator.language;
+Oni released on {{LocaleDate|2001|1|29}}.
- }
- const lang = getLang();
- const root = document.querySelector(':root');
- if (lang == "en-US") {
-  root.style.setProperty('--month-order', '1');
-  root.style.setProperty('--day-order', '2');
- } else {
-  root.style.setProperty('--month-order', '2');
-  root.style.setProperty('--day-order', '1');
- }
 [[Category:Utility templates]]
 </noinclude>