Giter Club home page Giter Club logo

palashbansal / pacman Goto Github PK

View Code? Open in Web Editor NEW
2.0 3.0 4.0 401 KB

Game based on collision detection in Javascript

Home Page: http://palashbansal.github.io/Pacman

License: MIT License

HTML 33.67% JavaScript 66.33%
collision game js javascript html hacktoberfest hacktoberfest2020 js13kgames js13kgames-starter hacktoberfest-accepted escapa-game hacktoberfest2021 hacktoberfest2022 hacktoberfest2019 hacktoberfest-starter hacktoberfest2023

pacman's Introduction

Pacman

Game based on collision detection.

Play game at- http://palashbansal.github.io/Pacman

I created this game in my spare time after getting inspired from the famous Escapa game- https://space.mit.edu/~linares/game.htm However, game has changed a lot since and you may not get essence of the escapa game.

How to contribute

Clone the repository in your local system.

Open index.htm in web browser (I use chrome) and start tweaking the game.

Test your changes against your browser and push changes followed by PR

Raise issues(bugs or new feature requests) from Issues section.

Create a PR solving any issues (Follow 1 PR <-> 1 Issue rule)

Please keep a stand-alone PR for code refactoring free of new features/bug-fix.

Please try to follow 1PR <-> 1commit rule. Take help of https://gist.github.com/PalashBansal/59d8119be3c1e963f2fe1827857bc9ac to squash commits.

Any contributions are highly appreciated โ˜บ

SUPPORT:

If you liked the game and would like to grab me a coffee-

Bitcoin(BTC) - 331RPAL7LsAjL2BzUKDgHsixQWepMbfchX

Paypal - https://www.paypal.com/paypalme/BansalPalash

pacman's People

Contributors

palashbansal avatar astriskit avatar mojiwa avatar palashbansalkla avatar albertodeago avatar yoaddb avatar

Stargazers

 avatar Aswin Venugopal avatar

Watchers

 avatar Aswin Venugopal avatar  avatar

pacman's Issues

Automatic paypal open with email

Is your feature request related to a problem? Please describe.

Clicking on email address should automatically open the paypal donate webpage.

favicon not visible clearly

favicon not visible clearly. to create less detailed, better visible favicon.
.
gif pacman icon would be preferable.
if gif not supported by favicon, then normal red pacman bitmap can be used.

Conditional best score storage

Description of the Issue

It is easy to keep playing game if FPS is low due to browser performing poorly. User can himself tweak the browser to get better at score.

Steps to Reproduce the Issue

  1. Provide lesser memory to browser using tools provided across internet, or use IE ๐Ÿ˜
  2. Play game while showing low fps
  3. Keep enjoying the game at easy level.

Expected Behavior

Game is easy to play and high score can be achieved easily

Actual Behavior

Score should not be considered for best score.

Game window and all icons/messages size is absolute

Description of the Issue

All game objects- logo, insctructions, game window appear fixed size. Can be changed to relative size. For, bigger resolution monitors, game looks same small size.

Steps to Reproduce the Issue

  1. Open game page on high resolution monitor, or change resolution of monitor.
  2. Game appears of same size irrespective of monitor resolution

Expected Behavior

Game objects(width and height) should be changed based on monitor resolution.

Actual Behavior

Game objects are of same size.

"Copy address" button not working

Description of the Issue

"Copy address" button not working. BTC address should be added to clipboard and tooltip should change accordingly.

Steps to Reproduce the Issue

  1. Click "Copy address" button
  2. Observe by pasting (Ctrl+v) in your notepad that BTC address not copied but the last text.

Expected Behavior

clipboard should be overwrited by btc public key

Actual Behavior

button not responding(only tooltip is appearing)

Tooltip style not correct

Copying on button "copy address" shows tooltip, gray background of which doesn't cover full text.
image

Hint of fix:
<style/> section of index.htm need to be edited

Frames per second(FPS) feature creation

Game speed can vary based on memory load on the browser and system capabilities. FPS feature can be created to indicate game being with sufficient speed or not.

Better "new game" start instead of F5

Is your feature request related to a problem? Please describe.
"โ˜บ Reload page to start new game." - can be changed to "right click to start new game" and reload of game functionality can be improved.
Its's really frustrating to keep on pressing F5

Describe the solution you'd like
Page reload should never be required. Instead, state of the game can be saved and reset after every right click from mouse event.

Code quality improvement

Too much code duplicacy. Redundant code can be removed from both index.htm and Game.js

Example-

