SVG/PNG/JPG import

[edemaine]

This would enable e.g. coloring books and grid paper (as a quick-hack alternative to #21).

SVG import should actually be really easy to implement, provided the file fits within one BSON document, which is 16MB so probably all we really need/want. A new type of object svg (at the level of pen), which just renders as is. We'll quickly want the ability to move it, and possibly scale it, via #17.

Once we have SVGs, images (PNG/JPG) would not be much harder -- just need to wrap in <image> tags.

• [ ] SVG import
• [ ] PNG/JPG image import
• [ ] Dragging files onto the canvas (this would be especially convenient for placing it where you want it, instead of having to drag it after import)
• [ ] Pasting from clipboard
• [ ] Quota system (per image, also per board? per user and require auth?) might be needed...
• [ ] Automatic downsizing in resolution and JPEG compression?
• [ ] Only vector importing?

[tomtachi]

It might be even better if I can paste clipboard image, then I don't even need to save a screenshot. I think we often take screenshot and annotate.

[kmcliff]

This would also enable students working on a desktop computer without tablet capabilities to share pictures of their handwritten work. It would be awesome if we could get image sharing soon!

[edemaine]

@kmcliff Coauthor is designed for that kind of image uploading in a group (as are other tools). You might consider using it instead?

Cocreate is really about being able to draw, e.g., to annotate on top of a picture.

[mehtank]

PR #142 allows for pasting PNG/JPG (and text) from the clipboard, which gets rendered as an in the svg. This framework can probably be reused for drag/drop [ which uses the same DataTransfer object ], and with some more logic can probably interpret svgs from the clipboard as well. Scaling [ issue #17 ] will be particularly relevant here. Also, perhaps some way of "locking" objects so they're not selectable / moveable / erasable by default would make the annotation functionality mentioned above more user-friendly.

[edemaine]

For those following this issue, I just implemented and deployed #144 which is a sort of workaround for this; it allows embedding arbitrary images (SVG/PNG/JPG/etc.) from another image host, such as Imgur (PNG/JPG only) or Coauthor or your website or really any website. This lets Cocreate use arbitrary images without taxing the server's disk space, until we figure out a good account/quota system.

[loleg]

I tried this, and it works nicely on Chrome - but on Firefox I am running into CORS restrictions.

[edemaine]

@loleg Could you please open a new issue that is more specific? What image are you trying to embed, and what error do you get on Firefox, in what situations?