Skip to content

Instantly share code, notes, and snippets.

View JanDW's full-sized avatar
🕳️

Jan De Wilde JanDW

🕳️
15 followers · 33 following
View GitHub Profile
@JanDW
JanDW / web-component.js
Created January 16, 2025 23:00
Web component boilerplate with lifecycle callbacks.
class MyElement extends HTMLElement {
// Fires when an instance of the element is created or updated
constructor() {
super();
}
// Fires when an instance was inserted into the document
connectedCallback() {
}
@JanDW
JanDW / Untitled-1
Created January 16, 2025 22:59
<script>
// Creates MyElements extending HTML Element
class MyElement extends HTMLElement {
// Fires when an instance of the element is created or updated
constructor() {
super();
}
// Fires when an instance was inserted into the document
connectedCallback() {
@JanDW
JanDW / gpx.js
Created October 31, 2024 17:47
return {
fileName: gpxFile,
// gpxString: gpxStringClean,
trkName,
totalDistance: totalDistance.toFixed(2),
startWaypoint: {
name: startWaypoint.getElementsByTagName('name')[0]?.textContent,
lat: startWaypoint.getAttribute('lat'),
lon: startWaypoint.getAttribute('lon'),
ele: startWaypoint.getElementsByTagName('ele')[0]?.textContent,
@JanDW
JanDW / tiaa-updates-01-10-23.md
Created January 10, 2024 23:04

TIA Website Updates · Jan 10, 2024

  • Andromeda bio pic
    • Nacul → Bio
    • Add to carousel on `tiarchitects/projects/andromeda swap out`` for Andromeda rendering
  • New article for Principles of Ecological Architecture
    • Sandy will supply image
  • Add the 2 new books
    • Omega
      • T - Get image (Nina can do mockup?)
@JanDW
JanDW / remco-not-so-happy-new-year.md
Created January 2, 2024 19:17

Remco the Betta not doing great

Tank + Creatures

On Nov 13, 2023, I set up this 10 gallon dirted, sand-capped, and planted tank. I don’t vacuum the sand.

Contains:

  • a Betta, added Nov 25. Currently sick.
@JanDW
JanDW / aspect-ratio-layout-2.html
Created November 10, 2023 02:32
Using parent CSS selector (:has()) to target the desired layout
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Container Queries Javascript II</title>
<body>
<main>
<style>
@JanDW
JanDW / aspect-ratio-layout.html
Created November 9, 2023 21:41
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Container Queries Javascript</title>
<body>
<main>
<style>
*,
@JanDW
JanDW / Untitled-1
Created September 22, 2022 18:34
Section instance consistently fails to render in page editor
instrument.ts:129 TypeError: Cannot read properties of undefined (reading 'label')
at Select.tsx:28:73
at Ru (react-dom.production.min.js:262:359)
at t.unstable_runWithPriority (scheduler.production.min.js:18:343)
at Wo (react-dom.production.min.js:122:325)
at Au (react-dom.production.min.js:261:308)
at gu (react-dom.production.min.js:243:50)
at react-dom.production.min.js:123:115
at t.unstable_runWithPriority (scheduler.production.min.js:18:343)
at Wo (react-dom.production.min.js:122:325)
@JanDW
JanDW / outliner-snippet.js
Last active September 23, 2022 13:47
Applies outline and background-color in order to more readily understand layouts.
if (!document.querySelector("#debugStyles")) {
const style = document.createElement("style");
style.setAttribute("id", "debugStyles");
style.innerHTML = `
.debug-boxes * {
outline: 1px solid blue;
background-color: rgba(0,255,255,.05);
}
`;
document.head.appendChild(style);
@JanDW
JanDW / monty-hall.js
Created January 17, 2021 06:32
function shuffleArray(arr) {
for (let i = arr.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[arr[i], arr[j]] = [arr[j], arr[i]];
}
}
const montyHall = (n) => {
let wins = 0;
let doors = ["goat", "goat", "car"];