Merge branch 'dev' into release/v1.0.8

* dev: (21 commits)
  first round of changes
  fixing test
  fixing settings style
  settings header changes
  cleanup
  fixed mistake
  Changed background color of page state header to $gray-lightest from $white
  Fixed background colors of my challenges and my arms
  remove skill fix
  SUP-2234, Dashboard-->Same challenge should not be displayed twice on ios dashboard.
  fixed
  Change text for endless pagination from More to Load More
  final fixes
  sticky fixed thanks to @Vikas!
  cleanup
  made nav logic more complete
  fixed skill grid for desktop
  Profile fixes, buttons, and small refactors
  a couple cursor fixes
  Scalable layout on Profile, have to replace the plugin to affix the user component, as Angular ngSticky is really bugy.
  ...

Author: vikasrohit

app/directives/challenge-tile/challenge-tile.directive.jade

@@ -29,7 +29,9 @@
         .registered(ng-switch-when="Registered") Registered
 
     // Only show if not data science track
-    p.roles(ng-hide="challenge.track === 'DATA_SCIENCE'") #[span Role:  ] #[span {{challenge.userDetails.roles | listRoles}}]
+    p.roles 
+      span(ng-hide="challenge.track === 'DATA_SCIENCE'") 
+        #[span Role:  ] #[span {{challenge.userDetails.roles | listRoles}}]
 
   .completed-challenge(
     ng-show="challenge.status === 'COMPLETED' || challenge.status === 'PAST'",

app/directives/external-account/external-account.directive.jade

@@ -1,4 +1,4 @@
-.ext-tile(ng-repeat="account in accountList | orderBy:'order'", ng-click="!account.disabled && !readOnly && handleClick(account.provider, account.status)", ng-class="{'connected': account.status === 'linked', 'connecting': account.status === 'pending', 'disabled': account.disabled, 'enabled': !account.disabled, 'read-only': readOnly}")
+.ext-tile(ng-repeat="account in accountList | orderBy:'order'", ng-click="!account.disabled && !readOnly && handleClick(account.provider, account.status)", ng-class="{'connected': account.status === 'linked', 'connecting': account.status === 'pending', 'disabled': account.disabled, 'enabled': !account.disabled, 'read-only': readOnly, 'connect': account.status === 'unlinked' && !account.disabled}")
   .external-account-box(ng-class="account.colorClass")
     i.fa(ng-class="account.className")
 

app/directives/header/header-menu-item.directive.js

@@ -18,7 +18,8 @@
 
         $scope.isActive = function() {
           if (window.location.pathname == href || $state.is(sref)) {
-            NavService.selectedTopLevelItem = NavService.hrefs[href] || NavService.hrefs[sref.slice(0, sref.indexOf('.'))];
+            NavService.selectedTopLevelItem = NavService.getParent(href || sref);
+              //NavService.hrefs[href] || NavService.hrefs[sref.slice(0, sref.indexOf('.'))];
 
             return true;
           }

app/directives/page-state-header/page-state-header.directive.jade

@@ -6,13 +6,12 @@
     .info
       .pic
         a(ui-sref="profile.about({userHandle: vm.profile.handle})")
-          img.profile-circle(ng-if="vm.profile.photoURL", ng-src="{{vm.profile.photoURL}}")
-          img.profile-circle(ng-if="!vm.profile.photoURL", src="/images/ico-user-default.svg")
+          img.profile-circle(ng-src="{{vm.profile.photoURL}}", loading-src="/images/ico-user-default.svg")
       .user-stats(id="metrics", ng-hide="vm.loading")
         .handle(style="color:{{vm.handleColor}};") {{vm.profile.handle}}
         .money-earned(ng-hide="hideMoney")
           p.number(ng-bind="vm.moneyEarned | currency:'$':0")
           p Earned
         .back-link(ng-if="showBackLink && vm.previousStateLabel")
-          a(ui-sref="{{vm.previousStateName}}") Back to {{vm.previousStateLabel}}
+          a(ng-click="vm.backHandler()") Back to {{vm.previousStateLabel}}
 

app/directives/page-state-header/page-state-header.directive.js

@@ -13,12 +13,12 @@
         hideMoney: '=',
         defaultState: '@'
       },
-      controller: ['$scope', 'NotificationService', 'ProfileService', '$log', pageStateHeader],
+      controller: ['$scope', 'NotificationService', 'ProfileService', '$log', '$state', pageStateHeader],
       controllerAs: "vm"
     };
   });
 
