If true, the controller value will be updated automatically if target
object is modified.
Carefull: heavy use may reduce performance
group.add('someProperty', target, { listen: true })
If true, the controller will not be editable
Display name of a controller, defaultly equal to property
.
group.add('someProperty', target, { name: 'Custom display name' })
property controlled in the target object
source object in which the property key is defined
Manually update controller value in the form if target
has changed
Delete the controller
Add a controller in the same Group
of current controller
Generated using TypeDoc
ColorController is the controller used to handle all different kind of colors.
It can take a lot of different format (HSL, RGB, HEX) and types (string, object, number)
This controller is build to keep the same input and output formats.
How to use
``` javascript const target = { colorHSL: { h: 1, s: 1, l: 1 }, colorHSLA: { h: 1, s: 1, l: 1, a: 0.4 }, colorHEX: "#FFFFFF", colorHEX2: 0xFFFFFF, colorRGB: {r: 1, g: 244, b: 1}, colorRGBA: {r: 1, g: 244, b: 1, a: 0.5}, colorRGBA: "rgba(255, 244, 122, 0.5)" }
// Method 1 group.add('colorHSL', target, { type: "color" }).on('update', (hslObject) => { console.log(hslObject.h) })
// Method 2 group.color('colorRGBA', target).on('update', (rgbaString) => { myElement.style.color = rgbaString })