[$60] - Stats row in the dashboard (mobile view)

[birdofpreyru]

Go to Dashboard, click any of the links to stats about a specific track (F2F, Code, etc.) and play with the window width.

Here is the regular large screen view:

And here is the mobile view:

Here are several things to be fixed:

1. The 3x3 squares icon next to the CODE label has lost its position - should be brough back to its place.

2. The DETAILS header has lost its style and margins below and above - should be fixed.

3. The primary stats line (percentile / challenges count / wins count) has dissapeared - should be visible.

4. Once (3) is fixed, there won't be enough space for the line, if we keep the same style as for the desktop. Let's make separate element of that line to lay them out vertically, when there is not enough space to arrange them in line, i.e.:

[ThomasKranitsas]

@birdofpreyru I'll work on this one

[ThomasKranitsas]

Actually.. is this open or not yet? I now noticed the READY TO OPEN label

[birdofpreyru]

@ThomasKranitsas Not yet :) Though, it is ready, I just didn't want to open the tickets before I publish the dummy challenge at TopCoder. Well, if you already started to work, no problem. I'll create the challenge and open other tickets soon.

[birdofpreyru]

@ThomasKranitsas Any update?

[ThomasKranitsas]

Sorry I won't be able to fix it as I'm extremely busy right now

[rushikesh90]

I can work on this

[rushikesh90]

Where exactly do you want the primary stats line in vertical view? I think it will look better if it is horizontal

[birdofpreyru]

The same place where it is in the desktop view. I don't mind keep it horizontal, if it looks good. Feel free to decrease fonts / spacing in this row in the mobile view, if it helps. Just keep in mind that at some pages this component has more than 3 values shown. Thus rearranging vertically or in few lines still may be necessary as the last resort in corner cases

[rushikesh90]

Can you tell me how can I sign NDA and add submitted challenges for temporary user. There are no challenges for the user in stats line and it is not visible for no data.

[birdofpreyru]

It is easier to tweak the App so that it loads stats not for the user logged in, but for the one you ask. To do so:

1. In /node_modules/appirio-tech-webpack-config/constants.coffee change API_URL and API_URL_V2 in the DEV section to https://api.topcoder.com/v3 and https://api.topcoder.com/v2.
2. In /app/services/user.service.js modify the getUserIdentity() function so that it always returns the handle you like, like yours or mine.
3. Restart the App, log in as before (with a user from dev backend), and you should see that all stats for the dashboard and profile page is now loaded for the user you have hardcoded in (2). Just don't forget to revert this change before submitting PR.

[rushikesh90]

I cant get the localcode running. Whenever I login it redirects to live site. As a result my code changes are not visible. Is there something I am missing? I am following Readme instructions to launch website locally.

[birdofpreyru]

When this happens, you can just manually correct URL in browser, to local.topcoder-dev.com:3000. Also, it might happen, that it redirects you to a wrong auth page. Again, you may correct it manually adding/removing -dev part in the topcoder-dev.com part of the url.

Also, if you want to run the App against the production backend, check the latest code in dev branch. I've figured out how to do it without such tweaks, and I have added corresponding note to README.md yesterday.

[rushikesh90]

The primary stats line is carousel, something like this http://codepen.io/yoanmarchal/pen/avGzBm. So even on mobile device screen , all stats can be seen by sliding after code modification. Is it necessary that all primary stats should be visible simultaneouly?

[rushikesh90]

The 3x3 square is not related to subtrack name e.g CODE. Do you want it on the same line of subtrack name or someplace else?

[birdofpreyru]

Is it necessary that all primary stats should be visible simultaneouly?

Sure! Having to scroll to see them demands extra efforts from user, not that comfortable, and has no added value. Nothing prevents us from making them just visible.

The 3x3 square is not related to subtrack name e.g CODE. Do you want it on the same line of subtrack name or someplace else?

Do you mean Not related functionally? I know, but it is located next to Code in the Desktop design, thus I want consistency. It is also obvious, that its current location in Mobile view is just a random, thus a result of styling mistake, not a result of a someone's choice.

[birdofpreyru]

@rushikesh90 Any news on this one? I am preparing to start another Bug Bash this weekend. If you are not interested in this ticket anymore, I'll open it for that Bug Bash.

[rushikesh90]

I will work on this . Give me some time.

[birdofpreyru]

@rushikesh90 Any update?

[birdofpreyru]

@rushikesh90 Sorry, as it was a lot of time and no progress, I open this ticket to other people.

[birdofpreyru]

@shizhouxing
I like what you did! Though, here are some fixes, I would like to see:

1. When I do window very narrow, the column of stats is not centered horizontally.
   
2. Currently, in mobile view, we have at most 3 stats values displayed. On some pages we have more of them, so all beside three first, dissappear in the mobile view (for example, the Marathon Matches page from the screenshot above supposed to have 4 stats counters, the last one being Wins, is missing in mobile view).
3. Probably, when the mobile view is wide enough, we can layout these stats counters in few columns, to optimally occupy available space?
4. Can we have apply these changes for the mobile view of the Dashboard?
   Are you interested to handle these corrections for additional $30?

[shizhouxing]

OK I'll try to fix them.

[shizhouxing]

@birdofpreyru It's now ready for review.