[#1716 #1705] working modal for challenge.participants.stats! also don't

scroll to top of page. We'll want to test that this doesn't break
anything else in the app, @paglias looks like the guys on that thread
felt pretty dirty about this workaround for some reason

public/css/challenges.styl

@@ -10,4 +10,12 @@ ul.challenge-accordion-header-specs
 	margin-bottom: 10px
 
 #challenges-filters h3
-	margin-top: 0px;
+	margin-top: 0px;
+
+// for things like challenges, member profiles, etc
+@media (min-width: 767px)
+  .wide-modal
+    /* new custom width */
+    width: 1020px;
+    /* must be half of the width, minus scrollbar on the left (30px) */
+    margin-left: -480px;

public/js/app.js

@@ -5,6 +5,10 @@ window.habitrpg = angular.module('habitrpg',
      'sharedServices', 'authServices', 'notificationServices', 'guideServices',
      'ui.bootstrap', 'ui.keypress', 'ui.router', 'chieffancypants.loadingBar'])
 
+  // @see https://github.com/angular-ui/ui-router/issues/110 and https://github.com/HabitRPG/habitrpg/issues/1705
+  // temporary hack until they have a better solution
+  .value('$anchorScroll', angular.noop)
+
   .constant("API_URL", "")
   .constant("STORAGE_USER_ID", 'habitrpg-user')
   .constant("STORAGE_SETTINGS_ID", 'habit-mobile-settings')
@@ -115,7 +119,6 @@ window.habitrpg = angular.module('habitrpg',
           templateUrl: 'partials/options.social.challenges.detail.member.html',
           controller: ['$scope', 'Challenges', '$stateParams',
             function($scope, Challenges, $stateParams){
-              alert("Why is this controller not being instantiated?");
               $scope.obj = Challenges.Challenge.getMember({cid:$stateParams.cid, uid:$stateParams.uid}, function(){
                 $scope.obj._locked = true;
               });

views/options/social/challenges.jade

@@ -7,8 +7,14 @@ script(type='text/ng-template', id='partials/options.social.challenges.detail.cl
     a(ng-click='cancelClosing(closingChal)') cancel
 
 script(type='text/ng-template', id='partials/options.social.challenges.detail.member.html')
-  h4 {{member.profile.name}}
-  habitrpg-tasks(main=false)
+  .modal.wide-modal
+    .modal-header
+        button.close(type='button', ng-click='$state.go("^")', aria-hidden='true') ×
+        h3 {{obj.profile.name}}
+      .modal-body
+        habitrpg-tasks(main=false)
+      .modal-footer
+        a.btn(ng-click='$state.go("^")') Close
 
 script(type='text/ng-template', id='partials/options.social.challenges.detail.html')
   // Edit button
@@ -35,22 +41,20 @@ script(type='text/ng-template', id='partials/options.social.challenges.detail.ht
 
   // Member List
   div(ng-if='challenge.members.length > 0')
-    h3 Participants
-    small.
-      (stats coming soon, see <a href='https://github.com/HabitRPG/habitrpg/issues/1716' target='_blank'>this issue</a>.)
-    table.table
-      tr(ng-repeat='member in challenge.members')
-        td {{member.profile.name}}
+    h3 How's Everyone Doing?
+    menu
+      button.customize-option(ng-repeat='member in challenge.members', ng-click='toggleMember(challenge._id, member._id)') {{member.profile.name}}
+  div(ui-view)
 
-  // FIXME, get this working - see https://github.com/HabitRPG/habitrpg/issues/1716
-  //-div(ng-if='challenge.members')
+  // Accordion version if we choose that instead
+  //- div(ng-if='challenge.members')
     h4 How's Everyone Doing?
     .accordion-group(ng-repeat='member in challenge.members')
       .accordion-heading
         a.accordion-toggle(ng-click='toggleMember(challenge._id, member._id)') {{member.profile.name}}
       .accordion-body(ng-class='{collapse: $stateParams.uid != member._id}')
         .accordion-inner(ng-if='$stateParams.uid == member._id')
-          div(ng-view)
+          div(ui-view)
 
 script(type='text/ng-template', id='partials/options.social.challenges.html')
   .row-fluid