zink/animated_wallpaper
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Edge-based shadow casting with proper width

Browse Source
This commit is contained in:
Richard Zink committed 2026-10-06 17:33:07 +02:00
1 parent 14ef21d657
commit 9b5f0d7e37
1 file changed
+38 -18
Download Patch File Download Diff File Expand all files Collapse all files
assets/index.html
+38 -18
View File
@@ -170,11 +170,6 @@
var water = isWater(h);
var sunX = wx + TILE;
var sunY = wy - TILE;
var sunH = heightMap[sunX + ',' + sunY] || 0;
var isInShadow = (sunH >= h);
for (var level = 1; level <= h; level++) {
var hRight;
if (level > (heightMap[(wx + TILE) + ',' + wy] || 0)) {
@@ -192,20 +187,45 @@
drawTile(wx, wy, level, true, hRight, hBack, false);
}
if (isInShadow && h > 0) {
var top1 = project(wx + GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
var top2 = project(wx + TILE - GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
var top3 = project(wx + TILE - GAP/2, wy + GAP/2, h * HEIGHT_UNIT);
var top4 = project(wx + GAP/2, wy + GAP/2, h * HEIGHT_UNIT);
if (h > 0) {
var shadowFront = (heightMap[(wx + TILE) + ',' + wy] || 0) - h;
var shadowLeft = (heightMap[wx + ',' + (wy - TILE)] || 0) - h;
ctx.fillStyle = 'rgba(0, 0, 0, 0.35)';
ctx.beginPath();
ctx.moveTo(top1[0], top1[1]);
ctx.lineTo(top2[0], top2[1]);
ctx.lineTo(top3[0], top3[1]);
ctx.lineTo(top4[0], top4[1]);
ctx.closePath();
ctx.fill();
if (shadowFront > 0) {
var shadowWidth = Math.min(shadowFront * 2, TILE);
var t = shadowWidth / TILE;
var top1 = project(wx + GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
var top2 = project(wx + TILE - GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
var topA = project(wx + GAP/2 + (TILE - GAP) * t, wy + TILE - GAP/2, h * HEIGHT_UNIT);
var topB = project(wx + TILE - GAP/2 - (TILE - GAP) * t, wy + TILE - GAP/2, h * HEIGHT_UNIT);
ctx.fillStyle = 'rgba(0, 0, 0, 0.4)';
ctx.beginPath();
ctx.moveTo(top1[0], top1[1]);
ctx.lineTo(topA[0], topA[1]);
ctx.lineTo(topB[0], topB[1]);
ctx.lineTo(top2[0], top2[1]);
ctx.closePath();
ctx.fill();
}
if (shadowLeft > 0) {
var shadowWidth = Math.min(shadowLeft * 2, TILE);
var t = shadowWidth / TILE;
var top4 = project(wx + GAP/2, wy + GAP/2, h * HEIGHT_UNIT);
var top1 = project(wx + GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
var topA = project(wx + GAP/2, wy + GAP/2 + (TILE - GAP) * t, h * HEIGHT_UNIT);
var topB = project(wx + GAP/2, wy + TILE - GAP/2 - (TILE - GAP) * t, h * HEIGHT_UNIT);
ctx.fillStyle = 'rgba(0, 0, 0, 0.4)';
ctx.beginPath();
ctx.moveTo(top4[0], top4[1]);
ctx.lineTo(topA[0], topA[1]);
ctx.lineTo(topB[0], topB[1]);
ctx.lineTo(top1[0], top1[1]);
ctx.closePath();
ctx.fill();
}
}
}
}