Image editor project: Is maintaining a custom image editor worth it?

Features
1

Summary

This pull request implements a custom image editor for the mobile app. It supports pen/touch drawing, touchpad gestures, and has an extremely large zoom range.

Features supported by the current implementation

  1. An extremely large zoom range
  2. Primarily designed for touch/pen input but also able to work well with mouse/keyboard input
  3. Ability to rotate the screen while zooming
  4. A GUI that fits nicely on a phone/tablet screen as well as on a desktop
    • This includes touchscreen and touchpad gestures, and keyboard navigation.
  5. Saves as vector images (ability to edit images after saving)
  6. Stroke smoothing

While the current implementation of the image editor does this, it's a large amount of additional code to maintain.

Topics to discuss

  • Is maintaining this app worth it? If not, what other image editing libraries exist that provide comparable functionality?
  • If the Joplin team does not maintain the new image editor, I'm willing to try maintaining it myself. Should I consider doing this? Is there another currently-maintained library that we can use instead?

Edit: For now, the image editor is being distributed as a plugin for the desktop app. It may be added to the mobile app as an opt-in beta feature after additional testing/stabilization.

3 Likes
2

The one that was considered at some point, for pen support, was this one:

http://fabricjs.com/freedrawing

The idea would have been to embed it in a webview, although I don't know how well mobile is supported.

3

The one that was considered 1 at some point, for pen support, was this one:

Free drawing | Fabric.js Demos

It doesn't seem to support multi-touch gestures (zooming/panning)... (We could perhaps try adding these features)

4

Yes maybe we could update this Fabric.js lib

That would be great, but even if you maintain it we won't have the benefits of an established library. An extreme example is React Native - we know we can rely on it because there are thousands of companies using it so even if Facebook stops developing it, Microsoft or some other big company will take over. With a small lib maintained by one person, we don't have these guarantees which are very important for us.

I mean it might depend on your personal interest. Perhaps there's a potential to create a new generic JS image editor, with better mobile support for example. Then if you release this and a lot of people get interested and start using it, we get some of those guarantees I mentioned since there will be more contributors, etc.

But I don't know if that something we want for GSoC at this point?

1 Like
5

I've looked at Fabric.js further — it's lower level than I thought it was. I think I can continue to use the panning/zooming/stroke smoothing code already written for the custom editor, while using FabricJS for SVG import/export and object manipulation. I'll have to look into this further. For now, I'm closing Mobile: Add image editor by personalizedrefrigerator · Pull Request #6739 · laurent22/joplin · GitHub.

6

I've given up on integrating FabricJS for now. While FabricJS would make it easier to add additional features, I think it would require roughly the same amount of custom code for the current functionality.

I've published the editor on NPM, however!

Because GSoC is nearing its end, I think the best course of action is to:

  1. Create a plugin that connects the desktop app to js-draw.
  2. Create another pull request that connects js-draw to the mobile editor.
  • For now, js-draw can be marked as a "beta" feature and be opt-in. A note can direct users to report issues/give feedback on GitHub.
4 Likes
7

Thanks for looking into it. I think your proposal is a good compromise

8

Come on, I believe this is needed, for example, I am looking forward to the beta version.