<!-- Session Update Invite Musicians Dialog -->
<div id="invite-musician-friends-dialog" class="dialog invitemusicians-overlay" layout="dialog" layout-id="select-invites" style="min-height:180px;">
  <div class="content-head">
    <%= image_tag "content/icon_email.png", {:height => 21, :width => 22, :class => 'content-icon'} %>
    <h1>invite musicians</h1>
  </div>
  <div class="dialog-inner">
    <p class="instructions">
      Start typing a name, or click the Choose Friends button to invite your JamKazam friends to join your session.
    </p>
    <div class="invitemusicians-inner" id="update-session-invite-musicians">
    </div>
    <br clear="all" />
    <div class="actions">
      <a id="btn-cancel-invites" layout-action="close" class="button-grey">CANCEL</a>
      <a id="btn-save-invites" layout-action="close" class="button-orange">INVITE</a>
    </div>


  </div>
</div>

<!-- invite musician friend selector template -->
<script type="text/template" id="template-session-invite-musicians">
  <div>
    <div class="right" layout-link="select-friends">
      <a href="#" class="btn-choose-friends button-grey" id="{choose_friends_id}">CHOOSE FRIENDS</a>
    </div>
    {instructions}
    <div class="clearall"></div>
  </div>
  <br />
  <!-- friend invitation box -->
  <div class="friendbox">
    <div class="selected-friends" id="{selected_friends_id}"></div>
    <input id="{friend_input}" type="text" placeholder="Looking up friends..." />
  </div>
</script>

<!-- Added Invitation Template -->
<script type="text/template" id="template-added-invitation">
    <div user-id="{userId}" class="invitation">{userName} 
        <a><%= image_tag "shared/icon_delete_sm.png", :size => "13x13" %></a>
    </div>
</script>