-  function pageStateHeader($scope, NotificationService, ProfileService, $log) {
+  function pageStateHeader($scope, NotificationService, ProfileService, $log, $state) {
     var vm = this;
     vm.handle = $scope.handle;
     vm.profile = null;
@@ -28,7 +28,7 @@
     vm.previousStateLabel = null;
     vm.previousState = null;
     vm.showBackLink = _.get($scope, 'showBackLink', false);
-
+    vm.backHandler = backHandler;
     activate();
 
     function activate() {
@@ -47,7 +47,7 @@
       if (vm.previousStateName) {
         if (vm.previousStateName === 'dashboard') {
           vm.previousStateLabel = 'Dashboard';
-        } else if (vm.previousStateName === 'profile') {
+        } else if (vm.previousStateName.indexOf('profile') > -1) {
           vm.previousStateLabel = 'Profile';
         }
       }
@@ -64,6 +64,21 @@
       });
     }
 
+    function backHandler() {
+      var _params = {};
+      var _name = vm.previousStateName;
+      switch (vm.previousStateName) {
+        case 'profile.about':
+          _params = {userHandle: vm.profile.handle};
+          break;
+        case 'dashboard':
+        default:
+          _name = 'dashboard';
+          break;
+      }
+      $state.go(_name, _params);
+    }
+
     function displayMoneyEarned(handle) {
       ProfileService.getUserFinancials(handle)
       .then(function(financials) {

app/directives/profile-widget/profile-widget.jade

@@ -13,16 +13,16 @@
     h3.tenure(ng-if="profile.startMonth")
       | Member Since {{profile.startMonth}}
 
-    a.tc-btn.tc-btn-m.edit(ng-show="editProfileLink", ui-sref="settings.profile") Edit Profile
+    a.tc-btn.tc-btn-s.edit(ng-show="editProfileLink", ui-sref="settings.profile") Edit Profile
 
-  .tracks-links
+  .tracks-links(ng-if="profile.tracks && profile.tracks.length > 0")
     .tracks
       .track(ng-repeat="track in (profile.tracks)", ng-click="profileVm.scrollTo(track)")
         div(class="track-icon {{profileVm.imgMap[track]}}-icon")
           div
         .text {{track | role}}
 
-  p.description {{profile.description}}
+  p.description(ng-if="profile.description") {{profile.description}}
 
   .links
     a.badges.link(ng-click="profileVm.showBadges()", ng-show="profileVm.profile.badges.Achievements.length > 0")

app/directives/skill-tile/skill-tile.directive.jade

@@ -1,4 +1,4 @@
-a(ng-click="enableHide && toggle()", ng-class="{'hidden': skill.hidden, 'new': skill.isNew}")
+a(ng-click="enableHide && toggle()", ng-class="{'skill-hidden': skill.hidden, 'new': skill.isNew}")
   .skill-icon(ng-switch="skill.category")
     .remove-indicator
 
@@ -10,4 +10,4 @@ a(ng-click="enableHide && toggle()", ng-class="{'hidden': skill.hidden, 'new': s
 
     img(ng-switch-when="DATA_SCIENCE", ng-src="{{ASSET_PREFIX}}images/skills/id-{{skill.tagId}}.svg", fallback-src="/images/skills/id-data.svg")
 
-  .name {{skill.tagName}}
+  .name {{skill.tagName | characters: 20:false}}

app/directives/tc-endless-paginator/tc-endless-paginator.jade

@@ -1,4 +1,4 @@
 div.paginator
   tc-section(state="state")
-    button.tc-btn(ng-show="pageParams.totalCount > pageParams.currentCount", ng-click="loadMore()") More
+    button.tc-btn(ng-show="pageParams.totalCount > pageParams.currentCount", ng-click="loadMore()") Load More
 

app/directives/tc-sticky/tc-sticky.directive.jade

@@ -0,0 +1,50 @@
+
+(function() {
+  'use strict';
+
+  angular.module('tcUIComponents').directive('tcSticky', ['CONSTANTS', '$window', tcSticky]);
+
+  function tcSticky(CONSTANTS, $window) {
+    return {
+        restrict: 'A',
+        link: function(scope, element) {
+            scope.width = element.prop('offsetWidth');
+            var elWidth = scope.width + 'px',
+                elChild = angular.element(element[0].querySelector(':first-child'));
+                // elChild.css('width', elWidth);
+            angular.element($window).bind("scroll", function() {
+                var affixElement = document.getElementById('affix'),
+                    xPosition = 0,
+                    yPosition = 0;
+                function getPosition(element) {
+                    while(element) {
+                        yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
+                        element = element.offsetParent;
+                    }
+                }
+                getPosition(affixElement);
+                var height = angular.element(affixElement).prop('offsetHeight');
+                var top = angular.element(affixElement).prop('offsetTop');
+                // console.log(yPosition);
+                // console.log(angular.element(document).scrollTop);
+                // console.log(elChild[0].clientTop);
+                if (yPosition >= 0 || $window.innerHeight <= elChild[0].offsetHeight || $window.innerWidth < 768) {
+                    elChild.removeClass('affix affix-bottom');
+                } else if ( yPosition < 0) {
+                    console.log(top + height);
+                    console.log(yPosition);
+                    console.log(top + height + yPosition);
+                    if (top + height + yPosition < 800) {
+                        elChild.addClass('affix-bottom');
+                        elChild.removeClass('affix');
+                    } else {
+                        elChild.removeClass('affix-bottom');
+                        elChild.addClass('affix');
+                    }
+                    
+                };
+            });
+        }
+    };
+  }
+})();

app/directives/tc-sticky/tc-sticky.directive.js

@@ -0,0 +1,53 @@
+(function() {
+  'use strict';
+
+angular.module('topcoder')
+    .filter('characters', function () {
+        return function (input, chars, breakOnWord) {
+            if (isNaN(chars)) return input;
+            if (chars <= 0) return '';
+            if (input && input.length > chars) {
+                input = input.substring(0, chars);
+
+                if (!breakOnWord) {
+                    var lastspace = input.lastIndexOf(' ');
+                    //get last space
+                    if (lastspace !== -1) {
+                        input = input.substr(0, lastspace);
+                    }
+                }else{
+                    while(input.charAt(input.length-1) === ' '){
+                        input = input.substr(0, input.length -1);
+                    }
+                }
+                return input + '…';
+            }
+            return input;
+        };
+    })
+    .filter('splitcharacters', function() {
+        return function (input, chars) {
+            if (isNaN(chars)) return input;
+            if (chars <= 0) return '';
+            if (input && input.length > chars) {
+                var prefix = input.substring(0, chars/2);
+                var postfix = input.substring(input.length-chars/2, input.length);
+                return prefix + '...' + postfix;
+            }
+            return input;
+        };
+    })
+    .filter('words', function () {
+        return function (input, words) {
+            if (isNaN(words)) return input;
+            if (words <= 0) return '';
+            if (input) {
+                var inputWords = input.split(/\s+/);
+                if (inputWords.length > words) {
+                    input = inputWords.slice(0, words).join(' ') + '…';
+                }
+            }
+            return input;
+        };
+    });
+})();

app/filters/truncate.filter.js

@@ -60,6 +60,7 @@ html
     link(rel="stylesheet", href="assets/css/directives/toggle-password-with-tips.css")
     link(rel="stylesheet", href="assets/css/directives/toggle-password.css")
     link(rel="stylesheet", href="assets/css/directives/tc-tabs.css")
+    link(rel="stylesheet", href="assets/css/directives/tc-sticky.css")
     link(rel="stylesheet", href="assets/css/directives/tc-section.css")
     link(rel="stylesheet", href="assets/css/directives/tc-paginator.css")
     link(rel="stylesheet", href="assets/css/directives/tc-endless-paginator.css")
@@ -145,6 +146,8 @@ html
     script(src='../bower_components/restangular/dist/restangular.js')
     script(src='../bower_components/angular-touch/angular-touch.js')
     script(src='../bower_components/angular-carousel/dist/angular-carousel.js')
+    script(src='../bower_components/matchmedia/matchMedia.js')
+    script(src='../bower_components/ngSticky/lib/sticky.js')
     //- endbower
     //- inject:nonBowerScripts
     script(src="/scripts/auth0-angular.js")
@@ -193,6 +196,7 @@ html
     script(src="directives/tc-endless-paginator/tc-endless-paginator.directive.js")
     script(src="directives/tc-paginator/tc-paginator.directive.js")
     script(src="directives/tc-section/tc-section.directive.js")
+    script(src="directives/tc-sticky/tc-sticky.directive.js")
     script(src="directives/tc-tabs/tc-tabs.directive.js")
     script(src="directives/tc-transclude.directive.js")
     script(src="directives/track-toggle/track-toggle.directive.js")
@@ -212,6 +216,7 @@ html
     script(src="filters/role.filter.js")
     script(src="filters/time-diff.filter.js")
     script(src="filters/track.filter.js")
+    script(src="filters/truncate.filter.js")
     script(src="filters/underscore-strip.filter.js")
     script(src="layout/layout.module.js")
     script(src="layout/header/header.controller.js")

app/index.jade

@@ -72,7 +72,7 @@
     }
 
     function selectedGroup() {
-      return _.get(NavService, 'selectedTopLevelItem.parent', null);
+      return _.get(NavService, 'selectedTopLevelItem', null);
     }
   }
 })();

