react-juce icon indicating copy to clipboard operation
react-juce copied to clipboard

Implement remaining Canvas API

Open JoshMarler opened this issue 5 years ago • 2 comments

@nick-thompson, I've started adding more Canvas API functions so figured it makes sense to open an issue here or pop something on the project board to track against? If you're happy with it being here I can assign to myself if you like?

Issue scope is to continue the work started here: https://github.com/nick-thompson/blueprint/commit/97ebe8cbe440bc384b10b08e8ab46273645ff2b7

I guess the aim is to implement bindings for as much of the CanvasRenderingContext2D API as possible: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D

A good approach is probably to take a section of the API at a time. i.e. "Drawing Rectangles" and "Paths" in the above link.

@nick-thompson, it strikes me that a CanvasCtx object would be a really nice thing to have a typescript definition/interface for. This could really help bullet proof client code. I'd be up for investigating typescript definitions, I intend to try and move my stuff over to TS at some point.

JoshMarler avatar May 22 '20 09:05 JoshMarler

PR for some of this work started here: https://github.com/nick-thompson/blueprint/pull/49

JoshMarler avatar May 22 '20 11:05 JoshMarler

The following is a checklist for CanvasRenderingContext2D API calls which we have deemed must haves for the beta release.

Once everything here is ticked off we can close this and probably open up a new Extended Canvas API ticker or similar:

  • [ ] arc()

  • [ ] arcTo()

  • [x] beginPath()

  • [ ] bezierCurveTo()

  • [x] clearRect()

  • [x] closePath()

  • [ ] createLinearGradient()

  • [ ] createRadialGradient()

  • [ ] drawImage()

  • [ ] ellipse()

  • [x] fill()

  • [x] fillRect()

  • [x] fillText()

  • [ ] getTransform()

  • [x] lineTo()

  • [x] moveTo()

  • [x] quadraticCurveTo()

  • [ ] rect()

  • [x] resetTransform()

  • [x] rotate()

  • [ ] scale()

  • [x] setTransform()

  • [x] stroke()

  • [x] strokeRect()

  • [x] strokeText()

  • [ ] transform()

  • [x] translate()

These should all follow the specs/API of the same functions listed at https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D

JoshMarler avatar Oct 21 '20 15:10 JoshMarler