Вопрос по программированию в HTML - Программирование

alexseystu · 21.05.2008, 22:54

Подскажите какой тег и в какой процедуре позволит видеть ходы компьютера на шахматной доске и изменить цвет квадратиков компьютера,на другой цвет. Не могу найти, где поменять цвет(((

.

Код:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Fastmind</title>
<link rel=STYLESHEET type=text/css href="../style.css">

<style>
.PLAYER	
{ 
	text-align: center;
	border-width: 3px; 
	background-color: #FF0000;
	border-style: RED; 
	paddings: 3px; 
	cursor:hand
}
</style>

<script><!-- 
d = document

NumCols = 10
NumRows = 8

ColorPlayer1 = "000000"
ColorPlayer2 = "pl2.GIF"
ColorActive1 = "#f0555"
ColorActive2 = "#fFF00"

Player1  = new Boolean(true);
Компьютер = 1;		//
fGame = 1;
Delay = 0;		//

Cell = new Array( NumRows );
for( var i=0; i < NumRows; i++ )
	Cell[i] = new Array( NumCols );
	
MoveAble = new Array( NumCols );
Prioritets = new Array( NumCols );


cook_name1 = "user_1"
cook_name2 = "user_2"


PageLoaded = false;

function Initialize()
{
	PageLoaded = true;

	// читаем имена из куков
	var value = getCookie(cook_name1)
	if( value ) Name1.innerText = value
	value = getCookie(cook_name2)
	if( value ) Name2.innerText = value

	GameField = d.all.tags("table")["field"];
	FirstCellIndex = GameField.cells[0].sourceIndex;
	StartGame();
}

function StartGame()
{
	for( var i=0; i < NumRows; i++ )
		for( var j=0; j < NumCols; j++ )
			Cell[i][j] = 0;
	for( var k=0; k < NumRows*NumCols; k++ )
		GameField.cells[k].bgColor="FFFFFF";

	fGame = 1;
	if( Компьютер > 1 )
		CompAttack();
}

function SetPrioritet( col )
{
	var enemy = (Player1)? 2: 1;
	var my = (Player1)? 1: 2;
	var row = MoveAble[col];

	if( row == NumRows )
	{ Prioritets[col] = 0; return; }

	if( row+1 < NumRows )
		if( TestWin(enemy,col,row+1) )
		{ Prioritets[col] = 1; return; }

	SetRelativePr( enemy, col, 0 )
	SetRelativePr(    my, col, 1 )
}

function SetRelativePr( target, col, bonus )
{
	var row = MoveAble[col];
	Cell[row][col] = target;

	for( var i=0; i<NumCols; i++ )
		if( MoveAble[i] < NumRows )
			if( TestWin(target,i,MoveAble[i]) )
			{
				Prioritets[col]++;
				Prioritets[i]++;
			}

	Cell[row][col] = 0;
}

function CompAttack()
{
	var i, j;

	// выбираем возможные ходы
	for( i=0; i<NumCols; i++ )
	{
		for( j=0; j<NumRows && !CanMove(i,j); j++ );
		// "шаг до победы"
		if( (MoveAble[i]=j) != NumRows )
			if( TestWin((Player1)?1:2, i, MoveAble[i]) )
				{ CompMove( i ); return; }
	}
			
	// "шаг до поражения"
	for( i=0; i<NumCols; i++ )
		if( MoveAble[i] != NumRows )
			if( TestWin((Player1)?2:1, i, MoveAble[i]) )
				{ CompMove( i ); return; }

	for( i=0; i < NumCols; i++ )
		Prioritets[i] = 5;

	for( i=0; i < NumCols; i++ )
		SetPrioritet(i);

	// выбираем один из столбцов с макс. приоритетом
	var Max=0, NumMax=0;
	for( i=0; i < NumCols; i++ )
	{
		if( Prioritets[i] > Max )
			{ Max = Prioritets[i]; NumMax = 0; }
		if( Prioritets[i] == Max )
			NumMax++;
	}

	if( !Max )
	{	
		alert("Ничья!"); 
		return;	
	}

	var Maxest = 1 + GetRandom( NumMax );
	for( i=0; Maxest > 0; i++ )
		if( Prioritets[i] == Max )
			Maxest--;

	CompMove( --i );
}

function GetRandom( max )
{
	return( Math.floor( Math.random()*max ) );
}

function ClickCell( obj, x, y )
{
	if( ClickCell.arguments.length == 1 )	{
		x=X; y=Y;
	}

	if( !fGame || !CanMove(x,y) )
		return;

	Cell[y][x] = (Player1)? 1: 2;
	obj.background = (Player1)? ColorPlayer1 : ColorPlayer2;

	if( TestWin( (Player1)?1:2, x, y ) )
		Win();

	Player1=!Player1;
	
	if( Компьютер && Компьютер !=2 )
		Компьютер = (Компьютер==1)? 3: 1;

	if( fGame && Компьютер > 1 )
	{
		fGame = 0;
		setTimeout( "CompAttack()", Delay );
	}
}

function Win()
{
	fGame = 0;
	var n = (Player1)? 1: 2;
	alert( d.all.tags("p")["Name"+n].innerText +" победил!")
}

function CompMove( i )
{
	var j = MoveAble[i];
	var CompCell = NumCols*( NumRows - j - 1 ) + i;
	fGame = 1;
	ClickCell( GameField.cells[ CompCell ], i, j );
}

function TestWin( target, x, y )
{
	var i, j;
	// по вертикали
	for( i=1; i<4 && !( y<i || Cell[y-i][x] != target ); i++ );
	if( i == 4 ) return 1;
	// по горизонтали
	for( i=1; i<4 && !( x<i || Cell[y][x-i] != target); i++ );
	for( j=1; j<4 && !( (x+j==NumCols) || Cell[y][x+j] != target ); j++ );
	if( i+j > 4 ) return 1;
	// по диагонали "/"
	for( i=1; i<4 && !( x<i || y<i || Cell[y-i][x-i] != target); i++ );
	for( j=1; j<4 && !( (x+j==NumCols) || (y+j==NumRows) || Cell[y+j][x+j] != target ); j++ );
	if( i+j > 4 ) return 1;
	// "\"
	for( i=1; i<4 && !( x<i || (y+i==NumRows) || Cell[y+i][x-i] != target); i++ );
	for( j=1; j<4 && !( (x+j==NumCols) || y<j || Cell[y-j][x+j] != target ); j++ );
	if( i+j > 4 ) return 1;
	return 0;
}

function CanMove( x, y )
{
	return ( !Cell[y][x] && (!y || (y>0 && Cell[y-1][x])) );
}

function OverCell( obj )
{
	if( PageLoaded )
	{
		X = obj.cellIndex;
		Y = (NumRows-1)-Math.floor( (obj.sourceIndex-FirstCellIndex)/(NumCols+1) );
		if( fGame && CanMove(X,Y) ) 
		{
			obj.bgColor = (Player1)? ColorActive1 : ColorActive2;
		}
	}
}

function InputName( obj )
{
	var s = prompt( "Имя:",obj.innerText );
	if( s ) obj.innerText = s;
}

function CompCheckBox( obj )
{
	var c1 = d.Player1.CompCheck.checked;
	var c2 = d.Player2.CompCheck.checked;

	if( c1 && c2 )
	{
		if( confirm("Пригодится задержка.") )
			Компьютер = 2
		else
			obj.checked=0;
	}
	else
	if( !c1 && !c2 )
		Компьютер = 0;
	else
		Компьютер = ((Player1 && c1) || (!Player1 && c2))? 3: 1;

	if( fGame && Компьютер > 1 )
		CompAttack();
}

function DisplayRules()
{
	alert("Побеждает тот, кто поставил 4 кубика подряд, в любом направлении.\n"
	+ "Игру добыл из хелпа к Stamin'е Орда.\n\n"
	+ "Хозяин игры Алексей Казанцев.\n"
	+ "www.stamina.ru"
	);
}


//	Cookie

function setCookie(name, value)
{
	var expi=new Date();
	expi.setDate( expi.getDate() + 1000 )
	document.cookie = name + "=" + escape(value) + ';expires='+expi.toGMTString()
}

function getCookie(name)
{
	var c = new String( document.cookie )
	var prefix = name + "="
	var start = c.indexOf( prefix )
	if( start == -1 )	return null
	
	var end = c.indexOf( ";", start+prefix.length )
	if( end == -1 ) end = c.length

	var value = c.substring( start + prefix.length, end )	
	return unescape( value )
}

//-->
</script>
</head>


<!-- ***************************(    BODY   )*************************** -->

<body onload="Initialize()">

<div align="center">

<table id=first_tbl border="0" cellpadding="0" width="100%" height="20%">
<tr><td width="100%" valign="middle"><H1>Fastmind</h1></tr>
</table>

<table border="0" cellpadding="0" width="100%">
<tr>
	<td width="25%" align="center" valign="top" style="padding-right: 30">
		<p id="Name1" class="PLAYER" style="border-color: blue" onclick="InputName(this);setCookie(cook_name1,this.innerText)">Орда</p>
		<form name="Player1"><input type="checkbox" name="CompCheck" onclick="CompCheckBox(this)" value="ON" id=c1><label for=c1>Компьютер</label></form>
	</td>

	<td width="50%" valign="top">
	<table ID="field" width="100%" border="1" cellpadding="0" cellspacing="0">
	<script language="JavaScript">
	var w = d.all.first_tbl.clientWidth/(2*NumCols)

	for( var i=0; i < NumRows; i++ )
	{
		document.write( "<tr>" );
		for( var j=0; j < NumCols; j++ )
		{
			document.write( "<td width=", w, " height=", w,
					" onMouseOver=OverCell(this)",
					" onMouseOut='if( !Cell[Y][X] ) this.bgColor=\"\";'",
					" onClick=ClickCell(this)>&nbsp;</td>" );
		}
		document.write( "</tr>" );
	}
	</script>
	</table>
	</td>

	<td width="25%" align="center" valign="top" style="padding-left: 30">
		<p id="Name2" class="PLAYER" style="border-color: red" onclick="InputName(this);setCookie(cook_name2,this.innerText)">Оппонент</p>
		<form name="Player2"><input type="checkbox" name="CompCheck" onclick="CompCheckBox(this)" checked value="ON" id=c2><label for=c2>Компьютер</label></form>
	</td>
</table>

<table border="0" cellpadding="0" width="100%" height="18%" cellspacing="0">
<tr>
	<td width="33%" align="left" valign="bottom">
	<form name="Rules">&nbsp; <input class=btn type="button" value="Информация" onclick="DisplayRules()"></form>
	</td>

	<td width="33%" align="center" valign="bottom">
	<form name="NewGame">

<input  type=reset value="Заново" onClick="document.field"></form>

	</td>

	<td width="33%" align="right" valign="bottom">
	<form>Эстонская игра:&nbsp; <select class=btn style="background:white;cursor:default" name="DelayList" onchange="Delay=this.options[this.selectedIndex].value">
		<option value="0" selected>0
		<option value="500">0.5
		<option value="1000">1
		<option value="1500">1.5
		<option value="2000">2
		<option value="5000">5</select> секунд задержки.&nbsp;&nbsp;
	</form>
	</td>
</tr>
</table>

</body>
</html>

EvroStandart · 22.05.2008, 12:15

1) Это JavaScript
2) Спрашивать нужно было в веб разработке
3) ColorPlayer2 = "pl2.GIF" - он пытается вставить картинку, а не закрашивать цветом
4) Скрипт глючит и толком не работает.

