it kinda works!
This commit is contained in:
dylan
parent
e85dbb1a33
commit
078b7806dd
1
deps.ts
1
deps.ts
@ -2,6 +2,5 @@ export {
|
|||||||
createWindow,
|
createWindow,
|
||||||
getProcAddress,
|
getProcAddress,
|
||||||
mainloop,
|
mainloop,
|
||||||
DwmWindow,
|
|
||||||
} from "https://deno.land/x/dwm@0.3.3/mod.ts";
|
} from "https://deno.land/x/dwm@0.3.3/mod.ts";
|
||||||
export * as gl from "https://deno.land/x/gluten@0.1.6/api/gles23.2.ts";
|
export * as gl from "https://deno.land/x/gluten@0.1.6/api/gles23.2.ts";
|
||||||
204
index.ts
204
index.ts
@ -1,162 +1,60 @@
|
|||||||
import {
|
import {
|
||||||
createWindow,
|
|
||||||
getProcAddress,
|
|
||||||
mainloop,
|
mainloop,
|
||||||
gl,
|
frame,
|
||||||
} from "./deps.ts";
|
setPixelColor,
|
||||||
|
clearScreen,
|
||||||
|
setPixelsInRect,
|
||||||
|
} from "./window.ts";
|
||||||
|
|
||||||
const window = createWindow({
|
// deno-fmt-ignore
|
||||||
title: "Faux",
|
const sprites = [
|
||||||
width: 1024,
|
[
|
||||||
height: 1024,
|
2, 2, 2, 2, 2, 2, 2, 2,
|
||||||
resizable: false,
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
glVersion: [3, 2],
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
gles: true,
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
});
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
gl.load(getProcAddress);
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
|
2, 2, 2, 2, 2, 2, 2, 2,
|
||||||
function loadShader(type: number, src: string) {
|
],
|
||||||
const shader = gl.CreateShader(type);
|
[
|
||||||
gl.ShaderSource(
|
2, 2, 2, 2, 2, 2, 2, 2,
|
||||||
shader,
|
2, 3, 3, 1, 1, 3, 3, 2,
|
||||||
1,
|
2, 3, 3, 1, 1, 3, 3, 2,
|
||||||
new Uint8Array(
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
new BigUint64Array([
|
2, 1, 1, 1, 1, 1, 1, 2,
|
||||||
BigInt(
|
2, 3, 3, 1, 1, 3, 3, 2,
|
||||||
Deno.UnsafePointer.value(
|
2, 3, 3, 1, 1, 3, 3, 2,
|
||||||
Deno.UnsafePointer.of(new TextEncoder().encode(src)),
|
2, 2, 2, 2, 2, 2, 2, 2,
|
||||||
),
|
],
|
||||||
),
|
[
|
||||||
]).buffer,
|
2, 2, 2, 2, 2, 2, 2, 2,
|
||||||
),
|
2, 4, 4, 4, 4, 5, 5, 2,
|
||||||
new Int32Array([src.length]),
|
2, 4, 4, 4, 5, 5, 5, 2,
|
||||||
);
|
2, 4, 4, 5, 5, 5, 6, 2,
|
||||||
gl.CompileShader(shader);
|
2, 4, 5, 5, 5, 6, 6, 2,
|
||||||
const status = new Int32Array(1);
|
2, 5, 5, 5, 6, 6, 6, 2,
|
||||||
gl.GetShaderiv(shader, gl.COMPILE_STATUS, status);
|
2, 5, 5, 6, 6, 6, 6, 2,
|
||||||
if (status[0] === gl.FALSE) {
|
2, 2, 2, 2, 2, 2, 2, 2,
|
||||||
const logLength = new Int32Array(1);
|
],
|
||||||
gl.GetShaderiv(shader, gl.INFO_LOG_LENGTH, logLength);
|
|
||||||
const log = new Uint8Array(logLength[0]);
|
|
||||||
gl.GetShaderInfoLog(shader, logLength[0], logLength, log);
|
|
||||||
console.log(new TextDecoder().decode(log));
|
|
||||||
gl.DeleteShader(shader);
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
return shader;
|
|
||||||
}
|
|
||||||
|
|
||||||
const vShaderSrc = `
|
|
||||||
attribute vec4 vPosition;
|
|
||||||
attribute vec4 vCol;
|
|
||||||
varying vec4 color;
|
|
||||||
void main() {
|
|
||||||
gl_Position = vPosition;
|
|
||||||
color = vCol;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const fShaderSrc = `
|
|
||||||
precision mediump float;
|
|
||||||
varying vec4 color;
|
|
||||||
void main() {
|
|
||||||
gl_FragColor = color;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const vShader = loadShader(gl.VERTEX_SHADER, vShaderSrc);
|
|
||||||
const fShader = loadShader(gl.FRAGMENT_SHADER, fShaderSrc);
|
|
||||||
|
|
||||||
const program = gl.CreateProgram();
|
|
||||||
gl.AttachShader(program, vShader);
|
|
||||||
gl.AttachShader(program, fShader);
|
|
||||||
|
|
||||||
gl.BindAttribLocation(program, 0, new TextEncoder().encode("vPosition\0"));
|
|
||||||
gl.BindAttribLocation(program, 1, new TextEncoder().encode("vCol\0"));
|
|
||||||
|
|
||||||
gl.LinkProgram(program);
|
|
||||||
|
|
||||||
const status = new Int32Array(1);
|
|
||||||
gl.GetProgramiv(program, gl.LINK_STATUS, status);
|
|
||||||
if (status[0] === gl.FALSE) {
|
|
||||||
const logLength = new Int32Array(1);
|
|
||||||
gl.GetProgramiv(program, gl.INFO_LOG_LENGTH, logLength);
|
|
||||||
const log = new Uint8Array(logLength[0]);
|
|
||||||
gl.GetProgramInfoLog(program, logLength[0], logLength, log);
|
|
||||||
console.log(new TextDecoder().decode(log));
|
|
||||||
gl.DeleteProgram(program);
|
|
||||||
Deno.exit(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
gl.ClearColor(0.0, 0.0, 0.0, 1.0);
|
|
||||||
|
|
||||||
addEventListener("resize", (event) => {
|
|
||||||
gl.Viewport(0, 0, event.width, event.height);
|
|
||||||
});
|
|
||||||
|
|
||||||
const pixelsPerRow = 128;
|
|
||||||
|
|
||||||
const top = 1;
|
|
||||||
const left = -1;
|
|
||||||
const cell = 2/pixelsPerRow;
|
|
||||||
|
|
||||||
const px = (x: number, y: number) => {
|
|
||||||
// deno-fmt-ignore
|
|
||||||
return [
|
|
||||||
left + x*cell, top - y*cell, 0,
|
|
||||||
left + (x+1)*cell, top - y*cell, 0,
|
|
||||||
left + x*cell, top - (y+1)*cell, 0,
|
|
||||||
left + (x+1)*cell, top - y*cell, 0,
|
|
||||||
left + x*cell, top - (y+1)*cell, 0,
|
|
||||||
left + (x+1)*cell, top - (y+1)*cell, 0,
|
|
||||||
];
|
|
||||||
}
|
|
||||||
|
|
||||||
const palette = [
|
|
||||||
[0, 0, 0, 0],
|
|
||||||
[0, 0, 0, 1],
|
|
||||||
[1, 1, 1, 1],
|
|
||||||
[1, 0, 0, 1],
|
|
||||||
[1, 1, 0, 1],
|
|
||||||
[0, 1, 0, 1],
|
|
||||||
[0, 0, 1, 1],
|
|
||||||
]
|
]
|
||||||
|
|
||||||
const c = (n: number) => {
|
const drawSprite = (x: number, y: number, spr: number) => {
|
||||||
return [
|
setPixelsInRect(x, y, 8, sprites[spr]);
|
||||||
...palette[n],
|
|
||||||
...palette[n],
|
|
||||||
...palette[n],
|
|
||||||
...palette[n],
|
|
||||||
...palette[n],
|
|
||||||
...palette[n],
|
|
||||||
];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const allPixelTriangles = new Float32Array(
|
await mainloop((t) => {
|
||||||
Array(pixelsPerRow*pixelsPerRow).fill(null).flatMap((_, i) => px(i%pixelsPerRow,Math.floor(i/pixelsPerRow)))
|
console.log(t/1000);
|
||||||
)
|
clearScreen();
|
||||||
|
for (let i = 0; i < 256; i++) {
|
||||||
const choose = <T>(alts: Array<T>): T => {
|
drawSprite(Math.floor(Math.random()*120), Math.floor(Math.random()*120), 0);
|
||||||
return alts[Math.floor(Math.random()*alts.length)];
|
drawSprite(Math.floor(Math.random()*120), Math.floor(Math.random()*120), 1);
|
||||||
}
|
drawSprite(Math.floor(Math.random()*120), Math.floor(Math.random()*120), 2);
|
||||||
|
}
|
||||||
const allPixelColors = new Float32Array(
|
setPixelColor(0, 0, 3);
|
||||||
Array(pixelsPerRow*pixelsPerRow).fill(null).flatMap(() => c(choose([1,2,3,4,5,6])))
|
setPixelColor(0, 127, 4);
|
||||||
)
|
setPixelColor(127, 0, 5);
|
||||||
|
setPixelColor(127, 127, 6);
|
||||||
const frame = () => {
|
|
||||||
gl.Clear(gl.COLOR_BUFFER_BIT);
|
|
||||||
gl.UseProgram(program);
|
|
||||||
gl.VertexAttribPointer(0, 3, gl.FLOAT, gl.FALSE, 0, allPixelTriangles);
|
|
||||||
gl.VertexAttribPointer(1, 4, gl.FLOAT, gl.FALSE, 0, allPixelColors);
|
|
||||||
gl.EnableVertexAttribArray(0);
|
|
||||||
gl.EnableVertexAttribArray(1);
|
|
||||||
gl.DrawArrays(gl.TRIANGLES, 0, 6*pixelsPerRow*pixelsPerRow);
|
|
||||||
window.swapBuffers();
|
|
||||||
}
|
|
||||||
|
|
||||||
await mainloop(() => {
|
|
||||||
frame();
|
frame();
|
||||||
});
|
});
|
||||||
|
|||||||
164
window.ts
Normal file
164
window.ts
Normal file
@ -0,0 +1,164 @@
|
|||||||
|
import {
|
||||||
|
createWindow,
|
||||||
|
getProcAddress,
|
||||||
|
gl,
|
||||||
|
} from "./deps.ts";
|
||||||
|
export {mainloop} from "./deps.ts";
|
||||||
|
|
||||||
|
const window = createWindow({
|
||||||
|
title: "Faux",
|
||||||
|
width: 1024,
|
||||||
|
height: 1024,
|
||||||
|
resizable: false,
|
||||||
|
glVersion: [3, 2],
|
||||||
|
gles: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
gl.load(getProcAddress);
|
||||||
|
|
||||||
|
function loadShader(type: number, src: string) {
|
||||||
|
const shader = gl.CreateShader(type);
|
||||||
|
gl.ShaderSource(
|
||||||
|
shader,
|
||||||
|
1,
|
||||||
|
new Uint8Array(
|
||||||
|
new BigUint64Array([
|
||||||
|
BigInt(
|
||||||
|
Deno.UnsafePointer.value(
|
||||||
|
Deno.UnsafePointer.of(new TextEncoder().encode(src)),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
]).buffer,
|
||||||
|
),
|
||||||
|
new Int32Array([src.length]),
|
||||||
|
);
|
||||||
|
gl.CompileShader(shader);
|
||||||
|
const status = new Int32Array(1);
|
||||||
|
gl.GetShaderiv(shader, gl.COMPILE_STATUS, status);
|
||||||
|
if (status[0] === gl.FALSE) {
|
||||||
|
const logLength = new Int32Array(1);
|
||||||
|
gl.GetShaderiv(shader, gl.INFO_LOG_LENGTH, logLength);
|
||||||
|
const log = new Uint8Array(logLength[0]);
|
||||||
|
gl.GetShaderInfoLog(shader, logLength[0], logLength, log);
|
||||||
|
console.log(new TextDecoder().decode(log));
|
||||||
|
gl.DeleteShader(shader);
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
return shader;
|
||||||
|
}
|
||||||
|
|
||||||
|
const vShaderSrc = `
|
||||||
|
attribute vec4 vPosition;
|
||||||
|
attribute vec4 vCol;
|
||||||
|
varying vec4 color;
|
||||||
|
void main() {
|
||||||
|
gl_Position = vPosition;
|
||||||
|
color = vCol;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
|
const fShaderSrc = `
|
||||||
|
precision mediump float;
|
||||||
|
varying vec4 color;
|
||||||
|
void main() {
|
||||||
|
gl_FragColor = color;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
|
const vShader = loadShader(gl.VERTEX_SHADER, vShaderSrc);
|
||||||
|
const fShader = loadShader(gl.FRAGMENT_SHADER, fShaderSrc);
|
||||||
|
|
||||||
|
const program = gl.CreateProgram();
|
||||||
|
gl.AttachShader(program, vShader);
|
||||||
|
gl.AttachShader(program, fShader);
|
||||||
|
|
||||||
|
gl.BindAttribLocation(program, 0, new TextEncoder().encode("vPosition\0"));
|
||||||
|
gl.BindAttribLocation(program, 1, new TextEncoder().encode("vCol\0"));
|
||||||
|
|
||||||
|
gl.LinkProgram(program);
|
||||||
|
|
||||||
|
const status = new Int32Array(1);
|
||||||
|
gl.GetProgramiv(program, gl.LINK_STATUS, status);
|
||||||
|
if (status[0] === gl.FALSE) {
|
||||||
|
const logLength = new Int32Array(1);
|
||||||
|
gl.GetProgramiv(program, gl.INFO_LOG_LENGTH, logLength);
|
||||||
|
const log = new Uint8Array(logLength[0]);
|
||||||
|
gl.GetProgramInfoLog(program, logLength[0], logLength, log);
|
||||||
|
console.log(new TextDecoder().decode(log));
|
||||||
|
gl.DeleteProgram(program);
|
||||||
|
Deno.exit(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
gl.ClearColor(0.0, 0.0, 0.0, 1.0);
|
||||||
|
|
||||||
|
addEventListener("resize", (event) => {
|
||||||
|
gl.Viewport(0, 0, event.width, event.height);
|
||||||
|
});
|
||||||
|
|
||||||
|
const pixelsPerRow = 128;
|
||||||
|
|
||||||
|
const top = 1;
|
||||||
|
const left = -1;
|
||||||
|
const cell = 2/pixelsPerRow;
|
||||||
|
|
||||||
|
const px = (x: number, y: number) => {
|
||||||
|
// deno-fmt-ignore
|
||||||
|
return [
|
||||||
|
left + x*cell, top - y*cell, 0,
|
||||||
|
left + (x+1)*cell, top - y*cell, 0,
|
||||||
|
left + x*cell, top - (y+1)*cell, 0,
|
||||||
|
left + (x+1)*cell, top - y*cell, 0,
|
||||||
|
left + x*cell, top - (y+1)*cell, 0,
|
||||||
|
left + (x+1)*cell, top - (y+1)*cell, 0,
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
const palette: Array<[number, number, number, number]> = [
|
||||||
|
[0, 0, 0, 0],
|
||||||
|
[0, 0, 0, 1],
|
||||||
|
[1, 1, 1, 1],
|
||||||
|
[1, 0, 0, 1],
|
||||||
|
[1, 1, 0, 1],
|
||||||
|
[0, 1, 0, 1],
|
||||||
|
[0, 0, 1, 1],
|
||||||
|
];
|
||||||
|
|
||||||
|
const paletteX6 = palette.map(rgba => [...rgba, ...rgba, ...rgba, ...rgba, ...rgba, ...rgba]);
|
||||||
|
|
||||||
|
const c = (n: number) => {
|
||||||
|
return paletteX6[n];
|
||||||
|
}
|
||||||
|
|
||||||
|
const allPixelTriangles = new Float32Array(
|
||||||
|
Array(pixelsPerRow*pixelsPerRow).fill(null).flatMap((_, i) => px(i%pixelsPerRow,Math.floor(i/pixelsPerRow)))
|
||||||
|
)
|
||||||
|
|
||||||
|
const allPixelColors = new Float32Array(
|
||||||
|
Array(pixelsPerRow*pixelsPerRow).fill(null).flatMap(() => c(1))
|
||||||
|
)
|
||||||
|
|
||||||
|
export const setPixelColor = (x: number, y: number, color: number) => {
|
||||||
|
const col = c(color);
|
||||||
|
allPixelColors.set(col, 4*6*(128*y+x));
|
||||||
|
}
|
||||||
|
|
||||||
|
export const setPixelsInRect = (x: number, y: number, w: number, pixels: Array<number>) => {
|
||||||
|
for (let i = 0; i < pixels.length; i++) {
|
||||||
|
setPixelColor(x+i%w, y+Math.floor(i/w), pixels[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const clearScreen = () => {
|
||||||
|
allPixelColors.fill(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
export const frame = () => {
|
||||||
|
gl.Clear(gl.COLOR_BUFFER_BIT);
|
||||||
|
gl.UseProgram(program);
|
||||||
|
gl.VertexAttribPointer(0, 3, gl.FLOAT, gl.FALSE, 0, allPixelTriangles);
|
||||||
|
gl.VertexAttribPointer(1, 4, gl.FLOAT, gl.FALSE, 0, allPixelColors);
|
||||||
|
gl.EnableVertexAttribArray(0);
|
||||||
|
gl.EnableVertexAttribArray(1);
|
||||||
|
gl.DrawArrays(gl.TRIANGLES, 0, 6*pixelsPerRow*pixelsPerRow);
|
||||||
|
window.swapBuffers();
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user