Every laptop I’ve ever had has just simply died on me eventually – kind of odd. Anyway, as I’ve mentioned before, at least every month I do a dvd backup of everything I’ve been working on. Commercial projects and personal projects alike. Every time my laptops die I end up loosing a few weeks of stuff – now, I rarely loose client work because I have weird trick – when I upload a client project to the dev server, I upload EVERYTHING, so it becomes an actual backup of the project. I guess I must have learned that the hard way – I know there have been about 3 times when I had to decompile an .swf to work on a project, but I can’t remember exactly why that was. My girlfriend is taking 4 of my old laptop and desktop hardrives and geting them all put onto one drive for my birthday. Pretty excited to see what I’ll discover. I was thinking about this, so I started looking through all the old DVDs again and I found this little thing:

Here is the fla – unedited: DOWNLOAD

This is the 3D engine it uses:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78

Stage.scaleMode = "noScale";
function localReset() {
	lxr = 0;
	lyr = 0;
	lx = 0;
	ly = 0;
	lz = 0;
}
gz = 0;
gx = 0;
gy = 0;
gxr = 0;
gyr = 0;
localReset();
centerX = 300;
centerY = 220;
rads = Math.PI/180;
sin = new Array();
cos = new Array();
for (var i = 0; i<720; i++) {
	sin[i] = Math.sin(i*(Math.PI/180));
}
for (var i = 0; i<720; i++) {
	cos[i] = Math.cos(i*(Math.PI/180));
}
lx = 0;
ly = 0;
lz;
// calculate 3d coards no 2d translation;
function l3d(_mx, my, mz) {
	zpos = ((lz+mz)*cos[lxr])-((lx+_mx)*sin[lxr]);
	xpos = ((lz+mz)*sin[lxr])+((lx+_mx)*cos[lxr]);
	ypos = ((ly+my)*cos[lyr])-(zpos*sin[lyr]);
	zpos = ((ly+my)*sin[lyr])+(zpos*cos[lyr]);
	//3rd one 
	apoint = [xpos, ypos, zpos];
	return apoint;
}
//////////////////////////////
// translate 3d coards to 2D 
//////////////////////////////
function p3d(_mx, my, mz) {
	zpos = ((gz+mz)*cos[gxr])-((gx+_mx)*sin[gxr]);
	xpos = ((gz+mz)*sin[gxr])+((gx+_mx)*cos[gxr]);
	ypos = ((gy+my)*cos[gyr])-(zpos*sin[gyr]);
	zpos = ((gy+my)*sin[gyr])+(zpos*cos[gyr]);
	dep = 1/((zpos/99390)+1);
	contrast = 1/((zpos/150)+1);
	//3rd one 
	apoint = [xpos*dep+centerX, ypos*dep+centerY, zpos];
	return apoint;
}
function skewObj(obj, mcW, mcH, pt0, ptH, ptW) {
	function distance(pt1, pt2) {
		var dy = pt2.y-pt1.y;
		var dx = pt2.x-pt1.x;
		var side = Math.sqrt(dy*dy+dx*dx);
		return side;
	}
	// 
	// pt0 = {x:p0._x, y:p0._y};
	// ptH = {x:pH._x, y:pH._y};
	// ptW = {x:pW._x, y:pW._y};
	// 
	obj._x = pt0.x;
	obj._y = pt0.y;
	obj._yscale = 100;
	var angleP2 = Math.atan2(ptW.y-pt0.y, ptW.x-pt0.x);
	var angleP1 = Math.atan2(ptH.y-pt0.y, ptH.x-pt0.x);
	var dAngle = (angleP1-angleP2)/2;
	var arm = Math.sqrt(2)/2/Math.cos(dAngle);
	// original a 100x100 model , now use 1x1 model
	obj._rotation = (180/Math.PI)*(angleP1-dAngle);
	obj.nest._rotation = -45;
	obj._yscale = 100*Math.tan(dAngle);
	obj.nest._xscale = distance(ptW, pt0)*100/arm/mcW;
	obj.nest._yscale = distance(ptH, pt0)*100/arm/mcH;
}

Despite the cluttered/messy style of the code and a few weird mistakes like the nesting of the distance function and a few other things. This code is actually kind of interesting, because it shows how we used to do 3D stuff and how we used to skew movieClips. The p3d function was based on code that I saw at http://wireframe.co.za/ I changed some stuff about it though, I cached the sin/cos function calls and added another function so that I could nest 3d transformations to give objects a local coordinate system. The skewing code was from Eric Lin. I may or may not have tweaked the skew code, I can’t remember.

The function for making a “blox”. Looks like this, you can see the thought process where I decided not to have top and bottom side for a cube:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

