script will not begin in Safari or FF

ashsechler · 05-15-2009, 11:36 PM

Hey,
the following script will not even begin to run in FF or safari. Any suggestions?

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>

</head>

<body onload="start();">
<script language="javascript" type="text/javascript">
var y = 10;
var x = 40;
var id = 0;
var timer=20;
var deviation=6;
var array = new Array(y);
for(var i=0; i<y;i++)
{
	array[i]=new Array(x);
	for(var j=0; j<x;j++)
	{
		array[i][j] = new Color(i,j);
	}
}
function start(){
	document.write('<table cellspacing="0">');
	for(var i=0; i<y;i++)
	{
		document.write('<tr>');
		for(var j=0; j<x;j++)
		{
			document.write('<td width="10" height="10" id="'+id+'"></td>');
			document.getElementById(id).style.backgroundColor = array[i][j].value();
			id++;
		}
		document.write('</tr>');
	}
	id=0;
	document.write('</table>');
	
	setTimeout('shifter()', timer);

}

function shifter(){
	for(var i=0; i<y;i++)
	{
		for(var j=0; j<x;j++)
		{	
			document.getElementById(id).style.backgroundColor = array[i][j].change();
			id++;
		}
	}
	id=0;
	
	setTimeout('shifter()', timer);
}
function convert(num){
	var val1;
	var val2;
	var num1 = Math.floor(num/16);
	var num2 = Math.floor(num%16);
	var both;
	if(num1<=9)
		val1 = num1;
	else if(num1>=10 && num1<=15)
	{
		switch(num1)
		{
			case 10:
				val1='A';
				break;
			case 11:
				val1='B';
				break;
			case 12:
				val1='C';
				break;
			case 13:
				val1='D';
				break;
			case 14:
				val1='E';
				break;
			case 15:
				val1='F';
				break;
		}
	}
	else
	{
		num1=0;
		val1 = num1;
	}
	if(num2<=9)
		val2 = num2;
	else if(num2>=10 && num2<=15)
	{
		switch(num2)
		{
			case 10:
				val2='A';
				break;
			case 11:
				val2='B';
				break;
			case 12:
				val2='C';
				break;
			case 13:
				val2='D';
				break;
			case 14:
				val2='E';
				break;
			case 15:
				val2='F';
				break;
		}
	}
	else
	{
		num2=0;
		val2 = num2;
	}
	both=val1.toString()+val2.toString();
	return both;
}

function Color(length,width){
	this.l=length;
	this.w=width;
	this.r = rand();
	this.g = rand();
	this.b = rand();
	this.behind = this.w-1;
	this.above = this.l-1;
	this.change = function()
	{
		if(this.above<0)
		{
			this.r=this.deviate(this.r+array[this.l][this.behind].r)/2);
			this.g=this.deviate(this.g+array[this.l][this.behind].g)/2);
			this.b=this.deviate(this.b+array[this.l][this.behind].b)/2);
		}
		else if(this.behind<0)
		{
			this.r=this.deviate((array[this.above][this.w].r+this.r)/2);
			this.g=this.deviate((array[this.above][this.w].g+this.g)/2);
			this.b=this.deviate((array[this.above][this.w].b+this.b)/2);
		}
		else if(this.behind<0 && this.above<0)
		{
			this.r=this.deviate(this.r);
			this.g=this.deviate(this.g);
			this.b=this.deviate(this.b);
		}
		else
		{
			this.r=this.deviate((array[this.above][this.w].r+array[this.l][this.behind].r)/2);
			this.g=this.deviate((array[this.above][this.w].g+array[this.l][this.behind].g)/2);
			this.b=this.deviate((array[this.above][this.w].b+array[this.l][this.behind].b)/2);
		}
		return this.value();
	}
	this.value=function ()
	{	
		this.hex='#'+convert(this.r)+convert(this.g)+convert(this.b);
		return this.hex;
	}
	this.deviate = function(number)
	{
		this.newNumber=number+((Math.floor(Math.random()*deviation)+1)-(deviation/2));
		if(newNumber<0)
			newNumber=0;
		return newNumber;
	}
}
function rand(){
	var randomNum = Math.floor(Math.random()*256);
	return randomNum;
}
</script>

</body>
</html>

randomuser773 · 05-16-2009, 01:03 AM

Quote:

Originally Posted by ashsechler

Hey,
the following script will not even begin to run in FF or safari.

Of course it won't - it's destroying itself.
You cannot call document.write after the document has loaded.

ashsechler · 05-17-2009, 01:39 AM

thanks for your response, but with that correction it still doesn't begin. Am i missing a step?

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>

</head>

<body onload="shifter();">
<script language="javascript" type="text/javascript">
var y = 10;
var x = 40;
var id = 0;
var timer=20;
var deviation=6;
var array = new Array(y);
for(var i=0; i<y;i++)
{
	array[i]=new Array(x);
	for(var j=0; j<x;j++)
	{
		array[i][j] = new Color(i,j);
	}
}

