hummingbird-me/hummingbird

View on GitHub
frontend/app/templates/group.hbs

Summary

Maintainability
Test Coverage
{{! Cover image }}
<div {{bind-attr class=":group-cover showEditMenu:edit-menu:no-edit"}}>
  <div class="cover-photo" {{bind-attr style=coverImageStyle}}>
    {{#if isAdmin}}
      <div class="edit-cover">
        <label for="cover-image">
          <i class="fa fa-camera"></i> Edit Cover (1440w x 400h)
        </label>
        <div class="container">
          <p>
            Cover images expand and shrink based on your device's width.
            <br>
            On smaller devices your cover will be cut off equally on both sides.
          </p>
        </div>
        {{view "file-upload" action="coverSelected" id="cover-image"}}
      </div>
    {{/if}}
    <div class="dark-overlay"></div>
  </div>
</div>

<div class="container relative">
  <div class="row">
    <div {{bind-attr class=":user-cover-options showEditMenu:edit-menu:no-edit"}}>
      <div class="col-sm-12 user-wrapper">
        {{! Group Avatar }}
        <div class="col-sm-2 col-md-2 user-avatar clearfix">
          <div class="large-avatar">
            <img class="responsive-image" {{bind-attr src=model.avatarUrl alt=model.name}}>
            <div class="edit-avatar">
              <label for="avatar-image">
                <i class="fa fa-camera"></i> Edit Avatar
              </label>
              {{view "file-upload" action="avatarSelected" id="avatar-image"}}
            </div>
          </div>
        </div>

        {{! Group Info }}
        <div class="col-sm-12 col-md-10 no-padding account-wrapper">
          <div class="account-info">
            <div class="bio-wrapper">
              <h2 class="name">
                {{model.name}}
              </h2>
              {{#if showEditMenu}}
                {{{textarea class="edit-bio" rows="2" maxlength="140" placeholder="Briefly tell us about yourself..." value=model.truncatedBio}}}
              {{else}}
                <p class="group-bio">
                  {{model.truncatedBio}}
                </p>
              {{/if}}
            </div>
          </div>

          <div class="follow-widgets">
            {{! staff delete button }}
            {{#if currentUser.isAdmin}}
              <button class="btn btn-default btn-lg follow-button edit delete-group {{if showEditMenu 'hide'}}" {{action "deleteGroup"}}>
                Delete Group
              </button>
            {{/if}}

            {{! Join/Leave Group Button }}
            {{#if loading}}
              <button class="btn btn-default btn-lg follow-button" disabled="disabled">
                Loading... <i class="fa fa-spin fa-spinner"></i>
              </button>
            {{else}}
              {{! edit button }}
              {{#if isAdmin}}
                {{#if showEditMenu}}
                  <button class="btn btn-default btn-lg follow-button save edit-group" {{action "saveEditMenu"}}>
                    <i class="fa fa-pencil"></i> Save
                  </button>
                {{else}}
                  <button class="btn btn-default btn-lg follow-button edit edit-group" {{action "toggleEditMenu"}}>
                    Edit Group
                  </button>
                {{/if}}
              {{/if}}
              {{#if model.currentMember}}
                {{#if model.currentMember.pending}}
                  <button class="btn btn-default btn-lg follow-button" disabled="disabled">
                    Approval Pending...
                  </button>
                {{else}}
                  <button class="btn btn-default btn-lg follow-button edit {{if showEditMenu 'hide'}}" {{action "leaveGroup"}}>
                    Leave Group
                  </button>
                {{/if}}
              {{else}}
                <button class="btn btn-default btn-lg follow-button" {{action "joinGroup" model}}>
                  Join Group
                </button>
              {{/if}}
            {{/if}}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

{{! Nav Bubbles }}
<div class="profile-navigation">
  <div class="container">
    <div class="row">
      <ul class="inline-list clearfix">
        <li class="nav-link">
          {{#link-to 'group.index'}}Feed{{/link-to}}
        </li>
        <li class="nav-link">
          {{#link-to 'group.members'}}Members{{/link-to}}
        </li>
      </ul>
    </div>
  </div>
</div>

{{! Ad Banner }}
<div class="container">
  <div class="feed-head-advert">
    {{ad-unit adId="1293413" adClass="257f81e798bd68dd81e60f42838f361f"}}
  </div>
</div>

{{! Content }}
<div class="min-height-wrapper">
  {{outlet}}
</div>