Updated announcement and banner in Dashboard + Some changes related to the skill-picker in registration flow?

app/my-dashboard/notifications/news.json

@@ -1,10 +1,12 @@
 [
   {
-    "header": "TCO17",
-    "details": "Congratulations to our Champions!",
-    "backgroundImage": "tco-winners.jpg",
-    "redirectTo": "https://tco17.topcoder.com",
-    "redirectText": "Congratulations to our TCO17 Champions!",
+    "header": "TCO18",
+    "details": "Congratulations to all Stage 1 Winners!!",
+    "headerExpand": "TCO18",
+    "detailsExpand": "Congratulations to all of our Stage 1 Winners in every track!  These members have earned an all-expense paid trip to the TCO18 finals.  There are 3 more stages to go, so get competing!",
+    "backgroundImage": "stage1-winners.png",
+    "redirectTo": "https://tco18.topcoder.com",
+    "redirectText": "TCO18 Homepage",
     "live": false,
     "liveExpand": false,
     "customTag": {

app/my-dashboard/notifications/notifications.jade

@@ -9,7 +9,6 @@
     it will have same width, you can create a new .banner-row if you want place more banners
     in a new row
   .banner-row
-    a.banner.tco17(href="https://tco17.topcoder.com/")
-      img(src=require("../../../assets/images/tco17-web-logo-white.svg"), alt="TCO17")
+    span.banner.tco17
     a.banner.watson(href="https://cognitive.topcoder.com/")
       img(src=require("../../../assets/images/logo_white.png"), alt="TCO17")

app/services/group.service.js

@@ -0,0 +1,27 @@
+import angular from 'angular'
+
+(function () {
+  'use strict'
+
+  angular.module('tc.services').factory('GroupService', GroupService)
+
+  GroupService.$inject = ['ApiService']
+
+  function GroupService(ApiService) {
+    var service = ApiService.restangularV3
+
+    // Retrieves the registration status of the member for the given program
+    service.getMembers = function(userId, programId) {
+      return service.one('groups',programId).one('members').get()
+    }
+
+    // Registers the given member for the given program.
+    service.addMember = function(userId, programId) {
+      return service.one('groups', programId).one('members').customPOST({
+        memberId : userId +'', membershipType : 'user'
+      })
+    }
+
+    return service
+  }
+})()

app/skill-picker/skill-picker.controller.js

@@ -6,14 +6,15 @@ import _ from 'lodash'
 
   angular.module('tc.skill-picker').controller('SkillPickerController', SkillPickerController)
 
-  SkillPickerController.$inject = ['$scope', 'CONSTANTS', 'ProfileService', '$state', 'userProfile', 'featuredSkills', 'logger', 'toaster', 'MemberCertService', '$q']
+  SkillPickerController.$inject = ['$scope', 'CONSTANTS', 'ProfileService', '$state', 'userProfile', 'featuredSkills', 'logger', 'toaster', 'MemberCertService','GroupService', '$q']
 
-  function SkillPickerController($scope, CONSTANTS, ProfileService, $state, userProfile, featuredSkills, logger, toaster, MemberCertService, $q) {
+  function SkillPickerController($scope, CONSTANTS, ProfileService, $state, userProfile, featuredSkills, logger, toaster, MemberCertService, GroupService, $q) {
     var vm = this
     vm.ASSET_PREFIX = CONSTANTS.ASSET_PREFIX
     vm.IOS_PROGRAM_ID = parseInt(CONSTANTS.SWIFT_PROGRAM_ID)
     vm.PREDIX_PROGRAM_ID = parseInt(CONSTANTS.PREDIX_PROGRAM_ID)
     vm.IBM_COGNITIVE_PROGRAM_ID = parseInt(CONSTANTS.IBM_COGNITIVE_PROGRAM_ID)
+    vm.BLOCKCHAIN_PROGRAM_ID = parseInt(CONSTANTS.BLOCKCHAIN_PROGRAM_ID)
     vm.submitSkills = submitSkills
     vm.featuredSkills = featuredSkills
     vm.userId = userProfile.userId
@@ -22,12 +23,13 @@ import _ from 'lodash'
     vm.tracks = {}
     vm.mySkills = []
     vm.disableDoneButton = false
-    vm.showCommunity = false
+    vm.showCommunity = true
     vm.loadingCommunities = false
     vm.communities = {}
     vm.isPageDirty = isPageDirty
     vm.isTracksDirty = isTracksDirty
     vm.isCommunitySelected = isCommunitySelected
+    vm.isPageStateDirty = false
     ///////
     activate()
 
@@ -42,20 +44,22 @@ import _ from 'lodash'
     /**
      * Verfies if the page state has been modified by the user in any way.
      */
-    function isPageDirty() {
+    function isPageDirty() {      
       return isTracksDirty() || isCommunitiesDirty()
     }
 
     /**
      * Verfies if the tracks section state has been modified by the user in any way.
      */
     function isTracksDirty() {
+      vm.isPageStateDirty = true
       return vm.tracks.DESIGN || vm.tracks.DEVELOP || vm.tracks.DATA_SCIENCE
     }
     /**
      * Verfies if the communities section state has been modified by the user in any way.
      */
     function isCommunitySelected() {
+      vm.isPageStateDirty = true
       var community = _.find(vm.communities, {status: true, display: true})
       return !!community
     }
@@ -79,6 +83,14 @@ import _ from 'lodash'
         dirty: true,
         display: true
       }
+      vm.communities['blockchain'] = {
+        displayName: 'Blockchain',
+        programId: vm.BLOCKCHAIN_PROGRAM_ID,
+        status: false,
+        dirty: false,
+        display: true,
+        groupCommunity: true
+      }
       vm.communities['ios'] = {
         displayName: 'iOS',
         programId: vm.IOS_PROGRAM_ID,
@@ -92,10 +104,11 @@ import _ from 'lodash'
         status: false,
         dirty: false,
         display: true
-      }
+      }      
       _addWatchToCommunity(vm.communities['ios'])
+      _addWatchToCommunity(vm.communities['blockchain'])
       _addWatchToCommunity(vm.communities['predix'])
-      _addWatchToCommunity(vm.communities['ibm_cognitive'])
+      _addWatchToCommunity(vm.communities['ibm_cognitive'])      
     }
 
     /**
@@ -117,43 +130,59 @@ import _ from 'lodash'
      * Checks registration status of each community and updates the state of each community.
      */
     function checkCommunityStatus() {
-      var promises = []
+      var eventAPIpromises = [], groupAPIPromises = []
       for (var name in vm.communities) {
         var community = vm.communities[name]
-        promises.push(MemberCertService.getMemberRegistration(vm.userId, community.programId))
+        if(community.groupCommunity){
+          groupAPIPromises.push(GroupService.getMembers(vm.userId, community.programId))
+        }else{
+          eventAPIpromises.push(MemberCertService.getMemberRegistration(vm.userId, community.programId))    
+        }
       }
+
       vm.loadingCommunities = true
 
-      $q.all(promises)
+      $q.all(groupAPIPromises)
+      .then(function(responses) {
+        let members = responses[0] || []
+        vm.loadingCommunities = false
+        members.forEach(function(member) {
+          if (member && member.memberId === vm.userId) {
+            addWatchToExistingCommunity(member.groupId)
+          }
+        })        
+      })
+      .catch(function(err) {
+        logger.error('Could not load communities with group data', err)
+        vm.loadingCommunities = false
+      })
+
+      $q.all(eventAPIpromises)
       .then(function(responses) {
         vm.loadingCommunities = false
         responses.forEach(function(program) {
-          if (program) {
-            var community = _.find(vm.communities, {programId: program.eventId})
-            if (community) {
-              // set display false to avoid showing already enabled/registered program
-              // we expect display property to be modified after first load  of the page
-              // community.status = true
-              if (community.unregister){
-                community.unregister()
-                _addWatchToCommunity(community)
-              }
-            }
+          if (program) {            
+            addWatchToExistingCommunity(program.eventId)
           }
         })
-        // if there exists at least 1 community which can be displayed, set showCommunity flag to true
-        var community = _.find(vm.communities, {display: true})
-        if (community) {
-          vm.showCommunity = true
-        }
       })
       .catch(function(err) {
         logger.error('Could not load communities with member cert registration data', err)
-
         vm.loadingCommunities = false
       })
     }
 
+    function addWatchToExistingCommunity(programId){
+      var community = _.find(vm.communities, {programId: programId})
+      if (community) {              
+        community.status = true
+        if (community.unregister){
+          community.unregister()
+          _addWatchToCommunity(community)
+        }
+      }
+    }
+
     /**
      * Toggles the given skill for the user. If it is not added, adds it and if already added, removes it.
      */
@@ -202,7 +231,11 @@ import _ from 'lodash'
           var community = vm.communities[communityName]
           if (community.dirty === true) {
             if (community.status === true) {
-              promises.push(MemberCertService.registerMember(vm.userId, community.programId))
+              if(community.groupCommunity){
+                promises.push(GroupService.addMember(vm.userId, community.programId))
+              }else{
+                promises.push(MemberCertService.registerMember(vm.userId, community.programId))                
+              }
             }
           }
         }
@@ -217,9 +250,7 @@ import _ from 'lodash'
       })
       .catch(function(err) {
         logger.error('Could not update update user skills or register members for community', err)
-
         vm.saving = false
-
         toaster.pop('error', 'Whoops!', 'Something went wrong. Please try again later.')
       })
     }

