init 2

.env

@@ -0,0 +1,2 @@
+NODE_ENV=development
+DEV=true

.env.prod

@@ -0,0 +1,2 @@
+NODE_ENV=production
+DEV=false

.eslintignore

@@ -0,0 +1,4 @@
+/dist/**
+/node_modules/**
+**/*.js
+tests

.eslintrc.js

@@ -0,0 +1,80 @@
+module.exports = {
+  "root": true,
+
+  "plugins": [ "@typescript-eslint" ],
+
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+
+  "parser": "@typescript-eslint/parser",
+
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+  ],
+
+  "rules": {
+    // basics
+    "indent": [ "error", 2, { // indentation should be 2 spaces
+      "flatTernaryExpressions": true, // ternary should be performed in flat
+    } ], // it forces 2 spaces indentation
+    "linebreak-style": [ "error", "unix" ], // fuck you, CRLF
+    "quotes": [ "error", "single" ], // quotes must be single
+    "eqeqeq": [ "error", "always", { "null": "ignore" } ], // fuck you, `==`
+    "max-len": [ "error", { // don't be too long, code
+      "code": 100,
+      "ignoreComments": true, // comments are okay
+      "ignoreStrings": true, // strings are okay
+      "ignoreTemplateLiterals": true, // templates are also okay
+      "ignoreRegExpLiterals": true, // regexs are also okay too
+    } ],
+    "sort-imports": [ "error" ], // imports have to be ordered
+    "eol-last": [ "error", "always" ], // eof newline is cool
+
+    // variables
+    "@typescript-eslint/no-unused-vars": [ "warn" ], // draw yellow line under unused vars
+    "no-var": [ "error" ], // fuck you, var
+    "prefer-const": [ "error" ], // const is better than let
+
+    // omittables
+    "semi": [ "error", "always" ], // semicolon is required
+    "curly": [ "error" ], // it kills `if (foo) bar++;`
+    "arrow-parens": [ "error", "always" ], // it kills `arg => { func(); }`
+
+    // force spacing (I prefer super sparse code!)
+    "array-bracket-spacing": [ "error", "always" ], // it kills `[val1, val2]`
+    "arrow-spacing": [ "error", { "before": true, "after": true } ], // it kills `( arg )=>{ func(); }`
+    "block-spacing": [ "error", "always" ], // it kills `if ( cond ) {func();}`
+    "comma-spacing": [ "error", { "before": false, "after": true } ], // it kills `func( arg1,arg2 )`
+    "computed-property-spacing": [ "error", "always" ], // it kills `arr[i]`
+    "key-spacing": [ "error", { "beforeColon": false, "afterColon": true } ], // it kills `{ key:val }`
+    "keyword-spacing": [ "error", { "before": true, "after": true } ], // it kills `}else{`
+    "object-curly-spacing": [ "error", "always" ], // it kills `{key: val}`
+    "semi-spacing": [ "error", { "before": false, "after": true } ], // it kills `func1();func2();`
+    "space-before-blocks": [ "error", "always" ], // it kills `if (cond){`
+    "space-in-parens": [ "error", "always" ], // it kills `func (arg)`
+    "space-infix-ops": [ "error" ], // it kills val1+val2
+    "space-unary-ops": [ "error", { "words": true, "nonwords": false, "overrides": { "++": true, "--": true } } ], // it kills `val++`
+    "spaced-comment": [ "error", "always" ], // it kills `//this is comment`
+
+    // ban spacing
+    "func-call-spacing": [ "error", "never" ], // no-trailing-spaces. yea.
+    "no-trailing-spaces": [ "error" ], // no-trailing-spaces. yea.
+    "no-whitespace-before-property": [ "error" ], // it kills `obj .key`
+    "space-before-function-paren": [ "error", { "anonymous": "never", "named": "never", "asyncArrow": "always" } ], // it kills `func ()`
+
+    // others
+    "no-eval": [ "error" ], // I don't think we're going to use the eval
+    "no-implied-eval": [ "warn" ], // ok don't
+    "no-console": [ "error", { allow: [ "info", "warn", "error" ] } ], // don't forget to remove `console.log` !
+
+    // typescript-specifics
+    "@typescript-eslint/no-explicit-any": [ "off" ], // Three.js sometimes forces us to deal with anys
+    "@typescript-eslint/no-non-null-assertion": [ "off" ], // Three.js sometimes forces us to deal with bangs
+    "@typescript-eslint/explicit-function-return-type": [ "error", { "allowExpressions": true } ], // return type is required
+    "@typescript-eslint/explicit-member-accessibility": [ "error" ], // `public` / `private` for members and methods are required
+  }
+};

