-
Notifications
You must be signed in to change notification settings - Fork 0
/
Pacmen.js
76 lines (68 loc) · 2.24 KB
/
Pacmen.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
var pos = 0;
const pacArray = [
['PacMan1.png', 'PacMan2.png'],
['PacMan3.png', 'PacMan4.png']
];
var direction = 0;
const pacMen = []; // This array holds all the pacmen
function setToRandom(scale) {
return {
x: Math.random() * scale,
y: Math.random() * scale
}
}
// Factory to make a PacMan at a random position with random velocity
function makePac() {
// returns an object with random values scaled {x: 33, y: 21}
let velocity = setToRandom(10); // {x:?, y:?}
let position = setToRandom(200);
// Add image to div id = game
let game = document.getElementById('game');
let newimg = document.createElement('img');
newimg.style.position = 'absolute';
newimg.src = 'PacMan1.png';
newimg.width = 100;
//
// set position here
//
newimg.style.left = position.x;
newimg.style.top = position.y;
// add new Child image to game
game.appendChild(newimg);
// return details in an object
return {
position,
velocity,
newimg
}
}
function update() {
//loop over pacmen array and move each one and move image in DOM
pacMen.forEach((item) => {
checkCollisions(item)
item.position.x += item.velocity.x;
item.position.y += item.velocity.y;
item.newimg.style.left = item.position.x;
item.newimg.style.top = item.position.y;
})
setTimeout(update, 20);
}
function checkCollisions(item) {
//
// detect collision with all walls and make pacman bounce
//
if (
item.position.x + item.velocity.x + item.newimg.width > window.innerWidth ||
item.position.x + item.velocity.x < 0
)
item.velocity.x = -item.velocity.x;
if (
item.position.y + item.velocity.y + item.newimg.height >
window.innerHeight ||
item.position.y + item.velocity.y < 0
)
item.velocity.y = -item.velocity.y;
}
function makeOne() {
pacMen.push(makePac()); // add a new PacMan
}