// FIXME note, due to https://github.com/angular-ui/bootstrap/issues/783 we can't use nested angular-bootstrap tabs
// Subscribe to that ticket & change this when they fix

include ./challenges.jade
include ./hall.jade

script(type='text/ng-template', id='partials/options.social.tavern.html')
  include ./tavern

script(type='text/ng-template', id='partials/options.social.party.html')
  div(ng-show='group._id')
    include ./group
  div(ng-hide='group._id')
    div(ng-show='user.invitations.party.id')
      h2=env.t('invitedTo') + '{{user.invitations.party.name}}'
      a.btn.btn-success(data-type='party', ng-click='join(user.invitations.party)')=env.t('accept')
      a.btn.btn-danger(ng-click='reject()')=env.t('reject')
    div(ng-hide='user.invitations.party.id')
      h2=env.t('createAParty')
      p
        =env.t('noPartyText')
      pre.prettyprint.
        {{user.id}}
      include ./create-group

script(type='text/ng-template', id='partials/options.social.guilds.public.html')
  div(ng-repeat='invitation in user.invitations.guilds')
    h3=env.t('invitedTo') + '{{invitation.name}}'
    a.btn.btn-success(data-type='guild', ng-click='join(invitation)')=env.t('accept')
    a.btn.btn-danger(ng-click='reject(invitation)')=env.t('reject')
  // Public Groups
  .col-md-3
    input.form-control(type='text',ng-model='guildSearch', placeholder=env.t('search'))
  table.table.table-striped
    tr(ng-repeat='group in groups.public | filter:guildSearch')
      td
        ul.pull-right.challenge-accordion-header-specs
          li='{{group.memberCount}} ' + env.t('members')
          li
            // join / leave
            a.btn.btn-small.btn-danger(ng-show='group._isMember', ng-click='clickLeave(group, $event)')
              span.glyphicon.glyphicon-ban-circle
              =env.t('leave')
            a.btn.btn-small.btn-success(ng-hide='group._isMember', ng-click='join(group)')
              span.glyphicon.glyphicon-ok
              =env.t('join')
        h4 {{group.name}}
        p {{group.description}}

script(type='text/ng-template', id='partials/options.social.guilds.detail.html')
  include ./group

script(type='text/ng-template', id='partials/options.social.guilds.create.html')
  include ./create-group

script(type='text/ng-template', id='partials/options.social.guilds.html')
  ul.nav.nav-tabs
    li(ng-class="{ active: $state.includes('options.social.guilds.public') }")
      a(ui-sref='options.social.guilds.public')
        =env.t('publicGuilds')
    li(ng-class="{ active: $stateParams.gid == group._id }", ng-repeat='group in groups.guilds')
      a(ui-sref="options.social.guilds.detail({gid:group._id})")
        | {{group.name}}
    li(ng-class="{ active: $state.includes('options.social.guilds.create') }")
      a(ui-sref='options.social.guilds.create')
        =env.t('createGuild')

  .tab-content
    .tab-pane.active
      div(ui-view)

script(type='text/ng-template', id='partials/options.social.html')
  ul.nav.nav-tabs
    li(ng-class="{ active: $state.includes('options.social.tavern') }")
      a(ui-sref='options.social.tavern')
        span.glyphicon.glyphicon-eye-close
        =env.t('tavern')
    li(ng-class="{ active: $state.includes('options.social.party') }")
      a(ui-sref='options.social.party')
        =env.t('party')
    li(ng-class="{ active: $state.includes('options.social.guilds') }")
      a(ui-sref='options.social.guilds')
        =env.t('guilds')
    li(ng-class="{ active: $state.includes('options.social.challenges') }")
      a(ui-sref='options.social.challenges')
        span.glyphicon.glyphicon-bullhorn
        =env.t('challenges')
    li(ng-class="{ active: $state.includes('options.social.hall') }")
      a(ui-sref='options.social.hall')
        span.glyphicon.glyphicon-flag
        =env.t('hall')

  .tab-content
    .tab-pane.active
      div(ui-view)