Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #21 (permalink)  
Старый 09.05.2017, 10:16
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 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.
Ответить с цитированием
  #22 (permalink)  
Старый 09.05.2017, 10:44
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Сообщение от Dilettante_Pro Посмотреть сообщение
Спасибо.
Тебе спасибо! )))
Ответить с цитированием
  #23 (permalink)  
Старый 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.
Ответить с цитированием
  #24 (permalink)  
Старый 09.05.2017, 13:39
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

рони,
Похоже, я телепат: я чувствовал, что что-то подобное появится
Ответить с цитированием
  #25 (permalink)  
Старый 09.05.2017, 13:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

Dilettante_Pro,
Ответить с цитированием
  #26 (permalink)  
Старый 10.05.2017, 14:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

изменил алгоритм движения кроликов пост №23

Последний раз редактировалось рони, 10.05.2017 в 14:14.
Ответить с цитированием
  #27 (permalink)  
Старый 10.05.2017, 17:11
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Прикрутил к коду Dilettante_Pro кое-что еще:
добавил некоторые элементы ООП;
добавил новый юнит - траву.

Теперь думаю над следующим:
1) Нужно реализовать эффект зарастания травы по всему полю. Т.е если на клетке трава, то через некоторое время(допустим через 4 сек) на соседней клетке (выбирается рандомно) тоже должна появиться трава.
(смотреть строку № 100) http://plnkr.co/edit/yFvDmjtbARSTLjoKK0rW?p=preview

2) Животное (красный квадратик) должно кушать эту траву и получать энергию (баллы). Если оно не ест (количество баллов = 0) - через какое-то время оно умирает.

Сейчас же животное не может даже зайти на траву, т.к. никакой юнит не может заходить на другого юнита
Ответить с цитированием
  #28 (permalink)  
Старый 10.05.2017, 17:48
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

yaparoff,
У вас при движении животных получается двойной forEach - при вызове функции moveAnimal() и внутри этой функции. Из-за этого животные прыгают как сумасшедшие
Ответить с цитированием
  #29 (permalink)  
Старый 10.05.2017, 18:34
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Сообщение от Dilettante_Pro Посмотреть сообщение
получается двойной forEach
Предлагаете убрать forEach у SetInterval (строка 129) ?

Написал вот так:
setInterval(function() {
	moveAnimal();
}, 1000);

Но интерпретатор не может понять что это за moveAnimal();
К нему надо подобраться по другому. Как?
Ответить с цитированием
  #30 (permalink)  
Старый 11.05.2017, 15:27
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 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);
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как узнать родительский элемент? alex_han Events/DOM/Window 6 06.12.2013 23:01
Скрыть элемент, который идет по известной ссылке PlayHard Общие вопросы Javascript 5 25.08.2013 23:27
Скрытный элемент. RAPOS Элементы интерфейса 4 20.07.2013 21:34
Взять элемент рандомно HETmozgov jQuery 12 16.01.2011 13:52
Кодировка при использовании Ajax Nichloas AJAX и COMET 9 17.09.2009 16:06