Skip to content

Instantly share code, notes, and snippets.

@westc
westc / Animated YourJS Logo.svg
Last active July 4, 2026 03:51
Animated YourJS SVG Logos
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@westc
westc / showBox.js
Last active July 4, 2026 01:40
A lightweight, zero-dependency asynchronous modal prompt library for the browser built on vanilla JS and HTML5 <dialog>. Features strict object-based button bindings, dynamic form field generation, keyboard shortcut captures (Enter/Esc), and automatic theme matching with explicit runtime overrides. Completely encapsulated within a single global …
/**
* @typedef {Object} FieldOption
* @property {string} [value] - The underlying data value for the option. Defaults to the label if omitted.
* @property {string} label - The visible text display for the option.
*/
/**
* @typedef {Object} BoxField
* @property {string} label - The unique identifier and visible text label for the form field.
* @property {string} [description] - Optional subtext or instructions displayed below the label.
@westc
westc / poll.js
Created June 2, 2026 23:30
A simple way to poll for something in JS.
/**
* @typedef poll__options
* @property {((criteriaResult: any) => void)=} callback
* Optional. If not specified then `poll` returns a promise that will resolve once `criteria` returns a `true`-ish value.
* @property {number} [timeout=50]
* Optional. Number of milliseconds between one call to criteria and the next (excluding the initial which is immediate). Defaults to `50`.
* @property {boolean} [ignoreErrors=false]
* Optional. Whether or not an error coming from `criteria` will be ignored. Defaults to `false`.
*/
/**
@westc
westc / fromUniqueBase.js
Created May 18, 2026 23:36
Convert numbers to custom bases using unique characters and convert back to numbers using custom bases.
/**
* @overload
* @param {string} uniqueBaseChars
* @returns {(str: string) => number}
*/
/**
* @overload
* @param {string} uniqueBaseChars
* @param {string} str
* @returns {number}
@westc
westc / Advanced JSDoc Annotations.md
Created May 10, 2026 05:23
Great examples of advanced JSDoc annotations.

Dynamic Return Based On Object Key/Value Pairs

/**
 * @typedef {{
 *   text: {text: string};
 *   numbers: {number: number};
 *   date: {date: string, time: string};
 * }} ColumnTypeMap
 */
@westc
westc / dedupe.js
Created May 5, 2026 22:35
dedupe() - Takes an array and removes all of the duplicate values determined by the specified hash function. This can be used to make an array of unique values but the uniqueness should rely more on underlying values or properties.
/**
* Takes an array and removes all of the duplicate values determined by the
* specified hash function.
* @template {any[]} T
* @param {T} array
* @param {(value: T[number], index: number, array: T) => any} hash
* @returns {T}
*/
function dedupe(array, hash) {
const hashedValues = new Set();
@westc
westc / sortJSON.js
Last active May 5, 2026 22:28
sortJSON() - Converts a JS value to canonical a JSON string that will be the same every time regardless of the order in which the keys are defined in the underlying objects.
/**
* @license Copyright 2026 - Chris West - MIT Licensed
* @see https://gist.github.com/westc/f1bf5453b74a055bb4013f4e23da96eb
*
* Converts a JS value to a canonical JSON string that will be the same every
* time regardless of the order in which the keys are defined in the underlying
* objects.
* @param {any} value
* A JavaScript value, usually an object or array, to be converted.
* @param {Parameters<typeof JSON.stringify>[1]} replacer
@westc
westc / random.js
Last active February 23, 2026 15:19
A simple & complete implementation of random which can also generate cryptographically sound numbers.
var random = (() => {
const uints = new Uint32Array(2);
/**
* @typedef $randomOptions
* @property {boolean} [returnInt=false]
* Defaults to `false`. If `true` then the returned number will be an
* integer. Floats will be rounded down if `includedLimit` is less than
* `excludedLimit`, otherwise they will be rounded up.
* @property {boolean} [useCrypto=false]
@westc
westc / favicon-character.js
Last active August 2, 2025 04:09
Sets a single character (eg. a unicode emoji as the favicon for the page.
/**
* Sets the character stored in FAVICON_CHARACTER as the favicon for this page.
*/
addEventListener('DOMContentLoaded', () => {
// The single character that will appear as the favicon for this page.
const FAVICON_CHARACTER = '\u{1F510}';
// Remove all `<link>` elements that are for icons.
document.querySelectorAll("link[rel~='icon']").forEach(el => el.remove());
@westc
westc / marquee-favicon.js
Last active August 1, 2025 21:48
Use JavaScript to set the favicon on a page so that it cycles through the characters (code points) in a string in similar way to how a marquee would.
/**
* Sets the favicon for the page to show one letter per second of the
* MARQUEE_TEXT constant. The background will be a solid color that slowly
* changes, cycling through different hues.
*/
addEventListener('DOMContentLoaded', () => {
const MARQUEE_TEXT = 'A TEST ';
// The canvas that will be used to generate the image that will show as the
// favicon once every second.