markknol

This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification

Language:

Version: WebGL 2.0
Arithmetic: ( ) + - ! * / %
Logical/Relatonal: ~ < > <= >= == != && ||
Bit Operators: & ^ | << >>
Comments: // /* */
Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 mat2 mat3 mat4 mat?x? sampler2D, sampler3D samplerCube
Format: float a = 1.0; int b = 1; uint i = 1U; int i = 0x1;

markknol

<nav><button onclick="reloadFrames()">GENERATE()</button></nav>
<main></main>
<script>
const urlParams = new URLSearchParams(window.location.search);
const total = 15+5; // total frames
const interval = urlParams.get("fast") == "true" ? 60 : 200; // ms
const src = "./index.html";

let alphabet = "123456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ"
function getHash() {

markknol

Links to Haxe Macro related tutorials and articles

• The official Haxe sources:

  • https://haxe.org/manual/macro.html
  • http://api.haxe.org/haxe/macro/
  • http://code.haxe.org/category/macros/

  Getting better all the time, this is the definitive guide though quite meaty and requires a good couple of passes before things make sense. Learn from simple examples and practicing, use the manual as a reference.

• Macronauts: Macro workshop

markknol

<canvas width="4096" height="3072" id=canvas></canvas>
<script>
let ctx = canvas.getContext`2d`;
window.onload = async () => {
	let grid = 12;
	canvas.width = grid*260; // grid * tile width
	canvas.height = grid*220; // grid * tile height
	for(let i=0;i<grid*grid;i++) {
		let image = await loadImage(`render_${(""+i).padStart(5,"0")}.png`);
		let idx = i%grid, idy = i/grid|0;

markknol

var palette = [["#69D2E7","#A7DBD8","#E0E4CC","#F38630","#FA6900"],
		["#FE4365","#FC9D9A","#F9CDAD","#C8C8A9","#83AF9B"],
		["#ECD078","#D95B43","#C02942","#542437","#53777A"],
		["#556270","#4ECDC4","#C7F464","#FF6B6B","#C44D58"],
		["#774F38","#E08E79","#F1D4AF","#ECE5CE","#C5E0DC"],
		["#E8DDCB","#CDB380","#036564","#033649","#031634"],
		["#490A3D","#BD1550","#E97F02","#F8CA00","#8A9B0F"],
		["#594F4F","#547980","#45ADA8","#9DE0AD","#E5FCC2"],
		["#00A0B0","#6A4A3C","#CC333F","#EB6841","#EDC951"],
		["#E94E77","#D68189","#C6A49A","#C6E5D9","#F4EAD5"],

markknol

// promisified version of parsing json in a worker
// usage:  `let data = await fetch(url).then(v => v.text()).then(v => parseJson(v)).then(data => console.log(data));`
function parseJson(txt:string) {
  return new Promise((resolve, reject) => { 
    var blob = new Blob([
      'this.onmessage = function(message) {\n' +
        'postMessage(JSON.parse(message.data));\n' +
      '};'
      ], { type: "text/javascript" });
    var w = new Worker(URL.createObjectURL(blob));

markknol

How to draw a circle or oval with Haxe/JavaScript

public static function oval(g:Graphics, w:Float, h:Float, cx:Float = 0, cy:Float = 0):Graphics {
	var lx = cx - w * .5;
	var rx = cx + w * .5;
	var ty = cy - h * .5;
	var by = cy + h * .5;

	var magic = 0.551915024494; 

markknol

class Test {
	static function main() {
		var mySet = new EnumSet((key:MyEnum) -> switch key {
			case A: [1,2];
			case B: [1,2,3];
			case C: [1,2,3,4];
			case D: [1,2,3,15];
		});

		mySet[A].push(911);

markknol

	<button label="Git Sync" click="RunProcess" tag="$(Quote)C:\Program Files\TortoiseGit\bin\TortoiseGitProc.exe$(Quote);-command sync -path $(Quote)$(ProjectDir)$(Quote)" image="59" />
	<button label="Git Pull" click="RunProcess" tag="$(Quote)C:\Program Files\TortoiseGit\bin\TortoiseGitProc.exe$(Quote);-command pull -path $(Quote)$(ProjectDir)$(Quote)" image="71" />
	<button label="Git Push" click="RunProcess" tag="$(Quote)C:\Program Files\TortoiseGit\bin\TortoiseGitProc.exe$(Quote);-command push -path $(Quote)$(ProjectDir)$(Quote)" image="72" />
	<button label="Git Commit" click="RunProcess" tag="$(Quote)C:\Program Files\TortoiseGit\bin\TortoiseGitProc.exe$(Quote);-command commit -path $(Quote)$(ProjectDir)$(Quote)" image="258" />
	<button label="Git Commit (current file only)" click="RunProcess" tag="$(Quote)C:\Program Files\TortoiseGit\bin\TortoiseGitProc.exe$(Quote);-command commit -logmsg $(Quote)$(TypName)$(Quote) -path $(Quote)$(CurFile)$(Quote)" image="80" />
	<button label="Git Switch" click="RunProc

markknol

class ArrayUtils {
  /**
	   Support `for(index => value in array)` syntax.
	**/
	public static inline function keyValueIterator<A>(arr:Array<A>) {
		return new ArrayKeyValueIterator(arr);
	}
}

private class ArrayKeyValueIterator<T>{