search

cdglabs / apparatus

A hybrid graphics editor and programming environment for creating interactive diagrams.
http://aprt.us/
MIT License
1.03k stars 58 forks source link

Color picker in expression editor #4

Open electronicwhisper opened 8 years ago

electronicwhisper commented 8 years ago

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.

dialmove commented 8 years ago

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.

1j01 commented 6 years ago

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)