alexseystu · 03.06.2008, 20:52

А из-за чего скрипт глючит? И как бы его поправить?

_michelin_ · 09.06.2008, 01:33

Для начала просмотри цвет кода который ты хочешь поменять т.е запусти скрипт и посмотри код цвета.
Затем поиск нужного цвета по файлу и меняй

EvroStandart · 10.06.2008, 10:20

Цитата:

Сообщение от alexseystu

А из-за чего скрипт глючит?

Скрипт вообще кривой. Там даже цвета неправильно прописаны.

Там есть команда
Cell[y][x] = (Player1)? 1: 2;
Она для игрока срабатывает, а для компьютера нет. Если перед этой командой поставить alert(), тогда ходы игрока тоже не появляются. Наверно это какаято заморочка с активными элементами.

Ещё он победу неправильно высчитывает. В общем, там нужно не исправлять, а всё полностью переделывать. Работать лучше с именами объектов, а не с объектами.

Я немного переделал. Если мышкой поводить по всем квадратам, ходы компьютера появляются.

Код:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Fastmind</title>
<link rel=STYLESHEET type=text/css href="../style.css">

<style>
.PLAYER	
{ 
	text-align: center;
	border-width: 3px; 
	background-color: #FF0000;
	border-style: RED; 
	paddings: 3px; 
	cursor:hand
}
</style>