bin/compeko.js

@@ -0,0 +1,62 @@
+#!/usr/bin/env node
+
+// compeko - pack JavaScript into a self-extracting html+deflate
+
+// Copyright (c) 2022 0b5vr
+// SPDX-License-Identifier: MIT
+
+// Usage:
+// - prepare a js code, which will be fed into `eval`
+// - install `node-zopfli` as your (dev-) dependency
+// - run: node compeko.js input.js output.html
+
+// Shoutouts to:
+// - gasman, for pnginator ... https://gist.github.com/gasman/2560551
+// - Charles Boccato, for JsExe ... https://www.pouet.net/prod.php?which=59298
+
+// =================================================================================================
+
+// -- sanity check ---------------------------------------------------------------------------------
+if ( process.argv[ 3 ] == null ) {
+  console.error( '\x1b[31mUsage: \x1b[35mnode compeko.js input.js output.html\x1b[0m' );
+  process.exit( 1 );
+}
+
+// -- modules --------------------------------------------------------------------------------------
+const fs = require( 'fs' );
+const { resolve } = require( 'path' );
+const glob = require( 'glob-promise' );
+const zopfli = require( 'node-zopfli' );
+
+// -- main -----------------------------------------------------------------------------------------
+console.info( 'Compressing the file...' );
+
+( async () => {
+  const inputMatches = await glob( process.argv[ 2 ] );
+  const inputPath = inputMatches[ 0 ];
+
+  const outputPath = resolve( process.cwd(), process.argv[ 3 ] );
+
+  const inputFile = await fs.promises.readFile( inputPath );
+  const inputSize = inputFile.length;
+  console.info( `Input size: \x1b[32m${ inputSize.toLocaleString() } bytes\x1b[0m` );
+
+  const compressed = await zopfli.zlib( inputFile, {
+    numiterations: 100, // increase this number to shave your last bytes
+    blocksplitting: true,
+  } );
+
+  const header = '<script>fetch("#").then(t=>t.blob()).then(t=>new Response(t.slice(156).stream().pipeThrough(new DecompressionStream("deflate"))).text()).then(eval)</script>';
+  const headerBuffer = Buffer.alloc( header.length );
+  headerBuffer.write( header );
+
+  const concated = Buffer.concat( [ headerBuffer, compressed ] );
+
+  const outputSize = concated.length;
+  const percentage = ( 100.0 * ( outputSize / inputSize ) ).toFixed( 3 );
+  console.info( `Output size: \x1b[32m${ outputSize.toLocaleString() } bytes\x1b[0m (${ percentage } %)` );
+
+  await fs.promises.writeFile( outputPath, concated );
+
+  console.info( 'Done \x1b[32m✓\x1b[0m' );
+} )();

index.html

@@ -0,0 +1 @@
+<script type="module" src="./src/main.ts"></script>

package.json

