Unindented — Home of Daniel Perez Alvarez

QR Code Generator

daniel@unindented.org (Daniel Perez Alvarez) — Wed, 17 May 2023 00:00:00 +0000

Whip up a QR code that can be scanned by anyone with a smartphone or a QR code reader. All thanks to the awesome headless-qr module by Rich Harris.

Clipboard Inspector

daniel@unindented.org (Daniel Perez Alvarez) — Thu, 05 Jan 2023 00:00:00 +0000

Small widget to explore the data available when you paste or drop something on a web page.

Change Shell to Latest Bash on macOS

daniel@unindented.org (Daniel Perez Alvarez) — Wed, 04 Jan 2023 00:00:00 +0000

Starting with macOS Catalina, Apple switched the default shell from Bash to Zsh. Also, the built-in version of Bash is horribly outdated. No bueno.

Create a Bootable USB for macOS Ventura

daniel@unindented.org (Daniel Perez Alvarez) — Sun, 01 Jan 2023 00:00:00 +0000

I find it useful to have a bootable USB lying around, in case I need to do a clean install, or recover from catastrophic failures.

Terminal Color Preview

daniel@unindented.org (Daniel Perez Alvarez) — Thu, 19 May 2022 00:00:00 +0000

I’ve been playing with terminal color schemes lately, and wanted a way of quickly previewing my changes, so I built this.

Baby Smash!

daniel@unindented.org (Daniel Perez Alvarez) — Thu, 28 Apr 2022 00:00:00 +0000

My kids love Baby Smash!, a Windows app that draws letters and shapes, and plays sounds, as they smash the keyboard and mouse.

This is a crude attempt to replicate it using web technologies. We can’t capture certain key combinations and gestures, so it’s not very baby-safe.

Mandelbrot Set with WebGL

daniel@unindented.org (Daniel Perez Alvarez) — Tue, 19 Apr 2022 00:00:00 +0000

Plotting the Mandelbrot set with a GLSL fragment shader.

I’ve translated the code I wrote for plotting the Mandelbrot set with p5.js to a GLSL 1.0 fragment shader. The main difference is that I’m using vec2 to represent complex numbers, which makes things a bit more concise.

Mandelbrot Set with AssemblyScript / WebAssembly

daniel@unindented.org (Daniel Perez Alvarez) — Wed, 13 Apr 2022 00:00:00 +0000

Plotting the Mandelbrot set with AssemblyScript, a TypeScript-like language that compiles to WebAssembly bytecode.

I’ve translated the code I wrote for plotting the Mandelbrot set with p5.js to AssemblyScript, to get a feel for it.

Mandelbrot Set with p5.js

daniel@unindented.org (Daniel Perez Alvarez) — Thu, 07 Apr 2022 00:00:00 +0000

The Mandelbrot set, named after Benoit Mandelbrot, is the set of complex numbers $c$ for which the function $f_c(z)=z^2+c$ does not diverge to infinity when iterated from $z=0$.

I’m using the pseudocode from the Wikipedia article Plotting algorithms for the Mandelbrot set as base, and applying different coloring algorithms.

Inspect WebViews in Any macOS App

daniel@unindented.org (Daniel Perez Alvarez) — Mon, 04 Apr 2022 00:00:00 +0000

Did you know you can inspect any WebView on any macOS app, just by right-clicking it?

WebRTC without Signaling Server

daniel@unindented.org (Daniel Perez Alvarez) — Thu, 31 Mar 2022 00:00:00 +0000

I was reading MDN’s article on signaling and video calling, and encountered this part:

WebRTC is a fully peer-to-peer technology for the real-time exchange of audio, video, and data, with one central caveat. A form of discovery and media format negotiation must take place, as discussed elsewhere, in order for two devices on different networks to locate one another. This process is called signaling and involves both devices connecting to a third, mutually agreed-upon server. Through this third server, the two devices can locate one another, and exchange negotiation messages.

It then goes on to talk about SDP, the protocol used to exchange signaling information, and guides you through implementing a video-calling app.