app/layout/header/header.controller.js

@@ -29,13 +29,15 @@
       li.menu-item.link-group.user-menu(ng-switch="vm.isAuth", ng-class="{'anonymous-menu': !vm.isAuth}")
         // links for logged in user
         div(ng-switch-when="true")
-          .menu-item-header
+          .menu-item-header(
+            ng-class="{'hide': vm.selectedGroup() == 'user'}"
+          )
             span(ui-sref="profile.about({userHandle: vm.userHandle})")
-              img(class="user-avatar", ng-src="{{vm.profile.photoURL}}")
+              img(class="user-avatar", ng-src="{{vm.profile.photoURL}}", loading-src="/images/ico-user-default.svg")
 
               span.username(
                 style="color:{{vm.userHandleColor}}",
-                ng-class="{'underline': vm.selectedGroup()}"
+                ng-class="{'underline': vm.selectedGroup() == 'user'}"
               ) {{vm.userHandle}}
 
           a.btn-link.btn-edit-profile.show-small(ui-sref="settings.profile") EDIT
@@ -56,7 +58,10 @@
 
           //- a(ng-click="launchIntro();", ng-show="!!vm.introOptions") Intro
 
-      li.menu-item.link-group(ng-repeat="(menu, items) in vm.menuLinks")
+      li.menu-item.link-group(
+        ng-repeat="(menu, items) in vm.menuLinks",
+        ng-class="{'selected': vm.selectedGroup() == menu}"
+      )
         .menu-item-header {{menu}}
 
         ul.submenu

