Dashboard game progression

[chinwenkai]

Added dummy data for game progression for each game. displays game progression of all games played by the user.

[barbayjuliette]

To have consistency, you could have a limited amount of games you show: like max 15-20 or 30 last games?

For the game specific data:

• If there are a lot of games, it makes the page too long and the data is not really interesting --> Show the data for each game in a modal. https://getbootstrap.com/docs/5.0/components/modal/ Either when the user clicks on a game from the dashboards (but it might be hard, since when you have many games, not all games are shown) Or (I think this might be a better user experience), from the history (https://localhost/history), for each game displayed, the user can click on a button, and it opens a modal with the specific dashboards for that game. For example, add a chart button (📊) to each history card, and when you click on it, it opens the modal with the charts. Then for the graph labels, you could just put you / opponent username.

[barbayjuliette]

Is there a way you can make this more compact? For example, show only 29/09 here, and then in the hover, you have the full date + time

[barbayjuliette]

Later: change "opponent" to the opponent's username and the player to "you" Not sure if this is possible, but can you change the rectangle to a line? This would fit more with the type of graph. Also, for some graphs, it would be nice to have 1 line or 2 explaining what the graph is trying to show. Because some graphs are not very obvious what it is trying to show right away. Ex: This game shows the evolution of ... for the last X games you played"

[barbayjuliette]

To make the pie charts smaller, you have to use !important:

gameMarginChart {

width: 500px !important;
height: 500px !important;

}

[barbayjuliette]

Can you label each axis for each graph? (for game-specific graphs, show only the number, not "points")

[barbayjuliette]

@chinwenkai Add translation for the graph labels as well: ex: Game duration / victories / losses

[chinwenkai]

Current progress

• Modal partially implemented at the end of dashboard
• Player renamed to You
• Rectangle label changed to Lines
• Pie Chart Size reduced
• Axis Titles added

To be continued

• translation for chart labels
• continue on modal implementation

[barbayjuliette]

I cannot see the axis titles. Some titles are h3, some titles are h4. --> Change all to same type

[barbayjuliette]

@chinwenkai In master, we now have the data for the games. You can see how I use it in profile. js. For the dashboards, you will need to pass the user.username to the API path.

For the game progression, we save it like this [0, 1, 1, 0, 1, 0, 1, 1]. 0 = user scores 1 = opponent scores Since the graph doesn't have the timestamps, that should be enough data.

So you can already change the game progression to the modal in /profile, since you should have all the data now. And delete it from the dashboards.

Also, it would be nice to have a graph about the tournaments. For the tournaments, the only thing we know for each is the ranking. So you could do a graph about the user ranking in the tournaments. Example: (for tournaments, it is not in the database yet) TOURNAMENTS: { "timestamp": "2015-06-15 23:30:01.000321+00:00", "results": ["guest1", "user", "guest3", "guest2"] }

• Do a global search of localStorage to see how I get the username of logged in user.

• Your branch has conflicts with master. You can try to fix them based on the instructions from GitHub below. Or I can help you on Monday. Just make sure you don't delete the translations I added.

[barbayjuliette]

When there is no data: I get this:

--> If no data: do not show any graph, show a message that says that there is no game result

When there is one game result:

Either show something, or display a message for this graph: that since there is only one game it cannot show the progression over time. It needs more data.

--> Invalid date. remove end time. Start time is not really the start time, so if you wanna use it, it is better to call it game time or something like that

I think it would make more sense if the games were shown chronologically for all graphs. Let me see with Anna if she can just send them in order, so you don't need to change anything

Modal in profile: Can you add a graph 📊 button, and when I click on it, the modal opens up. Because right now, it is bothering that you are just scrolling and it opens a modal without you choosing to open it.

Also add a description to the modal, because we don't know what the numbers on the y-axis and x-axis represent

[barbayjuliette]

The dates and time are not correct. Wrong timezone. It should be the same as in profile