This tutorial explains how to flip a player sprite to look in each direction when walking left or right (in WoofJS), as shown below. To achieve this, we just change the player costume by specifying a different URL (link) for the image.
Create a project at woofjs.com and add the following code. Pay attention to the comments in the code that explain how it works.
// Set the backdrop image setBackdropURL('https://www.codemahal.com/sprites/blue_background.png') // Make a variable for player movement speed var speed = 3 // Add the left-facing player image var player = new Image({ url: 'https://codemahal.com/sprites/player_left.gif', height: 50, width: 40, x: 0, y: 0, }) forever(() => { // If left arrow key is pressed... if(keysDown.includes('LEFT')){ // Set player image to left-facing player.setImageURL('https://codemahal.com/sprites/player_left.gif') // Move the player player.x -= speed } if(keysDown.includes('RIGHT')){ // Set player image to right-facing player.setImageURL('https://codemahal.com/sprites/player_right.gif') // Move the player player.x += speed } })