animMaterial

/*jshint esversion: 6, asi: true, laxbreak: true*/
var MaterialAnim = pc.createScript('animMaterial');
MaterialAnim.attributes.add('localEvents', { type: 'boolean', default: false });
MaterialAnim.attributes.add('eventShow', {type: 'string'});
MaterialAnim.attributes.add('eventEndShow', {type: 'string'});
MaterialAnim.attributes.add('eventHide', {type: 'string'});
MaterialAnim.attributes.add('eventEndHide', {type: 'string'});
MaterialAnim.attributes.add('eventSetDefault', { type: 'string' });
MaterialAnim.attributes.add('useColor', { type: 'boolean', default: true });
MaterialAnim.attributes.add('targetColor', {type: 'rgb'});
MaterialAnim.attributes.add('useAlpha', { type: 'boolean', default: true });
MaterialAnim.attributes.add('targetAlpha', {type: 'number', min: 0, max: 1});
MaterialAnim.attributes.add('timeIn', {type: 'number', default: 1.0});
MaterialAnim.attributes.add('typeIn', {
    type: 'number',
    enum: [
        { 'Linear': 1 },
        { 'ExponentialIn': 2 },
        { 'ExponentialOut': 3 },
        { 'ExponentialInOut': 4 },
        { 'ElasticIn': 5 },
        { 'ElasticOut': 6 },
        { 'ElasticInOut': 7 },
        { 'BounceIn': 8 },
        { 'BounceOut': 9 },
        { 'BounceInOut': 10 },
        { 'SineIn': 11 },
        { 'SineOut': 12 },
        { 'SineInOut': 13 }
    ],
    default: 1
});
MaterialAnim.attributes.add('timeOut', {type: 'number', default: 1.0});
MaterialAnim.attributes.add('typeOut', {
    type: 'number',
    enum: [
        { 'Linear': 1 },
        { 'ExponentialIn': 2 },
        { 'ExponentialOut': 3 },
        { 'ExponentialInOut': 4 },
        { 'ElasticIn': 5 },
        { 'ElasticOut': 6 },
        { 'ElasticInOut': 7 },
        { 'BounceIn': 8 },
        { 'BounceOut': 9 },
        { 'BounceInOut': 10 },
        { 'SineIn': 11 },
        { 'SineOut': 12 },
        { 'SineInOut': 13 }
    ],
    default: 1
});
MaterialAnim.attributes.add('soundShow', {type: 'string'});
MaterialAnim.attributes.add('soundHide', {type: 'string'});

MaterialAnim.prototype.initialize = function() {
    this.target = -1;
    if (this.entity.model)
        this.target = 0;
    else if (this.entity.element.material)
        this.target = 1;

    if (this.target === 0) {
        this.material = this.entity.model.model.meshInstances[0].material;
    } else if (this.target === 1) {
        this.material = this.entity.element.material;
    }

    this.audio = this.app.root.findByTag('sound')[0];
    this.color = this.material.diffuse.clone();
    this.col = new pc.Color();
    this.aa = {value: 0};
    this.alpha = { value: this.material.opacity };

    if (this.localEvents) {
        this.entity.on(this.eventShow,function() { this.animateShow(); }.bind(this));
        this.entity.on(this.eventHide,function() { this.animateHide(); }.bind(this));
        this.entity.on(this.eventSetDefault, this.setDefault, this);
    }
    else {
        this.app.on(this.eventShow,function() {
            if (!this.entity.enabled) return;
            //console.log("[AnimMaterial]", this.entity.name, this.eventShow);
            this.animateShow();
        }.bind(this));
        this.app.on(this.eventHide,function() {
            if (!this.entity.enabled) return;
            //console.log("[AnimMaterial]", this.entity.name, this.eventHide);
            this.animateHide();
        }.bind(this));
        this.app.on(this.eventSetDefault, this.setDefault, this);
    }

    this.entity.on('reset', this.reset, this);
    this.entity.on('default', this.setDefault, this);
};


MaterialAnim.prototype.postInitialize = function() {
    let material = null
    if (this.target === 0) {
        material = this.entity.model.model.meshInstances[0].material.clone();
        this.entity.model.model.meshInstances[0].material = material;
    } else if (this.target === 1) {
        material = this.entity.element.material.clone();
        this.entity.element.material = material;
    }
    this.reset();
    if (this.entity.script.holo2)
        this.entity.script.holo2.addCustomMaterial(material);
};


MaterialAnim.prototype.reset = function() {
    if (this.target === 0) {
        this.material = this.entity.model.model.meshInstances[0].material;
    } else if (this.target === 1) {
        this.material = this.entity.element.material;
    }
    this.color = this.material.diffuse.clone();
    this.alpha = { value: this.material.opacity };
};

