Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bravedigger -- Crazy Death Spiral #4

Open
Jantho1990 opened this issue Aug 14, 2018 · 2 comments
Open

Bravedigger -- Crazy Death Spiral #4

Jantho1990 opened this issue Aug 14, 2018 · 2 comments

Comments

@Jantho1990
Copy link

Jantho1990 commented Aug 14, 2018

(This is not an issue with the tutorial code, but an issue in my code that's been stumping me. If this is not the appropriate place to ask these sort of questions, let me know.)

I've built out the Chapter 5 Bravedigger code, and everything seems to be working perfectly, save for a really strange issue. If, at any point during the game, the player character moves left, then upon death the death spiral animation. The below pictures should hopefully communicate what I mean.

g1
g2
g3

As best as I can tell, I've copied the tutorial code almost verbatim for the player logic (and the parts that aren't exact are just personal style differences which don't affect the death spiral). I've also played with the final result posted on the examples site, and that version doesn't suffer the same problem.

Part of the problem is I'm not entirely sure what the problem is. I've already checked my rotation render method, and it seems to work just fine. The pivot [x,y] coordinates don't seem to be modified before render. I've tried searching for general issues with rotation offsets, but so far haven't found anything that helps.

Again, if this isn't the right place for issues like these, I apologize. I'm just going crazy because I can't figure out what my code is doing differently from the tutorial code to cause this bug.

EDIT: I said "right" when I meant "left". Also, took out some code that tried to fix the bug, but failed.

import pop from '../../pop/'
const { Texture, TileSprite, wallslide } = pop

const texture = new Texture('res/img/bravedigger-tiles.png')

class Player extends TileSprite {
  constructor(controls, map) {
    super(texture, 48, 48)
    this.controls = controls
    this.map = map
    this.hitBox = {
      x: 8,
      y: 10,
      w: 28,
      h: 38
    }
    this.speed = 210
    this.anchor = { x: 0, y: 0 }
    this.frame.x = 4
  }

  update(dt, t) {
    const { pos, controls, map, speed, gameOver } = this

    if (gameOver) {
      // TODO: Figure out why moving left prior to death causes this spiral to be exaggerated
      this.pivot.y = 24
      this.pivot.x = 24
      this.rotation += dt * 5
      return
    }

    let { x, y } = controls
    const xo = x * dt * speed
    const yo = y * dt * speed
    const r = wallslide(this, map, xo, yo)
    if (r.x !== 0 && r.y !== 0) {
      r.x /= Math.sqrt(2)
      r.y /= Math.sqrt(2)
    }
    pos.x += r.x
    pos.y += r.y

    // Animate
    if (r.x || r.y) {
      // Walking frames
      this.frame.x = ((t / 0.08) | 0) % 4
      // Walking left or right?
      if (r.x < 0) {
        this.scale.x = -1
        this.anchor.x = 48
      }
      if (r.x > 0) {
        this.scale.x = 1
        this.anchor.x = 0
      }
    } else {
      // Standing still
      this.frame.x = ((t / 0.2) | 0) % 2 + 4
    }
  }
}

export default Player
@simonmackie
Copy link

Paging @mrspeaker :)

@Jantho1990
Copy link
Author

So, through trial and error, I found a "fix" for my current code by multiplying the rotation and the x pivot point by the scale of x, essentially inverting the x axis. This still doesn't explain why my code was behaving improperly in the first place, though. :/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants