corresponding issue: #218

@TrueDoctor I'm not sure if this is what you imagined here so I created this PR in a bit of an unfinished state to ask for some feedback. Since the copy buffer is in the editor I think I need to send Layers wrapped as operations and since operations are serializable I needed to make Layers serializable too. And in turn I needed to enable to serde feature of kurbo. I’m not sure if this is desired.

Also I think there is a problem with the keybindings: I had to add the control-V shortcut to the beginning of the mapping! because otherwise the SelectTool(ToolType::Select) message bound to V did take precendence.

Furthermore the way I select the active layers in CopySelectedLayers (which I think is the same way we do it in DuplicateSelectedLayers and DeleteSelectedLayers) is flawed as it appears to also take into account some sort of temporary layers. This is why I added the warn log in process_action for CopySelectedLayers. To reproduce: create a rect and then press control-C which correctly copies the rect and logs a debug message to the console. Now just click the canvas with the rect tool which will not create a new layer and then press control-C. You’ll now see the warning message in the console indicating that layer_data contained a selected layer which does not actually exist in the real document layers.

This change is 

Closes #317

• [x] Add new handler
• [x] Add (neat) bindings to input mapper
• [x] Handle translation mouse movement
• [x] Handle rotation mouse movement
• [x] Handle scale mouse movement
• [x] Handle constrain to axis
• [x] Handle number typing
• [x] Handle shift to slow mouse movements
• [x] Handle ctrl to snap rotation and scale
• [x] Fix 0 scale breaking things
• [x] Fix deselecting layers sometimes causing panic (trouble reproducing)

This change is 

They might block the thing you actually wanted to interact with.

https://user-images.githubusercontent.com/17426603/164512624-f5af3b76-9995-4767-a799-0dbd7897e221.mp4

Closes #200

• [ ] Display lines (probably wait for overlay system?)
• [x] Don't search for every layer each mouse move
• [x] Snap new shapes while they're being created
• [x] Hook up the snap (🧲) icon to entirely enable/disable snapping behavior (on by default)

This change is 

As discussed, I will eventually need two editor instances side-by-side, so we cannot have global state.

This PR is the beginning of that work. Some global state has been reduced or eliminated, but there's still plenty of work to be done.

I will add further commits as I keep working on it, chipping away at the global state one piece at a time. You can merge anytime you like.

My current plan is as follows:

• Step 1: remove global state from the vue app. utilities/{dialog/documents,fullscreen}.ts still contain a lot of them, and I'll need to wrap my head around the response handler logic. On that topic, I'd like to move the stateful code from utilities/ to state/ or somewhere, if that's ok with you?
• Step 2: remove global state from the wasm.

This change is 

Currently ToolMessage::SwapColors and ToolMessage::ResetColors don't inform the frontend of their changes.

Todo:

• Add a FrontendMessage::UpdateWorkingColors(primary, secondary)
• emit that message in the tool_message_handler.rs
• add the message type to client/web/src/response-handlers.ts
• register a listener for the message in Document.vue
• modify the working colors accordingly

Test cases:

• use the keyboard shortcut X to check the colors have been swapped
• click the swap and reset buttons below your color picker swatches

Comeplexity: 1 Involves: Editor (Rust), Frontend (Javascript)

This PR ensures that adding and resizing artboards will not result in zero width or zero height.

Regarding adding borders to all artboards when the artboard tool is selected, I believe a separate PR is more suitable. When this PR is merged, a new issue should be created.

This is my first time writing Rust, any feedback is welcome!

Closes #704.

The first click in the empty area of the Layer Tree deselects the layers but the Properties panel doesn't go blank. It takes a second click in the same place to make it go blank.

https://user-images.githubusercontent.com/17426603/164511902-de672dbd-bcdf-4a4f-b0cb-3353569c54b6.mp4

Closes #504 Closes #529 Closes #508

• [x] Fetch fonts and put them into dropdown in the properties panel
• [x] TextArea to add to text properties
• [x] Download selected font and render.

Closes #430

The layer entry cache in the frontend was not populated when the document was opened because UpdateLayer was never called. This MR just creates the layerdata for all of the layers and then calls UpdateLayer on them.

For some reason, Github closed this issue while rebasing to get rid of the commit from my other PR. This is not related to an active issue, but I saw an opportunity to try and improve the codebase. This PR is not done and needs to be cleaned up a little. Is this change something that is worth pursuing further? The advantage of this pattern is that it makes the subscribing to responses more explicit as well as cuts down on repeated code.

Closes #399 Workaround for #396

This change is 

• [x] Allow naming artboards. The name should likely be shown above the artboard. (#538)
• [ ] Always draw border overlays around all artboards
• [ ] Default to one artboard always being selected (for discoverability, to avoid confusion about how you resize an artboard without any obvious handles shown). The user shouldn't be able to deselect all artboards to have 0 selected. For now, the artboard with index 0 can be the default, and the tool saves which artboard was most recently selected (even if the tool has been switched away from, and then back to), but default to index 0 if that tool information isn't valid or available anymore.

Right now, you can drag the little blut pivot dot around. But a lot of users complain that they expect this is actually the drag target for the entire layer, and they get confused why the dot is moving without the layer. So we should make the pivot draggable only when holding Alt. Therefore anywhere on the interior of the layer, including the pivot when not holding the modifier, just drags the layer around.

But discoverability is crucial, so we need to display a hint for the user that this is the pivot and it must be dragged while holding Alt. I mocked this up, shown at 100% and 400%:

Specs:

• Font size 12px weight 600/semibold
• Container 16px tall, white background (14px tall), 1px inset outline, 4px rounded corners, 4px above/below/left/right of the text to the top and bottom of the container (3px to the blue outline)
• Tooltip box positioned relative to the pivot dot by aligning the container's top edge with the dot's bottom edge, and the container's left edge 8px from the dot's right edge
• It should appear on hover, but disappear when the user is dragging (the layer or the pivot, i.e. with or without Alt)

One option is to display this with the overlays system. Text would be new though. The other option is that we just put in the time to implement custom tooltips for our entire UI and add support for a zero-delay option and for positioning tooltips over the viewport based on the positions of artwork. I suggest taking the easiest route for now, since this is just necessary to fix a UX problem, ideally before the public announcement.

Builder pattern for widgets e.g.

DropdownEntryData::new()
	.label(mode.to_string())
	.on_update(update_value(move |_| TaggedValue::ImaginateMaskStartingFill(mode), node_id, mask_fill_index)),

This was disabled when we switched away from the Kurbo vector data format. We might want to make this an explicit user action with a button in the Text area of the Properties panel, since we actually have a Properties panel now. Previously it was an implicit (and potentially accidentally triggered) action by dragging points with the Path tool. Perhaps it can be a button at the bottom called "Convert to Shape Layer". (Eventually this will be a non-destructive node-based workflow, but destructive will do for now.)

Similar to arrow keys (and the Shift modifier) to nudge the position of selected layer(s), this feature should "nudge" (by resizing) the right and bottom sides of the selected layer(s). Left and right arrows resize the layer(s) by 1px on the right edge. Up and down arrows resize the layer(s) by 1px on the bottom edge. The Shift makes it 10px. This should happen in layer space, not viewport space, so regardless of viewport zoom the user should expect to see the dimensions in the Properties panel change by 1px or 10px in W or H. If the layer is rotated, it should scale along the axis of the layer, so the X and Y would change as expected but the W and H would not necessarily change by 1px/10px. Assuming it doesn't conflict with any other keys, Ctrl would be nice as a modifier that changes it to the Left/Top instead of Bottom/Right.