Memory pair game from LuckyDnepr #395

LuckyDnepr · 2022-09-01T21:12:53Z

Memory Pair Game

The code is submitted in a dedicated feature branch.

Only code files are submitted.

Please, review.

stale · 2022-09-16T12:20:40Z

This issue has been automatically marked as stale because there were no activity during last 14 days. It will be closed in 7 days if no further activity occurs. Thank you for your contributions.

А. Чому так?
Найбільш розповсюджена причина: Студент не реагує на коментарі змінами коду і не задає запитань через брак часу або зміну життєвих пріоритетів. Покинуті піари відволікають менторів. Коли у студента з'явиться час, він/вона зможе перевідкрити той самий піар і продовжити роботу.

Б. Що робити, якщо в піарі нема оновлень, оскільки не зрозуміло, що треба зробити?
Варіант 1. Задати питання в самому PR.
Варіант 2. Задати питання в студентському чаті.

В. А якщо я все зробив(ла) і це ментор не рев'юває мої зміни?

Переконайся, що ти відреагував(ла) на всі коментарі або кодом, або запитаннями, або відповідями. Напиши в PR і в чаті, що чесно вважаєш, що все зроблено і попроси повторне рев'ю. Якщо щось не зрозуміло, задай запитання.
Реагуй на коментарі як менторів, так і інших учасників, включаючи ботів.
Не ігноруй прохання типу * "Let's do some self-checks ..." * "Go through the checklist below..." * "mark fulfilled requirements..." * "if you would silently ignore this recommendation, a mentor may think that you are still working on fixes"
навіть якщо вони написані ботом. Боти помічники і ментори покладаються на те, що прохання і пропозиції бота дотримуються.
Не лінись піти по лінках в коментарях, погуглити термінологію та скористатись Google Translate.
Можливо, у менторів склалися інші пріоритети через роботу, сімейні обставини і т.п. В такому разі, якщо ти зробив(ла) рекомендоване вище, то волай в чаті, що PR позначений stale, наче, все зроблено, а ментори чомусь не реагують - рятуйте!

Г. Хіба недостатньо того, що я додав(ла) коміт із змінами?
Часто буває так, що бачиш новий коміт, ідеш перевіряти, змін багато, доводиться перечитувати весь код. А потім з'ясовується, що одна невеличка зміна "відкладена на потім" чи з'являється ще один коміт і знов треба перечитувати все. Любіть нас, спілкуйтеся з нами - і ми відповімо повною взаємністю.

Традиційна пропозиція: задай питання по вищенаписаному в студентському чаті.

LuckyDnepr · 2022-09-17T08:26:58Z

PR marked as "stale", but there is no review.
Please, review my work.

LuckyDnepr · 2022-10-03T23:48:24Z

UAT done before create PR. Please review.

A-Ostrovnyy

Good work!
Please add files with markup, data, and styles.

A-Ostrovnyy · 2022-10-15T09:30:15Z

submissions/LuckyDnepr/memory-pair-game/script.js

