corrections

subjects/good-practices/README.md

@@ -39,3 +39,49 @@
 ### Time Limitation
 
 - Every computing programs should execute in a time limit of 5 minutes.
+
+### Game performance
+
+Performance is essential, so that's why you have to aim for less than 16.7ms(1000ms/60f), because in 16.7ms the browsers job and your work must be completed in each frame.
+
+Use [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) to sync your changes
+
+- You can try to reuse memory to avoid jank when the garbage collector pass
+
+Jank animation can be caused by loading too much information, for instance:
+
+- **JavaScript**
+- **Styles** that considers which style apply to which element
+- **Layout** that calculates the geometry of the pages (example: recalculating the width and height of a page)
+- **Painting**, normally when layout is triggered we must repaint. Repainting an element every time it animates
+- **Compositing** that consists on placing the pages together at the end
+
+In order to improve performance we must remove the causes above, that are more costly: layout and painting.
+
+The best way to remove layout and painting is to use [`transform`](https://developer.mozilla.org/en-US/docs/Web/CSS/transform) and [`opacity`](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
+
+Removing layout can be done using transform:
+
+```js
+// bad
+// this will trigger the layout to recalculate everything and repaint it again
+box.style.left = `${x * 100}px`;
+
+// good
+// this way its possible to lose the layout
+box.style.transform = `translateX(${x * 100}px)`;
+```
+
+It is possible to remove painting by adding a layer:
+
+```css
+/* this will take care of the painting by creating a layer and transform it*/
+  #box {
+    width: 100px;
+    height: 100px;
+    ....
+    will-change: transform;
+  }
+```
+
+By creating a new layer you can remove painting, but "there is always a tradeoff". If we add to much layers it will increase the **composition** and **update tree**. In conclusion you must promote a new layer only if you now you are going to use it. Performance is the key to a good animation. "Performance is the art of avoiding work".

subjects/make-your-game/README.md

@@ -16,62 +16,34 @@ Here are some of the features you want to implement on your game:
 
 - Run the game at least at **60fps** at all time
 - You must not have frame drops!
-- You will use **RequestAnimationFrame**
+- Proper use of **RequestAnimationFrame**
 - It is very hard to predict performances in JS. So measure performances,
   to know if your code is fast. This will be tested
+- Pause menu, that includes:
+  - Continue
+  - Restart
+- A score board that must present the following tasks:
+  - **Countdown clock**: That will indicate the amount of time the player has until the game ends
+  - **Score**: That will keep a score count of the amount of XP/points that the player got while playing
+  - **Lives**: That indicates the amount of lives that the player has left
 
-### Instructions
-
-Animation must have consistent motion, so in order to have a smooth animation (without interruptions or better named: jank animation) you must achieve a special number, [**60fps**](https://blog.algolia.com/performant-web-animations/).
-
-Performance is essential, so that's why you have to aim for less than 16.7ms(1000ms/60f), because in 16.7ms the browsers job and your work must be completed in each frame.
-
-Use [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) to sync your changes
-
-- You can try to reuse memory to avoid jank when the garbage collector pass
-
-Jank animation can be caused by loading too much information, for instance:
+You must not use frameworks or canvas, the game must be implemented using just plain JS/DOM and HTML
 
-- **JavaScript**
-- **Styles** that considers which style apply to which element
-- **Layout** that calculates the geometry of the pages (example: recalculating the width and height of a page)
-- **Painting**, normally when layout is triggered we must repaint. Repainting an element every time it animates
-- **Compositing** that consists on placing the pages together at the end
-
-In order to improve performance we must remove the causes above, that are more costly: layout and painting.
-
-The best way to remove layout and painting is to use [`transform`](https://developer.mozilla.org/en-US/docs/Web/CSS/transform) and [`opacity`](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
-
-Removing layout can be done using transform:
-
-```js
-// bad
-// this will trigger the layout to recalculate everything and repaint it again
-box.style.left = `${x * 100}px`;
+### Instructions
 
-// good
-// this way its possible to lose the layout
-box.style.transform = `translateX(${x * 100}px)`;
-```
+Animation must have consistent motion, so in order to have a smooth animation (without interruptions or better named: jank animation) you must achieve a special number, [**60fps**](https://blog.algolia.com/performant-web-animations/). You can see more about performance [here](https://public.01-edu.org/subjects/good-practices/README.md)
 
-It is possible to remove painting by adding a layer:
+In order to play the game you must use only the keyboard. The usage of keyboard must be smooth, in other words you must not spam the key to move the player. But instead you must, for example maintain the key down and the player must continue to do the proper action. If the key is released the player should stop doing the action.
 
-```css
-/* this will take care of the painting by creating a layer and transform it*/
-  #box {
-    width: 100px;
-    height: 100px;
-    ....
-    will-change: transform;
-  }
-```
+Basically every motion triggered by a key must not jank or stutter.
 
-By creating a new layer you can remove painting, but "there is always a tradeoff". If we add to much layers it will increase the **composition** and **update tree**. In conclusion you must promote a new layer only if you now you are going to use it. Performance is the key to a good animation. "Performance is the art of avoiding work".
+For the Pause menu you must be able to pause the game whenever you want to do so. The frames should not drop if paused
 
 ### Pre-Approved List
 
 Your game will have to respect the genre of one of these games listed below. In other words, the main goal of the game has to be similar to one of these:
 
+- [Bomberman](https://en.wikipedia.org/wiki/Super_Bomberman)
 - [Flipper/ Pinball](https://en.wikipedia.org/wiki/Pinball)
 - [Space Invaders](https://en.wikipedia.org/wiki/Space_Invaders)
 - [Donkey Kong](https://en.wikipedia.org/wiki/Donkey_Kong)

subjects/make-your-game/audit/README.md

@@ -14,10 +14,54 @@
 
 ###### Is the game chosen from the pre-approved list?
 
+##### Try pausing the game while it is running
+
+###### Does the game display the pause menu, with the options: continue, restart and quit?
+
+##### Try pausing the game while it is running and choose the continue option
+
+###### Does the game continue?
+
+##### Try pausing the game while it is running and choose the restart option
+
+###### Does the game restart?
+
+##### Use the Dev Tool/Performance to record, try pausing the game while it is running
+
+###### Does the game present any frame drops
+
+##### Try moving the player/element using the proper commands and key to do so
+
+##### Does the player obey the commands?
+
+##### Try moving the player/element using the proper commands and key to do so
+
+###### Does the player move without spamming the key to do so?
+
 ##### Try playing the game
 
 ###### Does the game work like it should (from the pre-approved list)?
 
+##### Try playing the game
+
+###### Does the countdown clock seem to be working?
+
+##### Try playing the game
+
+###### Does the countdown clock reaches the end?
+
+##### Try playing the game allowing the countdown clock to reach the end
+
+###### Does the game end?
+
+##### Try playing the game and score some points
+
+###### Does the score seems to work like it should, by increasing at a certain action done by the player?
+
+##### Try playing the game and try losing a life
+
+###### Does the player lives seem to work like it should, by decreasing the numbers of lives of the player?
+
 ##### Try using the Dev Tool/Performance
 
 ###### Does it not present frame trop?
@@ -32,18 +76,10 @@
 
 ##### Try using the Dev Tool/performance and the option rendering with the layer ON, if possible
 
-###### Is the layers being used as less as possible?
+###### Is the layers being used as less sas possible?
 
 ###### Are the creation of the [layers being promoted](https://developers.google.com/web/fundamentals/performance/rendering/stick-to-compositor-only-properties-and-manage-layer-count) properly?
 
-##### Try moving the player/element using the proper commands to do so
-
-###### Does the player move without struggle?
-
-##### Try moving the player/element using the proper commands to do so
-
-##### Does the player obey the commands?
-
 #### Bonus
 
 ###### +Does the project runs quickly and effectively? (Favoring recursive, no unnecessary data requests, etc)

subjects/make-your-game/make-your-game-score-handling/README.md

@@ -0,0 +1,80 @@
+## scoreboard
+
+### Objectives
+
+You must follow the same [principles](https://public.01-edu.org/subjects/make-your-game/README.md) as the first subject.
+
+For this project you must take into account:
+
+- The usage of **scoreboards**
+- Creation of a **go API service** to save the data from the game into a JSON file
+  - The API should accept POST and GET request from the client side, this being the scoreboard data
+
+### Instructions
+
+Just like the first subject you must respect performance.
+
+In order to tell apart every score it should be requested a name when the player ends the game.
+
+After every game, either you win or lose, a scoreboard should be shown with the five highest scores of every game made.
+The scoreboard must display the **position**, **Name**, **score**, **time** in minutes and paginate the results with the rest of the scores. You should give to the client the percentage and the position in the scoreboard
+
+For example:
+
+```console
+Congrats O.J, you are in the top 6%, in the 2nd position.
+
+Rank| Name | Score  | time
+---------------------------
+1st | Kave | 233254 | 12:01
+2nd | A.J. | 222555 | 03:00
+3rd | O.J. | 14356  | 05:40
+4th | -.-  | 13663  | 02:34
+5th | iris | 2354   | 00:40
+
+     <- Page 1/50 ->
+```
+
+The scoreboard should be ordered by descending order, so the player with the most points should appear on first place.
+
+You will have to create a **go API service**, where you can load the data (POST), and request it (GET). This service will store the information of each play (name, score and time) in a JSON file and returns all the information when requested.
+The JSON file can be organized as you wish.
+
+Here is an example:
+
+```json
+[
+  {
+    "name": "O.j.",
+    "Rank": 3,
+    "Score": 14356,
+    "time": "05:40"
+  },
+  {
+    "name": "Kave",
+    "Rank": 1,
+    "Score": 233254,
+    "time": "12:01"
+  },
+  ....
+]
+```
+
+This project will help you learn about:
+
+- [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame)
+- [Event loop](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/EventLoop)
+- FPS
+- DOM
+- [Jank/stutter animation](https://murtada.nl/blog/going-jank-free-achieving-60-fps-smooth-websites)
+- [Transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform)/ [opacity](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
+- JSON
+- Tasks
+  - JavaScript
+  - Styles
+  - Layout
+  - Painting
+  - Compositing
+- Developer Tools
+  - [Firefox](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools)
+  - [Chrome](https://developers.google.com/web/tools/chrome-devtools)

subjects/make-your-game/make-your-game-score-handling/audit.md

@@ -0,0 +1,47 @@
+#### Functional
+
+##### Play and finish the game
+
+###### Does the scoreboard appear?
+
+##### Play and finish the game
+
+###### Does it asks for a name?
+
+##### Try making a GET request to the GO server API
+
+###### Does the request present the right information?
+
+##### Try making a POST request to the GO server API, then make a GET request to see if the information posted is correct
+
+###### Is it correct?
+
+###### Does the scoreboard have the properties position, Name and score?
+
+###### Is the scoreboard in descending scores order?
+
+###### Does the scoreboard have pagination?
+
+##### Try to see the next page
+
+###### Does it display the next page of scores?
+
+##### Play and finish the game, then search for your name
+
+###### Does the scoreboard present your name and all the right information?
+
+##### Try using the Dev Tool/Performance
+
+###### Does it not present frame drop?
+
+##### Try using the Dev Tool/Performance
+
+###### Does the game run at or around 60fps
+
+#### Bonus
+
+###### +Does the project runs quickly and effectively? (Favoring recursive, no unnecessary data requests, etc)
+
+###### +Does the code obey the [good practices](https://public.01-edu.org/subjects/good-practices/README.md)?
+
+###### +Is the code using synchronicity to increase performance?

subjects/make-your-game/score/README.md

@@ -1,37 +0,0 @@
-## score-board
-
-### Objectives
-
-You must follow the same [principles](https://public.01-edu.org/subjects/make-your-game/README.md) as the first subject.
-
-For this project you must take into account the usage of score boards.
-
-The score board must present the following tasks:
-
-- **Countdown clock**: That will indicate the amount of time the player has until the game ends
-- **Score**: That will keep a score count of the amount of XP/points that the player got while playing
-- **Lives**: That indicates the amount of lives that the player has left
-
-### Instructions
-
-Just like the first subject you must respect performance.
-
-All of this tasks can cause some issues with performance if not done properly, causing repainting. The better way to avoid it is by using opacity.
-
-This project will help you learn about:
-
-- [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame)
-- [Event loop](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/EventLoop)
-- FPS
-- DOM
-- [Jank/stutter animation](https://murtada.nl/blog/going-jank-free-achieving-60-fps-smooth-websites)
-- [Transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform)/ [opacity](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
-- Tasks
-  - JavaScript
-  - Styles
-  - Layout
-  - Painting
-  - Compositing
-- Developer Tools
-  - [Firefox](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools)
-  - [Chrome](https://developers.google.com/web/tools/chrome-devtools)

subjects/make-your-game/score/audit.md

@@ -1,55 +0,0 @@
-#### Functional
-
-###### Does animation run using `RequestAnimationFrame`?
-
-###### Does the game avoid the use of frameworks?
-
-##### Try playing the game
-
-###### Does the game runs without crashing?
-
-##### Try playing the game
-
-###### Does the countdown clock seem to be working?
-
-##### Try playing the game
-
-###### Does the countdown clock reaches the end?
-
-##### Try playing the game allowing the countdown clock to reach the end
-
-###### Does the game end?
-
-##### Try playing the game and score some points
-
-###### Does the score seems to work like it should, by increasing at a certain action done by the player?
-
-##### Try playing the game and try losing a life
-
-###### Does the player lives seem to work like it should, by decreasing the numbers of lives of the player?
-
-##### Try using the Dev Tool/Performance
-
-###### Does it not present frame drop?
-
-##### Try using the Dev Tool/Performance
-
-###### Does the game run at or around 60fps
-
-##### Try using the Dev Tool/performance and the option rendering with the paint ON, if possible
-
-###### Is the paint being used as less as possible?
-
-##### Try using the Dev Tool/performance and the option rendering with the layer ON, if possible
-
-###### Is the layers being used as less as possible?
-
-###### Are the creation of the [layers being promoted](https://developers.google.com/web/fundamentals/performance/rendering/stick-to-compositor-only-properties-and-manage-layer-count) properly?
-
-#### Bonus
-
-###### +Does the project runs quickly and effectively? (Favoring recursive, no unnecessary data requests, etc)
-
-###### +Does the code obey the [good practices](https://public.01-edu.org/subjects/good-practices/README.md)?
-
-###### +Is the code using synchronicity to increase performance?