color-picker

Color picker with predefined colors.

Installation

Install with component(1):

$ component install lepture/color-picker

Install with spm:

$ spm install lepture/color-picker

Example

var ColorPicker = require('color-picker');

var picker = new ColorPicker();

picker.on('change', function(color) {
    console.log(color);
});
document.body.appendChild(picker.element);

API

All methods are refered to the instance of ColorPicker:

var picker = new ColorPicker();

It accepts parameters:

• colors for choosing: new ColorPicker(['#ffcc00', '#ddccdd'])
• default color: new ColorPicker('#000000')
• change both: new ColorPicker(['#ffcc00', '#ddccdd'], '#000000')

.element

Property element of the color picker.

.choose(color)

Choose a color, this is used by ColorPicker itself.

.change(color)

Change a color, this is used by ColorPicker itself.

.value(color)

Get or set the value.

var color = picker.value();
picker.value('#ff33cc')

.takeover(input)

Hide the input, and take position of it.

var input = document.querySelector('input.profile-color');
picker.takeover(input);

Event

Color picker only emit a change event.

picker.on('change', function(color) {
});

License

MIT