app/skill-picker/skill-picker.jade

@@ -12,6 +12,8 @@
           .community__icon(ng-class="{'community__icon--disabled': !community.status}")
             img(ng-if="communityKey == 'ibm_cognitive' && community.status", src=require("../../assets/images/ico-ibm_cognitive-community.svg"))
             img(ng-if="communityKey == 'ibm_cognitive' && !community.status", src=require("../../assets/images/ico-ibm_cognitive-community-grey.svg"))
+            img(ng-if="communityKey == 'blockchain' && community.status", src=require("../../assets/images/ico-predix-community.svg"))
+            img(ng-if="communityKey == 'blockchain' && !community.status", src=require("../../assets/images/ico-predix-community-grey.svg"))
             img(ng-if="communityKey == 'ios' && community.status", src=require("../../assets/images/ico-ios-community.svg"))
             img(ng-if="communityKey == 'ios' && !community.status", src=require("../../assets/images/ico-ios-community-grey.svg"))
             img(ng-if="communityKey == 'predix' && community.status", src=require("../../assets/images/ico-predix-community.svg"))
@@ -21,6 +23,7 @@
             span.community__title(class="{{!community.status && 'disabled'}}") {{community.displayName}}
             .community__description
               span(ng-if="communityKey == 'ibm_cognitive'") Cognitive Community
