Add QR code display modal. Addresses #80

edemaine / cocreate

Cocreate Shared Whiteboard/Drawing

MIT License

209 stars 27 forks source link

Add QR code display modal. Addresses #80 #110

Closed duetosymmetry closed 3 years ago

duetosymmetry commented 3 years ago

Adds a button in the vertical toolbar to toggle a modal which shares the QR code for the current room.

Changes to enable this:

Add a dom.classToggle function
Add svg icon for a QR code, from fontawesome
Add dependence on the node package qrious, which renders to canvas
Add a modal.info style with a lightgray background for showing the QR code
Add the modal element to client/main.pug, and driving code to client/main.coffee

edemaine commented 3 years ago

Thanks for all the PRs, @duetosymmetry! I'm looking forward to reviewing these.

duetosymmetry commented 3 years ago

Fixed the URL that was being emitted if user navigated to path / instead of directly to a room. Also added documentation.

edemaine commented 3 years ago

Finally getting to this, I revised this to use SVG QR codes (felt more Cocreate-like, and easier to make responsive), styled better, close button, etc. I also merged the "copy to clipboard" button with the QR button; I didn't like the QR icon, and it didn't seem like we needed multiple buttons for this purpose. Hope you like it, and sorry for the long delay!

duetosymmetry commented 3 years ago

LGTM, thanks for the improvements!