Simon Willison: TILs on javascript

javascript Creating a tiled zoomable image with OpenSeadragon and vips - 2022-08-12

The San Francisco Microscopical Society has some extremely high resolution scanned images - one of them is a 1.67GB PNG file with a 25,088 × 17,283 pixel resolution. …

javascript JavaScript date objects - 2022-01-16

A few notes on JavaScript Date object, based on trying to do some basic things with them in Observable notebooks. …

javascript Using Tesseract.js to OCR every image on a page - 2021-11-09

Pasting this code into a DevTools console should load Tesseract.js from a CDN, loop through every image loaded by that page (every PNG, GIF, JPG or JPEG), run OCR on them and output the result to the DevTools console. …

javascript Loading lit from Skypack - 2021-09-21

Lit 2 stable was released today, offering a tiny, feature-full framework for constructing web components using modern JavaScript. …

javascript Preventing double form submissions with JavaScript - 2021-07-08

I needed this for VIAL issue 722. I decided to disable form submissions for two seconds after they are submitted, to protect against accidental double submissions without risk of unexpected issues that could cause the form to be permanently disabled even though it should still be able to submit it. …

javascript Scroll page to form if there are errors - 2021-05-08

For a Django application I'm working on (this issue) I have a form that can be quite a long way down the page. …

javascript Using Jest without a package.json - 2020-12-30

I wanted to try out Jest for writing JavaScript unit tests, in a project that wasn't set up with package.json and other NPM related things. …

javascript Dropdown menu with details summary - 2020-10-31

I added dropdown menus to Datasette 0.51 - see #1064. …

javascript Writing JavaScript that responds to media queries - 2020-10-21

I wanted to change the layout of my blog on mobile screens such that the content from the "Elsewhere" right hand column combined with the main column in the correct order (issue #165). I couldn't find a way to do this in pure CSS without duplicating a bunch of content, so I decided to do it with JavaScript. …

javascript Manipulating query strings with URLSearchParams - 2020-10-04

The URLSearchParams class, in every modern browser since IE 11, provides a sensible API for manipulating query string parameters in JavaScript. I first used it to build Datasette's column action menu, see table.js and issue 981. …

javascript Minifying JavaScript with npx uglify-js - 2020-08-30

While upgrading CodeMirror in Datasette I figured out how to minify JavaScript using uglify-js on the command line without first installing any teels, using npx (which downloads and executes a CLI tool while skipping the install step): …

javascript Dynamically loading multiple assets with a callback - 2020-08-21

For datasette-leaflet-geojson I wanted to dynamically load some external CSS and JavaScript and then execute some code once they had loaded (issue 14). …

javascript Working around the size limit for nodeValue in the DOM - 2020-08-21

TIL that nodeValue in the DOM has a size limit! …

javascript Implementing a "copy to clipboard" button - 2020-07-23

I had to figure this out while building datasette-copyable - demo here. …