Back

Technologies:

javascriptjavascript
htmlhtml
csscss
avatar
Tolerim
3 hours ago

The functionality for undoing and redoing does not operate on canvas.

HelperFunctions is an object that includes event handlers for clear, save image, undo, and redo buttons. The clearButton handler removes the content of the canvas, the saveImageButton handler saves the canvas in JPG format, the undoButton handler extracts and redraws the previous drawing state from an array, and the redoButton handler inserts the last popped drawing state back in the stack and redraws the canvas. Nevertheless, the redo and undo buttons are not functioning correctly. The output of your code will be written to an HTML file on the front end, so make sure to encapsulate all your code within 
 tags.
Answers(1)
avatar
Tolerim
3 hours ago
Verified Answer
The issue with the undo and redo buttons not working may be related to the currentStateIndex variable not being updated correctly. Here are some things you can check:
1. Make sure that the currentStateIndex variable is being incremented/decremented correctly in the saveDrawingState(), undoButton, and redoButton functions. You can add console.log(currentStateIndex) statements to see what its value is at different points in the code.
2. Check that the drawingStates array is being updated correctly when a new drawing state is added. You can also log the length of the array to ensure that it's being updated and not staying at 0.
3. Check that the Canvas API functions, such as get() and image(), are being used correctly. Make sure that the values being passed to them are correct and that they're being called at the right time.
4. Check that the event listeners for the undo and redo buttons are being added correctly in your HTML and that they're targeting the correct buttons.
By systematically checking these areas, you should be able to narrow down the issue and figure out why the undo and redo buttons aren't working correctly.
;