<script><!-- 
d = document

NumCols = 10
NumRows = 8

ColorPlayer1 = "000000"
ColorPlayer2 = "pl2.GIF"
//ColorActive1 = "#f0555"
//ColorActive2 = "#fFF00"
ColorActive1 = "#f05550"
ColorActive2 = "#fFF000"

Player1  = new Boolean(true);
Computer = 1; //Компьютер = 1;		//
fGame = 1;
Delay = 0;		//

Cell = new Array( NumRows );
for( var i=0; i < NumRows; i++ )
	Cell[i] = new Array( NumCols );
	
MoveAble = new Array( NumCols );
Prioritets = new Array( NumCols );


cook_name1 = "user_1"
cook_name2 = "user_2"


PageLoaded = false;

function Initialize()
{
	PageLoaded = true;

	// читаем имена из куков
	var value = getCookie(cook_name1)
	if( value ) Name1.innerText = value
	value = getCookie(cook_name2)
	if( value ) Name2.innerText = value

	GameField = d.all.tags("table")["field"];
	FirstCellIndex = GameField.cells[0].sourceIndex;
	StartGame();
}

function StartGame()
{
	for( var i=0; i < NumRows; i++ )
		for( var j=0; j < NumCols; j++ )
			Cell[i][j] = 0;
	for( var k=0; k < NumRows*NumCols; k++ )
		GameField.cells[k].bgColor="FFFFFF";

	fGame = 1;
	if( Computer > 1 )
		CompAttack();
}

