tui.image-editor feat: Canvas data serialization

Save ImageEditor's state to JSON format
- object
  - backgroundImage
  - drawings
  - texts
  - shapes
  - icons
- filter
- undo/redo stack

issue-ref: #244

Jan 10 '20 07:01 junghwan-park

Hi @junghwan-park,

My next big use case for fabric and the tui-editor requires a feature like this. I am curious if you have stared work on this feature at all? I am happy to work together with you on this and contribute to the project.

For a little context on my use case and for an example of my work, I am currently using your component for my open source math site, it allows teachers to give feedback on images of student work.

https://freemathapp.org/

The next feature I would like to add is a drawing/graphing component built on fabric and the tui-editor to allow students to submit math drawings they create digitally in the site, rather than relying on images attached from elsewhere or captured from their webcam. For this feature though I want the documents to be further editable, so I don't want to ship the feature where it would just flatten the student work down to a jpeg or PNG.

Dec 22 '20 04:12 jaltekruse

@junghwan-park I have been working on this, and it appears that using the native fabric JS JSON serialization works for most of the types of shapes/objects in the editor. There is an issue reading back in objects that override the "type" property of a fabric object. So the use of a special 'circle' type instead of just leaving it as an ellipse did cause an issue, but removing that customization allowed most things to work.

Would you consider removing this customization and just letting it stay as an ellipse?

Is there important state in the image editor that isn't covered by a toJSON on the fabric canvas?

Dec 31 '20 05:12 jaltekruse

For replay it is doable by taking .tojson snapshots along with respective timestamps, and then replaying them (based on timestamp, by loading respective loadFromJSON )

Mar 25 '21 12:03 no-1ne

Currently is there an API on how do we get the fabric instance so that we can get the tojson data?

Mar 25 '21 13:03 no-1ne

@jaltekruse Excuse me for not having answered your letter sooner. You can take advantage of fabric canvas' toJson, but you should also consider serializing data on the undo/redo stack.

@startupgurukul Currently, APIs to get fabric instance are not supported.