@@ -4,11 +4,30 @@
   "version": "0.0.0",
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build",
+    "build": "yarn build-js && yarn build-comp",
+    "build-js": "vite build --mode prod",
+    "build-comp": "node bin/compeko.js dist/assets/index.*.js dist/compeko.html",
+    "typecheck": "tsc",
     "preview": "vite preview"
   },
   "devDependencies": {
+    "@0b5vr/automaton": "^4.2.1",
+    "@0b5vr/automaton-with-gui": "^4.2.1",
+    "@0b5vr/experimental": "^0.8.0",
+    "@0b5vr/imtweakpane": "^0.1.3",
+    "@0b5vr/tweakpane-plugin-profiler": "^0.3.0",
+    "@tweakpane/core": "^1.0.9",
+    "@types/glob": "^7.2.0",
+    "@types/node-zopfli": "^2.0.2",
+    "@types/webxr": "^0.2.3",
+    "eslint": "^8.14.0",
+    "eslint-plugin-sort-imports-es6-autofix": "^0.6.0",
+    "glob": "^8.0.1",
+    "glob-promise": "^4.2.2",
+    "node-zopfli": "^2.1.4",
+    "tweakpane": "^3.0.8",
     "typescript": "^4.5.4",
-    "vite": "^2.9.5"
+    "vite": "^2.9.5",
+    "webgl-memory": "^1.0.11"
   }
 }

src/automaton.json

@@ -0,0 +1 @@
+{"version":"4.2.1","resolution":600,"curves":[{"nodes":[[0,0,0,0,0.1],[0.163,1,-0.1,0,0.1],[1.6,0,-0.1]]},{"nodes":[[],[1.6,1]]},{"nodes":[[],[6.4,64]]},{"nodes":[[],[0.2,0,0,0,0.1],[0.3,0.6,-0.1,0,0.1],[0.4,0.2,-0.1,0,0.1],[0.5,0.8,-0.1,0,0.1],[0.6,0.4,-0.1,0,0.1],[0.7,1,-0.1],[0.8,1]]},{"nodes":[[],[1.6,1,-1.534]]},{"nodes":[[0,0,0,0,0.199],[0.347,0.1,-0.049,-0.089,0.069,0.126],[0.5,0.85,-0.084,-0.095,0.072,0.082],[0.8,1,-0.1]]},{"nodes":[[],[1.6,1]]},{"nodes":[[0,0,0,0,0.257],[1.6,1,-1.439]]},{"nodes":[[],[0,0.2],[0.4,0.2],[0.4,0.4],[0.8,0.4],[0.8,0.6],[1.2,0.6],[1.2,0.8],[1.6,0.8],[1.6,1],[2,1]]},{"nodes":[[0,0,0,0,0.092],[1.6,1,-0.578]]},{"nodes":[[0,0,0,0,0.011,0.179],[0.073,0.5,-0.038,-0.131,0.051,0.176],[0.255,0.9,-0.097,-0.066,0.111,0.075],[1.6,1,-0.828]]},{"nodes":[[0,0,0,0,0.181,0.275],[1.6,1,-1.077]]},{"nodes":[[0,0,0,0,0.257],[1.6,1,-0.512]]},{"nodes":[[0,0,0,0,0.204],[1.6,1]]},{"nodes":[[0,1,0,0,0,-0.247],[0.4,0.1,-0.1]]},{"nodes":[[],[1.6,1,-0.28]]},{"nodes":[[0,0,0,0,0.278],[1.6,1,-1.506]]}],"channels":[["cubemap/accumMix",{"items":[{"length":0.4,"curve":14}]}],["stuff",{"items":[{},{"time":27.2,"value":10},{"time":30.4,"value":25},{"time":33.6,"value":9},{"time":36.8,"value":8},{"time":40,"value":15},{"time":43.2,"value":2},{"time":46.4,"value":1},{"time":49.6,"value":13},{"time":52.8,"value":4},{"time":59.2,"value":17},{"time":65.6,"value":24},{"time":72,"value":29},{"time":78.4,"value":23},{"time":91.2,"value":12},{"time":102.4,"value":7},{"time":104,"value":28},{"time":116.8,"value":6},{"time":120,"value":3},{"time":123.2,"value":21},{"time":126.4,"value":22},{"time":128,"value":5},{"time":129.6,"value":27},{"time":132.8,"value":19},{"time":136,"value":20},{"time":139.2,"value":31},{"time":142.4,"value":16},{"time":145.6,"value":18},{"time":148.8,"value":14},{"time":152,"value":11},{"time":155.2,"value":30},{"time":161.6,"value":26}]}],["FUI/yugopp",{"items":[{"length":0.4},{"time":27.2,"length":0.4},{"time":30.4,"length":0.4},{"time":33.6,"length":0.4},{"time":36.8,"length":0.4},{"time":40,"length":0.4},{"time":43.2,"length":0.4},{"time":46.4,"length":0.4},{"time":49.6,"length":0.4},{"time":52.8,"length":0.4},{"time":59.2,"length":0.4},{"time":65.6,"length":0.4},{"time":72,"length":0.4},{"time":78.4,"length":0.4},{"time":91.2,"length":0.4},{"time":102.4,"length":0.4},{"time":104,"length":0.4},{"time":116.8,"length":0.4},{"time":120,"length":0.4},{"time":123.2,"length":0.4},{"time":126.4,"length":0.4},{"time":128,"length":0.4},{"time":129.6,"length":0.4},{"time":132.8,"length":0.4},{"time":136,"length":0.4},{"time":139.2,"length":0.4},{"time":142.4,"length":0.4},{"time":145.6,"length":0.4},{"time":148.8,"length":0.4},{"time":152,"length":0.4},{"time":155.2,"length":0.4},{"time":161.6,"length":0.4}]}],["lightTop/intensity",{"items":[{},{"time":1.6,"length":12.8,"curve":4,"speed":0.125}]}],["lightRight/intensity",{"items":[{},{"time":20.8,"length":6.4,"curve":4,"speed":0.25}]}],["lightLeft/intensity",{"items":[{},{"time":14.4,"length":12.8,"curve":4,"speed":0.25}]}],["fui/opacity",{"items":[{},{"time":24.148,"length":0.2,"curve":3,"speed":4}]}],["camera/fov",{"items":[{"value":40}]}],["camera/pos/r",{"items":[{"value":10}]}],["camera/pos/p",{"items":[{}]}],["camera/pos/t",{"items":[{}]}],["camera/pos/x",{"items":[{}]}],["camera/pos/y",{"items":[{"value":1.6}]}],["camera/pos/z",{"items":[{}]}],["camera/tar/x",{"items":[{}]}],["camera/tar/y",{"items":[{"value":3}]}],["camera/tar/z",{"items":[{}]}],["camera/shake",{"items":[{}]}],["camera/roll",{"items":[{}]}]],"labels":{},"guiSettings":{"snapTimeActive":false,"snapTimeInterval":0.1,"snapValueActive":false,"snapValueInterval":0.1,"snapBeatActive":true,"bpm":130,"beatOffset":0,"useBeatInGUI":true,"minimizedPrecisionTime":3,"minimizedPrecisionValue":3}}