function SetPrioritet( col )
{
	var enemy = (Player1)? 2: 1;
	var my = (Player1)? 1: 2;
	var row = MoveAble[col];

	if( row == NumRows )
	{ Prioritets[col] = 0; return; }

	if( row+1 < NumRows )
		if( TestWin(enemy,col,row+1) )
		{ Prioritets[col] = 1; return; }

	SetRelativePr( enemy, col, 0 )
	SetRelativePr(    my, col, 1 )
}

function SetRelativePr( target, col, bonus )
{
	var row = MoveAble[col];
	Cell[row][col] = target;

	for( var i=0; i<NumCols; i++ )
		if( MoveAble[i] < NumRows )
			if( TestWin(target,i,MoveAble[i]) )
			{
				Prioritets[col]++;
				Prioritets[i]++;
			}

	Cell[row][col] = 0;
}

function CompAttack()
{
	var i, j;

	// выбираем возможные ходы
	for( i=0; i<NumCols; i++ )
	{
		for( j=0; j<NumRows && !CanMove(i,j); j++ );
		// "шаг до победы"
		if( (MoveAble[i]=j) != NumRows )
			if( TestWin((Player1)?1:2, i, MoveAble[i]) )
				{ CompMove( i ); return; }
	}
			
	// "шаг до поражения"
	for( i=0; i<NumCols; i++ )
		if( MoveAble[i] != NumRows )
			if( TestWin((Player1)?2:1, i, MoveAble[i]) )
				{ CompMove( i ); return; }

	for( i=0; i < NumCols; i++ )
		Prioritets[i] = 5;

	for( i=0; i < NumCols; i++ )
		SetPrioritet(i);

	// выбираем один из столбцов с макс. приоритетом
	var Max=0, NumMax=0;
	for( i=0; i < NumCols; i++ )
	{
		if( Prioritets[i] > Max )
			{ Max = Prioritets[i]; NumMax = 0; }
		if( Prioritets[i] == Max )
			NumMax++;
	}

	if( !Max )
	{	
		alert("Ничья!"); 
		return;	
	}

	var Maxest = 1 + GetRandom( NumMax );
	for( i=0; Maxest > 0; i++ )
		if( Prioritets[i] == Max )
			Maxest--;

	CompMove( --i );
}

function GetRandom( max )
{
	return( Math.floor( Math.random()*max ) );
}

