andras/fleeting-garden
andras/fleeting-garden
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Copy utils

Browse source
This commit is contained in:
Andras Schmelczer 2023-04-29 21:18:27 +01:00
commit a3f76f5c77
No known key found for this signature in database
GPG key ID: FC8F2C3D3D1A718C
14 changed files with 141 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/index.html
View file

@ -32,6 +32,7 @@
<body> <body>
<noscript>JavaScript is required for this website.</noscript> <noscript>JavaScript is required for this website.</noscript>
<canvas></canvas> <canvas></canvas>
<section class="errors-container"><pre class="errors"></pre></section>
<script inline inline-asset="index.js" inline-asset-delete></script> <script inline inline-asset="index.js" inline-asset-delete></script>
</body> </body>
</html> </html>

32
src/index.ts
View file

@ -1,10 +1,36 @@
import GameLoop from './game-loop/game-loop'; import GameLoop from './game-loop/game-loop';
import './styles/index.scss'; import './styles/index.scss';
import { applyArrayPlugins } from './utils/array';
declare global {
interface Array<T> {
x: T;
y: T;
}
interface ReadonlyArray<T> {
x: T;
y: T;
}
interface Float32Array {
x: number;
y: number;
}
}
applyArrayPlugins();
const errorContainer = document.querySelector('.errors');
const main = () => { const main = () => {
const canvas = document.querySelector('canvas'); try {
const game = new GameLoop(canvas); const canvas = document.querySelector('canvas');
game.start(); const game = new GameLoop(canvas);
game.start();
} catch (e) {
errorContainer.innerHTML = e.message;
}
}; };
main(); main();

7
src/styles/index.scss
View file

@ -25,3 +25,10 @@ canvas {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.errors {
color: red;
position: absolute;
top: 0;
left: 0;
}

21
src/utils/array.ts Normal file
View file

@ -0,0 +1,21 @@
/** @internal */
const setIndexAlias = (name: string, index: number, type: any) => {
if (!Object.prototype.hasOwnProperty.call(type.prototype, name)) {
Object.defineProperty(type.prototype, name, {
get() {
return this[index];
},
set(value) {
this[index] = value;
},
});
}
};
/** @internal */
export const applyArrayPlugins = () => {
setIndexAlias('x', 0, Array);
setIndexAlias('y', 1, Array);
setIndexAlias('x', 0, Float32Array);
setIndexAlias('y', 1, Float32Array);
};

16
src/utils/colors/hex.ts Normal file
View file

@ -0,0 +1,16 @@
import { rgb255 } from './rgb255';
import { vec3 } from 'gl-matrix';
export const hex = (hex: string): vec3 => {
if (hex[0] === '#') {
hex = hex.slice(1);
}
const bigint = parseInt(hex, 16);
const r = (bigint >> 16) & 255;
const g = (bigint >> 8) & 255;
const b = bigint & 255;
return rgb255(r, g, b);
};

35
src/utils/colors/hsl.ts Normal file
View file

@ -0,0 +1,35 @@
import { rgb } from './rgb';
import { vec3 } from 'gl-matrix';
export const hsl = (hue: number, saturation: number, lightness: number): vec3 => {
hue /= 360;
saturation /= 100;
lightness /= 100;
let r, g, b;
if (saturation == 0) {
r = g = b = lightness;
} else {
const hue2rgb = (p: number, q: number, t: number) => {
if (t < 0) t += 1;
if (t > 1) t -= 1;
if (t < 1 / 6) return p + (q - p) * 6 * t;
if (t < 1 / 2) return q;
if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
return p;
};
const q =
lightness < 0.5
? lightness * (1 + saturation)
: lightness + saturation - lightness * saturation;
const p = 2 * lightness - q;
r = hue2rgb(p, q, hue + 1 / 3);
g = hue2rgb(p, q, hue);
b = hue2rgb(p, q, hue - 1 / 3);
}
return rgb(r, g, b);
};

3
src/utils/colors/rgb.ts Normal file
View file

@ -0,0 +1,3 @@
import { vec3 } from 'gl-matrix';
export const rgb = (r: number, g: number, b: number): vec3 => vec3.fromValues(r, g, b);

4
src/utils/colors/rgb255.ts Normal file
View file

@ -0,0 +1,4 @@
import { vec3 } from 'gl-matrix';
export const rgb255 = (r: number, g: number, b: number): vec3 =>
vec3.fromValues(r / 255, g / 255, b / 255);

4
src/utils/colors/rgba.ts Normal file
View file

@ -0,0 +1,4 @@
import { vec4 } from 'gl-matrix';
export const rgba = (r: number, g: number, b: number, a: number): vec4 =>
vec4.fromValues(r, g, b, a);

4
src/utils/colors/rgba255.ts Normal file
View file

@ -0,0 +1,4 @@
import { vec4 } from 'gl-matrix';
export const rgba255 = (r: number, g: number, b: number, a: number): vec4 =>
vec4.fromValues(r / 255, g / 255, b / 255, a / 255);

1
src/utils/mix.ts Normal file
View file

@ -0,0 +1 @@
export const mix = (from: number, to: number, q: number) => from + (to - from) * q;

7
static/maximize.svg Normal file
View file

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 24 24" stroke-width="1.5" stroke="#FFFFFF" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<path d="M4 8v-2a2 2 0 0 1 2 -2h2" />
<path d="M4 16v2a2 2 0 0 0 2 2h2" />
<path d="M16 4h2a2 2 0 0 1 2 2v2" />
<path d="M16 20h2a2 2 0 0 0 2 -2v-2" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 399 B

7
static/minimize.svg Normal file
View file

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 24 24" stroke-width="1.5" stroke="#FFFFFF" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<path d="M15 19v-2a2 2 0 0 1 2 -2h2" />
<path d="M15 5v2a2 2 0 0 0 2 2h2" />
<path d="M5 15h2a2 2 0 0 1 2 2v2" />
<path d="M5 9h2a2 2 0 0 0 2 -2v-2" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 399 B

2
static/no-change/robots.txt Normal file
View file

@ -0,0 +1,2 @@
User-agent: *
Allow: /