Skip to content

Instantly share code, notes, and snippets.

The light inside has broken, but I still work

Arno Richter oelna

The light inside has broken, but I still work
View GitHub Profile
oelna / shortcuts.js
Last active Apr 10, 2022
Quick $ and $$ wrappers for querySelector
View shortcuts.js
const $ = document.querySelector.bind(document);
const $$ = document.querySelectorAll.bind(document);
oelna / flexbox.css
Last active Apr 1, 2022
Rasterexperimente mit Flexbox und Grid, HTML-Kurs April 2022
View flexbox.css
html {
font: 125%/1.2 system-ui;
background-color: #999;
img {
max-width: 100%;
height: auto;
display: block;
oelna / cats.txt
Created Jan 21, 2022
View cats.txt
Ägyptische Mau
American Bobtail Shorthair
American Curl Shorthair
American Shorthair
American Wirehair
Arabische Mau
Australian Mist
oelna /
Last active Jun 12, 2020
A few custom Nightbot commands to use on Twitch

Nightbot custom commands

This is an incomplete list of Nightbot commands I use on my Twitch channel to facilitate the teaching of webdesign. Many commands only generate links to specific sites, but some also offer advanced functionality, such as RNG. You should probably adjust the code, if you'd like to use them.

Random Number

Command: !random
Description: Generate a random number between 1 and 100, or a specific interval
Usage: !random, !random 1 10 or !random 5 20

$(eval if ($(1) && $(2)) {
oelna / challenge.js
Created Jun 3, 2020
Calculate luck in Javascript, based on a RPG stat
View challenge.js
Calculate a RNG value with a percent chance to succeed,
based on a range and an stat input value somewhere between.
This is how the challenges in Sunless Sea work, for example.
- The lower bound defines a starting value required to get over 0%
- The upper bound defines the value at which you always succeed
- The stat value should between the two in order to produce a meaningful chance.
oelna /
Last active May 29, 2021
Merkblatt zur Kompression von Bildern, Videos und Audio-Daten

Merkblatt zur Dateikompression

Die Bitrate bestimmt die Qualität des Inhalts. Wird sie größer, steigen Qualität und Speicherbedarf an. Bilddimensionen, bzw. Länge des Musikstücks beeinflussen ebenfalls die Dateigröße: Höhere Auflösung bewirkt in der Regel größeren Platzbedarf.

Übersicht über Formate

Kompression Bild Video Audio
lossy JPG, PNG-8, WEBP, HEIC H.264, H.265, DivX, Xvid, 3GP, MJPEG MP3, AAC, OGG
oelna / highscore.html
Last active May 30, 2020
A very simple Javascript module to keep track of highscores in browser games. Uses localStorage to preserve entries.
View highscore.html
<!DOCTYPE html>
<title>Highscore Demo</title>
<script type="module">
import highscore from './highscore.js'
let points = new highscore('points', 14, 'desc'); /* keep up to 14 scores, under the storage name 'points', sorted in descending order */
oelna / demo.js
Created Apr 24, 2020
Poisson distribution HTML canvas demo
View demo.js
window.addEventListener('DOMContentLoaded', function (event) {
const CANVAS_WIDTH = 1200;
const CANVAS_HEIGHT = 700;
let canvasElement = document.createElement('canvas');
canvasElement.setAttribute('width', CANVAS_WIDTH+'px');
canvasElement.setAttribute('height', CANVAS_HEIGHT+'px');
oelna / character.js
Last active Apr 14, 2020
A simple hacked-together demo of Javascript modules and classes
View character.js
const CHARACTER = class {
constructor(name, attributes = {}) { = name;
this.attributes = {};
// merge custom with default values
Object.assign(this.attributes, {
'strength': 3,
'constitution': 3,
'dexterity': 3,
oelna / map.html
Last active Apr 2, 2020
A simple Mapbox GL JS map with a single marker, suitable for small business websites.
View map.html
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8" />
<link rel="stylesheet" href="" />
#map-container {
width: 100%;