2015-11-15 08:23:16 +08:00
|
|
|
|
2016-07-02 06:49:59 +08:00
|
|
|
import _ from '_';
|
2015-11-15 08:23:16 +08:00
|
|
|
import ko from 'ko';
|
|
|
|
import {componentExportHelper} from 'Component/Abstract';
|
|
|
|
import {AbstracCheckbox} from 'Component/AbstracCheckbox';
|
|
|
|
|
|
|
|
class CheckboxMaterialDesignComponent extends AbstracCheckbox
|
|
|
|
{
|
|
|
|
/**
|
|
|
|
* @param {Object} params
|
|
|
|
*/
|
|
|
|
constructor(params) {
|
2016-04-21 01:12:51 +08:00
|
|
|
|
2015-11-15 08:23:16 +08:00
|
|
|
super(params);
|
|
|
|
|
2016-04-21 01:12:51 +08:00
|
|
|
this.animationBox = ko.observable(false).extend({falseTimeout: 200});
|
|
|
|
this.animationCheckmark = ko.observable(false).extend({falseTimeout: 200});
|
2015-11-15 08:23:16 +08:00
|
|
|
|
|
|
|
this.animationBoxSetTrue = _.bind(this.animationBoxSetTrue, this);
|
|
|
|
this.animationCheckmarkSetTrue = _.bind(this.animationCheckmarkSetTrue, this);
|
|
|
|
|
|
|
|
this.disposable.push(
|
|
|
|
this.value.subscribe((value) => {
|
|
|
|
this.triggerAnimation(value);
|
|
|
|
}, this)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
animationBoxSetTrue() {
|
|
|
|
this.animationBox(true);
|
|
|
|
}
|
|
|
|
|
|
|
|
animationCheckmarkSetTrue() {
|
|
|
|
this.animationCheckmark(true);
|
|
|
|
}
|
|
|
|
|
|
|
|
triggerAnimation(box) {
|
|
|
|
if (box) {
|
|
|
|
this.animationBoxSetTrue();
|
|
|
|
_.delay(this.animationCheckmarkSetTrue, 200);
|
2016-06-30 08:02:45 +08:00
|
|
|
}
|
|
|
|
else {
|
2015-11-15 08:23:16 +08:00
|
|
|
this.animationCheckmarkSetTrue();
|
|
|
|
_.delay(this.animationBoxSetTrue, 200);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
module.exports = componentExportHelper(CheckboxMaterialDesignComponent, 'CheckboxMaterialDesignComponent');
|