В подготовительной части мы подгружали 2 JS файла:
<script type="text/javascript" src="js/three.js"></script>
<script type="text/javascript" src="js/step1.js"/></script>Если про 1 я упоминал — это сам 3D фреймфорк, то файл «step1.js», то то что нам предстоит создать.
Преступим.
Из чего должна состоять игра самолётик? Вполне логично предположить что из самого самолетика, поля над котором он должен лететь, облаков для антуража, топливо ( в последующем мы его заменим на буквы) для полета, которое нужно собирать ну и препятствий, которые нужно облетать.
Нам нужно создать соответствующие объекты. three.js содержит «по умолчанию» ряд стандартных графических объектов, такие как шар, куб, цилиндр, пирамида и тд. — подробнее можно глянуть в описании ФВ.
Итак с объектами разобрались — но игра это не только объекты, это и «камера» от лица который мы видим «сцену» , так же это освещение и управление объектами. Для удобства создания и обновления всех объектов создадим «основной» модуль-функцию, пусть называется «init»:
window.addEventListener('load', init, false);
function init() {
// тут создаем сцену - камеру
createScene();
// тут добавляем свет, а то темно будет
createLights();
// тут появляются чать наших объектов,
// еще не все что нужно, но уже что-то
// Сам самолетик / поверхность для полета будет море / облака
createPlane();
createSea();
createSky();
// здесь в зависимости от "контроллов",
// мы будем менять положение наших объектов
// а так же генерировать изменения ландшавта
loop();
}
Давайте начнем с самого простого и понятного — наших 3D объектов :
Самолетик:
