Forum Topic: As2 Flash Effect: Electricity

(1,389 views • 22 replies)

This topic is 1 page long.

<< < > >>
Elated

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/14/08 05:49 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

Heres another neat effect that you can use in your next flash game or movie:

ELECTRICITY

Here's an example of what this does. Click to toggle between sparks and electricity. (FPS: 30, BG: Black, QUALITY: LOW)

This goes in an .as file named Static.as :

Note: This will only work in ActionScript 2.0!!!

import flash.geom.Point;
class Static extends MovieClip {
	private var elec:MovieClip;
	private var rand:Number;
	private var i:Number;
	function Static() {
		elec = this.createEmptyMovieClip("elec", 1);
	}
	public function init(x:Number, y:Number):Void {
		MovieClip.prototype.drawPath = function() {
			this.createEmptyMovieClip("path",2);
			this.path.lineStyle(1,0xFFFFFF);
			this.path.moveTo(this.x,this.y);
			for (i=0; i<this.paths.length; ++i) {
				this.path.lineTo(this.paths[i].x-this._x,this.paths[i].y-this._y);
			}
		};
		MovieClip.prototype.addPath = function(x:Number, y:Number) {
			if (this.paths.length<15) {
				this.paths.unshift(new Point(x, y));
			} else {
				this.paths.pop();
				this.paths.unshift(new Point(x, y));
			}
		};
		MovieClip.prototype.move = function() {
			this.addPath(this.x-this._x,this.y-this._y);
			this.drawPath();
			this.x += Math.cos(this.r*Math.PI/180)*this.spd;
			this.y += Math.sin(this.r*Math.PI/180)*this.spd;
			this.spd *= .5;
			if (this.x>275+Stage.width/2 || this.x<275-Stage.width/2) {
				this.r *= -1;
				this.r += 180;
				this.x = 275+Stage.width/2*(this.x>275+Stage.width/2)-Stage.width/2*(this.x<275-Stage.width/2);
			}
			if (this.y>200+Stage.height/2 || this.y<200-Stage.height/2) {
				this.r *= -1;
				this.y = 200+Stage.height/2*(this.y>200+Stage.height/2)-Stage.height/2*(this.y<200-Stage.height/2);
			}
			this.r += random(90)-random(90);
			if (this.spd<.01) {
				this.removeMovieClip();
			}
			if (this.spd<.5) {
				if (random(2) == 0) {
					this._visible = !this._visible;
				}
			}
		};
		elec.x = x;
		elec.y = y;
		elec.paths = new Array();
		elec._rotation = random(360);
		rand = random(10)+2;
		elec.r = elec._rotation;
		elec.spd = rand*7;
		elec._rotation = 0;
		elec.onEnterFrame = function() {
			this.move();
		};
		elec.onUnload = function() {
			this._parent.removeMovieClip();
		};
	}
}

For the .fla file :

1. Save your .fla in the same directory as the Static.as file

2. Go to Insert>>New Symbol...

3. Insert static for the name. Make sure the type is set to Movie Clip

4. Click Advanced if the advanced menu is not already being displayed. Under 'Linkage:' check 'Export for ActionScript'

5. The Identifier should read static. Enter Static into the AS 2.0 class area.

6. To add a bolt of static electricity at the mouse's position, use this code:

s = attachMovie("static", "static"+d, d);
			s.init(_xmouse, _ymouse);

Here's an example of the static particle in use:

 import flash.filters.GlowFilter;
_quality = "LOW";
var d:Number = 0;
var glow:GlowFilter = new GlowFilter(0x9900CC, 1, 16, 16, 6);
var hold:MovieClip = createEmptyMovieClip("hold", 1);
hold.filters = [glow];
onEnterFrame = function () {
	for (i=0; i<3; ++i) {
		s = hold.attachMovie("static", "static"+d, d);
		s.init(_xmouse, _ymouse);
		d++;
	}
};

Electrifying!

If anybody is interested in this code snippet, why not develop your own particle effect and share it with the world? Perhaps we can get a collection going!

AS2 Flash Effect: Sparks


None

Ertyguy

Reply To Post Reply & Quote

Posted at: 2/14/08 05:53 PM

Ertyguy LIGHT LEVEL 25

Sign-Up: 02/02/06

Posts: 2,180

that is wicked cool!


Elated

Magical-Mark

Reply To Post Reply & Quote

Posted at: 2/14/08 05:56 PM

Magical-Mark DARK LEVEL 13

Sign-Up: 03/25/03

Posts: 548

I do not think I will ever use it but it is really awesome.

Keep up the good work.


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/14/08 06:02 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

At 2/14/08 05:57 PM, KemCab wrote: Could you explain how it works? I'm really interested in generating this kind of motion thing.

It wouldn't be a tut without :|

I never said this was a tutorial, but sure I'll explain it :)

Basically, what is happening is that each particle has its own array called paths. Each frame, it adds its current coordinates to the beginning of the array, and if the array is above a certain length, removes the last element from the array. Then, the particle draws a path from the first coordinates in its array to the last ones. When the particle is spawned, it is given an aritficial rotation and speed which define its initial path. Each frame, the particle rotates a random amount and slows down by a constant percentage. When the particle has reached a certain speed, it starts blinking and when it has reached an even lower speed, it removes itself from the stage. I hope this clears some things up for you, and I'll be happy to further explain anything you don't fully understand.


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/14/08 06:16 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

Ok for the paths/array thing:

Imagine this: The particle starts at (275,200). This point is added to the array called paths. Paths would now look like this: [(275,200)]. The next frame, lets say the particle moves to (260,180). This point would be added to the array. which would now look like [(260,180),(275,200)]. Now, the drawPath function would cycle through the array, drawing a line to each point in the array. Each frame, the drawing is cleared and redrawn, so you don't have lots of old lines lying around. I hope that this clarifies it. I really don't know how else to explain it.

As for the .as file, the major benefit is that if you wanted to implement this effect in multiple flash projects, you wouldn't have to copy/paste the code each time. All you have to do is load the class.


Elated

Kart-Man

Reply To Post Reply & Quote

Posted at: 2/14/08 08:28 PM

Kart-Man NEUTRAL LEVEL 27

Sign-Up: 01/07/07

Posts: 3,735

Wow, that's even cooler than the sparks... Great work!


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/14/08 08:55 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

Kart-Man:

funny thing is the code is essentially the same. Only difference is longer trails, no gravity particles, and the glow filter. Also, why not make another particle effect? Maybe we can get enough and compile them into one, easy to use file.


None

PyroflameGames

Reply To Post Reply & Quote

Posted at: 2/14/08 10:14 PM

PyroflameGames NEUTRAL LEVEL 09

Sign-Up: 08/04/07

Posts: 1,969

Pretty cool.

4 in 5 people found this post helpful, did you? Yes | No

BBS Signature

None

Skeik-Sprite

Reply To Post Reply & Quote

Posted at: 2/14/08 10:18 PM

Skeik-Sprite LIGHT LEVEL 15

Sign-Up: 06/19/05

Posts: 1,399

At 2/14/08 08:55 PM, LesPaulPlayer wrote: Kart-Man:

funny thing is the code is essentially the same. Only difference is longer trails, no gravity particles, and the glow filter. Also, why not make another particle effect? Maybe we can get enough and compile them into one, easy to use file.

Maybe make a customizable particle emitter class?


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/14/08 10:27 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

What do you mean by that skiek? Do you mean like the user draws their own shape? Because I was hoping to keep everything API. I'd also prefer to restrict everything to lines and curves (no solid shapes or anything) to be consistent with the first 2 effects. So I'd like to stay away from star particles, and smiley face showers as much as possible. Also, Skiek, you're a pretty competent coder, right? Why not take a stab at making your own effect?


None

zenyara

Reply To Post Reply & Quote

Posted at: 2/14/08 11:44 PM

zenyara NEUTRAL LEVEL 13

Sign-Up: 06/17/05

Posts: 1,200

Awesome. We'll add this to our game somewhere.

Check out the latest updates:

Toga Games (crew)

BBS Signature

None

125Maniac

Reply To Post Reply & Quote

Posted at: 2/14/08 11:56 PM

125Maniac EVIL LEVEL 12

Sign-Up: 09/14/07

Posts: 367


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/14/08 11:58 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

At 2/14/08 11:44 PM, zenyara wrote: Awesome. We'll add this to our game somewhere.

I will hold you to that. So you better.


None

zenyara

Reply To Post Reply & Quote

Posted at: 2/15/08 12:20 AM

zenyara NEUTRAL LEVEL 13

Sign-Up: 06/17/05

Posts: 1,200

At 2/14/08 11:58 PM, LesPaulPlayer wrote:
At 2/14/08 11:44 PM, zenyara wrote: Awesome. We'll add this to our game somewhere.
I will hold you to that. So you better.

The spark effect:
I can already see the effect coming off an item. Maybe a sword. Or even inside of a blacksmith shop where someone hits an iron block.

