Full Eyedropper Tool implementation based on pixel sampling

[Keavon]

Clicking somewhere samples the color of the pixel under the cursor and sets the primary working color to that. Left click to sample for the primary color, right click to sample for the secondary color.

Since it isn't possible to sample colors from a web page using JavaScript, the simplest approach for this is to probably use the browser's collision detection for the SVG shapes to determine which SVG element is being clicked on, then take either its fill or stroke color. However this approach breaks down for shapes with both a fill and a stroke, and shapes with a gradient or non-solid color. Further investigation is required for solutions that support those edge cases, but one possibility would be switching from rendering via the SVG element to rendering with a 2D canvas using the Path2D API for drawing SVG syntax to the canvas. Canvases can have their color sampled from.

A simpler MVP solution is to just check the color or stroke property of the shape clicked in the viewport, similar to #178. That MVP is filed under #303 and was merged in #300.

[azeemba]

What do we think about using something like Canvg to parse the SVG and generate the Canvas rendering? Without this, we are still going to have to parse the svg manually since we need to identify svg elements that are not "Paths" and use the appropriate rendering element for them.

[Keavon]

That's a possibility, although it must be something with zero transient dependencies. Canvg looks to be quite the offender in terms of its transient dependencies. We can very possibly just roll our own with the Path2D API.

[Keavon]

A reasonable medium-term replacement is #545.