[#1489] WIP start adding group edit. remove angular-ui-bootstrap accordion as it

was causing problems.

bower.json

@@ -35,8 +35,6 @@
     "marked": "~0.2.9"
   },
   "resolutions": {
-    "jquery": "~2.0.3",
-    "angular": "1.2.0-rc.1",
-    "bootstrap": "v2.3.2"
+    "jquery": "~2.0.3"
   }
 }

public/js/controllers/groupsCtrl.js

@@ -7,6 +7,9 @@ habitrpg.controller("GroupsCtrl", ['$scope', '$rootScope', 'Groups', '$http', 'A
         return ~(group.members.indexOf(user._id));
       }
 
+      $scope.Members = Members;
+      $scope._editing = {group:false};
+
       // ------ Loading ------
 
       $scope.groups = Groups.groups;

views/options/groups/group.jade

@@ -6,42 +6,57 @@ a.pull-right.gem-wallet(rel='popover', data-trigger='hover', data-title='Guild B
 .row-fluid
   .span4
     h3 {{group.name}}
-    accordion
-      accordion-group(heading='Information')
-        .blah-options
-          div(ng-show='_editing.groups[group.id]')
-            div(style='height:10px')
-              a.pull-right(x-bind='click:toggleGroupEdit', data-gid='{{group.id}}')
-                i.icon-ok
-            input.option-content(type='text', value='{{group.name}}', placeholder='Group Name')
-            textarea(cols='3', placeholder='Description') {{group.description}}
-            input.option-content(type='url', placeholder='Logo Url', value='{{group.logo}}')
-            form.form-inline(x-bind='submit:groupAddWebsite')
+    // FIXME remove angular-ui-bootstrap here and use standard bootstrap accordion. Eventually, remove ui-bootstrap altogether (too buggy)
+    .accordion(id='accordion-groups-{{group._id}}')
+
+      // ------ Information -------
+      .accordion-group
+        .accordion-heading
+          a.accordion-toggle(data-toggle='accordion', data-target='#accordion-groups-{{group._id}}-information', data-parent='#accordion-groups-{{group._id}}') Information
+        .accordion-body.collapse.in(id='accordion-groups-{{group._id}}-information')
+          .accordion-inner
+            div.whatever-options(ng-show='_editing.group')
+              .control-group.option-large
+                label.control-label Group Name
+                input.option-content(type='text', ng-model='group.name', placeholder='Group Name')
+              .control-group.option-large
+                label.control-label Description
+                textarea.option-content(style='height:15em;', placeholder='Description', ng-model='group.description')
+              .control-group.option-large
+                label.control-label Logo URL
+                input.option-content(type='url', placeholder='Logo URL', ng-model='group.logo')
+              .control-group.option-large
+                form.form-inline(x-bind='submit:groupAddWebsite', ng-submit='notPorted()')
                   input.option-content(type='url', placeholder='Website', value='{{_newGroupWebsite}}')
-              input(type='submit', value='Add')
+                  input.btn(type='submit', value='Add')
+
               h4 Assign Group Leader
               select#group-leader-selection
-              option(ng-repeat='memberId in group.members', selected='memberId == _new.groupLeader') {{username(_members[memberId].auth,_members[memberId].profile.name)}}
-            button(x-bind='click:assignGroupLeader') Assign
+                option(ng-repeat='member in group.members', selected='member._id == _new.groupLeader') {{username(member.auth,member.profile.name)}}
+              button(x-bind='click:assignGroupLeader', ng-click='notPorted()') Assign
+
               div(ng-show='group.websites')
                 h4 Resources
                 ul.unstyled
                   li
-                  a(ng-repeat='website in group.websites', x-bind='click:removeAt')
+                    a(ng-repeat='website in group.websites', x-bind='click:removeAt', ng-click='notPorted()')
                       i.icon-trash
                     a(target='_blank', href='{{website}}') {{website}}
-          div(ng-show='!_editing.groups[group.id]')
+
+          div(ng-show='!_editing.group')
             img.pull-right(ng-show='group.logo', style='max-width:150px', ng-src='{{group.logo}}')
-            a.pull-right(ng-if='group.leader==user.id', x-bind='click:toggleGroupEdit', data-gid='{{group.id}}')
-              i.icon-pencil
-            div {{group.description}}
+            markdown(ng-model='group.description')
             div(ng-show='group.websites')
-              h4 Resources
+              h4 Websites
               ul.unstyled
                 li(ng-repeat='website in group.websites')
                   a(target='_blank', ng-href='{{website}}') {{website}}
 
-      accordion-group(heading='Members')
+      .accordion-group
+        .accordion-heading
+          a.accordion-toggle(data-toggle='accordion', data-target='#accordion-groups-{{group._id}}-members', data-parent='#accordion-groups-{{group._id}}') Members
+        .accordion-body.collapse(id='accordion-groups-{{group._id}}-members')
+          .accordion-inner
             form.form-inline(ng-submit='invite(group, invitee)')
               .alert.alert-danger(ng-show='_groupError') {{_groupError}}
               .control-group
@@ -83,22 +98,24 @@ a.pull-right.gem-wallet(rel='popover', data-trigger='hover', data-title='Guild B
     a.btn.btn-danger(data-id='{{group.id}}', ng-click='leave(group)') Leave
 
   .span8
-    div(ng-if='group.leader==user.id')
-      div(ng-show='_editing.leaderMessage[group.id]')
-        a.pull-right(x-bind='click:toggleLeaderMessageEdit', data-gid='{{group.id}}')
+    div(ng-if='group.leader == user.id')
+      div.blah-options(ng-show='_editing.group')
+        button.btn.btn-primary.pull-right(ng-click='_editing.group = false') Save
           i.icon-ok
-        textarea(cols='3', placeholder='Message from group leader') {{group.leaderMessage}}
-      div(ng-hide='_editing.leaderMessage[group.id]')
-        a.btn.pull-right(x-bind='click:toggleLeaderMessageEdit', data-gid='{{group.id}}') Edit leader message
+        .option-large
+          textarea.option-content(style='height:15em;', placeholder='Message from group leader', ng-model='group.leaderMessage')
+      div(ng-hide='_editing.group')
+        button.btn.btn-default.pull-right(ng-click='_editing.group = true') Edit Group
     table(ng-show='group.leaderMessage')
       tr
         td
-          app:avatar:avatar(profile='{{_members[group.leader]}}')
+          app:avatar:avatar(profile='{{Members.members[group.leader]}}')
         td
           .popover.static-popover.fade.right.in
             .arrow
-            h3.popover-title {{username(_members[group.leader].auth,_members[group.leader].profile.name)}}
-            .popover-content {{group.leaderMessage}}
+            h3.popover-title {{username(Members.members[group.leader].auth, Members.members[group.leader].profile.name)}}
+            .popover-content
+              markdown(ng-model='group.leaderMessage')
     div(ng-controller='ChatCtrl')
       h3 Chat
       include ./chat-box