Форум

Shaci · #21 (**permalink**) 12.01.2011, 12:31

Сообщение от x-yuri

а зачем в эти if'ы остальной код пихать? Да и... "Правило представления: Храните знания в данных так, чтобы логика программы была тупой и надёжной." (ссылка)

var inc = {};
inc[RIGHT] = {'x': 1, 'y': 0};
inc[DOWN] = {'x': 0, 'y': 1};
inc[LEFT] = {'x': -1, 'y': 0};
inc[UP] = {'x': 0, 'y': -1};

nextX = snakeArray[firstI].x + inc[DIRECTION]['x'];
nextY = snakeArray[firstI].y + inc[DIRECTION]['y'];
if (nextX == eat.x && nextY == eat.y) {
	growth();
	eat.id = "";
	POINTS++;
	createEat();
} else
	move();

угу, так будет лучше намного

Цитата:

2) что ты хотел сказать, называя переменные и константы в верхнем регистре?

нельзя так было делать, переменную надо было в нижнем регистре

Цитата:

3) можно было бы написать более понятный код, и ошибок, скорее всего, не было б

это не оптимизация, это избавление от ненужного копипаста...

так а ошибок вроде и нет, я просто написал и как только она заработала и выложил сюда, надо конечно было код переделать

Aetae · #22 (**permalink**) 13.01.2011, 06:14

Дело было... ночью, но делать всё равно было нечего, забацал свою змейку).
Код сыроват, но вродь работает)

