09.05.2017, 10:16
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
yaparoff,
Сообщение от yaparoff
|
2) Что означает noFree = true ? То что ячейка занята?
|
Ну ведь понятно же - именно это.
Сообщение от yaparoff
|
3) На 36 строке для чего мы Math.random() умножаем именно на 19 ? Затем всё это умножаем на 20 и после вычитаем fieldTop?
Почему именно так?
|
сначала получаем случайное число от 0 до 19 - т.к у нас 20 ячеек по вертикали и по горизонтали, а потом умножаем на 20 - размер ячейки, корректируем полученные координаты относительно положения контейнера
Сообщение от yaparoff
|
4) Что означает эта запись (строка 40):
if(units[i].top == unitTop && units[i].left == unitLeft) noFree = true;
|
если две новых координаты unitTop и unitLeft есть у каких-то units - ячейка занята
Сообщение от yaparoff
|
5) Для чего в 60-ой строке стоит noFree = true; ?
|
Убрать значение предыдущей итерации. Чтобы цикл do-while заработал.
Сообщение от yaparoff
|
6) Для чего нужен второй цикл на 71 строке ?
|
Первый цикл - новые координаты для животных, второй - проверка занятости ячеек
Сообщение от yaparoff
|
7) Строки 77 и 79: для чего мы задаем одно и то же значение для units[i].left и animals[i].left ?
|
Запоминаем новые позиции животных.
units - все элементы - камни и животные, для проверки занятости ячеек
animals - животные, для управления
Сообщение от yaparoff
|
8) Как существо понимает, что на камень нельзя заходить?
|
Смотри ответ на вопрос 4
Сообщение от Diphenyl Oxalate
|
76 units[i],top = unitTop;
78 animals[i],top = unitTop;
Вот, а в strict mode бы не пустило.
|
Спасибо. Просто я писал наскоро, на смартфоне (Очень неудобно!). Специально написал, что черновик. Поправил. Убрались некоторые глюки
PS: имейте в виду, что строки скрипта немного сдвинулись в связи с расширением функциональности в последней редакции
Последний раз редактировалось Dilettante_Pro, 09.05.2017 в 10:37.
|
|
09.05.2017, 10:44
|
Кандидат Javascript-наук
|
|
Регистрация: 26.04.2016
Сообщений: 106
|
|
Сообщение от Dilettante_Pro
|
Спасибо.
|
Тебе спасибо! )))
|
|
09.05.2017, 12:42
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,075
|
|
игра кролики и клубника (передвижение обьекта в массиве рандомно)
yaparoff,
запусти кроликов в огород (клик по полю)
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
*{
padding: 0;
margin: 0;
}
.cell {
text-align: center;
float: left;
height: 23px;
width: 23px;
border: #0000CD 1px solid;
background-color: #FFEBCD;
font-size: 12px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
#matrix{
display: inline-block;
margin: 50px auto;
}
.red{
border-radius: 4px;
background-image: url(http://www.smayly.ru/gallery/big/vkBunny/12.png);
background-repeat: no-repeat;
background-size: cover;
}
.yellow{
background: #FFFF00;
}
.green{
background-image: url(http://moyhutor.net/images/klubnika2.png);
background-repeat: no-repeat;
background-size: cover;
}
.blue{
background: #0000FF
}
</style>
<script>
window.addEventListener("DOMContentLoaded", function() {
var matrix = document.getElementById("matrix"),
l = (Math.random() * 15 | 0) + 10;
t = (Math.random() * 10 | 0) + 10, n = l * t;
function createMatrix() {
var w;
for (var i = 0; i < n; i++) {
var div = document.createElement("div");
div.className = "cell";
Math.random() < .07 && div.classList.add("green");
div.dataset.index = i;
matrix.appendChild(div);
if (i == l - 1) w = matrix.offsetWidth + 1
}
matrix.style.width = w + "px";
matrix.style.display = "block"
}
function chec(indx, size) {
var s = [],
x = indx % l,
y = indx / l |
0;
size = size || 1;
for (var i = y - size; i <= y + size; i++)
for (var k = x - size; k <= x + size; k++) {
var num = k + i * l,
max = Math.max(Math.abs(i - y), Math.abs(k - x));
i > -1 && i < t && k > -1 && k < l && num < i * l + l && num != indx? s.push(num): s.push(null)
}
return {
s: s
}
}
createMatrix();
var divs = [].slice.call(document.querySelectorAll(".cell"), 0);
matrix.addEventListener("click", function(event) {
var el = event.target,
cls = el.classList;
if (cls && cls.contains("cell") && !cls.contains("green") && !cls.contains("red")) {
var index = el.dataset.index;
move(index, Math.random() * 8 | 0)
}
});
function move(index, num) {
var arr = chec(index, 1);
m = [];
var k = arr.s.filter(function(indx,i) {
return indx !== null && !divs[indx].classList.contains("green") && !divs[indx].classList.contains("red") && indx != index && m.push(i)
});
if (k.length) {
divs[index].classList.remove("red");
if (m.indexOf(num) == -1|| Math.random() < .17) num = m[Math.floor(Math.random() * m.length)];
k = arr.s[num];
divs[k].classList.add("red");
window.setTimeout(function() {
move(k, num)
}, 500)
}
else window.setTimeout(function() {
move(index, num)
}, 2000)
}
});
</script>
</head>
<body> <p></p>
<div id="matrix" ></div>
</body>
</html>
Последний раз редактировалось рони, 10.05.2017 в 14:08.
|
|
09.05.2017, 13:39
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
рони,
Похоже, я телепат: я чувствовал, что что-то подобное появится
|
|
09.05.2017, 13:49
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,075
|
|
Dilettante_Pro,
|
|
10.05.2017, 14:10
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,075
|
|
изменил алгоритм движения кроликов пост №23
Последний раз редактировалось рони, 10.05.2017 в 14:14.
|
|
10.05.2017, 17:11
|
Кандидат Javascript-наук
|
|
Регистрация: 26.04.2016
Сообщений: 106
|
|
Прикрутил к коду Dilettante_Pro кое-что еще:
добавил некоторые элементы ООП;
добавил новый юнит - траву.
Теперь думаю над следующим:
1) Нужно реализовать эффект зарастания травы по всему полю. Т.е если на клетке трава, то через некоторое время(допустим через 4 сек) на соседней клетке (выбирается рандомно) тоже должна появиться трава.
(смотреть строку № 100) http://plnkr.co/edit/yFvDmjtbARSTLjoKK0rW?p=preview
2) Животное (красный квадратик) должно кушать эту траву и получать энергию (баллы). Если оно не ест (количество баллов = 0) - через какое-то время оно умирает.
Сейчас же животное не может даже зайти на траву, т.к. никакой юнит не может заходить на другого юнита
|
|
10.05.2017, 17:48
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
yaparoff,
У вас при движении животных получается двойной forEach - при вызове функции moveAnimal() и внутри этой функции. Из-за этого животные прыгают как сумасшедшие
|
|
10.05.2017, 18:34
|
Кандидат Javascript-наук
|
|
Регистрация: 26.04.2016
Сообщений: 106
|
|
Сообщение от Dilettante_Pro
|
получается двойной forEach
|
Предлагаете убрать forEach у SetInterval (строка 129) ?
Написал вот так:
setInterval(function() {
moveAnimal();
}, 1000);
Но интерпретатор не может понять что это за moveAnimal();
К нему надо подобраться по другому. Как?
|
|
11.05.2017, 15:27
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
Сообщение от yaparoff
|
К нему надо подобраться по другому. Как?
|
Например, так
Animal.prototype.moveAnimal = function(i) {
var stepTop, stepLeft, unitTop, unitLeft, noFree, unitPos = {};
// for (var i = 0; i < animals.length; i++) {
noFree = true;
do {
stepTop = Math.round(Math.random() * 2 - 1) * 20;
stepLeft = Math.round(Math.random() * 2 - 1) * 20;
unitTop = +animals[i].top.replace(/\D/g,"") + stepTop;
unitLeft = +animals[i].left.replace(/\D/g,"") + stepLeft;
if (unitTop < 0 || unitLeft < 0 || unitTop > 380 || unitLeft > 380) {
noFree = true;
} else {
unitTop = unitTop + 'px';
unitLeft = unitLeft + 'px';
noFree = false;
for(var j = 0; j< units.length; j++) {
if(units[j].top == unitTop && units[j].left == unitLeft) {
noFree = true;
}
}
}
} while (noFree);
units[i].top = unitTop;
units[i].left = unitLeft;
animals[i].top = unitTop;
animals[i].left = unitLeft;
var elem = document.querySelector('#a' + i);
elem.style.top = unitTop;
elem.style.left = unitLeft;
// }
}
setInterval(function() {
newAnimals.forEach(function(animal, index) {
console.log(animal);
animal.moveAnimal(index);
});
}, 1000);
|
|
|
|