From eb39846b75bb9a416fa5389af52b96ba29a19b9a Mon Sep 17 00:00:00 2001 From: schmelczerandras Date: Sun, 16 Aug 2020 09:15:09 +0200 Subject: [PATCH] Fix rendering issues --- docker-compose.yml | 2 -- frontend/package.json | 1 - .../drawing/drawables/lights/circle-light.ts | 2 +- frontend/src/scripts/drawing/settings.ts | 1 - .../drawing/shaders/cave-distance-fs.glsl | 11 ++++++----- .../drawing/shaders/lights-shading-fs.glsl | 19 +++++++++---------- .../src/scripts/objects/types/character.ts | 18 +++++++++--------- 7 files changed, 25 insertions(+), 29 deletions(-) diff --git a/docker-compose.yml b/docker-compose.yml index a37d649..35401a9 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -4,8 +4,6 @@ services: declared-frontend: init: true image: schmelczera/declared-frontend - ports: - - "80" networks: - network deploy: diff --git a/frontend/package.json b/frontend/package.json index 57126ae..6635543 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -6,7 +6,6 @@ "main": "index.js", "scripts": { "start": "webpack-dev-server --mode development", - "start-unsafe": "webpack-dev-server --mode development --useLocalIp", "build": "webpack && find dist -type f -not -name '*.html' | xargs rm" }, "keywords": [], diff --git a/frontend/src/scripts/drawing/drawables/lights/circle-light.ts b/frontend/src/scripts/drawing/drawables/lights/circle-light.ts index 2f90ed8..66913d0 100644 --- a/frontend/src/scripts/drawing/drawables/lights/circle-light.ts +++ b/frontend/src/scripts/drawing/drawables/lights/circle-light.ts @@ -18,7 +18,7 @@ export class CircleLight implements ILight { public radius: number, public color: vec3, public lightness: number - ) { } + ) {} boundingBox: ImmutableBoundingBox; diff --git a/frontend/src/scripts/drawing/settings.ts b/frontend/src/scripts/drawing/settings.ts index 6d8d0d3..34dc169 100644 --- a/frontend/src/scripts/drawing/settings.ts +++ b/frontend/src/scripts/drawing/settings.ts @@ -23,7 +23,6 @@ export const settings = { shaderMacros: { distanceScale: 64, distanceOffset: 0.15, - //edgeSmoothing: 0, edgeSmoothing: 10, }, shaderCombinations: { diff --git a/frontend/src/scripts/drawing/shaders/cave-distance-fs.glsl b/frontend/src/scripts/drawing/shaders/cave-distance-fs.glsl index 64c8179..7d464cc 100644 --- a/frontend/src/scripts/drawing/shaders/cave-distance-fs.glsl +++ b/frontend/src/scripts/drawing/shaders/cave-distance-fs.glsl @@ -29,10 +29,10 @@ void main() { float minDistance = maxMinDistance; for (int i = 0; i < LINE_COUNT; i++) { - vec2 pa = worldCoordinates - lines[i].from; - vec2 ba = lines[i].toFromDelta; - float h = clamp(dot(pa, ba) / dot(ba, ba), 0.0, 1.0); - float lineDistance = distance(pa, ba * h) - mix(lines[i].fromRadius, lines[i].toRadius, h); + vec2 targetFromDelta = worldCoordinates - lines[i].from; + vec2 toFromDelta = lines[i].toFromDelta; + float h = clamp(dot(targetFromDelta, toFromDelta) / dot(toFromDelta, toFromDelta), 0.0, 1.0); + float lineDistance = distance(targetFromDelta, toFromDelta * h) - mix(lines[i].fromRadius, lines[i].toRadius, h); minDistance = min(minDistance, lineDistance); } @@ -42,6 +42,7 @@ void main() { fragmentColor = vec4( mix(CAVE_COLOR, AIR_COLOR, clamp(realDistance, 0.0, 1.0)), - (realDistance + DISTANCE_OFFSET) / DISTANCE_SCALE - 1.0/255.0 + (realDistance + DISTANCE_OFFSET) / DISTANCE_SCALE + ); } diff --git a/frontend/src/scripts/drawing/shaders/lights-shading-fs.glsl b/frontend/src/scripts/drawing/shaders/lights-shading-fs.glsl index 9e0fb2e..459ba60 100644 --- a/frontend/src/scripts/drawing/shaders/lights-shading-fs.glsl +++ b/frontend/src/scripts/drawing/shaders/lights-shading-fs.glsl @@ -4,7 +4,6 @@ precision mediump float; #define INFINITY 1000.0 #define LIGHT_DROP 500.0 -#define MIN_STEP 1.0 #define AMBIENT_LIGHT vec3(0.15) #define CIRCLE_LIGHT_COUNT {circleLightCount} @@ -59,9 +58,6 @@ void main() { for (int i = 0; i < CIRCLE_LIGHT_COUNT; i++) { float lightCenterDistance = distance(circleLights[i].center, worldCoordinates); - /*if (lightCenterDistance < circleLights[i].radius) { - lighting = vec3(1.0, 1.0, 0.0); - }*/ vec3 lightColorAtPosition = circleLights[i].value / pow( lightCenterDistance / LIGHT_DROP + 1.0, 2.0 @@ -73,19 +69,22 @@ void main() { vec2 direction = normalize(circleLightDirections[i]) / viewBoxSize; for (int j = 0; j < 48; j++) { - if (rayLength > lightCenterDistance) { + if (rayLength > lightCenterDistance - circleLights[i].radius) { + rayLength = lightCenterDistance - circleLights[i].radius; + float minDistance = getDistance(uvCoordinates + direction * rayLength); + exponentialDecayDistance = (exponentialDecayDistance + minDistance) / 2.0; + q = min(q, exponentialDecayDistance / rayLength); + lighting += lightColorAtPosition * clamp( q / circleLights[i].radius * (lightCenterDistance + 1.0), 0.0, 1.0 - ) * step(circleLights[i].radius, getDistance( - uvCoordinates + direction * lightCenterDistance - )); + ); break; } float minDistance = getDistance(uvCoordinates + direction * rayLength); exponentialDecayDistance = (exponentialDecayDistance + minDistance) / 2.0; q = min(q, exponentialDecayDistance / rayLength); - rayLength += max(MIN_STEP, minDistance); + rayLength += minDistance; } } #endif @@ -115,7 +114,7 @@ void main() { float minDistance = getDistance(uvCoordinates + direction * rayLength); exponentialDecayDistance = (exponentialDecayDistance + minDistance) / 2.0; q = min(q, exponentialDecayDistance); - rayLength += max(MIN_STEP, minDistance); + rayLength += minDistance; } } #endif diff --git a/frontend/src/scripts/objects/types/character.ts b/frontend/src/scripts/objects/types/character.ts index 256d295..d50ec63 100644 --- a/frontend/src/scripts/objects/types/character.ts +++ b/frontend/src/scripts/objects/types/character.ts @@ -43,15 +43,15 @@ export class Character extends GameObject { const nextPrimitive = this.primitive.clone(); nextPrimitive.center = value; - if ( - this.physics - .findIntersecting(nextPrimitive.boundingBox) - .filter((b) => b.value) - .map( - (b) => b.value.distance(nextPrimitive.center) + nextPrimitive.radius - ) - .find((d) => d < 0) !== undefined - ) { + const intersects = this.physics + .findIntersecting(nextPrimitive.boundingBox) + .filter((b) => b.value) + .map( + (b) => b.value.distance(nextPrimitive.center) + nextPrimitive.radius + ); + + console.log(intersects); + if (intersects.find((d) => d < 0) !== undefined) { this.setPosition(value); } }