Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Arcade game #289

Merged
merged 5 commits into from
Sep 26, 2022
Merged

Arcade game #289

merged 5 commits into from
Sep 26, 2022

Conversation

Levi123
Copy link
Contributor

@Levi123 Levi123 commented Aug 24, 2022

Object-Oriented JavaScript

Demo |
Code base

The code is submitted in a dedicated feature branch.

Only code files are submitted.

Please, review.

@A-Ostrovnyy A-Ostrovnyy added task-Friends irrelevant-files Files not required for the code review task-Frogger and removed task-Friends labels Aug 24, 2022
@github-actions
Copy link

Hey!

Congratulations on your PR! 😎😎😎

Let's do some self-checks to fix most common issues and to make some improvements to the code before reviewers put their hands on the code.

Go through the requirements/most common mistakes listed/linked below and fix the code as appropriate.

If you have any questions to requirements/common mistakes feel free asking them here or in Students' chat.

When you genuinely believe you are done put a comment stating that you have completed self-checks and fixed code accordingly.

Also, be aware, that if you would silently ignore this recommendation, a mentor can think that you are still working on fixes. And your PR will not be reviewed. 😒

This PR contains irrelevant files.

You can see this under Files changed tab (you will find a couple of helpful tabs right under the PR title).

Most likely, you added all files from your project, not only required and sufficient code review as instructed in section B123 of submission instructions. Also read an important note therein.

Why we want only few files?

  1. It helps code reviewers to focus on code you authored and have the workspace uncluttered with irrelevant images and transpiled files.
  2. This keeps homeworks repository small.
    For example, images add to the weight of the repo and will affect download/upload time for mentors and other students. We all care about others' time.

Please fix this issue by removing irrelevant files and add a comment stating that you did this.

Universal recommendations:

  • Give variables and functions meaningful names. Avoid generic names like item, element, key, object, array or their variations. Exception: helper functions that are specifically and intentionally designed to be multipurpose.
  • Function names should start with a verb as they denote actions; variables are normally nouns; boolean variables/functions start with is, does, has etc; variable containing multiple entities and functions returning lists contain entity name in plural form.
  • Have consistent code style and formatting. Employ Prettier to do all dirty work for you.
  • Use common sense or seek for an advice whenever requirements look ambiguous or unclear.

Also take a note of the requirements above and follow them in all your future projects.

By the way, you may proceed to the next task before this one is reviewed and merged.

Sincerely yours,
Submissions Kottachecker 😺

@github-actions
Copy link

github-actions bot commented Aug 24, 2022

discarded (related to Friends App)

@github-actions
Copy link

Hey!

Congratulations on your PR! 😎😎😎

Let's do some self-checks to fix most common issues and to make some improvements to the code before reviewers put their hands on the code.

Go through the requirements/most common mistakes listed/linked below and fix the code as appropriate.

If you have any questions to requirements/common mistakes feel free asking them here or in Students' chat.

When you genuinely believe you are done put a comment stating that you have completed self-checks and fixed code accordingly.

Also, be aware, that if you would silently ignore this recommendation, a mentor can think that you are still working on fixes. And your PR will not be reviewed. 😒

Frogger Arcade Game -- JS OO exercise check list

Relates to Object-Oriented JavaScript task.

