summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--public/gl/core/Shader.js6
-rw-r--r--public/gl/gl.js12
-rw-r--r--public/gl/math/Mat4.js104
-rw-r--r--public/gl/model/Cube.js117
-rw-r--r--public/gl/shader/SimpleShader.js34
-rw-r--r--public/test.js13
6 files changed, 112 insertions, 174 deletions
diff --git a/public/gl/core/Shader.js b/public/gl/core/Shader.js
index 0e7e528..dad7e4f 100644
--- a/public/gl/core/Shader.js
+++ b/public/gl/core/Shader.js
@@ -47,7 +47,7 @@ export class Shader {
this.#uniforms = {}
vertexCode.split('\n').forEach((line) => {
- const tokens = line.split(" ")
+ const tokens = line.trim().split(" ")
if (tokens.length != 3) return
if (tokens[0] === "attribute") {
this.#attributes.push(tokens[2].replace(/\s+/g, '').split(';')[0])
@@ -88,8 +88,8 @@ export class Shader {
}
loadMat4(name, m) {
- // console.log(name, m.get())
- gl.uniformMatrix4fv(this.#uniforms[name], gl.FALSE, m.get())
+ if(this.#uniforms[name] == undefined) return;
+ gl.uniformMatrix4fv(this.#uniforms[name], gl.FALSE, m.data)
}
loadBool(name, bool) {
diff --git a/public/gl/gl.js b/public/gl/gl.js
index 88e4973..7aca9c9 100644
--- a/public/gl/gl.js
+++ b/public/gl/gl.js
@@ -1,4 +1,3 @@
-export { SimpleController } from './controller/SimpleController.js'
export { Camera } from './core/Camera.js'
export { Entity } from './core/Entity.js'
export { Material } from './core/Material.js'
@@ -6,12 +5,19 @@ export { Mesh } from './core/Mesh.js'
export { Renderer } from './core/Renderer.js'
export { Scene } from './core/Scene.js'
export { Shader } from './core/Shader.js'
-export { File } from './io/File.js'
-export { Input } from './io/Input.js'
+
export { Mat4 } from './math/Mat4.js'
export { M as Math } from './math/Math.js'
export { Vec3 } from './math/Vec3.js'
export { Cube } from './model/Cube.js'
+
+export { File } from './io/File.js'
+export { Input } from './io/Input.js'
+
+export { SimpleController } from './controller/SimpleController.js'
+
+export { SimpleShader } from './shader/SimpleShader.js'
+
export { Loop }
export { DT }
diff --git a/public/gl/math/Mat4.js b/public/gl/math/Mat4.js
index 3481440..26996c5 100644
--- a/public/gl/math/Mat4.js
+++ b/public/gl/math/Mat4.js
@@ -27,21 +27,10 @@ export class Mat4 {
set(m00, m01, m02, m03, m10, m11, m12, m13, m20, m21, m22, m23, m30, m31, m32, m33) {
const d = this.data
- d[0] = m00; d[1] = m01; d[2] = m02; d[3] = m03;
- d[4] = m10; d[5] = m11; d[6] = m12; d[7] = m13;
- d[8] = m20; d[9] = m21; d[10] = m22; d[11] = m23;
- d[12] = m30; d[13] = m31; d[14] = m32; d[15] = m33;
- return this
- }
-
- clone() {
- return new Mat4().arr(this.da)
- }
-
- arr(arr, offset = 0) {
- for(let i = 0; i < 16; i++) {
- this.data[i] = arr[i + offset]
- }
+ d[0] = m00; d[4] = m01; d[8] = m02; d[12] = m03;
+ d[1] = m10; d[5] = m11; d[9] = m12; d[13] = m13;
+ d[2] = m20; d[6] = m21; d[10] = m22; d[14] = m23;
+ d[3] = m30; d[7] = m31; d[11] = m32; d[15] = m33;
return this
}
@@ -54,88 +43,5 @@ export class Mat4 {
)
return this
}
-
- copy(m) {
- const d = this.data
- const o = m.data
- d[0] = o[0]; d[1] = o[1]; d[2] = o[2]; d[3] = o[3];
- d[4] = o[4]; d[5] = o[5]; d[6] = o[6]; d[7] = o[7];
- d[8] = o[8]; d[9] = o[9]; d[10] = o[10]; d[11] = o[11];
- d[12] = o[12]; d[13] = o[13]; d[14] = o[14]; d[15] = o[15];
- return this
- }
-
- pos(v) {
- const d = this.data
-
- const m30 = d[0] * v.x + d[4] * v.y + d[8] * v.z;
- const m31 = d[1] * v.x + d[5] * v.y + d[9] * v.z;
- const m32 = d[2] * v.x + d[6] * v.y + d[10] * v.z;
- const m33 = d[3] * v.x + d[7] * v.y + d[11] * v.z;
-
- d[3] += m30;
- d[7] += m31;
- d[11] += m32;
- d[15] += m33;
- return this;
- }
-
- rot(v) {
- this.rotX(v.x)
- this.rotY(v.y)
- this.rotZ(v.z)
-
- return this
- }
-
- rotX(a) {
- const s = Math.sin(a), c = cosFromSin(s, a);
- const d = this.data;
-
- d[5] = c
- d[6] = s
- d[9] = -s
- d[10] = c
-
- return this
- }
-
- rotY(a) {
- const s = Math.sin(a), c = cosFromSin(s, a);
- const d = this.data;
-
- d[0] = c
- d[3] = -s
- d[8] = c
- d[10] = c
-
- return this
- }
-
- rotZ(a) {
- const s = Math.sin(a), c = cosFromSin(s, a);
- const d = this.data;
-
- d[0] = c
- d[1] = s
- d[4] = -s
- d[5] = c
-
- return this
- }
-
- scale(v) {
- const d = this.data;
-
- d[0] *= v.x; d[1] *= v.y; d[2] *= v.z;
- d[4] *= v.x; d[5] *= v.y; d[6] *= v.z;
- d[8] *= v.x; d[9] *= v.y; d[10] *= v.z;
- d[12] *= v.x; d[13] *= v.y; d[14] *= v.z;
-
- return this;
- }
-
- get() {
- return new Float32Array(this.data)
- }
+
} \ No newline at end of file
diff --git a/public/gl/model/Cube.js b/public/gl/model/Cube.js
index 824984b..8583afb 100644
--- a/public/gl/model/Cube.js
+++ b/public/gl/model/Cube.js
@@ -1,68 +1,65 @@
import { Mesh } from '../core/Mesh.js'
-export class Cube {
+export const Cube = () => {
- constructor() {
+ const data = [
+ -1.0, 1.0, -1.0, 0.5, 0.5, 0.5,
+ -1.0, 1.0, 1.0, 0.5, 0.5, 0.5,
+ 1.0, 1.0, 1.0, 0.5, 0.5, 0.5,
+ 1.0, 1.0, -1.0, 0.5, 0.5, 0.5,
+ -1.0, 1.0, 1.0, 0.75, 0.25, 0.5,
+ -1.0, -1.0, 1.0, 0.75, 0.25, 0.5,
+ -1.0, -1.0, -1.0, 0.75, 0.25, 0.5,
+ -1.0, 1.0, -1.0, 0.75, 0.25, 0.5,
+ 1.0, 1.0, 1.0, 0.25, 0.25, 0.75,
+ 1.0, -1.0, 1.0, 0.25, 0.25, 0.75,
+ 1.0, -1.0, -1.0, 0.25, 0.25, 0.75,
+ 1.0, 1.0, -1.0, 0.25, 0.25, 0.75,
+ 1.0, 1.0, 1.0, 1.0, 0.0, 0.15,
+ 1.0, -1.0, 1.0, 1.0, 0.0, 0.15,
+ -1.0, -1.0, 1.0, 1.0, 0.0, 0.15,
+ -1.0, 1.0, 1.0, 1.0, 0.0, 0.15,
+ 1.0, 1.0, -1.0, 0.0, 1.0, 0.15,
+ 1.0, -1.0, -1.0, 0.0, 1.0, 0.15,
+ -1.0, -1.0, -1.0, 0.0, 1.0, 0.15,
+ -1.0, 1.0, -1.0, 0.0, 1.0, 0.15,
+ -1.0, -1.0, -1.0, 0.5, 0.5, 1.0,
+ -1.0, -1.0, 1.0, 0.5, 0.5, 1.0,
+ 1.0, -1.0, 1.0, 0.5, 0.5, 1.0,
+ 1.0, -1.0, -1.0, 0.5, 0.5, 1.0,
+ ];
- this.data = [
- -1.0, 1.0, -1.0, 0.5, 0.5, 0.5,
- -1.0, 1.0, 1.0, 0.5, 0.5, 0.5,
- 1.0, 1.0, 1.0, 0.5, 0.5, 0.5,
- 1.0, 1.0, -1.0, 0.5, 0.5, 0.5,
- -1.0, 1.0, 1.0, 0.75, 0.25, 0.5,
- -1.0, -1.0, 1.0, 0.75, 0.25, 0.5,
- -1.0, -1.0, -1.0, 0.75, 0.25, 0.5,
- -1.0, 1.0, -1.0, 0.75, 0.25, 0.5,
- 1.0, 1.0, 1.0, 0.25, 0.25, 0.75,
- 1.0, -1.0, 1.0, 0.25, 0.25, 0.75,
- 1.0, -1.0, -1.0, 0.25, 0.25, 0.75,
- 1.0, 1.0, -1.0, 0.25, 0.25, 0.75,
- 1.0, 1.0, 1.0, 1.0, 0.0, 0.15,
- 1.0, -1.0, 1.0, 1.0, 0.0, 0.15,
- -1.0, -1.0, 1.0, 1.0, 0.0, 0.15,
- -1.0, 1.0, 1.0, 1.0, 0.0, 0.15,
- 1.0, 1.0, -1.0, 0.0, 1.0, 0.15,
- 1.0, -1.0, -1.0, 0.0, 1.0, 0.15,
- -1.0, -1.0, -1.0, 0.0, 1.0, 0.15,
- -1.0, 1.0, -1.0, 0.0, 1.0, 0.15,
- -1.0, -1.0, -1.0, 0.5, 0.5, 1.0,
- -1.0, -1.0, 1.0, 0.5, 0.5, 1.0,
- 1.0, -1.0, 1.0, 0.5, 0.5, 1.0,
- 1.0, -1.0, -1.0, 0.5, 0.5, 1.0,
- ];
-
- this.indicies = [
- 0, 1, 2,
- 0, 2, 3,
- 5, 4, 6,
- 6, 4, 7,
- 8, 9, 10,
- 8, 10, 11,
- 13, 12, 14,
- 15, 14, 12,
- 16, 17, 18,
- 16, 18, 19,
- 21, 20, 22,
- 22, 20, 23
- ];
-
- this.verticies = []
- this.colors = []
- for (let x = 0; x < this.indicies.length; x++) {
- var i = this.indicies[x]
- this.verticies.push(this.data[i * 6 + 2])
- this.verticies.push(this.data[i * 6 + 1])
- this.verticies.push(this.data[i * 6 + 0])
- this.colors.push(this.data[i * 6 + 3])
- this.colors.push(this.data[i * 6 + 4])
- this.colors.push(this.data[i * 6 + 5])
- }
-
- this.mesh = new Mesh(this.indicies.length)
- .store(this.verticies, 3)
- .store(this.colors, 3)
- .finish()
+ const indicies = [
+ 0, 1, 2,
+ 0, 2, 3,
+ 5, 4, 6,
+ 6, 4, 7,
+ 8, 9, 10,
+ 8, 10, 11,
+ 13, 12, 14,
+ 15, 14, 12,
+ 16, 17, 18,
+ 16, 18, 19,
+ 21, 20, 22,
+ 22, 20, 23
+ ];
+ const verticies = []
+ const colors = []
+
+ for (let x = 0; x < indicies.length; x++) {
+ var i = indicies[x]
+ verticies.push(data[i * 6 + 2])
+ verticies.push(data[i * 6 + 1])
+ verticies.push(data[i * 6 + 0])
+ colors.push(data[i * 6 + 3])
+ colors.push(data[i * 6 + 4])
+ colors.push(data[i * 6 + 5])
}
+ return new Mesh(indicies.length)
+ .store(verticies, 3)
+ .store(colors, 3)
+ .finish()
+
} \ No newline at end of file
diff --git a/public/gl/shader/SimpleShader.js b/public/gl/shader/SimpleShader.js
new file mode 100644
index 0000000..715aa60
--- /dev/null
+++ b/public/gl/shader/SimpleShader.js
@@ -0,0 +1,34 @@
+import { Shader } from '../core/Shader.js'
+
+export const SimpleShader = () => {
+
+ const VertexCode = `
+ precision mediump float;
+
+ attribute vec3 position;
+ attribute vec3 color;
+
+ uniform mat4 proj;
+ uniform mat4 view;
+ uniform mat4 tran;
+
+ varying vec3 color_pass;
+
+ void main() {
+ color_pass = color;
+ gl_Position = proj * view * tran * vec4(position, 1.0);
+ }
+ `
+
+ const FragmentCode = `
+ precision mediump float;
+
+ varying vec3 color_pass;
+
+ void main() {
+ gl_FragColor = vec4(color_pass, 1.0);
+ }
+ `
+ return new Shader(VertexCode, FragmentCode)
+
+} \ No newline at end of file
diff --git a/public/test.js b/public/test.js
index 3622a15..631591d 100644
--- a/public/test.js
+++ b/public/test.js
@@ -1,31 +1,26 @@
import * as GL from '/gl/gl.js'
-const main = async () => {
+const main = () => {
var Renderer = new GL.Renderer()
var Scene = new GL.Scene()
var Camera = new GL.Camera()
var SimpleController = new GL.SimpleController(Camera)
- var Shader = new GL.Shader(
- await GL.File.readFileAsync("shader/simple.vert"),
- await GL.File.readFileAsync("shader/simple.frag")
- )
+ var Shader = GL.SimpleShader()
var Material = new GL.Material(Shader)
- var Mesh = new GL.Cube().mesh
+ var Mesh = GL.Cube()
var Cube = new GL.Entity(Mesh)
Cube.position.z = 3;
Scene.add(Material, Cube)
-
- const a = new GL.Vec3(1,1,1)
GL.Loop(() => {
Renderer.draw(Scene, Camera)
- Cube.rotation.add(a)
+ Cube.rotation.add(new GL.Vec3(1,1,1))
SimpleController.update(GL.DT)
});
}