mirrors/caddy-website
1
0
Fork 0
mirror of https://github.com/caddyserver/website.git synced 2025-04-21 20:46:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Rework AJQuery to $_ to not interfere with jQuery

Browse source
This commit is contained in:
Francis Lavoie 2023-11-19 07:11:21 -05:00
parent babfa3a7c0
commit 36841d57d4
No known key found for this signature in database
GPG key ID: 0F66EE1687682239
13 changed files with 57 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

4
new/includes/examples/custom-ca.md
View file

@ -1,6 +1,6 @@
<script>
document.addEventListener("DOMContentLoaded", (event) => {
window.$('.ex-custom-ca pre.chroma').classList.add('light');
ready(() => {
window.$_('.ex-custom-ca pre.chroma').classList.add('light');
});
</script>

4
new/includes/examples/file-server.md
View file

@ -1,5 +1,5 @@
<script>
document.addEventListener("DOMContentLoaded", (event) => {
ready(() => {
let startElement, endElement;
startElement = findWithContent('.ex-fs pre.chroma code span.line', 'file_server /downloads/* {');
@ -25,7 +25,7 @@ document.addEventListener("DOMContentLoaded", (event) => {
endElement = findNextText(startElement, 'browse');
wrapRangeWithSpan(startElement, endElement, 'rollover-browse rollover-purple');
window.$('.ex-fs pre.chroma').classList.add('light');
window.$_('.ex-fs pre.chroma').classList.add('light');
});
</script>

4
new/includes/examples/json-automate-certs.md
View file

@ -1,6 +1,6 @@
<script>
document.addEventListener("DOMContentLoaded", (event) => {
window.$('.ex-json-automate-certs pre.chroma').classList.add('light');
ready(() => {
window.$_('.ex-json-automate-certs pre.chroma').classList.add('light');
});
</script>

4
new/includes/examples/local-https.md
View file

@ -1,6 +1,6 @@
<script>
document.addEventListener("DOMContentLoaded", (event) => {
window.$('.ex-local-https pre.chroma').classList.add('light');
ready(() => {
window.$_('.ex-local-https pre.chroma').classList.add('light');
});
</script>

2
new/includes/examples/proxy.md
View file

@ -1,5 +1,5 @@
<script>
document.addEventListener("DOMContentLoaded", (event) => {
ready(() => {
let startElement, endElement;
startElement = findWithContent('.ex-proxy pre.chroma code span', 'php_fastcgi');

4
new/includes/examples/website-caddyfile.md
View file

@ -1,6 +1,6 @@
<script>
document.addEventListener("DOMContentLoaded", (event) => {
window.$('.ex-website-caddyfile pre.chroma').classList.add('light');
ready(() => {
window.$_('.ex-website-caddyfile pre.chroma').classList.add('light');
});
</script>

2
new/index.html
View file

@ -702,7 +702,7 @@ $ curl localhost:2019/config/ | jq<div class="blinking"></div></code>
</template>
<script>
AsciinemaPlayer.create('/resources/321140.cast', $('#video-demo'), {
AsciinemaPlayer.create('/resources/321140.cast', $_('#video-demo'), {
preload: true,
autoPlay: true,
controls: true

12
new/resources/js/common.js
View file

@ -1,6 +1,6 @@
// AJQuery: https://github.com/coolaj86/ajquery.js (modified slightly by me)
function $(sel, el) { return ((typeof el === 'string' ? $(el) : el) || document).querySelector(sel); }
function $$(sel, el) { return (el || document).querySelectorAll(sel); }
function $_(sel, el) { return ((typeof el === 'string' ? $_(el) : el) || document).querySelector(sel); }
function $$_(sel, el) { return (el || document).querySelectorAll(sel); }
function ready(fn) {
if (document.readyState !== 'loading') {
@ -43,7 +43,7 @@ function cloneTemplate(tplSelector) {
// Ohhhhhh wow, we need to use firstElementChild when cloning the content of a template tag (!!!!):
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template#avoiding_documentfragment_pitfall
// I spent way too long on this.
const elem = $(tplSelector);
const elem = $_(tplSelector);
if (!elem) return;
return elem.content.firstElementChild.cloneNode(true);
// return document.importNode(elem.content, true);
@ -131,7 +131,7 @@ function setTheme(theme) {
theme = "system";
}
localStorage.setItem("theme", theme);
ready(function() { $('#current-theme').innerText = theme; });
ready(function() { $_('#current-theme').innerText = theme; });
let lightOrDarkTheme = theme;
if (lightOrDarkTheme == "system") {
lightOrDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? "dark" : "light";
@ -142,9 +142,9 @@ function setTheme(theme) {
// applyTheme simply adds or removes the 'dark' class to the HTML.
function applyTheme(lightOrDark) {
if (lightOrDark == "dark") {
$('html').classList.add('dark');
$_('html').classList.add('dark');
} else {
$('html').classList.remove('dark');
$_('html').classList.remove('dark');
}
}

14
new/resources/js/docs-home.js
View file

@ -365,9 +365,9 @@ quickAssist = function() {
// show renders the given state into the quick assist box
function show(state) {
// reset & show prompt/content
$('.quick-assist-question').innerHTML = state.prompt || state.title;
$('.quick-assist-content').innerHTML = state.content || '';
$('.quick-assist-options').innerHTML = '';
$_('.quick-assist-question').innerHTML = state.prompt || state.title;
$_('.quick-assist-content').innerHTML = state.content || '';
$_('.quick-assist-options').innerHTML = '';
// render options
let hasNext = false;
@ -385,7 +385,7 @@ quickAssist = function() {
} else if (opt.href) {
btn.href = opt.href;
}
$('.quick-assist-options').append(btn);
$_('.quick-assist-options').append(btn);
}
}
@ -395,7 +395,7 @@ quickAssist = function() {
const reset = document.createElement('a');
reset.classList.add('button', 'reset');
reset.innerText = "Reset";
$('.quick-assist-options').append(reset);
$_('.quick-assist-options').append(reset);
}
history.push(state);
@ -429,12 +429,12 @@ quickAssist = function() {
const link = document.createElement('a');
link.innerText = event.target.dataset.breadcrumb || event.target.innerText;
link.dataset.index = history.length;
$('.quick-assist-history').append(link);
$_('.quick-assist-history').append(link);
show(states[event.target.dataset.next]);
});
on('click', '.quick-assist-options a.reset', event => {
$('.quick-assist-history a:first-child').dispatchEvent(new Event('click', { bubbles: true }));
$_('.quick-assist-history a:first-child').dispatchEvent(new Event('click', { bubbles: true }));
})
// when page loads, show the start of the quick assist

22
new/resources/js/docs.js
View file

@ -1,13 +1,13 @@
ready(function() {
// highlight current page in left nav
let currentPageLink = $('main nav a[href="'+window.location.pathname+'"]');
let currentPageLink = $_('main nav a[href="'+window.location.pathname+'"]');
if (window.location.pathname.startsWith("/docs/json/")) {
// as a special case, highlight the JSON structure link anywhere within it
currentPageLink = $('main nav a[href="/docs/json/"]');
currentPageLink = $_('main nav a[href="/docs/json/"]');
}
if (window.location.pathname.startsWith("/docs/modules/")) {
// as another special case, highlight the modules link anywhere within it
currentPageLink = $('main nav a[href="/docs/modules/"]');
currentPageLink = $_('main nav a[href="/docs/modules/"]');
}
currentPageLink?.classList?.add('current');
@ -16,22 +16,22 @@ ready(function() {
// TODO: support h3 too
const spacingMS = 50;
let delay = spacingMS;
const h2elems = $$('main article h2');
const h2elems = $$_('main article h2');
if (h2elems.length) {
$('#pagenav .heading').style.display = 'block';
$_('#pagenav .heading').style.display = 'block';
h2elems.forEach(elem => {
const a = document.createElement('a');
a.innerText = elem.innerText;
a.href = `#${elem.id}`;
setTimeout(function() {
$('#pagenav').append(a);
$_('#pagenav').append(a);
}, delay);
delay += spacingMS;
});
}
// add anchor links, inspired by https://github.com/bryanbraun/anchorjs
$$('article > h2[id], article > h3[id], article > h4[id], article > h5[id], article > h6[id]').forEach(function(elem) {
$$_('article > h2[id], article > h3[id], article > h4[id], article > h5[id], article > h6[id]').forEach(function(elem) {
const anchor = document.createElement('a');
anchor.href = `#${elem.id}`;
anchor.classList.add('anchor-link');
@ -40,12 +40,12 @@ ready(function() {
elem.append(anchor);
});
const autonav = $('#autonav');
const autonav = $_('#autonav');
// when a left-side-nav-link is hovered, show the in-page nav in a popout to the side
on('mouseover', 'main nav li a:not(#autonav a)', async e => {
// only show the pop-out nav if not on mobile/narrow screen
if ($('#docs-menu').offsetParent != null) {
if ($_('#docs-menu').offsetParent != null) {
return;
}
@ -75,7 +75,7 @@ ready(function() {
autonav.append(a);
}
if ($('#autonav *')) {
if ($_('#autonav *')) {
const sections = document.createElement('div')
sections.classList.add('heading');
sections.innerText = 'Sections';
@ -92,7 +92,7 @@ ready(function() {
// toggle left-nav when menu link is clicked
on('click', '#docs-menu', e => {
const nav = $('#docs-menu-container');
const nav = $_('#docs-menu-container');
if (!nav.offsetHeight) {
nav.style.height = `${nav.scrollHeight}px`;
} else {

20
new/resources/js/home.js
View file

@ -6,28 +6,28 @@ const resp = fetch("/resources/testimonials.json").then(async resp => {
for (let i = 0; i < testimonials.length; i++) {
const testimonial = testimonials[i];
const tpl = cloneTemplate('#tpl-testimonial');
$('.testimonial-picture', tpl).src = testimonial.picture || "";
$('.testimonial-quote', tpl).innerText = `"${testimonial.quote}"`;
$_('.testimonial-picture', tpl).src = testimonial.picture || "";
$_('.testimonial-quote', tpl).innerText = `"${testimonial.quote}"`;
if (testimonial.username) {
$('.testimonial-name', tpl).innerText = ` @${testimonial.username}`;
$_('.testimonial-name', tpl).innerText = ` @${testimonial.username}`;
} else {
$('.testimonial-name', tpl).innerText = testimonial.name || "";
$_('.testimonial-name', tpl).innerText = testimonial.name || "";
}
$('.testimonial-role', tpl).innerText = testimonial.role || "";
$_('.testimonial-role', tpl).innerText = testimonial.role || "";
if (testimonial.org) {
$('.testimonial-role', tpl).appendChild(document.createElement("br"));
$('.testimonial-role', tpl).appendChild(document.createTextNode(testimonial.org));
$_('.testimonial-role', tpl).appendChild(document.createElement("br"));
$_('.testimonial-role', tpl).appendChild(document.createTextNode(testimonial.org));
}
$(`.testimonial-col:nth-child(${i%3 + 1})`).append(tpl);
$_(`.testimonial-col:nth-child(${i%3 + 1})`).append(tpl);
}
on('mouseover', '.rollover', e => {
const target = e.target.closest('.rollover') || e.target;
$$(`.${target.dataset.rollover}`).forEach(elem => elem.classList.add('show'));
$$_(`.${target.dataset.rollover}`).forEach(elem => elem.classList.add('show'));
});
on('mouseout', '.rollover', e => {
const target = e.target.closest('.rollover') || e.target;
$$(`.${target.dataset.rollover}`).forEach(elem => elem.classList.remove('show'));
$$_(`.${target.dataset.rollover}`).forEach(elem => elem.classList.remove('show'));
});
});
});

10
new/resources/js/lib.js
View file

@ -1,6 +1,6 @@
// AJQuery: https://github.com/coolaj86/ajquery.js (modified slightly by me)
function $(sel, el) { return ((typeof el === 'string' ? $(el) : el) || document).querySelector(sel); }
function $$(sel, el) { return (el || document).querySelectorAll(sel); }
function $_(sel, el) { return ((typeof el === 'string' ? $_(el) : el) || document).querySelector(sel); }
function $$_(sel, el) { return (el || document).querySelectorAll(sel); }
function ready(fn) {
@ -40,7 +40,7 @@ function on(eventName, elemSelector, handler, capture) {
function trigger(el, eventType) {
if (typeof el === 'string') {
el = $(el); // assume it was a selector, for convenience
el = $_(el); // assume it was a selector, for convenience
}
// from youmightnotneedjquery.com
@ -60,7 +60,7 @@ function cloneTemplate(tplSelector) {
// Ohhhhhh wow, we need to use firstElementChild when cloning the content of a template tag (!!!!):
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template#avoiding_documentfragment_pitfall
// I spent way too long on this.
const elem = $(tplSelector);
const elem = $_(tplSelector);
if (!elem) return;
return elem.content.firstElementChild.cloneNode(true);
// return document.importNode(elem.content, true);
@ -69,7 +69,7 @@ function cloneTemplate(tplSelector) {
// isVisible returns true if elem (an element or selector) is visible.
function isVisible(elem) {
if (typeof elem === 'string') {
elem = $(elem);
elem = $_(elem);
}
return elem.offsetParent !== null;
}

6
new/sponsor.html
View file

@ -640,9 +640,9 @@
// Original hover glowy effect code from here:
// https://codepen.io/inescodes/pen/PoxMyvX
const cardsContainer = $(".plans");
const cards = Array.from($$(".plan"));
const overlay = $(".overlay");
const cardsContainer = $_(".plans");
const cards = Array.from($$_(".plan"));
const overlay = $_(".overlay");
function applyOverlayMask(e) {
const overlayEl = e.currentTarget;