pts = new Array();
pre = new Array();
function box(pX, pY, pZ) {
	// left
	lx = pX;
	lz = 10+pZ;
	ly = pY;
	pre[inc] = l3d(50, 50, 0);
	pre[inc+1] = l3d(-50, 50, 0);
	pre[inc+2] = l3d(50, -50, 0);
	inc += 3;
	// front
	lx = 10+pX;
	ly = pY;
	lz = pZ;
	pre[inc] = l3d(0, 50, 50);
	pre[inc+1] = l3d(0, 50, -50);
	pre[inc+2] = l3d(0, -50, 50);
	inc += 3;
	// right 
	lx = pX;
	lz = 50+pZ;
	ly = pY;
	pre[inc] = l3d(50, 50, 0);
	pre[inc+1] = l3d(-50, 50, 0);
	pre[inc+2] = l3d(50, -50, 0);
	inc += 3;
	// top
	/*lx = pX+1;
	lz = 60+pZ;
	ly = pY+62;
	pre[inc] = l3d(50, 0, -50);
	pre[inc+1] = l3d(-50, 0, -50);
	pre[inc+2] = l3d(50, 0, 50);
	inc += 3;*/
	//back
	lx = 50+pX;
	ly = pY;
	lz = pZ;
	pre[inc] = l3d(0, 50, 50);
	pre[inc+1] = l3d(0, 50, -50);
	pre[inc+2] = l3d(0, -50, 50);
	inc += 3;
}

Kind of interesting that I’m storing all the blox points in one array. Then when I draw, I alter the values in the array and end by looping through it and drawing each point:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

this.onEnterFrame = function() {
 
	inc = 0;
	for (var i = 0; i<10; i++) {
		spindle[i] += rinc[i];
		mindle[i] += zinc[i];
		lxr = spindle[i]%360;
		lyr = mindle[i]%360
		box(rx[i], ry[i], 0);
	}
	tint = (inc/3)+2;
	//
	if (_xmouse>10 && _xmouse<500) {
		xdest = _xmouse;
	}
	if (_ymouse>10 && _ymouse<500) {
		ydest = _ymouse;
	}
	active = true;
	gxr += ((xdest)-gxr)/5;
	gyr += ((ydest)-gyr)/5;
	gxr = int(gxr);
	gyr = int(gyr);
	localReset();
	inc = 0;
	for (var i = 0; i<tint; i++) {
		pts[0] = p3d(pre[inc][0], pre[inc][1], pre[inc][2]);
		pts[1] = p3d(pre[inc+1][0], pre[inc+1][1], pre[inc+1][2]);
		pts[2] = p3d(pre[inc+2][0], pre[inc+2][1], pre[inc+2][2]);
		pt0 = {x:pts[0][0], y:pts[0][1]};
		ptH = {x:pts[1][0], y:pts[1][1]};
		ptW = {x:pts[2][0], y:pts[2][1]};
		dup = this["plane"+i];
		skewObj(dup, 100, 100, pt0, ptH, ptW);
 
		val = 4000+int(((pts[0][2]+pts[1][2]+pts[2][2])/3)*20);
		dup.swapDepths((val));
 
		dup._visible = true;
		inc += 3;
	}
};

It’s kind of like some of the OpenGL ES stuff I’ve been doing lately where I make heavy use of glDrawArrays() and array manipulation.

I used this basic 3D engine a bunch of times back in 2006-07. If you dig around you’ll find other instances of it here: old daily log.

Here is another one that uses the same engine:

I also used this same 3D technique back in my director days 2002-04 – and java days too: Catch Env.

This link is also a great resource if your interested in simple 3D engines:

http://freespace.virgin.net/hugo.elias/routines/3d_to_2d.htm

Every month or two I do a DVD backup – I backup all my administrative stuff… including estimates, invoices and finished project source code – I also backup weird experiments from a folder called shapevent. I’ve been doing these backups for years and for some reason I decided to dig through them today.I’ve only scratched the surface and I’ve found some interesting stuff that I had completely forgotten about.

The below experiment uses pure code to draw an image inspired by a photo. It doesn’t sample any colors or use any of the image data, the idea was to do everything by “painting” with code. If your feeling impatient, scroll to the bottom to see what kind of image this produces, otherwise sit back and watch:

Here are two examples of the kinds of images it will generate:

There is some really fun stuff going on in this code. I wrote a mini library when bitmapdata first came out that treated things sort of like photoshop layers, you could make new layers, flatten layers, apply filters and blendmodes to layers – it was pretty nice, surprised I didn’t use it more. I made most of these using it.

The brush motion is a randomly generated bezier path, I wrote weird functions like zigZag() that would aid in the creation of certain types of paths. I remember that you could create any kind of shape and then distort it, so you could do something like :

circle(x, y, radius, smooth, distortion amount).

That’s how the little blobs that make up the brush were created. Looking forward to digging into the source a bit more and maybe porting it to AS3.

In 2005 I was planning on starting up some programming tennis with someone – pass some code back and forth and see what happens. For some reason the game of tennis never got off the ground and I was left with the first thing I wrote for the game. It’s interesting to see how my code style has changed in ~6 years… Maybe I’ll recode this one and really compare the styles… Anyway have a look:

Den ganzen Beitrag lesen…