From 09963ee30a54cf0f37b53c9e2cdade6b3a09e2c6 Mon Sep 17 00:00:00 2001 From: Tyler Renelle Date: Mon, 9 Sep 2013 16:15:57 -0400 Subject: [PATCH] [#1489] WIP start adding group edit. remove angular-ui-bootstrap accordion as it was causing problems. --- bower.json | 4 +- public/js/controllers/groupsCtrl.js | 3 + views/options/groups/group.jade | 133 ++++++++++++++++------------ 3 files changed, 79 insertions(+), 61 deletions(-) diff --git a/bower.json b/bower.json index 04895e36f3..6411c5a5d5 100644 --- a/bower.json +++ b/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" } } diff --git a/public/js/controllers/groupsCtrl.js b/public/js/controllers/groupsCtrl.js index 324e180a16..a3dd070974 100644 --- a/public/js/controllers/groupsCtrl.js +++ b/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; diff --git a/views/options/groups/group.jade b/views/options/groups/group.jade index 2024b83ae4..c66965e8e0 100644 --- a/views/options/groups/group.jade +++ b/views/options/groups/group.jade @@ -6,61 +6,76 @@ 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') - input.option-content(type='url', placeholder='Website', value='{{_newGroupWebsite}}') - input(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 - div(ng-show='group.websites') - h4 Resources - ul.unstyled - li - a(ng-repeat='website in group.websites', x-bind='click:removeAt') - i.icon-trash - a(target='_blank', href='{{website}}') {{website}} - div(ng-show='!_editing.groups[group.id]') + // 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.btn(type='submit', value='Add') + + h4 Assign Group Leader + select#group-leader-selection + 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', ng-click='notPorted()') + i.icon-trash + a(target='_blank', href='{{website}}') {{website}} + + 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') - form.form-inline(ng-submit='invite(group, invitee)') - .alert.alert-danger(ng-show='_groupError') {{_groupError}} - .control-group - input.input-medium(type='text', placeholder='User Id', ng-model='invitee') - input.btn(type='submit', value='Invite') - table.table.table-striped - tr(ng-repeat='member in group.members') - td - // allow leaders to ban members - div(ng-show='group.leader == user.id && user.id!=member._id') - // {{#with group.members[$index]}} - a(x-bind='click:removeAt', data-refresh='true', data-confirm='Boot this member?') - i.icon-ban-circle(tooltip='Boot Member') - // {{/}} - a(data-toggle='modal', data-target='#avatar-modal-{{member._id}}') - span(ng-class='{"badge badge-info": group.leader==member._id}') - | {{username(member.auth, member.profile.name)}} - td - | ({{member._id}}) + .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 + input.input-medium(type='text', placeholder='User Id', ng-model='invitee') + input.btn(type='submit', value='Invite') + table.table.table-striped + tr(ng-repeat='member in group.members') + td + // allow leaders to ban members + div(ng-show='group.leader == user.id && user.id!=member._id') + // {{#with group.members[$index]}} + a(x-bind='click:removeAt', data-refresh='true', data-confirm='Boot this member?') + i.icon-ban-circle(tooltip='Boot Member') + // {{/}} + a(data-toggle='modal', data-target='#avatar-modal-{{member._id}}') + span(ng-class='{"badge badge-info": group.leader==member._id}') + | {{username(member.auth, member.profile.name)}} + td + | ({{member._id}}) //-accordion-group(heading='Challenges') span.label @@ -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