sikistys 1k js framework

This is 1k js framework supporting one fragment shader and byte beat/float beat. Included is tähtituho's lovebyte 2023 entry sikistys

Prerequisites

1. install node
2. run npm install -g http-server
3. npm install node-zopfli
4. npm install terser

Shader development

Custom build of Leviathan 2.0 is included for your convenience. Leviathan is great test shaders, because it is really simple and aims to be productive. Custom build differs from orignal in following ways:

1. You don't need to divide t variable at all. It is compatible with time variable from js.
2. It does not support post processing

Use you favorite editor to write shader. Visual Studio Code with GLSL lint is recommended.

1. Edit shader.frag
2. Run tools/leviatha-custom-build.exe
3. Leviathan will reload shader when you save shader in your editor

GLSL Sandbox and Shadertoy are also great for wrinting shaders.

Testing with browser

When you feel like shader is ready to be executed in browser, do following steps:

1. Run .\startBrowser.ps1
2. This should open new browser tab to address http://localhost:8080/index.html
3. Click somewhere in upper left segment of browser to start

Writing byte beat/float beat

Find onclick-function in main.js and there you will se comment saying "write tune here". Paste your byte beat or float beat into that. NOTICE your tune might need some tweaking if you wrote in it https://greggman.com/downloads/examples/html5bytebeat/html5bytebeat.html. Tweaking should be done on a.createBuffer(1, q = 8000 * 45, 8000);

Making release

When you feel that shader and byte beat are good as they get, you should do release.

1. Run .\makeRelease.ps1 (you can number of compeko passes as argument like .\makeRelease.ps1 100 (100 is default) try 300, might save you 1 byte).
2. Run http-server and try results at http://localhost:8080/release/index.html
3. Submit entry to you favorite party with instruction how to run and start demo.

Shoutouts

Leviathan 2.0 For awesome shader runtime

Shader_Minifier For minifying shader

Terser For minifying js

compeko For PNG compression