instruction

📋 Инструкция

Открываем ссылку в новой вкладке

Открываем консоль браузера Ctrl + Shift + I ( или F12 )

( точнее, инструменты разработчика )

Переходим на вкладку Sources

• Слева панель навигации и кнопка >>
• С ее помощью переходим в Snippets
• Создаем новый сниппет

В нем мы и будем писать код, а затем запускать его и смотреть, что у нас получилось

:person_with_blond_hair: Как создать хорошего парня:

var guy = document.body.appendChild (
    document.createElement ( 'good-boy' )
)

👹 Как создать плохого парня:

var scamp = document.body.appendChild (
    document.createElement ( 'bad-boy' )
)

👬 Методы персонажей

👴 Поменять картинку

guy.setImage ( personages [3] )

В вашем распоряжении куча персонажей ↪️

Это элементы массива personages

📐 Изменить ( установить ) размер ( высоту персонажа )

guy.setHeight ( 200 )

📌 Зафиксировать относительное положение ( используется для пересчета координат персонажа при изменении размеров окна браузера )

guy.getRelativePosition ()

📌 Гулять ( переместиться в точку, заданную массивом координат )

наберите в консоли:

guy.walk ( [ 200, 300 ] )

Опрокидывать мебель ( вредный персонаж ) или ставить мебель на место ( хороший персонаж )

наберите в консоли:

guy.mode = 'break'
guy.breakAll ()

💩 Загрязнять комнату ( вредный персонаж ) или убирать ( хороший персонаж )

наберите в консоли:

guy.mode = 'shit'
guy.showMustGoOn ()

🚬 Чтобы прекратить деятельность персонажа, достаточно набрать в консоли:

guy.mode = 'stop'

Итак, чтобы создать персонажа, нужно:

1. Создать элемент и вставить на страницу
2. Установить размер ( высоту )
3. Задать изображение для персонажа
4. Зафиксировать его относительные координаты

badBoy = document.createElement ( 'bad-boy' )
document.body.appendChild ( badBoy )
badBoy.setImage ( personages [5] )
badBoy.setHeight ( 200 )
badBoy.getRelativePosition ()

Все остальное у него будет 😏

Если кликнуть правой кнопкой мышки на персонаже, то появится контекстное меню

вредный персонаж может:

• перворачивать мебель ( break )
• загрязнять комнату ( shit )

хороший персонаж может:

• ставить мебель на место ( break )
• убирать комнату ( shit )

Если кликнуть правой кнопкой мышки на предмете в комнате, то появится контекстное меню, с помощью которого можно немного сместить предмет вправо / влево / верх / вниз