New topcoder Community Site - Account Profile Builder

We need to recreate the account profile pages from coderbits on the topcoder member profile. This will be a simplified version of the page that is here:

https://coderbits.com/account/profile
This will be a single page angular app for /account on topcoder using pushstate for all paths, with the base path of http://www.topcoder.com/account.
These page also should be completely in angular, written compliant to topcoder style (both code style as well as the style of the page, fonts, etc), with no reliance on the existing php other than to include a wordpress template file with calls to get header and footer. Please be sure you examine the header and footer to avoid conflicting with the parent angular environment.
Screenshots, javascript and html file of current coderbits profile builder is attached in forum.

The data on these pages will use the coderbits API, which has been updated to accept cross domain requests from *.topcoder.com. All of the endpoints used will require the tcjwt token to be included using Authorization: Bearer just like existing API calls.

The submissions should include a configuration value in config.json that defines a coderbits instance to use (cbURL), similar to apiURL, lcURL, etc. The test server for this challenge is setup here: 

https://ec2-54-164-107-36.compute-1.amazonaws.com

Be aware the cert is not valid and needs to be accepted in another tab in your browser before you can use it. This will not affect production since it will be set to https://coderbits.com in production, where the cert is valid.

The following endpoints are available for use on coderbits: (Content-Type: application/json and vallid tcjwt is required!!!)

/api/accounts (https://ec2-54-164-107-36.compute-1.amazonaws.com/api/accounts?page_size=100)

• GET request will provide a list of all accounts that coderbits supports linking for (data for Profile Builder below). Optional query string parameters are id (to get a single account by its id), page, and page_size (to support paging). For this implementation, you may set page_size to 100 for the request to get all accounts.

/api/externalaccount (https://ec2-54-164-107-36.compute-1.amazonaws.com/api/externalaccount?accountId=12&username=thabo)

• GET request will indicate whether the characters the user has typed can be linked on that external account (checks to see if a link can be made). Requires two query string parameters, accountId and username, where accountId is the external account's id from /api/accounts, and the username is the username on that external service that the person is trying to link. A 404 means the account cannot be linked and a 204 means the link can be allowed.

/api/integrations (https://ec2-54-164-107-36.compute-1.amazonaws.com/api/integrations)

• GET request provides the total list of all sites that the user (defined by the included tcjwt) has integrated. For testing purposes, you can link (non oauth) users from each account on the existing profile builder to fill this out. Feel free to use any of the accounts linked here to test: https://coderbits.com/thabo
• GET with single id (/api/integrations/71) will provide the details for a single integration. This will help for oauth accounts when you are redirected back to the page and jsut need to check the integration status of a single external account.
• PUT with an id (/api/integrations/71) and a username in the body will integrate the account. Remember the content type is json, so the data payload is a plain json string, so quotes are required, i.e. 'thabo' or "thabo"
• DELETE with and id will remove the integration and delete the associated data (Unlink from the UI).

/api/skillsknown (https://ec2-54-164-107-36.compute-1.amazonaws.com/api/skillsknown)

• GET request provides all the skills known for the user based on their current integrations, as well as whether or not those skills have been hidden (data for Skill Hider below)
• DELETE with and id will set hidden to true, and recalculate what to show/hide on the profile as a result
• PUT with an id will unset hidden on a hidden skill. This can only be done for hidden skills, you cannot put a new skill this way.

Profile Builder Page
On this new page, topcoder member will be able to build profile page from external accounts (github, Bitbucket, etc).

1. URL should be http://www.topcoder.com/account/integrations
2. Layout will be similar to https://coderbits.com/account/profile, but without sidebar. Header and footer follow the main www.topcoder.com site. Javascript and HTML of https://coderbits.com/account/profile is attached
3. Please add "Skills Found" hyperlink to top of builder form. currently it is as "Skill Identified" on sidebar
4. Tooltips next to account title should work as well as on coderbits page
5. Remove topcoder integration form (first item), since this page will be integrated to topcoder wordpress theme
6. Auto search should work as existing, please try to type "jeresig" into slideshare and ohloh or other non oauth calls, as they dont require oauth on a test account. If profile found, then "Not Found" Button will replaced with "Link" button. Please pay attention on button color change. This will be supported by the /api/externalaccount call.
7. For all non oauth calls and all other ajax calls, the angular services should use the coderbits API to link and unlink accounts on the page. This will be supported by the /api/integrations call.
8. For all oauth links, the challenge can allow the link to go to redirect coderbits to complete the oauth process and assume the oauth service on coderbits will redirect back to topcoder.com/account/profile?cb=servicename where servicename is the callback name in the #url the existing callbacks go to after the authorization is complete. For instance for geeklist, when the authorize button is hit, you can redirect the page to https://ec2-54-164-107-36.compute-1.amazonaws.com/auth?provider=Geeklist to complete the process
   The coderbits engine will still do the oauth process with the server and complete the integration, the page should recheck the status given by cb= and update accordingly by rechecking /api/integrations/id
9. Interim steps in the oauth process are required to select scope for bitbucket and github (https://ec2-54-164-107-36.compute-1.amazonaws.com/auth/githubpermission). This selection should be implemented as a showModal on the topcoder side before redirecting on to coderbits to complete the integration.

Skill Hider Page
This page will be available (displayed by AJAX) by clicking "Skills Found" on profile builder page described above.

1. URL should be : http://www.topcoder.com/account/integrations/hide
2. Please add External Account link to get user back to profile builder
3. All data on the page should be supported by the /api/skillsknown api call.
4. Checking or unchecking "Hide" checkbox will update the status of skills know by calling DELETE or PUT on the /api/skillsknown
5. icon of integrated account should be displayed on "accounts" column. Accounts list is taken from https://coderbits.com/thabo.json fileld "account", where thabo is as example. Picture links are included and should be served from the configured cbURL.

Browsers Requirements :
- IE10
- IE11
- Latest Safari
- Latest Firefox
- Latest Chrome

Deployment Guide :

Local Setup : https://gitlab.com/topcoderinc/tc-site/blob/master/README.md#local-env-setup, if want to disable local minification, please configure it on config.json

Final Submission Guidelines