MaterialAnim.prototype.setDefault = function() {
    if (this.tween1) this.tween1.stop();
    if (this.tween2) this.tween2.stop();

    if (this.useColor)
        this.material.diffuse = this.color;
    if (this.useAlpha)
        this.material.opacity = this.alpha.value;
    this.material.update();
};


MaterialAnim.prototype.animateShow = function() {
    if (this.tween1) this.tween1.stop();
    if (this.tween2) this.tween2.stop();

    this.col.copy(this.material.diffuse);
    this.aa = { value: this.material.opacity };

    //console.log("show", this.aa.value, "->", this.targetAlpha);

    if (this.useColor) {
        this.tween1 = this.entity
            .tween(this.col)
            .to(this.targetColor, this.timeIn, this.getCurve(this.typeIn))
            .on('update', function() {
                this.material.diffuse = new pc.Color(this.col.r, this.col.g, this.col.b);
                if (!this.useAlpha)
                    this.material.update();
            }.bind(this), this)
            .loop(false)
            .yoyo(false);
    this.tween1.start();
    }

    if (this.useAlpha) {
        this.tween2 = this.entity
            .tween(this.aa)
            .to({ value: this.targetAlpha }, this.timeIn, this.getCurve(this.typeIn))
            .on('update', function() {
                this.material.opacity = this.aa.value;
                this.material.update();
            }.bind(this), this)
            .loop(false)
            .yoyo(false);
    this.tween2.start();
    }

    if (this.eventEndShow && this.eventEndShow.length > 0) {
        if (this.useColor) {
            if (this.localEvents)
                this.tween1.on('complete', function() { this.entity.fire(this.eventEndShow); }.bind(this), this);
            else
                this.tween1.on('complete', function() { this.app.fire(this.eventEndShow); }.bind(this), this);
        }
        else if (this.useAlpha) {
            if (this.localEvents)
                this.tween2.on('complete', function() { this.entity.fire(this.eventEndShow); }.bind(this), this);
            else
                this.tween2.on('complete', function() { this.app.fire(this.eventEndShow); }.bind(this), this);
        }
    }

    if (this.soundShow && this.soundShow.length > 0)
        this.audio.sound.play(this.soundShow);
};

MaterialAnim.prototype.animateHide = function() {
    if (this.tween1) this.tween1.stop();
    if (this.tween2) this.tween2.stop();

    this.col.copy(this.material.diffuse);
    this.aa = { value: this.material.opacity };

    //console.log("hide", this.aa.value, "->", this.alpha.value);

    if (this.useColor) {
        this.tween1 = this.entity
            .tween(this.col)
            .to(this.color, this.timeOut, this.getCurve(this.typeOut))
            .on('update', function() {
                this.material.diffuse = new pc.Color(this.col.r, this.col.g, this.col.b);
                if (!this.useAlpha)
                    this.material.update();
            }.bind(this), this)
            .loop(false)
            .yoyo(false);
    this.tween1.start();
    }

    if (this.useAlpha) {
        this.tween2 = this.entity
            .tween(this.aa)
            .to(this.alpha, this.timeOut, this.getCurve(this.typeIn))
            .on('update', function() {
                this.material.opacity = this.aa.value;
                this.material.update();
            }.bind(this), this)
            .loop(false)
            .yoyo(false);
    this.tween2.start();
    }

    if (this.eventEndHide && this.eventEndHide !== "") {
        if (this.useColor) {
            if (this.localEvents)
                this.tween1.once('complete', function() { this.entity.fire(this.eventEndHide); }.bind(this), this);
            else
                this.tween1.once('complete', function() { this.app.fire(this.eventEndHide); }.bind(this), this);
        } else if (this.useAlpha) {
            if (this.localEvents)
                this.tween2.once('complete', function() { this.entity.fire(this.eventEndHide); }.bind(this), this);
            else
                this.tween2.once('complete', function() { this.app.fire(this.eventEndHide); }.bind(this), this);
        }
    }

    if (this.soundHide && this.soundHide.length > 0)
        this.audio.sound.play(this.soundHide);

};


MaterialAnim.prototype.getCurve = function(type) {
    if (type === 1) return pc.Linear;
    if (type === 2) return pc.ExponentialIn;
    if (type === 3) return pc.ExponentialOut;
    if (type === 4) return pc.ExponentialInOut;
    if (type === 5) return pc.ElasticIn;
    if (type === 6) return pc.ElasticOut;
    if (type === 7) return pc.ElasticInOut;
    if (type === 8) return pc.BounceIn;
    if (type === 9) return pc.BounceOut;
    if (type === 10) return pc.BounceInOut;
    if (type === 11) return pc.SineIn;
    if (type === 12) return pc.SineOut;
    if (type === 13) return pc.SineInOut;
};