Пример: старая версия в опере не пашет

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<style type="text/css">
	.snakeTable {height:100px;width:600px;border:2px solid #ddf;table-layout:fixed;}
	.snakeTable * {margin:0;padding:0}
	.snakeTable td,.snakeTable tr {border:0;}
	.snakeTable td {background-color:#ddf}
	.snakeTable caption {border:2px solid #ddf;text-align:center;border-bottom:0;color: #99a;padding:2px;font:bold 12pt sans-serif;}
	.snakeTable a {color: #99a;text-decoration:none}	
	.snakeTable a:hover {color: #9a9;}	
	.snakeTable .snakeFood {background-color:#0f0}
	.snakeTable .snakeBody {background-color:#f00}
	.snakeTable table{border-collapse:collapse;width:100%;table-layout:fixed;}
	</style>
	<script type="text/javascript">
	window.onload=function(){
		(function(set){

			function addEvent(e,t,h){e.addEventListener?e.addEventListener(t,h,false):e.attachEvent("on"+t,h)}
			addEvent(document,'keydown',function(e){
				switch (e.keyCode!=way[2]&&e.keyCode){
					case false:
					break;
					case 37: //left
					way=[1,-1,39]
					break;
					case 38: //up
					way=[0,-1,40]
					break;
					case 39: //right
					way=[1,1,37]
					break;
					case 40: //down
					way=[0,1,38]
					break;
				}
			})

			var vars={
				way:[1,1,37], //направление движения
				zmey:[[0,0]], //,[0,1],[0,2],[0,3],[0,4],[0,5],[0,6],[0,7],[0,8],[0,9],[0,10],[0,11],[0,12]] //сама змейка
				points:0,  //очки
				elem:document.body, //в какой нод помещать змейку
				rows:20, //клеток y
				cells:20, //клеток х
				speed:100, //скорость
				css:'snakeTable' //класс базовой таблицы
			}

			if(set)for(var i in set)if (set.hasOwnProperty(i))vars[i]=set[i]; //меняем умолчания на заданные значения

			var lng={
				points:'POINTS: ',
				fail:'YOU FAIL!',
				speed:'SPEED',
				play:'PLAY',
				stop:'PAUSE',
				start:'START!',
				restart:'RESTART!'
			} //языковой объект)

			var d=document,way,zmey,points,time,timer;
			var e=function(h,w){ //отрисовка
				var t=d.createElement('table'),c=d.createElement('caption'),tr,i,a;
				t.className=vars.css;
				while(h--) {
					tr=t.insertRow(-1);i=w;
					while(i--)tr.insertCell(-1)
				}
				i=c.appendChild(d.createElement('table')).insertRow(-1);
				w=d.createElement('a');
				w.href='#';
				w.onclick=start;
				w.appendChild(d.createTextNode(lng.start))
				t.appendChild(c);
				return {
				caption:c,
				points:i.insertCell(-1).appendChild(d.createTextNode(lng.points+'0')),
				center:i.insertCell(-1).appendChild(w),
				time:i.insertCell(-1).appendChild(d.createTextNode('00:00')),
				table:vars.elem.appendChild(t)
				}
			}(vars.rows,vars.cells) 
			
			function start() {
				way=vars.way.slice();zmey=vars.zmey.slice();points=vars.points;time=new Date();//возвршаем умолчания
				var i=zmey.length;
				while(i--)e.table.rows[zmey[i][0]].cells[zmey[i][1]].className='snakeBody'; //первоначальная отрисовка
				makeFood();
				move();
				e.center.onclick=toggle;
				e.center.firstChild.data=lng.stop;
			}

			function restart() {
				var i=zmey.push(food)&&zmey.length;
				while(i--)e.table.rows[zmey[i][0]].cells[zmey[i][1]].className=''; //чистим поле от трупика
				start()
			}

			function toggle() {
				var txt=this.firstChild;
				if(txt.data==lng.stop){timer&&clearTimeout(timer);txt.data=lng.play}
				else{move();txt.data=lng.stop}
			}
			
			function makeFood() {
				(function(){
					var i=zmey.length;
					food=[Math.floor(Math.random()*vars.rows),Math.floor(Math.random()*vars.cells)];
					while(i--)if(food[0]==zmey[i][0]&&food[1]==zmey[i][1]){arguments.callee();break}
				})()
				e.table.rows[food[0]].cells[food[1]].className="snakeFood";
			}
			
			function move() {
				var i=zmey.length,good=true,tail;
				var head=zmey[i-1].slice(); //голова змейки
				head[way[0]]+=way[1]; //намечаем сдвиг согласно выбранному направлению
				while(i)if(zmey[--i].join()==head.join()){good=false;break} //если сдвинутая голова попадает на тело - плохо)
				if(~head[0]&&~head[1]&&head[0]<vars.rows&&head[1]<vars.cells&&good){ //проверяем не выходит ли за область и не пожирает ли себя
					zmey.push(head);
					e.table.rows[head[0]].cells[head[1]].className='snakeBody'; //добавляем в массив и отмечаем на экране
					if(food.join()==head.join()){ //если попадает на еду
						e.points.data=lng.points + ++points; //добавляем очки
						makeFood() //создаём новую еду
					}
					else{
						tail=zmey.shift(); //отрезаем хвост
						e.table.rows[tail[0]].cells[tail[1]].className='';
					}
					e.time.data=new Date(new Date()-time).toLocaleTimeString().slice(2);
					timer=setTimeout(move,vars.speed)
				}
				else{
					e.center.firstChild.data=lng.restart;
					e.center.onclick=restart
				}
				
			}
		})({cells:60,rows:10})
	}
	</script>
</head>
<body>
</body>
</html>

ksa · #23 (**permalink**) 13.01.2011, 10:48

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

ночью, но делать всё равно было нечего

Прискорбно...

Matre · #24 (**permalink**) 13.01.2011, 11:19

Aetae
у меня доходит досередины и пишет проигрыш (pause меняеться на restart)
при нажатии restart-надпись меняеться на pause и ничего непроисходит,управление неработает
opera 11

Aetae · #25 (**permalink**) 13.01.2011, 14:51

Эх, так и знал. Писал на ноуте - а тут оперы нема чтоб проверить. ff\ie работает)
Теерь до следующей ночи, когда делать бут нефига.

P.S. Всегда ненавидел оперу.=\

monolithed · #26 (**permalink**) 13.01.2011, 18:03

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

Дело было... ночью

да тут и утром попахивает

в целом, вполне неплохо, ждем в следующем релизе прохождение через стены

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

P.S. Всегда ненавидел оперу.=\

я почему-то последнее время того же мнения о этом недобраузере

x-yuri · #27 (**permalink**) 13.01.2011, 18:51

а мне с каждой новой версией все больше нравиться. Имхо, лучший браузер под windows

Aetae · #28 (**permalink**) 13.01.2011, 19:45

Частично пофиксил(всё ещё недоумеваю чем опере противны побитовые операции), но что делать с кривым отображением таблицы я хз, имхо явный глюк оперы.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<style type="text/css">
	.snakeTable {height:100px;width:600px;border:2px solid #ddf;table-layout:fixed;}
	.snakeTable * {margin:0;padding:0}
	.snakeTable td,.snakeTable tr {border:0;}
	.snakeTable td {background-color:#ddf}
	.snakeTable caption {border:2px solid #ddf;text-align:center;border-bottom:0;color: #99a;padding:2px;font:bold 12pt sans-serif;}
	.snakeTable a {color: #99a;text-decoration:none}	
	.snakeTable a:hover {color: #9a9;}	
	.snakeTable .snakeFood {background-color:#0f0}
	.snakeTable .snakeBody {background-color:#f00}
	.snakeTable table{border-collapse:collapse;width:100%;table-layout:fixed;}
	</style>
	<script type="text/javascript">
	window.onload=function(){
		(function(set){

			function addEvent(e,t,h){e.addEventListener?e.addEventListener(t,h,false):e.attachEvent("on"+t,h)}
			addEvent(document,'keydown',function(e){
				switch (e.keyCode!=way[2]&&e.keyCode){
					case false:
					break;
					case 37: //left
					way=[1,-1,39]
					break;
					case 38: //up
					way=[0,-1,40]
					break;
					case 39: //right
					way=[1,1,37]
					break;
					case 40: //down
					way=[0,1,38]
					break;
				}
			})

			var vars={
				way:[1,1,37], //направление движения
				zmey:[[0,0]], //,[0,1],[0,2],[0,3],[0,4],[0,5],[0,6],[0,7],[0,8],[0,9],[0,10],[0,11],[0,12]] //сама змейка
				points:0,  //очки
				elem:document.body, //в какой нод помещать змейку
				rows:20, //клеток y
				cells:20, //клеток х
				speed:100, //скорость
				css:'snakeTable' //класс базовой таблицы
			}

			if(set)for(var i in set)if (set.hasOwnProperty(i))vars[i]=set[i]; //меняем умолчания на заданные значения

			var lng={
				points:'POINTS: ',
				fail:'YOU FAIL!',
				speed:'SPEED',
				play:'PLAY',
				stop:'PAUSE',
				start:'START!',
				restart:'RESTART!'
			} //языковой объект)

			var d=document,way,zmey,points,time,timer;
			var e=function(h,w){ //отрисовка
				var t=d.createElement('table'),c=d.createElement('caption'),tr,i,a;
				t.className=vars.css;
				while(h--) {
					tr=t.insertRow(-1);i=w;
					while(i--)tr.insertCell(-1)
				}
				i=c.appendChild(d.createElement('table')).insertRow(-1);
				w=d.createElement('a');
				w.href='#';
				w.onclick=start;
				w.appendChild(d.createTextNode(lng.start))
				t.appendChild(c);
				return {
				caption:c,
				points:i.insertCell(-1).appendChild(d.createTextNode(lng.points+'0')),
				center:i.insertCell(-1).appendChild(w),
				time:i.insertCell(-1).appendChild(d.createTextNode('00:00')),
				table:vars.elem.appendChild(t)
				}
			}(vars.rows,vars.cells) 
			
			function start() {
				way=vars.way.slice();zmey=vars.zmey.slice();points=vars.points;time=new Date();//возвршаем умолчания
				var i=zmey.length;
				while(i--)e.table.rows[zmey[i][0]].cells[zmey[i][1]].className='snakeBody'; //первоначальная отрисовка
				makeFood();
				move();
				e.center.onclick=toggle;
				e.center.firstChild.data=lng.stop;
			}

			function restart() {
				var i=zmey.push(food)&&zmey.length;
				while(i--)e.table.rows[zmey[i][0]].cells[zmey[i][1]].className=''; //чистим поле от трупика
				start()
			}

			function toggle() {
				var txt=this.firstChild;
				if(txt.data==lng.stop){txt.data=lng.play;timer&&clearTimeout(timer)}
				else{txt.data=lng.stop;move()}
			}
			
			function makeFood() {
				(function(){
					var i=zmey.length;
					food=[Math.floor(Math.random()*vars.rows),Math.floor(Math.random()*vars.cells)];
					while(i--)if(food[0]==zmey[i][0]&&food[1]==zmey[i][1]){arguments.callee();break}
				})()
				e.table.rows[food[0]].cells[food[1]].className="snakeFood";
			}
			
			function move() {
				var i=zmey.length,good=true,tail;
				var head=zmey[i-1].slice(); //голова змейки
				head[way[0]]+=way[1]; //намечаем сдвиг согласно выбранному направлению
				while(i)if(zmey[--i].join()==head.join()){good=false;break} //если сдвинутая голова попадает на тело - плохо)
			*!*	/* старая версия if(~head[0]&&~head[1]&&head[0]<vars.rows&&head[1]<vars.cells&&good){ кто мне скажет почему опера кладёт х*й на побитовые операции?*/ */!*
				if(head[0]>-1&&head[1]>-1&&head[0]<vars.rows&&head[1]<vars.cells&&good){
					zmey.push(head);
					e.table.rows[head[0]].cells[head[1]].className='snakeBody'; //добавляем в массив и отмечаем на экране
					if(food.join()==head.join()){ //если попадает на еду
						e.points.data=lng.points + ++points; //добавляем очки
						makeFood() //создаём новую еду
					}
					else{
						tail=zmey.shift(); //отрезаем хвост
						e.table.rows[tail[0]].cells[tail[1]].className='';
					}
					e.time.data=new Date(new Date()-time).toLocaleTimeString().slice(2);
					timer=setTimeout(move,vars.speed)
				}
				else{
					e.center.firstChild.data=lng.restart;
					e.center.onclick=restart
				}
				
			}
		})({cells:60,rows:10})
	}
	</script>
</head>
<body>
</body>
</html>

x-yuri · #29 (**permalink**) 13.01.2011, 20:01

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

но что делать с кривым отображением таблицы я хз

задать высоту ячеек, а не таблицы

Aetae · #30 (**permalink**) 13.01.2011, 20:13

Сообщение от x-yuri

задать высоту ячеек, а не таблицы

А вот те хрен.) Да - таблица становится ровнее, но цвет нижней половины всё равно отказывается меняться. Ни через style ни через className не хочет.
И вообще по уму табица должна сама равнять ячейки, это как-бэ и есть смысл таблицы.

Нет можно конечно заюзать грязный хак вызывающий принудительный репеинт - тогда да всё работает, но что за нах?
Именно за это я ненавижу оперу.

Пример: спешал фор опера: ни единого скрпта без хака

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<style type="text/css">
	.snakeTable {border:2px solid #ddf;table-layout:fixed;}
	.snakeTable * {margin:0;padding:0}
	.snakeTable td,.snakeTable tr {border:0;}
	*!*.snakeTable td {background-color:#ddf;height:6px;width:6px;} /*из-за оперы вам придётся вычислять размер ячеек вручную под нужный вам размер*/  */!*
	.snakeTable caption {border:2px solid #ddf;text-align:center;border-bottom:0;color: #99a;padding:2px;font:bold 12pt sans-serif;}
	.snakeTable a {color: #99a;text-decoration:none}	
	.snakeTable a:hover {color: #9a9;}	
	.snakeTable .snakeFood {background-color:#0f0}
	.snakeTable .snakeBody {background-color:#f00}
	.snakeTable table{border-collapse:collapse;width:100%;table-layout:fixed;}
	</style>
	<script type="text/javascript">
	window.onload=function(){
		(function(set){

			function addEvent(e,t,h){e.addEventListener?e.addEventListener(t,h,false):e.attachEvent("on"+t,h)}
			addEvent(document,'keydown',function(e){
				switch (e.keyCode!=way[2]&&e.keyCode){
					case false:
					break;
					case 37: //left
					way=[1,-1,39]
					break;
					case 38: //up
					way=[0,-1,40]
					break;
					case 39: //right
					way=[1,1,37]
					break;
					case 40: //down
					way=[0,1,38]
					break;
				}
			})

			var vars={
				way:[1,1,37], //направление движения
				zmey:[[0,0]], //,[0,1],[0,2],[0,3],[0,4],[0,5],[0,6],[0,7],[0,8],[0,9],[0,10],[0,11],[0,12]] //сама змейка
				points:0,  //очки
				elem:document.body, //в какой нод помещать змейку
				rows:20, //клеток y
				cells:20, //клеток х
				speed:100, //скорость
				css:'snakeTable' //класс базовой таблицы
			}

			if(set)for(var i in set)if (set.hasOwnProperty(i))vars[i]=set[i]; //меняем умолчания на заданные значения

			var lng={
				points:'POINTS: ',
				fail:'YOU FAIL!',
				speed:'SPEED',
				play:'PLAY',
				stop:'PAUSE',
				start:'START!',
				restart:'RESTART!'
			} //языковой объект)

			var d=document,way,zmey,points,time,timer;
			var e=function(h,w){ //отрисовка
				var t=d.createElement('table'),c=d.createElement('caption'),tr,i,a;
				t.className=vars.css;
				while(h--) {
					tr=t.insertRow(-1);i=w;
					while(i--)tr.insertCell(-1);
				}
				i=c.appendChild(d.createElement('table')).insertRow(-1);
				w=d.createElement('a');
				w.href='#';
				w.onclick=start;
				w.appendChild(d.createTextNode(lng.start))
				t.appendChild(c);
				return {
				caption:c,
				points:i.insertCell(-1).appendChild(d.createTextNode(lng.points+'0')),
				center:i.insertCell(-1).appendChild(w),
				time:i.insertCell(-1).appendChild(d.createTextNode('00:00')),
				table:vars.elem.appendChild(t)
				}
			}(vars.rows,vars.cells) 
			
			function start() {
				way=vars.way.slice();zmey=vars.zmey.slice();points=vars.points;time=new Date();//возвршаем умолчания
				var i=zmey.length;
				while(i--)e.table.rows[zmey[i][0]].cells[zmey[i][1]].className='snakeBody'; //первоначальная отрисовка
				makeFood();
				move();
				e.center.onclick=toggle;
				e.center.firstChild.data=lng.stop;
			}

			function restart() {
				var i=zmey.push(food)&&zmey.length;
				while(i--)e.table.rows[zmey[i][0]].cells[zmey[i][1]].className=''; //чистим поле от трупика
				start()
			}

			function toggle() {
				var txt=this.firstChild;
				if(txt.data==lng.stop){txt.data=lng.play;timer&&clearTimeout(timer)}
				else{txt.data=lng.stop;move();}
			}
			
			function makeFood() {
				(function(){
					var i=zmey.length;
					food=[Math.floor(Math.random()*vars.rows),Math.floor(Math.random()*vars.cells)];
					while(i--)if(food[0]==zmey[i][0]&&food[1]==zmey[i][1]){arguments.callee();break}
				})()
				e.table.rows[food[0]].cells[food[1]].className="snakeFood";
			}
			
			function move() {
				var i=zmey.length,good=true,tail;
				var head=zmey[i-1].slice(); //голова змейки
				head[way[0]]+=way[1]; //намечаем сдвиг согласно выбранному направлению
				while(i)if(zmey[--i].join()==head.join()){good=false;break}; //если сдвинутая голова попадает на тело - плохо)
				if (head[0]>-1&&head[1]>-1&&head[0]<vars.rows&&head[1]<vars.cells&&good) { //проверяем не выходит ли за область и не пожирает ли себя
					zmey.push(head);
					e.table.rows[head[0]].cells[head[1]].className='snakeBody'; //добавляем в массив и отмечаем на экране
					if(food.join()==head.join()){ //если попадает на еду
						e.points.data=lng.points + ++points; //добавляем очки
						makeFood() //создаём новую еду
					}
					else{
						tail=zmey.shift(); //отрезаем хвост
						e.table.rows[tail[0]].cells[tail[1]].className='';
					}
					e.time.data=new Date(new Date()-time).toLocaleTimeString().slice(2);
					*!* window.opera&&(e.table.style.outlineColor="rgb("+Math.floor(Math.random()*256)+",0,0)"); //грязный хак, ибо опера блеать */!*
					timer=setTimeout(move,vars.speed)
				}
				else {
					e.center.firstChild.data=lng.restart;
					e.center.onclick=restart

				}
				
			}
		})({cells:60,rows:10})
	}
	</script>
</head>
<body>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript