Skip to content

Instantly share code, notes, and snippets.

View PierBover's full-sized avatar

Pier Bover PierBover

View GitHub Profile
@PierBover
PierBover / script.sh
Created January 30, 2024 00:00
Create self signed certificate in macOS
openssl req -x509 -newkey rsa:2048 -nodes -sha256 -subj '/CN=localhost' -keyout localhost-key.pem -out localhost-cert.pem
mkcert -install
mkcert -key-file localhost-key.pem -cert-file localhost-cert.pem mydevdomain.com localhost 127.0.0.1
@PierBover
PierBover / index.md
Last active August 22, 2024 10:17
Reading waveform data in ffmpeg

Reading waveform data in ffmpeg

When working on an audio player, I wanted to extract the audio waveform data to paint the audio waveform dynamically in the browser on a <canvas> element.

Initially I used the bbc/audiowaveform package but this proved problematic for a number of reasons. First I wasn't able to install that package (or build the binary) in macOS for local dev. The other big issue is that I was only able to figure out how to install it on Ubuntu, so I couldn't use it in Alpine (for Docker images) or other environments like cloud functions.

Initial approach

I found out from these docs it's possible to paint a waveform with ffmpeg by extracting raw audio data:

@PierBover
PierBover / action.js
Created June 21, 2022 16:19
Bfcache action for Svelte
const elements = [];
const events = [];
window.addEventListener('pageshow', (event) => {
const navigationType = window.performance.getEntriesByType('navigation')[0].type;
if (navigationType !== 'back_forward') return;
elements.forEach((element, index) => {
element.dispatchEvent(new Event(events[index], {
bubbles: true,
@PierBover
PierBover / create-dev-certs.sh
Created January 27, 2022 17:57
Create certs for HTTP in localhost
openssl req -x509 -newkey rsa:2048 -nodes -sha256 -subj '/CN=localhost' -keyout localhost-key.pem -out localhost-cert.pem
mkcert -install
mkcert -key-file localhost-key.pem -cert-file localhost-cert.pem localhost 127.0.0.1
@PierBover
PierBover / using-svelte-vercel.md
Last active February 7, 2023 09:05
Using Svelte in a Vercel serverless function

Using Svelte in a Vercel serverless function

The easiest way of using Svelte for SSR in Node is by using svelte/register. This allows to require .svelte files without any bundling and render HTML, CSS, etc.

This is the example from the docs:

require('svelte/register');

const App = require('./App.svelte').default;
@PierBover
PierBover / worker.js
Created September 14, 2021 23:37
Cloudflare Worker audio streaming from Backblaze B2
const cache = caches.default;
addEventListener("fetch", (event) => {
try {
const request = event.request
return event.respondWith(handleRequest(event))
} catch (e) {
return event.respondWith(new Response("Error thrown " + e.message))
}
});
@PierBover
PierBover / Example.svelte
Last active June 30, 2024 21:14
Keep alive Svelte action
<script>
import keepAlive from "./action.js";
import Component from './Component.svelte';
</script>
<div use:keepAlive={{id: 'some-manual-id', componentClass: Component}}/>
@PierBover
PierBover / function.js
Last active August 6, 2021 19:11
FQL function to convert the result of an index with values, to an object with the field names
CreateFunction({
name: 'GetIndexValuesObject',
body: Query(
Lambda(
['indexRef', 'indexValuesArray'],
Let(
{
keys: Let(
{
indexDoc: Get(Var('indexRef')),
@PierBover
PierBover / doc.md
Last active June 17, 2021 20:41
Unmetered traffic VPS providers