Skip to content

Commit dacfd43

Browse files
antfoo1antfoo1
authored
Add files via upload
1 parent 6397c51 commit dacfd43

File tree

10 files changed

+2963
-0
lines changed

10 files changed

+2963
-0
lines changed

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/README.md‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# Creating NodeJS and/or Web programs in Codio
2+
3+
### Make a new file
4+
Use **File > New File...** or right-click in the file tree to create a new file. You can right-click in the file tree to rename or delete files.
5+
6+
As Codio detects which file is in focus, simply put your cursor into whichever code editor you want to preview and use the "Preview Current File".
7+
8+
### View site or Current file
9+
Use the Preview button (with the "play" icon) to see a preview of the website.
10+
11+
![](https://global.codio.com/platform/readme.resources/PreviewMenuWeb.png)
12+
13+
Use the drop-down arrow to the right of the "Preview Website" option to change the button to view the current file. You can also configure your preview button to open the preview as a new tab inside Codio, or as a new tab in your browser.
14+
15+
### Running Node
16+
Use the Run button (with the "rocketship" icon) to start the current NodeJS file. To stop node, press ctrl + c in the terminal.
17+
18+
### Debug your Code
19+
Use the "Debug Current NodeJS File" on the far right of the top menu bar to launch the debugger targeting the NodeJS file your cursor is in.
20+
21+
Use your browser's built in Developer Tools to debug other web projects such as HTML/CSS.
22+
23+
### Reconfigure your Panels for easier development
24+
Use the **View > Panels** menu on the top tool bar to segment your screen.
25+
26+
Simply drag the tab of the file or terminal (the part with the name) you want to move into the new panel.
27+

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/index.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
5+
<title>Passing Arguments to Functions</title>
6+
</head>
7+
<body>
8+
<p>When you're done coding, refresh this page</p>
9+
<script src="./main-01.js"></script>
10+
<script src="./main-02.js"></script>
11+
</body>
12+
</html>

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/package-lock.json‎

Lines changed: 2812 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/package.json‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"name": "codiotests",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"directories": {
7+
"test": "test"
8+
},
9+
"scripts": {
10+
"test": "jest"
11+
},
12+
"author": "",
13+
"license": "ISC",
14+
"dependencies": {
15+
"jest": "^29.3.1",
16+
"jest-environment-jsdom": "^29.3.1",
17+
"node-notifier": "^10.0.1"
18+
}
19+
}

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/student_code/PacMan1.png‎

9.23 KB
Loading

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/student_code/PacMan2.png‎

9.7 KB
Loading

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/student_code/PacMan3.png‎

35.2 KB
Loading

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/student_code/PacMan4.png‎

28.7 KB
Loading

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/student_code/index.html‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<html>
2+
3+
<head>
4+
<title>Pacmen</title>
5+
</head>
6+
<!-- DO NOT CHANGE THIS LINE OF CODE -->
7+
<script src="./pacmen.js"></script>
8+
<body>
9+
<div id='game'>
10+
<button onclick='makeOne()' width='200' height='30'>Add PacMan</button>
11+
<button onclick='update()' width='200' height='30'>Start Game</button>
12+
</div>
13+
14+
</body>
15+
16+
</html>

‎Project Pt 2-PacMen Factory Activity/pacman-factory-exercise/student_code/pacmen.js‎

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

0 commit comments

Comments
 (0)