function ClickCell( obj, x, y )
{
	if( ClickCell.arguments.length == 1 )	{
		x=X; y=Y;
	}

	if( !fGame || !CanMove(x,y) )
		return;

        //alert("test " + "test2 "); // !!!
	Cell[y][x] = (Player1)? 1: 2;
	obj.background = (Player1)? ColorPlayer1 : ColorPlayer2;

	if( TestWin( (Player1)?1:2, x, y ) )
		Win();

	Player1=!Player1;
	
	if( Computer && Computer !=2 )
		Computer = (Computer==1)? 3: 1;

	if( fGame && Computer > 1 )
	{
		fGame = 0;
		setTimeout( "CompAttack()", Delay );
	}
}

function Win()
{
	fGame = 0;
	var n = (Player1)? 1: 2;
	alert( d.all.tags("p")["Name"+n].innerText +" победил!")
}

function CompMove( i )
{
	var j = MoveAble[i];
	var CompCell = NumCols*( NumRows - j - 1 ) + i;
	fGame = 1;
	//alert (GameField.cells[ CompCell ]);
	ClickCell( GameField.cells[ CompCell ], i, j );
}

function TestWin( target, x, y )
{
	var i, j;
	// по вертикали
	for( i=1; i<4 && !( y<i || Cell[y-i][x] != target ); i++ );
	if( i == 4 ) return 1;
	// по горизонтали
	for( i=1; i<4 && !( x<i || Cell[y][x-i] != target); i++ );
	for( j=1; j<4 && !( (x+j==NumCols) || Cell[y][x+j] != target ); j++ );
	if( i+j > 4 ) return 1;
	// по диагонали "/"
	for( i=1; i<4 && !( x<i || y<i || Cell[y-i][x-i] != target); i++ );
	for( j=1; j<4 && !( (x+j==NumCols) || (y+j==NumRows) || Cell[y+j][x+j] != target ); j++ );
	if( i+j > 4 ) return 1;
	// "\"
	for( i=1; i<4 && !( x<i || (y+i==NumRows) || Cell[y+i][x-i] != target); i++ );
	for( j=1; j<4 && !( (x+j==NumCols) || y<j || Cell[y-j][x+j] != target ); j++ );
	if( i+j > 4 ) return 1;
	return 0;
}

function CanMove( x, y )
{
	return ( !Cell[y][x] && (!y || (y>0 && Cell[y-1][x])) );
}

function OverCell( obj )
{
	if( PageLoaded )
	{
		X = obj.cellIndex;
		Y = (NumRows-1)-Math.floor( (obj.sourceIndex-FirstCellIndex)/(NumCols+1) );
		if( fGame && CanMove(X,Y) ) 
		{
			obj.bgColor = (Player1)? ColorActive1 : ColorActive2;
		}
		//if( obj.bgColor == ColorActive2 && ) {  alert ("color2"); }
		//if( !CanMove(X,Y)) {  alert ("can not move"); }
		//alert( !Cell[y][x] );
		if( !CanMove(X,Y)  && obj.bgColor != ColorActive1  && obj.bgColor != ColorActive2 ) 
		{  
		   //alert ("this is the place"); 
		   obj.bgColor =  ColorActive2;
		   //if(  ) {  alert ("color " + obj.bgColor); }
		}
	}
}

function InputName( obj )
{
	var s = prompt( "Имя:",obj.innerText );
	if( s ) obj.innerText = s;
}

function CompCheckBox( obj )
{
	var c1 = d.Player1.CompCheck.checked;
	var c2 = d.Player2.CompCheck.checked;

	if( c1 && c2 )
	{
		if( confirm("Пригодится задержка.") )
			Computer = 2
		else
			obj.checked=0;
	}
	else
	if( !c1 && !c2 )
		Computer = 0;
	else
		Computer = ((Player1 && c1) || (!Player1 && c2))? 3: 1;

	if( fGame && Computer > 1 )
		CompAttack();
}

function DisplayRules()
{
	alert("Побеждает тот, кто поставил 4 кубика подряд, в любом направлении.\n"
	+ "Игру добыл из хелпа к Stamin'е Орда.\n\n"
	+ "Хозяин игры Алексей Казанцев.\n"
	+ "www.stamina.ru"
	);
}


//	Cookie

