cdglabs / apparatus

A hybrid graphics editor and programming environment for creating interactive diagrams.

Home Page:http://aprt.us/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Color picker in expression editor

electronicwhisper opened this issue · comments

The same way you can scrub numbers, you should be able to scrub colors with a color picker.

Here is a mockup of what I'm thinking,

image

Any text of the form "rgba(#, #, #, #)" would get a mark to its left showing the color. When you click the color swatch the color picker pops up and you can change the color live.

The place in the code to do this is here,
https://github.com/cdglabs/apparatus/blob/master/src/View/ExpressionCode.coffee#L154

A nice looking color picker to use might be this one as it is already React-ready.

One of the demos is a proof-of-concept yet functional color picker. It would be great if the value could be set using a component built on Apparatus itself, instead of having to plug in something new at the low level React code. This way end users could tweak the user interface without having to leave the environment, a la Smalltalk.

Though, I suppose, allowing Apparatus components to provide values for variables would require some kind of type system.

I made an improved version of the color picker, altho I'm in favor of react-color as the more practical option (for starters at least)