Skip to content

Latest commit

 

History

History
145 lines (113 loc) · 5.02 KB

README.md

File metadata and controls

145 lines (113 loc) · 5.02 KB

hydro

This is an experiment that tries to implement a minimal hydra in a single self-contained HTML file. The GLSL compiler is implemented with a stripped down version of @kabelsalat/core.

live at felixroos.github.io/hydro

Why?

I did this mainly to learn more about how WebGL works, as a continuation of schattenspiel. The hydra DSL seemed to be a good fit to implement with my graph compiler @kabelsalat/core. Also, it seemed like a nice challenge to try to do this in a single HTML file, which is very sharable and readable / editable.

Examples

  • To load a random example, open the browser console and enter shuffle()
  • To load a specific example, open the browser console and enter example(index)

You can also load some of my own examples:

Completeness

All documented hydra functions / features work, except the external sources and some synth settings. The initial goal was to see if @kabelsalat/core could be used to compile an existing DSL that also targets another language (GLSL) + another domain (visual). It seems to work out nicely for the moment. I might implement the remaining features in the future, just for completeness sake.

Be aware that this project is very new and likely to contain bugs.

Here's a list of implementated features:

Language Features

  • Method-Chaining DSL
  • Array Arguments
  • Function Arguments
  • Multiple Outputs with Feedback

Source

  • o0...o3
  • s0...s3
  • noise
  • voronoi
  • osc
  • shape
  • gradient
  • src
  • solid
  • prev

Geometry

  • rotate
  • scale
  • pixelate
  • repeat
  • repeatX
  • repeatY
  • kaleid
  • scroll
  • scrollX
  • scrollY

Color

  • posterize
  • shift
  • invert
  • contrast
  • brightness
  • luma
  • thresh
  • color
  • saturate
  • hue
  • colorama
  • sum
  • r
  • g
  • b
  • a

Blend

  • add
  • sub
  • layer
  • blend
  • mult
  • diff
  • mask

Modulate

  • modulateRepeat
  • modulateRepeatX
  • modulateRepeatY
  • modulateKaleid
  • modulateScrollX
  • modulateScrollY
  • modulate
  • modulateScale
  • modulatePixelate
  • modulateRotate
  • modulateHue

Array

  • fast
  • smooth
  • ease
  • offset
  • fit

Synth Settings

  • render
  • update
  • setResolution
  • hush
  • setFunction
  • speed
  • bpm
  • width
  • height
  • time
  • mouse

External Sources

  • initCam
  • initImage
  • initVideo
  • init
  • initStream
  • initScreen

Git History

More git history can be found in the schattenspiel repo.