Challenge Overview

Project Overview

Detect IT is a web application that is being developed by the World Wildlife Fund that allows comparison of trade data to identify discrepancies in reporting of imports and exports between countries which may be a sign of illegal activity.  For example: if Russia reports significantly less exports of king crab to South Korea than South Korea reports in imports of king crab from Russia, this suggests there may be some illegal trade occurring in king crab between the two countries.

This challenge is part of the Living Progress Build Challenge Blitz program.

Competition Task Overview

In this challenge, we’re going to be working on the public profile and collaboration features of the application.  As part of the DetectIT application users will be able to interrogate UN Comtrade data to do analysis and identify possible sources of illegal trade.  After they perform their analysis, the Detect IT application will allow users to publish content to a forum-like interface to share their findings publicly and have continued discussions around them.

Here are the pages that we’ll be implementing as part of the challenge:

-- Forum Listing Page:  /forum  https://github.com/topcoderinc/HP-LP-WWF-Detect-IT/blob/angular-dev/src/client/app/forum

-- Forum Detail Page:  /forumpost  https://github.com/topcoderinc/HP-LP-WWF-Detect-IT/tree/angular-dev/src/client/app/forum-post

-- Forum Create Post: /forumcreatepost  https://github.com/topcoderinc/HP-LP-WWF-Detect-IT/tree/angular-dev/src/client/app/forum-create-post

-- Profile Page:  /profile  https://github.com/topcoderinc/HP-LP-WWF-Detect-IT/tree/angular-dev/src/client/app/profile

-- Public Profile Page: /publicprofile  https://github.com/topcoderinc/HP-LP-WWF-Detect-IT/tree/angular-dev/src/client/app/public-profile

This application has a C#/ASP.NET backend services layer and an AngularJS front-end.  You should write services to make updates or retrieve data from the backend.

The forum functionality in the Detect IT site is going to use the Contentful CMS system.  We’ve set up the following content types in Contentful to support forum-based functionality:

Here are the basic credential required to pull content from the Contentful CMS:

- Content Space Name: WWF

- ContentFul Space Id:  9i1m79rt44ru

- Contentful Content Delivery API Key: d6b16c2a8821ab46dd0038fa3809923c7c3cfc52b882ea0fd61363912d19e995

- You can use this AngularJS Contentful Module on your application https://github.com/jvandemo/angular-contentful  OR suggest other Contentful for AngularJS app.

We'll be using two content types in this challenge:

Post:  
- Here’s sample query for all the Posts:

https://cdn.contentful.com/spaces/9i1m79rt44ru/entries?access_token=d6b16c2a8821ab46dd0038fa3809923c7c3cfc52b882ea0fd61363912d19e995&content_type=Parent

 

Comments:
- For all Comments

https://cdn.contentful.com/spaces/9i1m79rt44ru/entries?access_token=d6b16c2a8821ab46dd0038fa3809923c7c3cfc52b882ea0fd61363912d19e995&content_type=comment

You'll also need to publish content.  Here is an OAuth authentication token which will allow you to post content to the Contentful Content Space shownn above:  aae29fde36d7a2139c759de98bb19ce22f5ef92143f4abaa740ac8c1200785d5
 

Requirements

1. For this challenge you will need to both create and display entries in the Contentful content management system.  We have some sample code attached to this challenge which demonstrates how to do this.  There is also some Post and Comment content staged within the Contentful space itself.  Please be considerate and do not delete content which you have not entered into the space yourself.

2. It takes about 10-15 seconds for new content to be available for the display after it has been loaded to the system.  Please alert users that new content may not be available immediately.  We need to put refresh buttons on Forum Listing and Forum Posts pages so that users can easily refresh these pages to retrieve recently updated posts and comments.  In general, content should be displayed in descending most recently updated order on the screen so posts and comments that have been most recently updated should be at the top of the list.

3. On the Forum Listings page let’s remove the “Following” tab.  We won’t support that functionality in our initial version.

4. On the Forum Listing page, let’s populate the “Hot Topics” section of the page with the Titles of the Posts (as links) that have the most comments attached.  Let’s use the comments bubble from the Latest Post style in the section below to show the number of comments.