src/automaton.json.d.ts

@@ -0,0 +1,6 @@
+import type { SerializedAutomatonWithGUI } from '@0b5vr/automaton-with-gui';
+
+declare module './automaton.json' {
+  const data: SerializedAutomatonWithGUI;
+  export default data;
+}

src/config.ts

@@ -0,0 +1,11 @@
+export const
+  MUSIC_BPM = 130.0,
+  MUSIC_LENGTH = 169,
+  MUSIC_AUTOMATON_TEXTURE_HEIGHT = 16,
+  AO_RESOLUTION_RATIO = 0.5,
+  IBLLUT_ITER = 400,
+  IBLLUT_SIZE = 256,
+  NEAR = 0.1,
+  FAR = 30.0,
+  RANDOM_RESOLUTION = [ 64, 64 ],
+  STATIC_RANDOM_RESOLUTION = [ 2048, 2048 ];

src/geometries/genCube.ts

@@ -0,0 +1,110 @@
+import { Geometry } from '../heck/Geometry';
+import { HALF_PI, PI } from '../utils/constants';
+import { glCreateVertexbuffer } from '../gl/glCreateVertexbuffer';
+import { glVertexArrayBindVertexbuffer } from '../gl/glVertexArrayBindVertexbuffer';
+import { glVertexArrayBindIndexbuffer } from '../gl/glVertexArrayBindIndexbuffer';
+import { glCreateIndexbuffer } from '../gl/glCreateIndexbuffer';
+import { GL_TRIANGLES, GL_UNSIGNED_SHORT } from '../gl/constants';
+
+interface ResultGenCube {
+  position: WebGLBuffer;
+  normal: WebGLBuffer;
+  uv: WebGLBuffer;
+  index: WebGLBuffer;
+  geometry: Geometry;
+  count: number;
+  mode: GLenum;
+  indexType: GLenum;
+}
+
+export function genCube( options?: {
+  dimension?: [ number, number, number ]
+} ): ResultGenCube {
+  const dimension = options?.dimension ?? [ 1, 1, 1 ];
+
+  const arrayPosition: number[] = [];
+  const arrayNormal: number[] = [];
+  const arrayUv: number[] = [];
+  const arrayIndex: number[] = [];
+
+  const chunkPosition = [
+    [ -1, -1,  1 ],
+    [  1, -1,  1 ],
+    [ -1,  1,  1 ],
+    [  1,  1,  1 ],
+  ];
+  const chunkNormal = [
+    [ 0, 0, 1 ],
+    [ 0, 0, 1 ],
+    [ 0, 0, 1 ],
+    [ 0, 0, 1 ],
+  ];
+  const chunkUv = [
+    [ 0, 0 ],
+    [ 1, 0 ],
+    [ 0, 1 ],
+    [ 1, 1 ],
+  ];
+
+  for ( let i = 0; i < 6; i ++ ) {
+    const rotate = ( v: number[] ): number[] => {
+      const vt: number[] = [];
+
+      if ( i < 4 ) {
+        const t = i * HALF_PI;
+        vt[ 0 ] = Math.cos( t ) * v[ 0 ] - Math.sin( t ) * v[ 2 ];
+        vt[ 1 ] = v[ 1 ];
+        vt[ 2 ] = Math.sin( t ) * v[ 0 ] + Math.cos( t ) * v[ 2 ];
+      } else {
+        const t = ( i - 0.5 ) * PI;
+        vt[ 0 ] = v[ 0 ];
+        vt[ 1 ] = Math.cos( t ) * v[ 1 ] - Math.sin( t ) * v[ 2 ];
+        vt[ 2 ] = Math.sin( t ) * v[ 1 ] + Math.cos( t ) * v[ 2 ];
+      }
+
+      return vt;
+    };
+
+    const scale = ( v: number[] ): number[] => {
+      return [
+        v[ 0 ] * dimension[ 0 ],
+        v[ 1 ] * dimension[ 1 ],
+        v[ 2 ] * dimension[ 2 ],
+      ];
+    };
+
+    arrayPosition.push( ...chunkPosition.map( rotate ).map( scale ).flat() );
+    arrayNormal.push( ...chunkNormal.map( rotate ).flat() );
+    arrayUv.push( ...chunkUv.flat() );
+    arrayIndex.push( ...[ 0, 1, 3, 0, 3, 2 ].map( ( v ) => v + 4 * i ) );
+  }
+
+  // -- buffers ------------------------------------------------------------------------------------
+  const position = glCreateVertexbuffer( new Float32Array( arrayPosition ) );
+  const normal = glCreateVertexbuffer( new Float32Array( arrayNormal ) );
+  const uv = glCreateVertexbuffer( new Float32Array( arrayUv ) );
+  const index = glCreateIndexbuffer( new Uint16Array( arrayIndex ) );
+
+  // -- geometry -----------------------------------------------------------------------------------
+  const geometry = new Geometry();
+
+  glVertexArrayBindVertexbuffer( geometry.vao, position, 0, 3 );
+  glVertexArrayBindVertexbuffer( geometry.vao, normal, 1, 3 );
+  glVertexArrayBindVertexbuffer( geometry.vao, uv, 2, 2 );
+  glVertexArrayBindIndexbuffer( geometry.vao, index );
+
+  const count = geometry.count = arrayIndex.length;
+  const mode = geometry.mode = GL_TRIANGLES;
+  const indexType = geometry.indexType = GL_UNSIGNED_SHORT;
+
+  return {
+    position,
+    normal,
+    uv,
+    index,
+    geometry,
+    count,
+    mode,
+    indexType,
+  };
+}