I started wondering, do you really need that third server? Is there anything preventing peers from exchanging the SDP offer and answer through some other means, like IRC or similar? It turns out there’s not!

Compress Strings with lz‑string

daniel@unindented.org (Daniel Perez Alvarez) — Wed, 30 Mar 2022 00:00:00 +0000

I wanted to compress some large strings in JavaScript, for an experiment with WebRTC, and found the excellent lz-string by pieroxy.

It’s fast, and it weighs just a little over 4KB if you run it through something like Terser. I’ve tweaked it ever so slightly for my needs, but it should still be 100% compatible with the original. You can play with it below.

Prime Spiral with p5.js

daniel@unindented.org (Daniel Perez Alvarez) — Sun, 06 Mar 2022 00:00:00 +0000

The prime spiral, also known as Ulam spiral, is a neat visualization of prime numbers devised by mathematician Stanisław Ulam.

JWT Decoder in the Browser

daniel@unindented.org (Daniel Perez Alvarez) — Thu, 22 Apr 2021 00:00:00 +0000

Decode JSON web tokens right in the browser. Nothing gets recorded, everything is done client-side.

Colored Noise — White, Pink, and Red

daniel@unindented.org (Daniel Perez Alvarez) — Mon, 23 Nov 2020 00:00:00 +0000

Using the Web Audio API to generate noise of different colors.

SVG Line Animation

daniel@unindented.org (Daniel Perez Alvarez) — Mon, 01 Dec 2014 00:00:00 +0000

You know that cool animation that Polygon used in their Xbox One and PS4 reviews, where SVG images appeared to draw progressively? It’s really easy to do.

Pixel Art Scaling Comparison — Part 2

daniel@unindented.org (Daniel Perez Alvarez) — Fri, 18 Apr 2014 00:00:00 +0000

I’ve been playing with a few other scaling algorithms in the 2dimagefilter project. They produce even more impressive results than the previous batch.

Pixel Art Scaling Comparison — Part 1

daniel@unindented.org (Daniel Perez Alvarez) — Fri, 11 Apr 2014 00:00:00 +0000

I’ve been playing with a few scaling algorithms in the 2dimagefilter project. They produce impressive results when fed pixel art, and the fact that emulators can run them in real-time is just mind-boggling.

Compare Two Images Side-by-Side

daniel@unindented.org (Daniel Perez Alvarez) — Wed, 09 Apr 2014 00:00:00 +0000

Small widget to compare two images side by side, for my articles on pixel art scaling (parts one and two).

Zoom into an Image

daniel@unindented.org (Daniel Perez Alvarez) — Mon, 07 Apr 2014 00:00:00 +0000

Small widget that simulates a magnifying glass, for my articles on pixel art scaling (parts one and two).

Lorenz Attractor with JS

daniel@unindented.org (Daniel Perez Alvarez) — Sun, 16 Feb 2014 00:00:00 +0000

Drawing a Lorenz attractor by absolutely positioning span elements along the x and y axes, and faking the z axis by adjusting their size.

Lorenz Attractor with CSS

daniel@unindented.org (Daniel Perez Alvarez) — Sat, 15 Feb 2014 00:00:00 +0000

Drawing a Lorenz attractor with CSS shadows. No JavaScript involved.

3D Shapes with CSS

daniel@unindented.org (Daniel Perez Alvarez) — Sat, 08 Feb 2014 00:00:00 +0000

Rotating 3D shapes with CSS transforms and animations. No JavaScript involved.

Trigonometry in Sass

daniel@unindented.org (Daniel Perez Alvarez) — Fri, 07 Feb 2014 00:00:00 +0000

Have you ever found yourself needing trigonometric functions like sine, cosine, and tangent when writing your Sass stylesheets? Ok, probably not, but the day may come, and you’ll be glad you read this.

GitHub Ribbon Using CSS Transforms

daniel@unindented.org (Daniel Perez Alvarez) — Sun, 12 Jan 2014 00:00:00 +0000

You know those ‘Fork me on GitHub’ ribbons that you often see on websites for open source projects? Tom Preston-Werner released them in December 2008! Gosh, I feel old.