app/layout/header/header.jade

@@ -50,11 +50,11 @@
           ChallengeService.processActiveDevDesignChallenges(devDesignChallenges);
           ChallengeService.processActiveMarathonMatches(marathonMatches);
           var userChallenges = marathonMatches.concat(devDesignChallenges);
-          // FIX when working on marathon matches:
-          // sort by closest deadline? .sort(function)
-          // limit to 8 .slice(0, 8);
 
-          vm.myChallenges = userChallenges;
+          userChallenges = _.sortBy(userChallenges, function(n) {
+            return n.registrationEndDate
+          });
+          vm.myChallenges = userChallenges.reverse().slice(0, 8);
           vm.userHasChallenges = true;
           vm.loading = false;
         }

app/my-dashboard/my-challenges/my-challenges.controller.js

@@ -55,35 +55,16 @@
     }
 
     function loadChallenges() {
-      var challengePromises = [
-        ChallengeService.getChallenges({
-          filter: "reviewType=peer&status=active",
-          limit: 3,
-          offset: 0,
-          orderBy: 'submissionEndDate'
-        }),
-        ChallengeService.getChallenges({
-          filter: "platforms=ios&technologies=swift&status=active",
-          limit: 3,
-          offset: 0,
-          orderBy: 'submissionEndDate'
-        })
-      ];
-
-      return $q.all(challengePromises)
-      .then(function(challenges) {
-        var peerChallenges = challenges[0];
-        var iOSChallenges = challenges[1];
-        var challenges = [];
-
-        if (peerChallenges.length === 0) {
-          challenges = challenges.concat(iOSChallenges);
-        } else if (peerChallenges.length > 0) {
-          challenges = challenges.concat(peerChallenges[0]).concat(iOSChallenges.slice(0, iOSChallenges.length - 1));
+      ChallengeService.getChallenges({
+        filter: "platforms=ios&technologies=swift&status=active",
+        limit: 3,
+        offset: 0,
+        orderBy: 'submissionEndDate desc'
+      }).then(function(challenges) {
+        if (challenges.length > 0) {
+          vm.challenges = challenges.slice(0, 3);
+          ChallengeService.processActiveDevDesignChallenges(vm.challenges);
         }
-
-        vm.challenges = challenges;
-        ChallengeService.processActiveDevDesignChallenges(vm.challenges);
         vm.loading = false;
       })
       .catch(function(err) {

app/my-dashboard/programs/programs.controller.js

@@ -1,7 +1,14 @@
 .about-container
-  .profile-header-container(ng-cloak)
-    profile-widget(profile="profileVm.profile", edit-profile-link="profileVm.showEditProfileLink", num-wins="profileVm.numWins", profile-vm="profileVm")
+  
+  .profile-header-container(ng-cloak,id="affix", tc-sticky)
+    //- .sticky-container(sticky media-query="min-width: 780px" use-placeholder="true" offset="10" confine="true" sticky-class="sticked")
+      profile-widget(profile="profileVm.profile", edit-profile-link="profileVm.showEditProfileLink", num-wins="profileVm.numWins", profile-vm="profileVm")
 
+    //- .sticky-container(bs-affix data-offset-top="10" data-offset-bottom="400")
+    .sticky-container()
+      profile-widget(profile="profileVm.profile", edit-profile-link="profileVm.showEditProfileLink", num-wins="profileVm.numWins", profile-vm="profileVm")
+
+  
   .profile-about-container
 
     #skills