5. On the Forum Listing page, let’s populate the “Latest Post” section of the page with the Titles of the Posts (as links) ordered by Last Modified Date descending.  Looks like the current prototype supports 3 entries which is fine.  The comment bubble which displays the number of comments for a Post can just be removed, we’re using it for the Hot Forum’s section above.

6. On the Forum Post page, let’s remove the ability to upload formatted text and just make the description field a plain text area.

7. Our Post Content Type has a Graphic field.  The purpose of this field is to allow users to load a chart into the forum post which can be basis for discussion.  We should have a separate attachment field which allows users to load this graphic.  There are some some rules about what can be loaded in this field -- we should only allow images files between 400-900 pixels in width and 250-700 pixels in height.  The CMS itself has a validation to limit the type and size of the images but our app has to be configured to show the validation messages.

8. The purpose of the second attachment field is to allow users to load supporting data in spreadsheet or pdf form but we can allow this field to be less restrictive.  We don’t need to limit content type for this field.

9. Our current forum list prototype suggests that forum posts will be grouped by general topic -- “General Discussion” or “Community FAQ” or whatever.  But this isn’t the case.  Each post will create a thread that will be shown on the Forum List page.  The threads will be tagged by commodity and country and the tags will allow users to filter the post to see threads of interest.

10. The countries and commodities should be downloaded from Vertica.  Some of the names will need to be truncated to fit the current tagging format.  We should tag entries  by commodity and country name not by “code” values to make the tagging user-friendly.  Here are the credentials to the TradeData database:


Host: 54.149.189.221

Port: 5433

Database Name:  TradeData

User:  user1

Password:  pass1

 
11. Our User Profile page is basically complete but we need to add checkboxes next to each field which indicate if that field should be shared on the User’s public profile.  Username is always shared but the rest of the fields can be made private.  It is assumed that the users will only load a user avatar image into the system if they want to share it.  You’ll need to create the backend services and database infrastructure to support this functionality.

12. On the Forum Post page there are icon buttons for Sharing, Printing, and Downloading content.  Those buttons can be removed.  We won’t implement those features for the initial version of the forum implementation.  There are also “Like” feature denoted with the hearts on the comments.  Let’s remove those as well.

13. We should allow users to publish comments to existing Posts.  The user name and avatar picture should link to the publishing user’s public profile page.  Let’s show username rather than the user’s “real” name on the Forum Listings and Comments.

14. Users should be able to edit their content to update it or delete it.  Let’s allow this capability, when the user id of the current user is the same as the user id recorded in the CMS.   

Technology Overview

Java 1.5
C# / .NET 4.5+
Visual Studio 2015
ASP.NET MVC Web API
SQL Server Express 2016
REST
Angular.js
CSS
Vertica
D3.js

 


Final Submission Guidelines

Submission Deliverables

1. Complete projects that cover all the mentioned requirements

2. For the backend, we need a word based deployment guide with details on how to configure and deploy the services to IIS, and details on how to test / verify the REST services.

3. For the frontend, please provide a README in markdown format with details on how to deploy and test the pages.

4. Please keep your frontend and backend code in separate and independent folders, because they will need to be merged into different repos.

Final Submission

- For frontend, please fork the following repo: https://github.com/topcoderinc/HP-LP-WWF-Detect-IT. We are working from the angular-dev branch (which is the default).  This contains the existing front-end website code.

- For backend, please fork the following repo: https://github.com/topcoderinc/HP-LP-WWF-Detect-IT-Services. We are working from the master branch (which is the default). This contains the existing backend services code.

- You will need to request access to the repos by providing your GitHub ID in the GitHub Access thread in the forum.

- The winner will be asked to provide a pull request to each of the repos with his or her updates.

- You will still need to submit a submission.zip with your source code, build scripts, and configuration files via the challenge detail page on topcoder.com.

- Check README file to deploy this Angularjs app

- For each member, the final submission should be uploaded via the challenge detail page on topcoder.com.

 

ELIGIBLE EVENTS:

2017 TopCoder(R) Open

Review style

Final Review

Community Review Board

Approval

User Sign-Off

ID: 30055320