CSFV Minisite5 - Profile Page Improvement

Task Overview

The goal of this challenge is make few fixes to Stormbound Profile Page.

Task Requirements

We need to apply the following changes :

• Add GET /profile as new endpoint to render the profile page.
  • Update backend logic in Profile.js controller to read user information from session if accessed using this new route. Basically, you are checking if username parameter is missing then pull from session.
• In current logic for loading user ranks tab when opening the profile page, we have this scenario :
  • If user has ranking below top 10 users, it will load the 5 users above that current user profile rank and 5 users below that user rank, and mark his row as red. And add "View More" buttons at top of table and bottom of table. (if there are more buttons to load)
  • This logic should be changed so that if user has ranking below top 10 users, then it will return all users above the current user profile rank, and 5 users below the current user profile rank, and mark it as red and table should be centered on that user row. "View More" button should appear if there is more users to load.
• Currently we are doing the sorting in the client side only against the displayed/rendered rows. When loading more items it will not populate new items based on the selected columns for sorting and the direction of sorting. This needs to be fixed so when clicking on sorting header, it should call backend, make sorting in backend, and return results to frontend.
  • You will update Profile.js#getnewRanking method to address this requirement.
  • The sorting should return same number of currently displayed items.
  • The sorting should call backend via ajax call, you must show loading indicator while ajax call is being done.
  • "View More" button should only appear if there is more items to load, if there is not, then don't display it.
• Update rank table to make the rows area scrollable, you will need to set new css rule with "overflow-y:scrollable;height:255px;"
  • Table header should not be part of scrolling area
  • "View More" button should not be part of scrolling area.

Github Code

CSFV websites code exists in private github repository http://github.com/topcoderinc

• CSFV Minisites
• CSFV CMS
• CSFV Test Data Generator
• Dependencies CSFV node modules are configured in package.json in minisite5.

Deployment Guide

Follow readme file of each repistory to deploy the application.

Deliverable

• Patch file of changes.
• Text file with notes to reviewer.

Final Submission Guidelines

.