opt: colors
This commit is contained in:
parent
d7c64241ef
commit
812c5e45e0
|
@ -20,14 +20,20 @@ export default (flecks) => {
|
|||
|
||||
return class Colorized extends decorate(Trait) {
|
||||
|
||||
constructor(...args) {
|
||||
super(...args);
|
||||
this.$$rgbChanged = false;
|
||||
this.$$hsvChanged = false;
|
||||
this.$$hsv = [0, 0, 0];
|
||||
}
|
||||
|
||||
get blue() {
|
||||
return this.state.blue;
|
||||
}
|
||||
|
||||
set blue(blue) {
|
||||
this.wrapRgbSet(() => {
|
||||
super.blue = blue;
|
||||
});
|
||||
this.$$rgbChanged = true;
|
||||
}
|
||||
|
||||
static defaultState() {
|
||||
|
@ -43,17 +49,22 @@ export default (flecks) => {
|
|||
}
|
||||
|
||||
set green(green) {
|
||||
this.wrapRgbSet(() => {
|
||||
super.green = green;
|
||||
});
|
||||
this.$$rgbChanged = true;
|
||||
}
|
||||
|
||||
get hue() {
|
||||
return rgb2hsv([this.red, this.green, this.blue])[0];
|
||||
return this.$$hsv[0];
|
||||
}
|
||||
|
||||
set hue(hue) {
|
||||
this.wrapHsvSet(0, hue);
|
||||
this.$$hsv[0] = hue;
|
||||
this.$$hsvChanged = true;
|
||||
}
|
||||
|
||||
async load(json) {
|
||||
await super.load(json);
|
||||
this.$$hsv = rgb2hsv([this.state.red, this.state.green, this.state.blue]);
|
||||
}
|
||||
|
||||
get red() {
|
||||
|
@ -61,47 +72,41 @@ export default (flecks) => {
|
|||
}
|
||||
|
||||
set red(red) {
|
||||
this.wrapRgbSet(() => {
|
||||
super.red = red;
|
||||
});
|
||||
this.$$rgbChanged = true;
|
||||
}
|
||||
|
||||
get saturation() {
|
||||
return rgb2hsv([this.red, this.green, this.blue])[1];
|
||||
return this.$$hsv[1];
|
||||
}
|
||||
|
||||
set saturation(saturation) {
|
||||
this.wrapHsvSet(1, saturation);
|
||||
this.$$hsv[1] = saturation;
|
||||
this.$$hsvChanged = true;
|
||||
}
|
||||
|
||||
tick() {
|
||||
// RGB takes priority...
|
||||
if (this.$$rgbChanged) {
|
||||
this.$$hsv = rgb2hsv([this.state.red, this.state.green, this.state.blue]);
|
||||
}
|
||||
else if (this.$$hsvChanged) {
|
||||
[this.red, this.green, this.blue] = hsv2rgb(this.$$hsv);
|
||||
}
|
||||
else {
|
||||
return;
|
||||
}
|
||||
this.$$hsvChanged = false;
|
||||
this.$$rgbChanged = false;
|
||||
}
|
||||
|
||||
get value() {
|
||||
return rgb2hsv([this.red, this.green, this.blue])[2];
|
||||
return this.$$hsv[2];
|
||||
}
|
||||
|
||||
set value(value) {
|
||||
this.wrapHsvSet(2, value);
|
||||
}
|
||||
|
||||
wrapHsvSet(i, nv) {
|
||||
const hsv = rgb2hsv([this.red, this.green, this.blue]);
|
||||
const keys = ['hue', 'saturation', 'value'];
|
||||
if (nv !== hsv[i]) {
|
||||
hsv[i] = nv;
|
||||
[this.red, this.green, this.blue] = hsv2rgb(hsv);
|
||||
this.entity.emit(`${keys[i]}Changed`);
|
||||
}
|
||||
}
|
||||
|
||||
wrapRgbSet(fn) {
|
||||
const o = rgb2hsv([this.red, this.green, this.blue]);
|
||||
fn();
|
||||
const n = rgb2hsv([this.red, this.green, this.blue]);
|
||||
['hue', 'saturation', 'value'].forEach((key, i) => {
|
||||
if (n[i] !== o[i]) {
|
||||
this.entity.emit(`${key}Changed`);
|
||||
}
|
||||
});
|
||||
|
||||
this.$$hsv[2] = value;
|
||||
this.$$hsvChanged = true;
|
||||
}
|
||||
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue
Block a user