+              span(ng-if="communityKey == 'blockchain'") Help create the future of Blockchain-based applications
               span(ng-if="communityKey == 'ios'") Mobile app design and development for iOS, with Swift emphasis
               span(ng-if="communityKey == 'predix'") Design and development on GE’s platform for the Industrial Internet of Things
 
@@ -74,4 +77,4 @@
     type="button",
     tc-busy-button, tc-busy-when="vm.saving",
     ng-click="vm.submitSkills()",
-    ng-disabled="vm.disableDoneButton || !vm.isPageDirty()") Done
+    ng-disabled="vm.disableDoneButton || vm.isPageStateDirty") Done

app/topcoder.constants.js

@@ -29,7 +29,8 @@ angular.module('CONSTANTS', []).constant('CONSTANTS', {
   'NEW_CHALLENGES_URL'     : 'https://www.topcoder.com/challenges/develop/upcoming/',
   'SWIFT_PROGRAM_ID'       : 3445,
   'PREDIX_PROGRAM_ID'      : process.env.PREDIX_PROGRAM_ID || 3448,
-  'IBM_COGNITIVE_PROGRAM_ID'      : process.env.IBM_COGNITIVE_PROGRAM_ID || 3449,
+  'IBM_COGNITIVE_PROGRAM_ID' : process.env.IBM_COGNITIVE_PROGRAM_ID || 3449,
+  'BLOCKCHAIN_PROGRAM_ID'  : process.env.BLOCKCHAIN_PROGRAM_ID || 20000010,
   'UPCOMING_SRMS_URL'      : 'https://www.topcoder.com/challenges/data/upcoming/',
   'EVENT_USER_LOGGED_IN'   : 'user_logged_in',
   'EVENT_USER_LOGGED_OUT'  : 'user_logged_out',

assets/css/directives/notification.directive.scss

@@ -77,16 +77,18 @@
     .header{
       font-weight: bold;
       font-size: 40px;
-      margin-top: 440px;
+      margin-top: 35px;
       padding-left: 60px;
       margin-bottom: 20px;
+      color: #FFF;
     }
     .details{
       font-size: 16px;
       line-height: 26px;
       font-weight: 100;
       padding-left: 60px;
-      max-width: 640px;
+      max-width: 40%;
+      color: #FFF;
     }
     .action{
       position: absolute;

assets/css/my-dashboard/notifications.scss

@@ -40,7 +40,7 @@
       margin-right: 0;
     }
     &.tco17{
-      background: url(../../images/home-hero.jpg) center/cover;
+      background: url(../../images/happy-holidays.png) center/cover;
       img{
         width: 150px;
         margin: 120px auto 0;