document.write('<table cellspacing="0">');
for(var i=0; i<y;i++)
{
	document.write('<tr>');
	for(var j=0; j<x;j++)
	{
		document.write('<td width="10" height="10" id="'+id+'"></td>');
		document.getElementById(id).style.backgroundColor = array[i][j].value();
		id++;
	}
	document.write('</tr>');
}
id=0;
document.write('</table>');
	
function shifter(){
	for(var i=0; i<y;i++)
	{
		for(var j=0; j<x;j++)
		{	
			document.getElementById(id).style.backgroundColor = array[i][j].change();
			id++;
		}
	}
	id=0;
	
	setTimeout('shifter()', timer);
}
function convert(num){
	var val1;
	var val2;
	var num1 = Math.floor(num/16);
	var num2 = Math.floor(num%16);
	var both;
	if(num1<=9)
		val1 = num1;
	else if(num1>=10 && num1<=15)
	{
		switch(num1)
		{
			case 10:
				val1='A';
				break;
			case 11:
				val1='B';
				break;
			case 12:
				val1='C';
				break;
			case 13:
				val1='D';
				break;
			case 14:
				val1='E';
				break;
			case 15:
				val1='F';
				break;
		}
	}
	else
	{
		num1=0;
		val1 = num1;
	}
	if(num2<=9)
		val2 = num2;
	else if(num2>=10 && num2<=15)
	{
		switch(num2)
		{
			case 10:
				val2='A';
				break;
			case 11:
				val2='B';
				break;
			case 12:
				val2='C';
				break;
			case 13:
				val2='D';
				break;
			case 14:
				val2='E';
				break;
			case 15:
				val2='F';
				break;
		}
	}
	else
	{
		num2=0;
		val2 = num2;
	}
	both=val1.toString()+val2.toString();
	return both;
}

function Color(length,width){
	this.l=length;
	this.w=width;
	this.r = rand();
	this.g = rand();
	this.b = rand();
	this.behind = this.w-1;
	this.above = this.l-1;
	this.change = function()
	{
		if(this.above<0)
		{
			this.r=this.deviate(this.r+array[this.l][this.behind].r)/2);
			this.g=this.deviate(this.g+array[this.l][this.behind].g)/2);
			this.b=this.deviate(this.b+array[this.l][this.behind].b)/2);
		}
		else if(this.behind<0)
		{
			this.r=this.deviate((array[this.above][this.w].r+this.r)/2);
			this.g=this.deviate((array[this.above][this.w].g+this.g)/2);
			this.b=this.deviate((array[this.above][this.w].b+this.b)/2);
		}
		else if(this.behind<0 && this.above<0)
		{
			this.r=this.deviate(this.r);
			this.g=this.deviate(this.g);
			this.b=this.deviate(this.b);
		}
		else
		{
			this.r=this.deviate((array[this.above][this.w].r+array[this.l][this.behind].r)/2);
			this.g=this.deviate((array[this.above][this.w].g+array[this.l][this.behind].g)/2);
			this.b=this.deviate((array[this.above][this.w].b+array[this.l][this.behind].b)/2);
		}
		return this.value();
	}
	this.value=function ()
	{	
		this.hex='#'+convert(this.r)+convert(this.g)+convert(this.b);
		return this.hex;
	}
	this.deviate = function(number)
	{
		this.newNumber=number+((Math.floor(Math.random()*deviation)+1)-(deviation/2));
		if(newNumber<0)
			newNumber=0;
		return newNumber;
	}
}
function rand(){
	var randomNum = Math.floor(Math.random()*256);
	return randomNum;
}
</script>

</body>
</html>

Leeoniya · 05-17-2009, 02:20 AM

without testing it, i would say first and foremost, put the entire <script> into the <head> section. you're binding a function to the onload event before the function is defined.

Leon

adios · 05-17-2009, 02:59 AM

Actually, that just binds a wrapper. Shouldn't be an issue.

If I may ask: what does this script do exactly?

randomuser773 · 05-17-2009, 03:31 AM

Quote:

Originally Posted by ashsechler

Am i missing a step?

Yes - failing to use the error console.

Code:

if(this.above<0)
		{
			this.r = this.deviate( this.r + array[this.l][this.behind].r )/2);
			this.g=this.deviate(this.g+array[this.l][this.behind].g)/2);
			this.b=this.deviate(this.b+array[this.l][this.behind].b)/2);
		}

Statements in this block contain an extraneous ')'.

adios · 05-17-2009, 05:01 AM

To the OP:

Probably not the best policy to begin with:

Quote:

the following script will not even begin to run in FF or safari.

... as you're sort of implying that it will run somewhere else, likely IE. Very different from just leaving the user agent out of it.

ashsechler · 05-17-2009, 05:01 AM

thank you, that was it.

This script creates blocks of color that change and interact with eachother, just experimenting a bit.