AX6UIPalette.md

AX6UIPalette

Kind: global class

• AX6UIPalette
  • new AX6UIPalette(config)
  • .config : JSON
  • .$target : Object
  • .xvar : Object
  • .colors : Array
  • .init(config)
  • .initOnce()
  • .repaint() ⇒ AX6UIPalette
  • .setSelectedColor(selectedColor) ⇒ AX6UIPalette

new AX6UIPalette(config)

Param	Type	Default
config
[config.theme]
config.target
[config.animateTime]
[config.selectedColor]	String
[config.colors]	Object
[config.colors.preview]	Object
[config.colors.preview.width]	Number	24
[config.colors.preview.height]	Number	24
[config.colors.preview.cellWidth]	Number	30
[config.colors.label]	Object
[config.colors.label.width]	Number	80
[config.colors.slider]	Object
[config.colors.slider.trackHeight]	Number	8
[config.colors.slider.amount]	Number	32
[config.colors.slider.handleWidth]	Number	18
[config.colors.slider.handleHeight]	Number	18
[config.colors.list]	Array.<Object>	[red,orange,yellow,green,blue,purple,black,white]
config.colors.list[].label	String
config.colors.list[].value	String
[config.controls]	Object
[config.controls.height]	Number	0
[config.onStateChanged]
[config.onClick]
[config.onUpdateColor]

Example

myPalette = new Palette({
 target: $('[data-ax5palette="01"]'),
 onClick: function (hexColor) {
     alert(hexColor);
 }
});

myPalette = new Palette({
 target: $('[data-ax5palette="01"]'),
 colors: {
     list: [
         {label: "red", value: "#ff0000"},
         {label: "orange", value: "#ff9802"},
         {label: "yellow", value: "#ffff00"},
         {label: "skyblue", value: "#84e4ff"},
         {label: "white", value: "#ffffff"}
     ]
 }
 onClick: function (hexColor) {

 }
});

aX6UIPalette.config : JSON

Kind: instance property of AX6UIPalette

Param	Default
config
config.target
[config.theme]	default
[config.clickEventName]	"click"
[config.animateTime]	100
[config.colors]
[config.colors.preview]
[config.colors.preview.width]	24
[config.colors.preview,height]	24
[config.colors.preview.cellWidth]	30
[config.colors.label]
[config.colors.label.width]	80
[config.colors.slider]
[config.colors.slider.trackHeight]	8
[config.colors.slider.amount]	32
[config.colors.slider.handleWidth]	18
[config.colors.slider.handleHeight]	18
[config.colors.list]
[config.colors.list[].label]
[config.colors.list[].value]
[config.controls]
[config.controls.height]	0
[config.columnKeys=]
[config.onStateChanged]
[config.onClick]

aX6UIPalette.$target : Object

Kind: instance property of AX6UIPalette

aX6UIPalette.xvar : Object

Kind: instance property of AX6UIPalette

aX6UIPalette.colors : Array

Kind: instance property of AX6UIPalette

aX6UIPalette.init(config)

Kind: instance method of AX6UIPalette

Param	Type	Default
config
[config.theme]
config.target
[config.animateTime]
[config.selectedColor]	String
[config.colors]	Object
[config.colors.preview]	Object
[config.colors.preview.width]	Number	24
[config.colors.preview.height]	Number	24
[config.colors.preview.cellWidth]	Number	30
[config.colors.label]	Object
[config.colors.label.width]	Number	80
[config.colors.slider]	Object
[config.colors.slider.trackHeight]	Number	8
[config.colors.slider.amount]	Number	32
[config.colors.slider.handleWidth]	Number	18
[config.colors.slider.handleHeight]	Number	18
[config.colors.list]	Array.<Object>	[red,orange,yellow,green,blue,purple,black,white]
config.colors.list[].label	String
config.colors.list[].value	String
[config.controls]	Object
[config.controls.height]	Number	0
[config.onStateChanged]
[config.onClick]
[config.onUpdateColor]

aX6UIPalette.initOnce()

Kind: instance method of AX6UIPalette

aX6UIPalette.repaint() ⇒ AX6UIPalette

Kind: instance method of AX6UIPalette

aX6UIPalette.setSelectedColor(selectedColor) ⇒ AX6UIPalette

Kind: instance method of AX6UIPalette

Param
selectedColor