Code snippets like-

	DetectCollision("whiteDot1");
	DetectCollision("whiteDot2");
	DetectCollision("whiteDot3");
	DetectCollision("whiteCircle");
	DetectCollision("whiteSquare");
	DetectCollision("whiteRect");
	DetectCollision("whiteSquare1");
	DetectCollision("whiteSquare2");
	DetectCollision("whiteSquare3");
	DetectCollision("whiteSquare4");
	DetectCollision("whiteSquare5");
	DetectCollision("whiteSquare6");
	DetectCollision("whiteSquare7");
	DetectCollision("whiteSquare8");

Can be created in one line after pushing all obstacles in an array and passing to DetectCollision(); like-

var whiteObstaclesArr[] = {"whiteDot1","whiteDot2",....};
foreach(var whiteObstacle in whiteObstaclesArr)
    DetectCollision(whiteObstacle);

Add support for arrow keys

Is your feature request related to a problem? Please describe.

It's a standard to provide capability for user to play with keyboard itself.

Describe the solution you'd like

Arrow keys support can be provided so gamer can just press up/down/left/right to move pacman. (2 keys simultaneously to bring diagonal movement)
Support for WASD keys would be good add-on.

Star feature

Like in many games, a star appears and player becomes immune to any kill for limited amount of time. Eg.: The famous "Super Mario bros"

A Star(or something else, open to creativity) appears for some time after random interval, at random location inside game canvas.
If player manages to hit it, make pacman immune to collision with obstacles for some time.

Support for Arrow keys

Is your feature request related to a problem? Please describe.

It's a standard to provide capability for user to play with keyboard itself.

Describe the solution you'd like

Arrow keys support can be provided so gamer can just press up/down/left/right to move pacman. (2 keys simultaneously to bring diagonal movement)
Support for WASD keys would be good add-on.

Best score gone on tab reopen

Description of the Issue

Best score is retained if-
reloading tab by reload button
or, pressing enter on URL
or, reopen closed tab
but not when reopening http://palashbansal.github.io/Collision/ again in fresh tab or window

Steps to Reproduce the Issue

  1. Play game and observe that score is saved.
  2. Close tab and open new tab with http://palashbansal.github.io/Collision/ URL
  3. Obsreve that best score is set to 0
    OR,
  4. Close all browser windows
  5. Open browser again and go to URL- http://palashbansal.github.io/Collision/
  6. Observe that best score is gone.

Expected Behavior

Best score should always be there until user himself clears "Browsing data"

Actual Behavior

Best score is gone too soon.

blink food to grab attention

Issue:
Food appears but can get unnoticed as blends with obstacles.

Solution:
None of the obstacles blinks but only moves, so blinking food will grab attention of player.
Blinking of food must happen all the time and not just in last few seconds before disappearing as happens in games usually.

Keep the basic game for what Collision is meant for

Is your feature request related to a problem? Please describe.
Bringing pacman/ghosts images changes game a lot.
Remember that game was created based on escapa game, which got lost.

Describe the solution you'd like
Better keep both the game modes.
Create an option to switch to basic game, retaining red ball/ white obstacle part.

Best score doesn't get saved

Description of the Issue

"Best Score" gets updated with "Current Score" at first run but doesn't get saved in browser cookies.

Steps to Reproduce the Issue

  1. Navigate to- http://palashbansal.github.io/Collision/
  2. Start playing game.
  3. "Best score" is changed
  4. Reload game, and find that best score reset to 0

Expected Behavior

Best score should be highest recorded until cookies are cleared.

Actual Behavior

Best score is not getting stored in browser cookies

Improve "Game Over!" message readability

Description of the Issue

Keep the message poped out for more time (eg.- 3secs) and reduce the hidden time (eg.- 1.5secs)
Also show message the moment collision happens.

Steps to Reproduce the Issue

  1. Play game and strike to any ghost
  2. wait for a while and "Game over" message appears.

Expected Behavior

Message should appear immediately and should be there on screen for longer duration.
Also, font size and color can be changed for better readability.

Actual Behavior

Message takes time to appear initially. Also, it resides for same time 1sec based on below code snippet-

	callBlink();
		}, 1000);

Collision Detected! Game Over! message not good.

Description of the Issue

"Collision Detected! Game Over!" message appears below game objects(red ball and probably white obstacles)

Steps to Reproduce the Issue

  1. Play game and lose by colliding red ball while ball is in middle of game screen

Expected Behavior

"Collision Detected! Game Over!" should be topmost layer

Actual Behavior

Some part of text "Collision Detected! Game Over!" gets hiddden behind red ball.

image

Better improvement-

"Collision Detected! Game Over!"

  1. in top most layer
  2. with bigger font size
  3. with color of better visibility(not green)

Taking bonus cherries is difficult

Description of the Issue

On successfully hovering pacman over cherry, cherry stays and is not able to detect collision with pacman.
Occurs 50% of the time.

