JSFiddle-Like Functionality with Basic FabricJS Canvas
New here? Learn about Bountify and follow @bountify to get notified of new bounties! x

Goal

Add Update, Fork, Share functionality to a simple FabricJS Canvas. Allow users to:

  1. Load the page with a special link; they're free to draw on the canvas, update it (which would update the link), fork it (branched link), and share it
  2. Visiting a shared link would load the canvas and be able editable, forkable, and updateable

I am thinking along the lines of how JSFiddle works. I'm interested in seeing what you come up with! Please let me know if I can answer any questions that will help you produce a solution. Here is a basic JSFiddle with the starter FabricJS and buttons, as an example/reference. I am willing to tip for extended edits and the like. Mostly interested in seeing how this can be accomplished.

Thank you,

sharper

Any preferred backend languages to be used?
kostasx 3 months ago
Hi! Preferably Meteor or just Node — am open to learning!
sharper 3 months ago
awarded to kostasx

Crowdsource coding tasks.

1 Solution

Winning solution

Here is my solution based on a JSON backend server ( http://myjson.com/ ).
I didn't want to setup a Node server just for the example.

https://codepen.io/kostasx/pen/ZRMwKL?editors=0010

1) Draw something
2) Hit Update to save the Canvas
3) Hit Fork and a link is created that redirects to the forked Canvas

You can use any kind of technology for the backend (Node, PHP, python), as long as it features a simple endpoint for GET, POST, UPDATE for JSON files, just like the MyJSON service does.

This is so cool! Thank you for the quick solution. I appreciate it. I'm going to play with this! Mind if I post back if I have questions (for tips of course)? Excited to mess with this.
sharper 3 months ago
Sure. Thanks for the tip. You can change the server variable to point to your server and of course the URL variable to point to the domain that hosts the front end.
kostasx 3 months ago