Monatsarchiv für April 2011

 
 

Recent Snippets Part 1

Here are a few snippets that I’ve used recently. They are javascript, mysql, php and some apache directives:

Select rows from a table in random order:

SELECT * FROM `table` ORDER BY `field` RAND();

Fix broken images on a page, good for use with ajax:

1
2
3
4
5
function fixBrokenImages(someDiv){
   someDiv.find("img").bind("error", function(){
         $(this).attr("src", "no-image.jpg");
   });
}

I use this snippet locally to prevent caching in mamp:

1
2
3
4
5
6
7
8
9
<FilesMatch "\.(html|htm|js|css|jpg|png|gif)$">
FileETag None
<IfModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</IfModule>
</FilesMatch>

Working on something with jsfiddle-esque mod rewrite happening, this basically takes up to 3 get vars, but the urls can look like this: mysite.com/one/two/three

1
2
3
4
5
6
7
8
RewriteEngine on
 
RewriteCond %{REQUEST_FILENAME} -f
RewriteRule ^ - [L]
 
RewriteRule ^([^/]+)/?$ index.php?folder=$1 [L]
RewriteRule ^([^/]+)/([^/]+)/?$ index.php?folder=$1&name=$2 [NC]
RewriteRule ^([^/]+)/([^/]+)/([^/]+)/?$ index.php?folder=$1&name=$2&revision=$3 [NC]

CSS3 selector with jQuery to alter css on even li tags:

$("li:nth-child(even)").css({backgroundColor : red, border : 1px solid black"});

CSS3 selectors with jQuery to select elements based on attribute values:

$("<p>I start with a<\/p>").insertBefore("img[src^='a']");
 
$("<p>I contain with a<\/p>").insertBefore("img[src*='a']");
 
$("<p>I end with a<\/p>").insertBefore("img[src$='a']");

Get the levenshtein distance between two strings:

echo levenshtein ( "zevan" , "kevin" );
// result is 2

Get the metaphone key for a string:

echo metaphone("zevan");
// result is SFN

I have a bunch more of these that I’ll post either over the weekend or on monday.

As2 Blox

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:

This movie requires Flash Player 9

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:

This movie requires Flash Player 9

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

C Blocks as Arguments

I don’t know the details, but based off the little I’ve read online, Apple added the ability to point to C blocks. This means that you can do interesting stuff like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
#include <stdio.h>
 
void repeat(int num, void(^block)()){
	for (int i = 0; i < num; i++){
	  printf("--");
	  block();
	}
}
 
int main() {
 
	repeat(10, ^{
		static int i = 0;
		i++;
		printf("%d\n", i);
	});
 
	return 0;
}

This will output:

--1
--2
--3
--4
--5
--6
--7
--8
--9
--10

It’s common in jQuery to do things like:

thing.click(function(){
  alert("I was clicked");
});

Kind of interesting that you can do it in C too…

Based on googling, this works in osx 10.6 and with a little tweak of the compiler settings 10.5.

As a side note, this is doable pretty much across the board with function pointers – you just don’t have anonymous functions so you have to define a function and then pass it:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#include <stdio.h>
 
void runTen(void (*func)()){
	for(int i = 0; i < 10; i++)
		func();
}
void count(){
	static int i = 0;
	printf("--%d\n", ++i);	
}
 
int main(){
       // no need for &
	runTen(count);
	return 0;
}

I could still see using the block technique in certain scenarios – especially with some of the interesting things going on in Block.h like Block_copy() etc…

For more info check out this great explanation:

http://thirdcog.eu/pwcblocks/