@@ -2,12 +2,13 @@ | |||
<html> | |||
<head> | |||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> | |||
<title>КОЛОБОК 0.1.0</title> | |||
<title>К 0.2.0</title> | |||
<script src="https://cdn.jsdelivr.net/npm/phaser@3.54.0/dist/phaser.min.js"></script> | |||
<style> | |||
html, body { | |||
margin: 0; | |||
padding: 0; | |||
overflow: hidden; | |||
} | |||
body { | |||
@@ -5,9 +5,10 @@ | |||
*/ | |||
НастроитьМышь = мир => | |||
НастроитьМышьИКлаву = мир => | |||
{ | |||
мир.сцена.input.mouse.disableContextMenu(); | |||
мир.клавиши = мир.сцена.input.keyboard.createCursorKeys(); | |||
}; | |||
@@ -41,7 +42,74 @@ | |||
// // // // | |||
УведомитьОбУправлении = мир => | |||
УведомитьОКлаве = мир => | |||
{ | |||
var новое = { | |||
"направление": 0, | |||
"прыжок": false, | |||
}; | |||
if (мир.клавиши.left.isDown) | |||
{ | |||
новое.направление = -1; | |||
} | |||
else if (мир.клавиши.right.isDown) | |||
{ | |||
новое.направление = 1; | |||
} | |||
if (мир.клавиши.space.isDown) | |||
{ | |||
новое.прыжок = true; | |||
} | |||
if ( | |||
мир.клава && | |||
мир.клава.направление == новое.направление && | |||
мир.клава.прыжок == новое.прыжок | |||
) { | |||
// Ничего не делаем. | |||
} | |||
else | |||
{ | |||
мир.клава = новое; | |||
мир.уведомить("изменили клаву"); | |||
} | |||
}; | |||
// // // // | |||
УведомитьОбУправленииКлавой = мир => | |||
{ | |||
const естьДвижение = (мир.клава.направление != 0 || мир.клава.прыжок); | |||
// Начало движения. | |||
if (!мир.управление && естьДвижение) | |||
{ | |||
мир.управление = мир.клава; | |||
мир.уведомить("изменили управление"); | |||
} | |||
// Окончание движения. | |||
else if (мир.управление && !естьДвижение) | |||
{ | |||
мир.управление = null; | |||
мир.уведомить("изменили управление"); | |||
} | |||
// Продолжение движения. | |||
else if ( | |||
(мир.управление && естьДвижение) && | |||
( | |||
(мир.управление.направление != мир.клава.направление) || | |||
(мир.управление.прыжок != мир.клава.прыжок) | |||
) | |||
) { | |||
мир.управление = мир.клава; | |||
мир.уведомить("изменили управление"); | |||
} | |||
}; | |||
// // // // | |||
УведомитьОбУправленииМышью = мир => | |||
{ | |||
const камера = мир.сцена.cameras.main; | |||
const ширина = камера.width; | |||
@@ -95,10 +163,13 @@ | |||
мир.разобрать(` | |||
создать сцену | |||
настроить мышь | |||
настроить мышь и клаву | |||
обновить сцену | |||
уведомить о клаве | |||
уведомить о мыши | |||
изменили мышь | |||
уведомить об управлении | |||
уведомить об управлении мышью | |||
изменили клаву | |||
уведомить об управлении клавой | |||
`); | |||
@@ -7,16 +7,25 @@ | |||
ЗагрузитьРесурсыКолобка= мир => | |||
{ | |||
мир.сцена.load.image("колобок", "ресурсы/колобок/колобок_неподвижен.png"); | |||
//мир.сцена.load.image("колобок", "ресурсы/колобок/колобок_неподвижен.png"); | |||
мир.сцена.load.spritesheet( | |||
"колобок", | |||
"ресурсы/колобок/колобок.png", | |||
{ | |||
frameWidth: 97, | |||
frameHeight: 94, | |||
} | |||
); | |||
}; | |||
// // // // | |||
СоздатьКаркас = мир => | |||
СоздатьКаркасИПлатформы = мир => | |||
{ | |||
мир.каркас = мир.сцена.physics.add.staticGroup(); | |||
мир.платформы = мир.сцена.physics.add.staticGroup(); | |||
}; | |||
@@ -27,7 +36,23 @@ | |||
{ | |||
мир.колобок = мир.сцена.physics.add.sprite(100, 100, "колобок"); | |||
мир.колобок.depth = 10; | |||
//мир.колобок.setBounce(0.1); | |||
мир.сцена.anims.create({ | |||
key: "неподвижен", | |||
frames: [{ key: "колобок", frame: 0 }], | |||
frameRate: 20, | |||
}) | |||
мир.сцена.anims.create({ | |||
key: "движение", | |||
frames: мир.сцена.anims.generateFrameNumbers("колобок", { start: 23, end: 1 }), | |||
frameRate: 20, | |||
repeat: -1, | |||
}) | |||
мир.сцена.anims.create({ | |||
key: "прыжок", | |||
frames: [{ key: "колобок", frame: 24 }], | |||
frameRate: 20, | |||
}) | |||
// Следить за колобком камерой. | |||
const камера = мир.сцена.cameras.main; | |||
@@ -35,14 +60,13 @@ | |||
}; | |||
// // // // | |||
СоздатьСтолкновениеКолобкаСКаркасом = мир => | |||
СоздатьСтолкновениеКолобкаСКаркасомИПлатформами = мир => | |||
{ | |||
мир.сцена.physics.add.collider(мир.колобок, мир.каркас); | |||
мир.столкновениеПлатформы = мир.сцена.physics.add.collider(мир.колобок, мир.платформы); | |||
}; | |||
@@ -54,6 +78,7 @@ | |||
if (!мир.управление) | |||
{ | |||
мир.колобок.setVelocityX(0); | |||
мир.колобок.anims.play("неподвижен"); | |||
return; | |||
} | |||
@@ -61,16 +86,21 @@ | |||
if (мир.управление.направление == -1) | |||
{ | |||
x = -200; | |||
мир.колобок.anims.play("движение"); | |||
мир.колобок.flipX = true; | |||
} | |||
else if (мир.управление.направление == 1) | |||
{ | |||
x = 200; | |||
мир.колобок.anims.play("движение"); | |||
мир.колобок.flipX = false; | |||
} | |||
мир.колобок.setVelocityX(x); | |||
if (мир.управление.прыжок && мир.колобок.body.touching.down) | |||
{ | |||
мир.колобок.setVelocityY(-500); | |||
мир.колобок.setVelocityY(-570); | |||
мир.колобок.anims.play("прыжок"); | |||
} | |||
}; | |||
@@ -86,9 +116,9 @@ | |||
загрузить ресурсы сцены | |||
загрузить ресурсы колобка | |||
создать сцену | |||
создать каркас | |||
создать каркас и платформы | |||
создать колобка | |||
создать столкновение колобка с каркасом | |||
создать столкновение колобка с каркасом и платформами | |||
изменили управление | |||
переместить колобка | |||
`); | |||
@@ -18,23 +18,133 @@ | |||
СоздатьИзбу = мир => | |||
{ | |||
мир.сцена.add.image(0, 0, "изба").setOrigin(0, 0); | |||
}; | |||
// // // // | |||
var полСлева = мир.каркас.create(0, 585, "основа").setOrigin(0, 0); | |||
полСлева.setScale(43, 1).refreshBody(); | |||
полСлева.setVisible(false); | |||
var полСправа = мир.каркас.create(510, 585, "основа").setOrigin(0, 0); | |||
полСправа.setScale(200, 1).refreshBody(); | |||
полСправа.setVisible(false); | |||
мир.полКрышки = мир.каркас.create(300, 585, "основа").setOrigin(0, 0); | |||
мир.полКрышки.setScale(30, 1).refreshBody(); | |||
мир.полКрышки.setVisible(false); | |||
var стенаСлева = мир.каркас.create(0, 385, "основа"); | |||
стенаСлева.setScale(1, 50).refreshBody(); | |||
стенаСлева.setVisible(false); | |||
var стенаСправа = мир.каркас.create(2000, 385, "основа"); | |||
стенаСправа.setScale(1, 50).refreshBody(); | |||
стенаСправа.setVisible(false); | |||
СоздатьПолыИСтеныКаркаса = мир => | |||
{ | |||
var полы = [ | |||
{ | |||
x: 0, | |||
y: 585, | |||
ширина: 43, | |||
}, | |||
{ | |||
x: 300, | |||
y: 585, | |||
ширина: 30, | |||
}, | |||
{ | |||
x: 510, | |||
y: 585, | |||
ширина: 200, | |||
}, | |||
]; | |||
for (var номер in полы) | |||
{ | |||
var пол = полы[номер]; | |||
var элемент = мир.каркас.create(пол.x, пол.y, "основа").setOrigin(0, 0); | |||
элемент.setScale(пол.ширина, 1).refreshBody(); | |||
элемент.setVisible(false); | |||
} | |||
var стены = [ | |||
{ | |||
x: 0, | |||
y: 385, | |||
высота: 50, | |||
}, | |||
{ | |||
x: 2000, | |||
y: 385, | |||
высота: 50, | |||
}, | |||
]; | |||
for (var номер in стены) | |||
{ | |||
var стена = стены[номер]; | |||
var элемент = мир.каркас.create(стена.x, стена.y, "основа"); | |||
элемент.setScale(1, стена.высота).refreshBody(); | |||
элемент.setVisible(false); | |||
} | |||
}; | |||
// // // // | |||
СоздатьПлатформы = мир => | |||
{ | |||
var п = [ | |||
{ | |||
x: 583, | |||
y: 473, | |||
ширина: 65, | |||
}, | |||
{ | |||
x: 665, | |||
y: 340, | |||
ширина: 1, | |||
}, | |||
{ | |||
x: 770, | |||
y: 340, | |||
ширина: 1, | |||
}, | |||
{ | |||
x: 860, | |||
y: 340, | |||
ширина: 1, | |||
}, | |||
{ | |||
x: 1005, | |||
y: 355, | |||
ширина: 1, | |||
}, | |||
{ | |||
x: 620, | |||
y: 245, | |||
ширина: 35, | |||
}, | |||
{ | |||
x: 950, | |||
y: 180, | |||
ширина: 12, | |||
}, | |||
{ | |||
x: 1270, | |||
y: 427, | |||
ширина: 70, | |||
}, | |||
{ | |||
x: 1690, | |||
y: 375, | |||
ширина: 20, | |||
}, | |||
]; | |||
for (var номер in п) | |||
{ | |||
var часть = п[номер]; | |||
var элемент = мир.платформы.create(часть.x, часть.y, "основа").setOrigin(0, 0); | |||
элемент.setScale(часть.ширина, 1).refreshBody(); | |||
//элемент.setVisible(false); | |||
} | |||
}; | |||
// // // // | |||
ПозволитьПлатформамПропускатьПрыжки = мир => | |||
{ | |||
мир.платформы.children.iterate(function(платформа) { | |||
платформа.body.checkCollision.down = false; | |||
платформа.body.checkCollision.left = false; | |||
платформа.body.checkCollision.right = false; | |||
}); | |||
}; | |||
@@ -50,5 +160,8 @@ | |||
загрузить ресурсы избы | |||
создать сцену | |||
создать избу | |||
создать полы и стены каркаса | |||
создать платформы | |||
позволить платформам пропускать прыжки | |||
`); | |||
@@ -0,0 +1,53 @@ | |||
<?xml version="1.0" encoding="UTF-8"?> | |||
<spriter_data scml_version="1.0" generator="BrashMonkey Spriter" generator_version="r9"> | |||
<folder id="0"> | |||
<file id="0" name="колобок_вращение.png" width="70" height="70" pivot_x="0.5" pivot_y="0.5"/> | |||
<file id="1" name="колобок_прыжок.png" width="56" height="90" pivot_x="0.5" pivot_y="0.357143"/> | |||
</folder> | |||
<entity id="0" name="колобок"> | |||
<animation id="0" name="крутится-прыгает" length="1500" interval="100"> | |||
<mainline> | |||
<key id="0"> | |||
<object_ref id="0" timeline="0" key="0" z_index="0"/> | |||
</key> | |||
<key id="1" time="200"> | |||
<object_ref id="0" timeline="0" key="1" z_index="0"/> | |||
</key> | |||
<key id="2" time="400"> | |||
<object_ref id="0" timeline="0" key="2" z_index="0"/> | |||
</key> | |||
<key id="3" time="600"> | |||
<object_ref id="0" timeline="0" key="3" z_index="0"/> | |||
</key> | |||
<key id="4" time="800"> | |||
<object_ref id="0" timeline="0" key="4" z_index="0"/> | |||
</key> | |||
<key id="5" time="1000"> | |||
<object_ref id="0" timeline="1" key="0" z_index="0"/> | |||
</key> | |||
</mainline> | |||
<timeline id="0" name="колобок_вращение"> | |||
<key id="0"> | |||
<object folder="0" file="0" angle="0"/> | |||
</key> | |||
<key id="1" time="200"> | |||
<object folder="0" file="0" angle="90"/> | |||
</key> | |||
<key id="2" time="400"> | |||
<object folder="0" file="0" angle="180"/> | |||
</key> | |||
<key id="3" time="600"> | |||
<object folder="0" file="0" angle="270"/> | |||
</key> | |||
<key id="4" time="800" spin="0"> | |||
<object folder="0" file="0" angle="0"/> | |||
</key> | |||
</timeline> | |||
<timeline id="1" name="колобок_прыжок"> | |||
<key id="0" time="1000" spin="0"> | |||
<object folder="0" file="1"/> | |||
</key> | |||
</timeline> | |||
</animation> | |||
</entity> | |||
</spriter_data> |
@@ -0,0 +1,53 @@ | |||
<?xml version="1.0" encoding="UTF-8"?> | |||
<spriter_data scml_version="1.0" generator="BrashMonkey Spriter" generator_version="r9"> | |||
<folder id="0"> | |||
<file id="0" name="колобок_вращение.png" width="70" height="70" pivot_x="0.5" pivot_y="0.5"/> | |||
<file id="1" name="колобок_прыжок.png" width="56" height="90" pivot_x="0.5" pivot_y="0.357143"/> | |||
</folder> | |||
<entity id="0" name="колобок"> | |||
<animation id="0" name="крутится-прыгает" length="1500" interval="100"> | |||
<mainline> | |||
<key id="0"> | |||
<object_ref id="0" timeline="0" key="0" z_index="0"/> | |||
</key> | |||
<key id="1" time="200"> | |||
<object_ref id="0" timeline="0" key="1" z_index="0"/> | |||
</key> | |||
<key id="2" time="400"> | |||
<object_ref id="0" timeline="0" key="2" z_index="0"/> | |||
</key> | |||
<key id="3" time="600"> | |||
<object_ref id="0" timeline="0" key="3" z_index="0"/> | |||
</key> | |||
<key id="4" time="800"> | |||
<object_ref id="0" timeline="0" key="4" z_index="0"/> | |||
</key> | |||
<key id="5" time="1000"> | |||
<object_ref id="0" timeline="1" key="0" z_index="0"/> | |||
</key> | |||
</mainline> | |||
<timeline id="0" name="колобок_вращение"> | |||
<key id="0"> | |||
<object folder="0" file="0" angle="0"/> | |||
</key> | |||
<key id="1" time="200"> | |||
<object folder="0" file="0" angle="90"/> | |||
</key> | |||
<key id="2" time="400"> | |||
<object folder="0" file="0" angle="180"/> | |||
</key> | |||
<key id="3" time="600"> | |||
<object folder="0" file="0" angle="270"/> | |||
</key> | |||
<key id="4" time="800" spin="0"> | |||
<object folder="0" file="0" angle="0"/> | |||
</key> | |||
</timeline> | |||
<timeline id="1" name="колобок_прыжок"> | |||
<key id="0" time="1000" spin="0"> | |||
<object folder="0" file="1"/> | |||
</key> | |||
</timeline> | |||
</animation> | |||
</entity> | |||
</spriter_data> |