42 lines
1.4 KiB
JavaScript
42 lines
1.4 KiB
JavaScript
Vue.component('light-hue-property-selector', {
|
|
template: '#tmpl-light-hue-property-selector',
|
|
props: ['id','value'],
|
|
computed: {
|
|
rgb: function() {
|
|
if (!(this.value && 'xy' in this.value)) {
|
|
return;
|
|
}
|
|
|
|
return toRGB(this.value.xy[0], this.value.xy[1], this.value.bri);
|
|
},
|
|
},
|
|
|
|
methods: {
|
|
changed: function(event) {
|
|
var value = parseInt(event.target.value);
|
|
var xy;
|
|
|
|
if (event.target.getAttribute('class').split(' ').indexOf('bri') > -1) {
|
|
this.$emit('bri-changed', {bri: value});
|
|
return;
|
|
} else if (event.target.getAttribute('class').split(' ').indexOf('ct') > -1) {
|
|
this.$emit('ct-changed', {ct: value});
|
|
return;
|
|
}
|
|
|
|
if (event.target.getAttribute('class').split(' ').indexOf('red') > -1) {
|
|
xy = toXY(value, this.rgb[1], this.rgb[2]);
|
|
} else if (event.target.getAttribute('class').split(' ').indexOf('green') > -1) {
|
|
xy = toXY(this.rgb[0], value, this.rgb[2]);
|
|
} else if (event.target.getAttribute('class').split(' ').indexOf('blue') > -1) {
|
|
xy = toXY(this.rgb[0], this.rgb[1], value);
|
|
} else {
|
|
return;
|
|
}
|
|
|
|
this.$emit('color-changed', {xy: xy});
|
|
},
|
|
},
|
|
});
|
|
|