Fix sprite directions — swap Up and Left frame offsets to match actual sheet layout

This commit is contained in:
Justin Oros
2026-05-14 13:51:56 -07:00
parent 478944b8b6
commit b0768841f1
2 changed files with 3 additions and 3 deletions
+1 -1
View File
@@ -348,7 +348,7 @@ class Game {
p.className = 'map-player idle'; p.className = 'map-player idle';
/* Show the idle/middle frame for the last direction walked /* Show the idle/middle frame for the last direction walked
Frames at 2× scale (32px each): down=32, up=128, left=224, right=320 */ Frames at 2× scale (32px each): down=32, up=128, left=224, right=320 */
const idleFrames = { down:'-32px', up:'-128px', left:'-224px', right:'-320px' }; const idleFrames = { down:'-32px', left:'-128px', up:'-224px', right:'-320px' };
p.style.backgroundPositionX = idleFrames[this.state.lastDir] || '-32px'; p.style.backgroundPositionX = idleFrames[this.state.lastDir] || '-32px';
} }
} }
+2 -2
View File
@@ -103,8 +103,8 @@ html, body {
/* Sprite walk — player.png 384x32px, 24 frames at 16x32px each /* Sprite walk — player.png 384x32px, 24 frames at 16x32px each
Layout: 0-2=down 3-5=up 6-8=left 9-11=right */ Layout: 0-2=down 3-5=up 6-8=left 9-11=right */
@keyframes walkDown { from{background-position-x: 0px} to{background-position-x: -96px} } @keyframes walkDown { from{background-position-x: 0px} to{background-position-x: -96px} }
@keyframes walkUp { from{background-position-x: -96px} to{background-position-x: -192px} } @keyframes walkLeft { from{background-position-x: -96px} to{background-position-x: -192px} }
@keyframes walkLeft { from{background-position-x:-192px} to{background-position-x: -288px} } @keyframes walkUp { from{background-position-x:-192px} to{background-position-x: -288px} }
@keyframes walkRight { from{background-position-x:-288px} to{background-position-x: -384px} } @keyframes walkRight { from{background-position-x:-288px} to{background-position-x: -384px} }
@keyframes dpadPress { 0%{transform:scale(1)}50%{transform:scale(.88)}100%{transform:scale(1)} } @keyframes dpadPress { 0%{transform:scale(1)}50%{transform:scale(.88)}100%{transform:scale(1)} }
@keyframes abPress { 0%{transform:scale(1)}40%{transform:scale(.82)}100%{transform:scale(1)} } @keyframes abPress { 0%{transform:scale(1)}40%{transform:scale(.82)}100%{transform:scale(1)} }