The lighting could be used for a background during a rainstorm.

Check out the latest updates:

Toga Games (crew)

BBS Signature

None

Skeik-Sprite

Reply To Post Reply & Quote

Posted at: 2/15/08 04:37 PM

Skeik-Sprite LIGHT LEVEL 15

Sign-Up: 06/19/05

Posts: 1,399

At 2/14/08 10:27 PM, LesPaulPlayer wrote: What do you mean by that skiek? Do you mean like the user draws their own shape? Because I was hoping to keep everything API. I'd also prefer to restrict everything to lines and curves (no solid shapes or anything) to be consistent with the first 2 effects. So I'd like to stay away from star particles, and smiley face showers as much as possible. Also, Skiek, you're a pretty competent coder, right? Why not take a stab at making your own effect?

I'll start one later today :P. By effect emitter, I mean to keep the whole thing api if possible. Just...

Make a class with about a dozen different particle effects for use in games. Like you already have 2 effects, we could add about 10 more different API effects to that. Doing that, we could use the class freely in many different games for different effects. Just use a function, something like...

var particleSpawner:(classname) = new (classname)

particleSpawner.spawnEmitter(x,y,typeOfP article,FrequencyOfParticle)

Basically just a collection of many different open source particle effects in one big AS file.


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/15/08 06:32 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

I dont know about collecting all the APIs into one file because there is a possibility that differnt future effects will have different init functions. For example a particle that is color dependent or something should be easily changeable in the .fla. Though, the function could look like:

 init(x,y,{properties}) 

Which is similar to the initObj of the attachMovie function. Either way, this project is definately going to be open source, easily customizable, and most importantly totally awesome


None

DarkRedemption

Reply To Post Reply & Quote

Posted at: 2/15/08 06:32 PM

DarkRedemption DARK LEVEL 05

Sign-Up: 07/21/07

Posts: 233

Well, you've sufficiently inspired me.

I'll probably shove this in its own thread later once I've done some more optimizations.

Fire Particles


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/15/08 06:35 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

At 2/15/08 06:32 PM, DarkRedemption wrote: Well, you've sufficiently inspired me.

I'll probably shove this in its own thread later once I've done some more optimizations.

Fire Particles

Nice job. Im glad some people are taking an active interest in this.


None

Vengeance

Reply To Post Reply & Quote

Posted at: 2/15/08 06:41 PM

Vengeance EVIL LEVEL 28

Sign-Up: 03/18/05

Posts: 5,033

I'll develop one when I get home from work. If anyone wants anything specific made, post it. Because I have no ideas for what to make. :P

========|| WWWWWWWW>[-[Blog] - [Audio] - [Userpage] - [Flash] - [Last.fm]-]<WWWWWWWW ||========

BBS Signature

None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/15/08 07:21 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

At 2/15/08 06:41 PM, Vengeance wrote: I'll develop one when I get home from work. If anyone wants anything specific made, post it. Because I have no ideas for what to make. :P

Sweet. I'm really drawing blanks for ideas. I've made a retro/laser particle which looks nice so don't do something like that. I've also created a mod of the electricty particle to create a broken glass-ish effect. Ill post both later on tonight, though the glass effect is not that good.


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/15/08 10:45 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

You got anything yet Vengeance?


None

SNARE

Reply To Post Reply & Quote

Posted at: 2/16/08 05:45 AM

SNARE EVIL LEVEL 25

Sign-Up: 05/14/04

Posts: 5,495

Thats fucking awesome, I was looking for effects like this and I'll definately give you super credit if I ever use it =]


None

LesPaulPlayer

Reply To Post Reply & Quote

Posted at: 2/16/08 01:23 PM

LesPaulPlayer DARK LEVEL 12

Sign-Up: 05/18/06

Posts: 675

At 2/16/08 05:45 AM, SNARE wrote: Thats fucking awesome, I was looking for effects like this and I'll definately give you super credit if I ever use it =]

Thanks I appreciate that. When this project is finished, I'll probably set up a website or something with some documentation, logos, etc. So if you want to use these effects before all 10 are finished, shoot me a PM or email (benweitzman@gmail.com) and I'll hit you up with a logo to throw in.


All times are Eastern Standard Time (GMT -5) | Current Time: 11:21 PM

<< Back

This topic is 1 page long.

<< < > >>
You need a Grounds Gold Account to post on the NG BBS! If you don't have one, click here to sign up now! It's fast, free, and easy — and opens up tons of great NG features!