Forums » Code » Fading Entity

Hi all,

I wanted to share my FadingEntity with you, as I couldn't find anything similar on my research. At the moment I am sitting at coding a game, in which I need to spawn new entities on a click. As simply spawning them doesn't look that nice I searched for a way to let them fade in. Finally I found out how to do it (and even had a chance to learn something about the timers) and realized that I had to totally rewrite my entities, as I worked with plane images and not animation sheets, which (I didn't find a way) doesn't give me the ability to change the alpha channel.

Maybe it is a pretty noobish implementation, but hey, I am totally new to Impact and Game Dev (yeah, and mostly normal Development as well). :)

As I do not want to post a big wall of text, here is the link to the public repo:

https://bitbucket.org/neogope/simple-fading-entity/

Any Feedback is pretty much appreciated!

Cool, but in my opinion, quite strict, as you can't really spawn the entity you want.

Perhaps you could inject on the ig.Entity class to make it prettier/cleaner ?
Here's my fade-kill, which does the same as your fadeout, but uses the inject.

ig.module(
    'plugins.fadekill'
)
.requires(
    'impact.entity'
)
.defines(function(){

ig.Entity.inject({
    
	fadeKillTimer: null,

	update: function() {
		this.parent();

		if(this.fadeKillTimer) {
			this.currentAnim.alpha = this.fadeKillTimer.delta().map( -this.fadeKillTimer.target, 0, 1, 0 ); 

			if (this.fadeKillTimer.delta() > 0) {
				this.kill();
			}
		}
	},

	fadeKill: function(time) {
		this.fadeKillTimer = new ig.Timer(time);
	}
    
});
});

This way I can just call ent.fadeKill(time) on any entity I want after requiring the plugin.

Thanks for the hint. I've just adjusted my code.

ig.module(
	'plugins.fading'
)
.requires(
	'impact.entity',
	'impact.input'
)
.defines(function() {	
	ig.Entity.inject({
		span: 0,
		fadeValue: 'stop',
		readyToKill: false,

		init: function (x, y, settings) {
			this.parent(x, y, settings);
			
			if (fadeValue == 'in') {
				this.currentAnim.alpha = 0;
			} else if (fadeValue == 'out'){
				this.currentAnim.alpha = 1;
			}
			
			this.timer = new ig.Timer(this.span);
		},

		update: function() {
			this.parent();
			
			if (this.fadeValue == 'in') {
				this.fadeIn()
			}
			if (this.fadeValue == 'out') {
				this.fadeOut();
			}
			if (this.fadeValue == 'stop' && this.readyToKill){
				this.kill();
			}
		},

		fadeIn: function() {
			if (this.timer.delta() <= 0) {
				this.currentAnim.alpha = 1 + (this.timer.delta() / this.span);
			} else {
				this.fadeValue = 'stop';
			}
		},
		
		fadeOut: function() {
			if (this.timer.delta() <= 0) {
				this.currentAnim.alpha = 0 - (this.timer.delta() / this.span);
			} else {
				this.fadeValue = 'stop';
			}
		},

		setFade: function(fadeValue, span, readyToKill) {
			this.fadeValue = fadeValue;
			this.timer.set(span);
			this.readyToKill = readyToKill;
		},

	});
});