Canvas for \~Urbit

Video Demo

Features

• Each stroke is stored automatically on your Urbit.
• Export Canvas Images as SVG.
  • Image files are stored on S3 Storage, if configured.
• Allows creation of Public/Private Canvas.
  • Others can join a Public Canvas and work collaboratively in a cool art project.

Access

Search for ~dister-norsyr-torryn in Grid to find the Canvas app, and install it from there

A public canvas is hosted at

~picsel-norsyr-torryn/public

Come and join the group to share your creations and see what others are doing:

~norsyr-torryn/canvas

Development Setup

1. Clone the repo, of course
2. Create a new desk in Urbit to install canvas in
   • $ ./urbit -F zod - Spin up a fake zod, if you haven't already (should be running on port 8080. If not, you'll need to edit ui/svelte.config.js)
   • dojo> +code - Get an access code and use it to sign in to your ship at http://localhost:8080
   • dojo> |mount %base - Mount %base, if you haven't already
   • dojo> |merge %canvas our %base - Create a %canvas desk
   • dojo> |mount %canvas - Mount the desk so it appears in your pier
   • $ rm -r zod/canvas/* - Clear out your new desk to make room for the actual desk
   • Follow the instructions here to merge the base-dev and garden-dev desks into your desk
3. Copy canvas desk to Urbit From the repo folder, run ./install.sh <PATH_TO_THE_MOUNTED_DESK> where <PATH_TO_THE_MOUNTED_DESK> might be something like ~/urbit/zod/canvas You can alse run ./install.sh -w <PATH_TO_THE_MOUNTED_DESK> if you want to watch for changes.
4. Install %canvas in Dojo with
   • dojo> |commit %canvas (do this after every change to see it reflected in Urbit)
   • dojo> |install our %canvas(only necessary the first time, I think)
5. Serve the UI for development In the repo folder:
   • cd ui
   • npm i (short for npm install)
   • npm run dev (runs on port 3000. To run on a different port: npm run dev -- --port 3001)
   • Visit http://localhost:3000/apps/canvas
6. Eventually, build the UI to test in Urbit for real test
   • npm run build (in /ui)
   • ./install.sh <PATH_TO_THE_MOUNTED_DESK> (in project root)
   • |commit %canvas (in dojo)

     Templates

TODO