function setCookie(name, value)
{
	var expi=new Date();
	expi.setDate( expi.getDate() + 1000 )
	document.cookie = name + "=" + escape(value) + ';expires='+expi.toGMTString()
}

function getCookie(name)
{
	var c = new String( document.cookie )
	var prefix = name + "="
	var start = c.indexOf( prefix )
	if( start == -1 )	return null
	
	var end = c.indexOf( ";", start+prefix.length )
	if( end == -1 ) end = c.length

	var value = c.substring( start + prefix.length, end )	
	return unescape( value )
}

//-->
</script>
</head>


<!-- ***************************(    BODY   )*************************** -->

<body onload="Initialize()">

<div align="center">

<table id=first_tbl border="0" cellpadding="0" width="100%" height="20%">
<tr><td width="100%" valign="middle"><H1>Fastmind</h1></tr>
</table>

<table border="0" cellpadding="0" width="100%">
<tr>
	<td width="25%" align="center" valign="top" style="padding-right: 30">
		<p id="Name1" class="PLAYER" style="border-color: blue" onclick="InputName(this);setCookie(cook_name1,this.innerText)">Орда</p>
		<form name="Player1"><input type="checkbox" name="CompCheck" onclick="CompCheckBox(this)" value="ON" id=c1><label for=c1>Компьютер</label></form>
	</td>

	<td width="50%" valign="top">
	<table ID="field" width="100%" border="1" cellpadding="0" cellspacing="0">
	<script language="JavaScript">
	var w = d.all.first_tbl.clientWidth/(2*NumCols)

	for( var i=0; i < NumRows; i++ )
	{
		document.write( "<tr>" );
		for( var j=0; j < NumCols; j++ )
		{
			document.write( "<td width=", w, " height=", w,
					" onMouseOver=OverCell(this)",
					" onMouseOut='if( !Cell[Y][X] ) this.bgColor=\"\";'",
					" onClick=ClickCell(this)>&nbsp;</td>" );
		}
		document.write( "</tr>" );
	}
	//Initialize();
	</script>
	</table>
	</td>

	<td width="25%" align="center" valign="top" style="padding-left: 30">
		<p id="Name2" class="PLAYER" style="border-color: red" onclick="InputName(this);setCookie(cook_name2,this.innerText)">Оппонент</p>
		<form name="Player2"><input type="checkbox" name="CompCheck" onclick="CompCheckBox(this)" checked value="ON" id=c2><label for=c2>Компьютер</label></form>
	</td>
</table>

<table border="0" cellpadding="0" width="100%" height="18%" cellspacing="0">
<tr>
	<td width="33%" align="left" valign="bottom">
	<form name="Rules">&nbsp; <input class=btn type="button" value="Информация" onclick="DisplayRules()"></form>
	</td>

	<td width="33%" align="center" valign="bottom">
	<form name="NewGame">

<input  type=reset value="Заново" onClick="document.field"></form>

	</td>

	<td width="33%" align="right" valign="bottom">
	<form>Эстонская игра:&nbsp; <select class=btn style="background:white;cursor:default" name="DelayList" onchange="Delay=this.options[this.selectedIndex].value">
		<option value="0" selected>0
		<option value="500">0.5
		<option value="1000">1
		<option value="1500">1.5
		<option value="2000">2
		<option value="5000">5</select> секунд задержки.&nbsp;&nbsp;
	</form>
	</td>
</tr>
</table>

</body>
</html>

09.06.2008, 01:33	# 4
_michelin_ Newbie Регистрация: 06.08.2007 Сообщения: 10	Для начала просмотри цвет кода который ты хочешь поменять т.е запусти скрипт и посмотри код цвета. Затем поиск нужного цвета по файлу и меняй __________________ Код, спасет мир....

22.05.2008, 12:15	# 2
EvroStandart Full Member Регистрация: 20.01.2004 Адрес: Таллинн Пол: Male Сообщения: 623	1) Это JavaScript 2) Спрашивать нужно было в веб разработке 3) ColorPlayer2 = "pl2.GIF" - он пытается вставить картинку, а не закрашивать цветом 4) Скрипт глючит и толком не работает.

03.06.2008, 20:52	# 3
alexseystu Junior Member Регистрация: 21.05.2008 Пол: Male Сообщения: 54	А из-за чего скрипт глючит? И как бы его поправить?