Forums » Help » Setting up snake clone in impact?

Hey everyone!

My first post so go easy on me! I've just got hold of impact and I'm really enjoying it. I thought an appropriate project would be snake but I'm struggling to set things up elegantly.

I followed this guide and it was super helpful for setting up a basic demo

http://impactjs.com/forums/code/top-down-rpg-style-tile-based-grid-movement

I now have a sort of grid based movement which is what I was going for but it's really jolty, because of the way I've used the grid code.

            if (ig.input.state('left'))
                    this.moveIntention = 1;
                else if (ig.input.state('right'))
                    this.moveIntention = 3;
                else if (ig.input.state('up'))
                    this.moveIntention = 2;
                else if (ig.input.state('down'))
                    this.moveIntention = 4;
            
            
            if (this.moveIntention==1)
                    this.movement.direction = GridMovement.moveType.LEFT;
                else if (this.moveIntention==3)
                    this.movement.direction = GridMovement.moveType.RIGHT;
                else if (this.moveIntention==2)
                    this.movement.direction = GridMovement.moveType.UP;
                else if (this.moveIntention==4)
                    this.movement.direction = GridMovement.moveType.DOWN;

Not elegant I know, but it allowed for the continued movement that I wanted from my snake clone.

I figured that progressing with this plugin isn't really going to be ideal as movement with the way I've set it up is jolty. There's probably a much easier way that I'm not seeing... Could anyway point me in the way of a more elegant solution?

I imagine I'll have to setup a grid which isn't impossible, it's just getting the snake to snap to that grid and then all of its extra pieces as well.

A version of this build is playable here (http://atomichael.com/snake/)

This entire block:

if (ig.input.state('left'))
this.moveIntention = 1;
else if (ig.input.state('right'))
this.moveIntention = 3;
else if (ig.input.state('up'))
this.moveIntention = 2;
else if (ig.input.state('down'))
this.moveIntention = 4;

if (this.moveIntention==1)
this.movement.direction = GridMovement.moveType.LEFT;
else if (this.moveIntention==3)
this.movement.direction = GridMovement.moveType.RIGHT;
else if (this.moveIntention==2)
this.movement.direction = GridMovement.moveType.UP;
else if (this.moveIntention==4)
this.movement.direction = GridMovement.moveType.DOWN;

... can be condensed into this:

if (ig.input.state('left'))
this.moveIntention = GridMovement.moveType.LEFT;
else if (ig.input.state('right'))
this.moveIntention = GridMovement.moveType.RIGHT;
else if (ig.input.state('up'))
this.moveIntention = GridMovement.moveType.UP;
else if (ig.input.state('down'))
this.moveIntention = GridMovement.moveType.DOWN;

You&039;ve just removed a duplicate "direction" variable. Just use #this.moveIntention where you were using this.movement.direction before. And make sure you never set this.moveIntention to null because that would allow the Snake to stop moving.

Without the second if statement there's nothing to actually move the snake though... moveIntention is just a variable. Wouldn't I still need something to interpret moveIntention and actually move the snake?? Which is what 'this.movement.direction' was doing?

Quote from kidshenlong
Without the second if statement there's nothing to actually move the snake though... moveIntention is just a variable. Wouldn't I still need something to interpret moveIntention and actually move the snake?? Which is what 'this.movement.direction' was doing?

You are correct. My bad.

This won't do exactly what you're after, but it should point you in the right direction. Basically, what you do is you record the Input for the current frame and the lastFrame, if there is a difference, update the direction. Otherwise, if the entity stops moving (Meaning it reached the destination) set the new direction using the last input:

_lastInput: null,
_currentInput: null,

//init
                this.movement = new GridMovement(this);
                this._currentInput = GridMovement.moveType.DOWN; // This sets the starting input to 'DOWN'

// Update
                // Input
                if (ig.input.state('left')){
                    this._currentInput = GridMovement.moveType.LEFT;}
                else if (ig.input.state('right')){
                    this._currentInput = GridMovement.moveType.RIGHT;}
                else if (ig.input.state('up')){
                    this._currentInput = GridMovement.moveType.UP;}
                else if (ig.input.state('down')){
                    this._currentInput = GridMovement.moveType.DOWN;}

                // Auto movement
                this.setMovement();
// Sync lastInput to current input
                this._lastInput = this._currentInput;

// Set movement function:
            setMovement: function(){
                // If current input and last input differ, update the move direction
                if (this._lastInput != this._currentInput){
                    this.movement.destination = this.movement.getTileAdjacentToTile(this.movement.getCurrentTile().x, this.movement.getCurrentTile().y, this._currentInput);
                    this.movement.direction = this._currentInput;
                    this._lastInput = this._currentInput;
// The entity has stopped moving (Meaning it reached the destination
// So we send it a new destination by passing along the lastInput
                } else if (!this.movement.isMoving()){
                    this.movement.startMoving(this._lastInput);
                }
            }

Thanks for the suggestion lTyl, I'll try and put it into action now.

just as a side note, there's some screen tearing (just on the canvas) and jagged shaky movement from the snake. Does anyone know why this is? I'm apprehensive to move forward until this is fixed as I'd hate to have to redo all my code because it's to do with the movement!

Quote from kidshenlong
there's some screen tearing (just on the canvas) and jagged shaky movement from the snake. Does anyone know why this is? I'm apprehensive to move forward until this is fixed as I'd hate to have to redo all my code because it's to do with the movement!

There is a good chance that it is being caused by the movement code. I noticed the same thing happening in my game, and I've fixed it for the most part, but there is still a little jitter I'm trying to work out...