+    const gameField = doc.querySelector(".game_field");
+    switch (numberOfCards) {
+        case 6:
+            gameField.setAttribute("style", "--cols: 3; --rows: 2");


Avoid inline styles, use CSS classes instead.

A-Ostrovnyy · 2022-10-15T09:34:49Z

submissions/LuckyDnepr/memory-pair-game/script.js

+}
+
+function checkPair() {
+    if (openedCards.length % 2 == 0) {


Suggested change

if (openedCards.length % 2 == 0) {

if (openedCards.length === 2) {

Your array.length never will be greater than 2

…orks into memory-pair-game

LuckyDnepr · 2022-10-15T17:05:41Z

Thanks for review!

When I look at code from months ago, I want to rewrite everything with new methods, new knowledge.

I think this is okay.

Result:

I have implemented all the changes you specified.
I also found a few mistakes of my own due to inexperience.

A-Ostrovnyy

Good progress!

A-Ostrovnyy · 2022-10-16T06:46:32Z

submissions/LuckyDnepr/memory-pair-game/index.html

+    <div class="fader hide"></div>
+    <div class="wrapper">
+        <header class="header hide">
+            <!-- hide -->


A-Ostrovnyy · 2022-10-16T06:47:50Z

submissions/LuckyDnepr/memory-pair-game/index.html

+                </div>
+                <div class="nav_menu themes"></div>
+                <div class="theme_image">
+                    <img src="" alt="" class="theme_image_img" />


Set some default value or generate dynamically this block.

A-Ostrovnyy · 2022-10-16T06:49:33Z

submissions/LuckyDnepr/memory-pair-game/index.html

+            </div>
+            <div class="game_field"></div>
+            <div class="modal hide">
+                <h1 class="win_text">You win!</h1>


From SEO perspective you will have a problem with two h1 headings on one page. try to use one h1 heading per page.

A-Ostrovnyy · 2022-10-16T06:50:57Z

submissions/LuckyDnepr/memory-pair-game/menu.js

+}
+
+async function readThemes(path) {
+    try {


A-Ostrovnyy · 2022-10-16T06:51:09Z

submissions/LuckyDnepr/memory-pair-game/menu.js

+        const response = await fetch(path);
+        themesData = await response.json();


You should handle fetch response status - https://www.tjvantoll.com/2015/09/13/fetch-and-errors/

A-Ostrovnyy · 2022-10-16T06:58:11Z

submissions/LuckyDnepr/memory-pair-game/style.css

+}
+
+.title {
+    text-shadow: 3px 3px 5px steelblue;


Avoid named colors in CSS, use hex, rgb(a), or hsl color scheme

A-Ostrovnyy · 2022-10-16T07:00:04Z

submissions/LuckyDnepr/memory-pair-game/style.css

+    width: 100vw;
+    position: absolute;
+    background-color: rgba(0, 0, 0, 0.733);
+    z-index: 1000;


Avoid such a big numbers for z-index

A-Ostrovnyy · 2022-10-16T07:00:29Z

submissions/LuckyDnepr/memory-pair-game/style.css

+    width: 0;
+}
+
+.nav_menu label {


Avoid styling by HTML tags except you add base styles. Reason

Why did I use tag-based styling if I added classes to all these elements? The question is more for me. Practice. More practice.

A-Ostrovnyy · 2022-10-16T07:01:55Z

submissions/LuckyDnepr/memory-pair-game/script.js

+    });
+}
+
+function generateCardsSet(sizeOfSet, highestNumber) {


Suggested change

function generateCardsSet(sizeOfSet, highestNumber) {

function generateCardsSet(sizeOfSet, count) {

Suggested change

function generateCardsSet(sizeOfSet, highestNumber) {

function generateCardsSet(sizeOfSet, quantity) {

Suggested change

function generateCardsSet(sizeOfSet, highestNumber) {

function generateCardsSet(sizeOfSet, size) {

A-Ostrovnyy · 2022-10-16T07:14:42Z

submissions/LuckyDnepr/memory-pair-game/script.js

+    let mixedSetOfPairs = [],
+        setOfPairs = [];
+    for (let i = 0; i < sizeOfSet / 2; i++) {
+        const randomNumber = Math.floor(Math.random() * highestNumber);
+        if (!setOfPairs.includes(randomNumber)) {
+            setOfPairs.push(randomNumber, randomNumber);
+        } else {
+            i--;
+        }
+    }


As for me you should take a copy of the array with images shuffle it and take first sizeOfSet / 2 elements and then work with this copy. What do you think about that?

Perhaps.

If I take the first sizeOfSet/2 elements, and then work with them.
I have to somehow get an array of sizeOfSet, in which the indexes of two cards are randomly distributed throughout the sizeOfSet. Again I'll have to shuffle everything.
If I simply glue the two shuffled sizeOfSet/2 element arrays together, I get card[i] === card[sizeOfSet/2 + i], which is too simple gameplay-wise.
I spent a lot of time thinking about randomizing the set of cards, and came to the conclusion that there's no right way to do it. I can generate a jumbled array of 2n cards in different ways.

…rks#395 (comment)

…eworks#395 (comment)

…s/frontend-2022-homeworks#395 (comment)

… based on comment kottans/frontend-2022-homeworks#395 (comment)

…ontend-2022-homeworks#395 (comment)

…95 (comment)

stale · 2023-04-14T22:03:22Z

This issue has been automatically marked as stale because there were no activity during last 14 days. It will be closed in 7 days if no further activity occurs. Thank you for your contributions.

А. Чому так?
Найбільш розповсюджена причина: Студент не реагує на коментарі змінами коду і не задає запитань через брак часу або зміну життєвих пріоритетів. Покинуті піари відволікають менторів. Коли у студента з'явиться час, він/вона зможе перевідкрити той самий піар і продовжити роботу.

Б. Що робити, якщо в піарі нема оновлень, оскільки не зрозуміло, що треба зробити?
Варіант 1. Задати питання в самому PR.
Варіант 2. Задати питання в студентському чаті.

В. А якщо я все зробив(ла) і це ментор не рев'юває мої зміни?

Переконайся, що ти відреагував(ла) на всі коментарі або кодом, або запитаннями, або відповідями. Напиши в PR і в чаті, що чесно вважаєш, що все зроблено і попроси повторне рев'ю. Якщо щось не зрозуміло, задай запитання.
Реагуй на коментарі як менторів, так і інших учасників, включаючи ботів.
Не ігноруй прохання типу * "Let's do some self-checks ..." * "Go through the checklist below..." * "mark fulfilled requirements..." * "if you would silently ignore this recommendation, a mentor may think that you are still working on fixes"
навіть якщо вони написані ботом. Боти помічники і ментори покладаються на те, що прохання і пропозиції бота дотримуються.
Не лінись піти по лінках в коментарях, погуглити термінологію та скористатись Google Translate.
Можливо, у менторів склалися інші пріоритети через роботу, сімейні обставини і т.п. В такому разі, якщо ти зробив(ла) рекомендоване вище, то волай в чаті, що PR позначений stale, наче, все зроблено, а ментори чомусь не реагують - рятуйте!

Г. Хіба недостатньо того, що я додав(ла) коміт із змінами?
Часто буває так, що бачиш новий коміт, ідеш перевіряти, змін багато, доводиться перечитувати весь код. А потім з'ясовується, що одна невеличка зміна "відкладена на потім" чи з'являється ще один коміт і знов треба перечитувати все. Любіть нас, спілкуйтеся з нами - і ми відповімо повною взаємністю.

Традиційна пропозиція: задай питання по вищенаписаному в студентському чаті.

Memory pair game from LuckyDnepr

a709782

A-Ostrovnyy added the task-MPG label Sep 2, 2022

Add some chenges based on users comments in Telegram

7f87961

stale bot added the 💤 Stale label Sep 16, 2022

stale bot removed the 💤 Stale label Sep 17, 2022

OleksiyRudenko added the Stage0.1 label Oct 1, 2022

OleksiyRudenko added the UAT-done Student confirmed User Acceptance Tests are done and collected feedback is processed label Oct 5, 2022

A-Ostrovnyy requested changes Oct 15, 2022

View reviewed changes

A-Ostrovnyy self-assigned this Oct 15, 2022

LuckyDnepr added 4 commits October 15, 2022 19:25

fix: add changes based on comments from @A-Ostrovnyy in PR

ded03bb

fix: merge after pull

e372165

Merge branch 'main' of https://github.com/kottans/frontend-2022-homew…

fcfa23f

…orks into memory-pair-game

refactor: add toggleWinWindow() function

a004638

LuckyDnepr requested a review from A-Ostrovnyy October 15, 2022 17:05

A-Ostrovnyy requested changes Oct 16, 2022

View reviewed changes

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

fix: based on comment kottans/frontend-2022-homeworks#395 (comment)

a0e36b6

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

fix: add default image. based on comment kottans/frontend-2022-homewo…

3bca747

…rks#395 (comment)

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

fix: remove second h1 tag. based on comment kottans/frontend-2022-hom…

41d6ba6

…eworks#395 (comment)

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

fix: add handle fetch status and throw error. based on comment:kottan…

6140766

…s/frontend-2022-homeworks#395 (comment)

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

fix: change color scheme in css (don't use preinstalled color words).…

06fff2a

… based on comment kottans/frontend-2022-homeworks#395 (comment)

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

fix: change z-indexes 1000->10, 1500->15. based on comment kottans/fr…

0e6dc23

…ontend-2022-homeworks#395 (comment)

LuckyDnepr added a commit to LuckyDnepr-LearningStage/Memory-game that referenced this pull request Oct 16, 2022

refactor: rename variable. based on kottans/frontend-2022-homeworks#3…

8a3b2e1

…95 (comment)

fix and refactor: implement changes based on coment from @A-Ostrovnyy

246e3ef

LuckyDnepr requested a review from A-Ostrovnyy October 16, 2022 13:59

fix: change .ttf font to .woff

4f566f8

stale bot added the 💤 Stale label Apr 14, 2023

LuckyDnepr closed this by deleting the head repository May 22, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Memory pair game from LuckyDnepr #395

Memory pair game from LuckyDnepr #395

LuckyDnepr commented Sep 1, 2022

stale bot commented Sep 16, 2022

LuckyDnepr commented Sep 17, 2022

LuckyDnepr commented Oct 3, 2022

A-Ostrovnyy left a comment

A-Ostrovnyy Oct 15, 2022

A-Ostrovnyy Oct 15, 2022

LuckyDnepr commented Oct 15, 2022

A-Ostrovnyy left a comment

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

LuckyDnepr Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

A-Ostrovnyy Oct 16, 2022

LuckyDnepr Oct 16, 2022 •

edited

Loading

stale bot commented Apr 14, 2023

	if (openedCards.length % 2 == 0) {
	if (openedCards.length === 2) {

		const response = await fetch(path);
		themesData = await response.json();

	function generateCardsSet(sizeOfSet, highestNumber) {
	function generateCardsSet(sizeOfSet, count) {

	function generateCardsSet(sizeOfSet, highestNumber) {
	function generateCardsSet(sizeOfSet, quantity) {

	function generateCardsSet(sizeOfSet, highestNumber) {
	function generateCardsSet(sizeOfSet, size) {

Memory pair game from LuckyDnepr #395

Memory pair game from LuckyDnepr #395

Conversation

LuckyDnepr commented Sep 1, 2022

Memory Pair Game

stale bot commented Sep 16, 2022

LuckyDnepr commented Sep 17, 2022

LuckyDnepr commented Oct 3, 2022

A-Ostrovnyy left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

LuckyDnepr commented Oct 15, 2022

Thanks for review!

I think this is okay.

Result:

A-Ostrovnyy left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

LuckyDnepr Oct 16, 2022 • edited Loading

Choose a reason for hiding this comment

Perhaps.

stale bot commented Apr 14, 2023

LuckyDnepr Oct 16, 2022 •

edited

Loading