Steps to Reproduce the Issue

  1. Wait for cherry to appear.
  2. Hover over cherry and keep moving over it. (disable collision with obstacles temporarily via code change to easily reproduce)
  3. Observe that collision is not detected.

Expected Behavior

Collision with cherry should be sensitive enough.

Actual Behavior

Not able to take bonus cherries most of the times.

create food feature, which our pacman will be eating

Is your feature request related to a problem? Please describe.
Food can be placed randomly, which can/cannot be moving. It can move by colliding with obstacles.
Pacman can eat it to get bonus score of +20 poping up in current score(and also in best score if best score is also increasing)
1 food at a time, it can be pacman game ghosts.

example images-
image
image
image

UI issue of red ball out of boundary

Description of the Issue

Red ball is going out of boundary from right and bottom edge.

Steps to Reproduce the Issue

  1. Start game by clicking red ball.
  2. move ball to right or bottom most corner
  3. observe that half ball goes out of window

Expected Behavior

ball should not go out of window like in top/left edges

Actual Behavior

ball goes out of window partially

image

Make food bounce by obstacles

Grabbing food is quite easy sometimes, can make it interesting by bouncing it off whenever any obstacle hits it.

Bouncing must happen with good speed and slowly decrease to 0 i.e. resting state.
The direction of movement of food must be determined by where the obstacle is hitting it.

Optional:
Bounce speed can vary based on which obstacle hits, a bigger obstacle creates better momentum.

Note: It may happen that 2 obstacles are hitting the food one after other, in that case, food must bounce in different direction.

Bug in greetings.yml

https://github.com/PalashBansal/Collision/pull/29/checks?check_run_id=1052962066

In header-
Run actions/first-interaction@v1

/usr/bin/docker run --name b3ac6d446532dbae243d6a2bd1c54febc8dbd_9cf1e8 --label 3b3ac6 --workdir /github/workspace --rm -e INPUT_REPO-TOKEN -e INPUT_ISSUE-MESSAGE -e INPUT_PR-MESSAGE -e HOME -e GITHUB_JOB -e GITHUB_REF -e GITHUB_SHA -e GITHUB_REPOSITORY -e GITHUB_REPOSITORY_OWNER -e GITHUB_RUN_ID -e GITHUB_RUN_NUMBER -e GITHUB_ACTOR -e GITHUB_WORKFLOW -e GITHUB_HEAD_REF -e GITHUB_BASE_REF -e GITHUB_EVENT_NAME -e GITHUB_SERVER_URL -e GITHUB_API_URL -e GITHUB_GRAPHQL_URL -e GITHUB_WORKSPACE -e GITHUB_ACTION -e GITHUB_EVENT_PATH -e RUNNER_OS -e RUNNER_TOOL_CACHE -e RUNNER_TEMP -e RUNNER_WORKSPACE -e ACTIONS_RUNTIME_URL -e ACTIONS_RUNTIME_TOKEN -e ACTIONS_CACHE_URL -e GITHUB_ACTIONS=true -e CI=true -v "/var/run/docker.sock":"/var/run/docker.sock" -v "/home/runner/work/_temp/_github_home":"/github/home" -v "/home/runner/work/_temp/_github_workflow":"/github/workflow" -v "/home/runner/work/Collision/Collision":"/github/workspace" 3b3ac6:d446532dbae243d6a2bd1c54febc8dbd
[@octokit/rest] `const Octokit = require("@octokit/rest")` is deprecated. Use `const { Octokit } = require("@octokit/rest")` instead
[@octokit/rest] `const Octokit = require("@octokit/rest")` is deprecated. Use `const { Octokit } = require("@octokit/rest")` instead
Checking if its the users first contribution
Checking...
Checking...
Adding message: Hello @xxx, thank you for submitting your first PR! -Palash to pull request 29
##[error]Resource not accessible by integration

Adhoc of #45- Improvement of movement keys functionality.

Is your feature request related to a problem? Please describe.

It's a standard to provide capability for user to play with keyboard itself. Functionality is there now but can be improved.

Describe the solution you'd like

Arrow keys support can be provided so gamer can just press up/down/left/right to move pacman. - (Already implemented in #50)

To be done-

Two keys simultaneously to bring diagonal movement(For eg.- top and right arrow or W+D to move to right up diagonal)

Game starts only on left click on pacman. Game should also start by pressing any movement key.

Red dot change to pacman

Red dot can be changed to a pacman .gif image(with mouth opening closing animation) which looks more meaningful iff-
we create an additional feature- food randomly getting placed and pacman need to be hovered over to make it eat the food(to get additional score as bonus point eg.- +20)

Score share button

A score sharing button can be created for users to share their highest score on regular social media- fb, twitter, etc.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.