Check-list - definition of done

  • employ ES6 features like const, let etc. (with exclusion of ES6 class syntax)

  • the code is very DRY

  • Requirements re Constants:

    • all numbers like block dimensions, initial locations are defined as named constants (e.g. const STEP = 101;) as otherwise numbers scattered across code base look cryptic; named constants add semantic meaning and improve readability
    • every number that has a semantic purpose (like those listed above) should be defined as constants; think of how your code reads - the closer to plain English the better
    • there are core constants and derived constants
      (e.g. derived constant const FIELD_WIDTH = BLOCK_WIDTH * BLOCKS_NUMBER;)
    • arrays of constants are also constants
      (e.g. const INITIAL_POSITIONS = [1,2,3,4].map(rowNumber => rowNumber * BLOCK_HEIGHT);)
    • const objects help organizing and structure const data even better
      (e.g. const PLAYER_CONF = { initialPosition: {x: 1, y: 5}, sprite: '...', ...etc... };
  • Requirements re OOP:

    • OO is implemented using JS prototype chain object model (not ES6 classes syntax)
    • classes do not refer to any global variables, like global variable player, which is an instance of Player class
      (referring to global constants and globals provided by the gaming platform like Resources is OK);
      Hint: pass Player instance as an argument to every enemy
    • Separation of Concerns principle is followed
      (e.g. update method does only rendering and doesn't contain any unrelated inline code; for example collision check is defined as a dedicated method and only called from inside update)
    • Nice To Have: properties common for some classes are generalized into a base class
      (e.g. there is Character base class, which is extended by Enemy and Player classes)
    • class extension is implemented using Subclass.prototype = Object.create(Superclass.prototype), not Subclass.prototype = new Superclass(params);; Helpful resource
  • Most common mistakes

    • Make sure target = condition ? valueWhenConditionTrue : valueWhenConditionFalse is used instead of condition ? target = valueWhenConditionTrue : target = valueWhenConditionFalse; Conditional (ternary) operator

Universal recommendations:

  • Give variables and functions meaningful names. Avoid generic names like item, element, key, object, array or their variations. Exception: helper functions that are specifically and intentionally designed to be multipurpose.
  • Function names should start with a verb as they denote actions; variables are normally nouns; boolean variables/functions start with is, does, has etc; variable containing multiple entities and functions returning lists contain entity name in plural form.
  • Have consistent code style and formatting. Employ Prettier to do all dirty work for you.
  • Use common sense or seek for an advice whenever requirements look ambiguous or unclear.

Also take a note of the requirements above and follow them in all your future projects.

By the way, you may proceed to the next task before this one is reviewed and merged.

Sincerely yours,
Submissions Kottachecker 😺

@Levi123 Levi123 closed this Aug 25, 2022
@Levi123 Levi123 reopened this Aug 25, 2022
@Levi123
Copy link
Contributor Author

Levi123 commented Aug 25, 2022

@A-Ostrovnyy Hello! Can you help me delete irrelevant files?

@A-Ostrovnyy A-Ostrovnyy removed the irrelevant-files Files not required for the code review label Aug 25, 2022
@Levi123
Copy link
Contributor Author

Levi123 commented Aug 26, 2022

@A-Ostrovnyy hello, can you check my code? I'm add main constants and checked my code against the main check-list.

Copy link
Member

@OleksiyRudenko OleksiyRudenko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Levi123 good job.
Let's take some care of peer developers that will need to collaborate on this project.

widthEnemy: 80,
heightEnemy: 60,
positionX: -100,
positionY: [50, 140, 225],
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a peer developer I am tasked to add more rows and more enemies.
I'd like to this in terms or "rows" rather than pixels.
Can we make values calculable from some basic consepts like "row number", "block height" etc?
This also relates to other pixel-based numbers across the code base that are calculable from basic concepts.
As a bonus you will have more accurate positioning of characters on the field.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a peer developer I am tasked to add more rows and more enemies. I'd like to this in terms or "rows" rather than pixels. Can we make values calculable from some basic consepts like "row number", "block height" etc? This also relates to other pixel-based numbers across the code base that are calculable from basic concepts. As a bonus you will have more accurate positioning of characters on the field.

can you give me your telegram contact?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a peer developer I am tasked to add more rows and more enemies. I'd like to this in terms or "rows" rather than pixels. Can we make values calculable from some basic consepts like "row number", "block height" etc? This also relates to other pixel-based numbers across the code base that are calculable from basic concepts. As a bonus you will have more accurate positioning of characters on the field.

i refresh my PR and DEMO. I tried to implement line work for enemy creation instead of pixel work

setTimeout(() => {
this.x = DEFAULT_PLAYER.positionX;
this.y = DEFAULT_PLAYER.positionY;
}, 300)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is 300 semantically? I know it is delay. It delays what?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is 300 semantically? I know it is delay. It delays what?

when person move to waterline, we refresh him position to default. I added delay to smoother animation.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let the constant name say this somehow

@OleksiyRudenko OleksiyRudenko self-assigned this Aug 26, 2022
@Levi123
Copy link
Contributor Author

Levi123 commented Sep 1, 2022

@OleksiyRudenko Hello, can you review my changes?

Copy link
Member

@OleksiyRudenko OleksiyRudenko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Levi123 good job!
A few improvements are still needed.

Comment on lines 124 to 137
if (valueY === 1){
enemy = new Enemy(DEFAULT_ENEMY.positionX, firstRowEnemy);
allEnemies.push(enemy);
}

if (valueY === 2){
enemy = new Enemy(DEFAULT_ENEMY.positionX, secondRowEnemy);
allEnemies.push(enemy);
}

if (valueY === 3){
enemy = new Enemy(DEFAULT_ENEMY.positionX, thirdRowEnemy);
allEnemies.push(enemy);
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a peer developer I am tasked to add two more rows to the play field.
Can we map valueY into enemy Y position?
Also is valueY is a pixel or field row?
Let the code say that.

Let's also Array#map [1,2,3] directly into allEnemies.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a peer developer I am tasked to add two more rows to the play field. Can we map valueY into enemy Y position? Also is valueY is a pixel or field row? Let the code say that.

Let's also Array#map [1,2,3] directly into allEnemies.

done

Comment on lines 95 to 100
if(player.x < this.x + DEFAULT_ENEMY.widthEnemy &&
player.x + DEFAULT_ENEMY.widthEnemy > this.x &&
player.y < this.y + DEFAULT_ENEMY.heightEnemy &&
DEFAULT_ENEMY.heightEnemy + player.y > this.y){
player.x = DEFAULT_PLAYER.positionX;
player.y = DEFAULT_PLAYER.positionY;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

* [ ] classes do not refer to any global variables, like global variable `player`, which is an instance of `Player` class
 (referring to global constants and globals provided by the gaming platform like `Resources` is OK);
 Hint: pass `Player` instance as an argument to every enemy

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

* [ ] classes do not refer to any global variables, like global variable `player`, which is an instance of `Player` class
 (referring to global constants and globals provided by the gaming platform like `Resources` is OK);
 Hint: pass `Player` instance as an argument to every enemy

done

Copy link
Member

@OleksiyRudenko OleksiyRudenko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Levi123 great job!

@OleksiyRudenko OleksiyRudenko merged commit bc02e89 into kottans:main Sep 26, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants