From 7ac036cc8cb322e0bcb935c820c0705f1d620355 Mon Sep 17 00:00:00 2001 From: lrsb Date: Mon, 17 Aug 2020 17:27:23 +0200 Subject: [PATCH] new colors and light --- index.html | 6 ++++++ js/lights.js | 4 +++- js/main.js | 15 +++++++-------- js/models.js | 5 ++++- shaders/fs.glsl | 8 +++++++- 5 files changed, 27 insertions(+), 11 deletions(-) diff --git a/index.html b/index.html index 97c4024..aeeadd7 100644 --- a/index.html +++ b/index.html @@ -366,6 +366,12 @@ +
+
+ + +
+
diff --git a/js/lights.js b/js/lights.js index a28d898..2c35c46 100644 --- a/js/lights.js +++ b/js/lights.js @@ -16,7 +16,8 @@ const lights = { ambient: '#000000', diffuse: '#ffffff', material: '#ffffff', - specular: '#ffffff' + specular: '#ffffff', + trajectory: '#ffffff' } } @@ -109,6 +110,7 @@ function setColor() { lights.colors.diffuse = $('#diffuse-color').val() lights.colors.material = $('#ambient-mat-color').val() lights.colors.specular = $('#specular-color').val() + lights.colors.trajectory = $('#trajectory-color').val() } function setSpecShine() { diff --git a/js/main.js b/js/main.js index ac21cf5..14e1637 100644 --- a/js/main.js +++ b/js/main.js @@ -44,7 +44,7 @@ function drawScene() { [missile.end.x, missile.end.y, missile.end.z], settings.height, i + 0.01) const sphereWorldMatrix = utils.MakeWorld(position[0], position[1], position[2], 0, 0, 0, 0.01) - drawModel(models.sphere, sphereWorldMatrix, cm) + drawModel(models.sphere, sphereWorldMatrix, cm, decodeColor(lights.colors.trajectory), false) if (events.computeMax && (checkCollision(models.landscape.mesh, position, nextPosition) || position[1] < -0.2)) { events.maxCompletion = i events.computeMax = false @@ -60,21 +60,20 @@ function drawScene() { const missileWorldMatrix = utils.MakeWorldFromBetweenVectors(position[0], position[1], position[2], [0, 0, 1], missileDirection, 0.01) drawModel(missile.model1 ? models.missile1 : models.missile2, missileWorldMatrix, cm) drawModel(models.landscape, utils.MakeWorld(0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 1), cm) - if (lights.lightType[1] === 1 || lights.lightType[2] === 1) { + if (lights.lightType[1] === 1) { + drawModel(models.sphere, utils.MakeWorld(lights.point.x, lights.point.y + 0.1, lights.point.z, 0, 0, 0, 0.05), + cm, decodeColor(lights.colors.light), true) + } else if (lights.lightType[2] === 1) { const angle = lights.lightType[2] === 1 ? lights.spot.phi : 0 const elevation = lights.lightType[2] === 1 ? lights.spot.theta : 0 const vect = utils.normalizeVector3([Math.sin(elevation) * Math.sin(angle), Math.cos(elevation), Math.sin(elevation) * Math.cos(angle)]) - drawModel(models.light, utils.MakeWorldFromBetweenVectors( - lights.lightType[1] === 1 ? lights.point.x : lights.spot.x, - lights.lightType[1] === 1 ? lights.point.y : lights.spot.y, - lights.lightType[1] === 1 ? lights.point.z : lights.spot.z, - [0, 0, -1], vect, 0.01), cm) + drawModel(models.light, utils.MakeWorldFromBetweenVectors(lights.spot.x, lights.spot.y, lights.spot.z, [0, 0, -1], vect, 0.01), cm) } if (camera.lookAt) { const sphereWorldMatrix = utils.MakeWorld(camera.x, camera.y, camera.z, 0, 0, 0, 0.05) - drawModel(models.sphere, sphereWorldMatrix, cm) + drawModel(models.sphere, sphereWorldMatrix, cm, [0, 1, 0], true) } if (events.playing) missile.completion += (Date.now() - events.lastDrawTimestamp) / (1000.0 * settings.flightTime) events.lastDrawTimestamp = Date.now() diff --git a/js/models.js b/js/models.js index 9d6110c..34dc785 100644 --- a/js/models.js +++ b/js/models.js @@ -47,7 +47,7 @@ async function loadModel(modelName) { return {vao, mesh, texture} } -function drawModel(model, worldMatrix, cm) { +function drawModel(model, worldMatrix, cm, fillColor, ignoreAmbient) { const viewWorldMatrix = utils.multiplyMatrices(cm.viewMatrix, worldMatrix) const projectionMatrix = utils.multiplyMatrices(cm.perspectiveMatrix, viewWorldMatrix) @@ -56,6 +56,9 @@ function drawModel(model, worldMatrix, cm) { gl.uniformMatrix4fv(gl.getUniformLocation(program, 'two_matrix'), gl.FALSE, worldMatrix) gl.uniformMatrix4fv(gl.getUniformLocation(program, 'matrix'), gl.FALSE, utils.transposeMatrix(projectionMatrix)) + fillColor = fillColor == null ? [0, 0, 0, 0] : [fillColor[0], fillColor[1], fillColor[2], ignoreAmbient ? 1.0 : 0.5] + gl.uniform4f(gl.getUniformLocation(program, 'fillColor'), fillColor[0], fillColor[1], fillColor[2], fillColor[3]) + gl.activeTexture(gl.TEXTURE0) gl.bindTexture(gl.TEXTURE_2D, model.texture) diff --git a/shaders/fs.glsl b/shaders/fs.glsl index 45caef8..fcbdaff 100644 --- a/shaders/fs.glsl +++ b/shaders/fs.glsl @@ -11,7 +11,9 @@ out vec4 out_color; uniform mat4 wo_matrix; uniform mat4 two_matrix; uniform vec3 eyePos; + uniform sampler2D u_texture; +uniform vec4 fillColor; uniform vec4 LAlightType; uniform vec3 LAPos; @@ -62,7 +64,11 @@ vec4 compSpecular(vec3 lightDir, vec4 lightCol, vec3 normalVec, vec3 eyedirVec) } void main() { - vec4 texcol = texture(u_texture, fs_uv); + vec4 texcol = fillColor.a != 0.0 ? fillColor : texture(u_texture, fs_uv); + if (fillColor.a == 1.0) { + out_color = texcol; + return; + } vec4 diffColor = diffuseColor * (1.0 - DTexMix) + texcol * DTexMix; vec4 ambColor = ambientMatColor * (1.0 - DTexMix) + texcol * DTexMix;