jcbantuelle/dominion-meteor

<template name="lobby">
{{#with lobby}}
  <div id="lobby-container">
    <div id="proposal-message">{{{currentUser.declined_proposal}}}</div>

    <div id="proposal">
      {{#with proposal}}
        <div>
          {{#if is_proposer}}
            You have
          {{else}}
            <strong>{{proposer.username}}</strong> has
          {{/if}}
          proposed a game.
        </div>

        <br />

        <div>
          <strong>Players:</strong>
          {{#each players}}
            {{username}}
          {{/each}}
        </div>

        <div>
          <strong>Cards:</strong>
          {{#each cards}}
            <span class="lobby-card {{types}}">{{name}}</span>
            <div class="card-tooltip">
              {{#if wide}}
                <img src="{{static_image image}}" width="341" height="220" />
              {{else}}
                  <img src="{{static_image image}}" width="220" height="341" />
              {{/if}}
            </div>
          {{/each}}
        </div>

        <br />

        {{#if accepted}}
          <div>Waiting for others to accept...</div>
        {{/if}}
        <div id="proposal-form-container">
          <form id="proposed-game">
            <input type="hidden" id="proposal_id" value="{{_id}}" />
            <button id="decline-proposal" class="btn btn-small btn-danger" type="submit" value="Decline Game">Decline Game</button>
            {{#unless accepted}}
              <button id="accept-proposal" class="btn btn-small btn-success" type="submit" value="Accept Game">Accept Game</button>
            {{/unless}}
          </form>
        </div>
      {{/with}}
    </div>

    {{#unless proposal}}
      <form id="lobby">
        <div class="lobby-instructions">Choose any sets you'd like to exclude:</div>
        <div id="card-sets" class="checkbox">
          {{#each card_sets}}
            <div class="choose-set-container form-check form-check-inline">
              <input type="checkbox" class="form-check-input card-set" id="set_{{id}}" value="{{id}}" />
              <label class="form-check-label" for="set_{{id}}">{{name}}</label>
            </div>
          {{/each}}
        </div>
        <hr>
        <div class="lobby-instructions">Choose which edition you would like to play with:</div>
        <div class="checkbox">
          <div class="form-check form-check-inline">
            <input type="radio" id="edition_2" class="form-check-input edition" name="edition" value="2" checked="checked" />
            <label class="form-check-label" for="edition_2">2nd Edition</label>
          </div>
          <div class="form-check form-check-inline">
            <input type="radio" id="edition_1" class="form-check-input edition" name="edition" value="1" />
            <label class="form-check-label" for="edition_1">1st Edition</label>
          </div>
        </div>
        <hr />
        <div class="lobby-instructions">Select up to 3 other players to play a game with:</div>
        <div id="players" class="checkbox">
          {{#each lobby_players}}
            {{#if has_proposal}}
              <span class="busy">{{username}}</span>
            {{else}}
              <div class="form-check form-check-inline">
                <input type="checkbox" class="lobby-player form-check-input" id="player_{{_id}}" value="{{_id}}" />
                <label class="form-check-label" for="player_{{_id}}">{{username}}</label>
              </div>
            {{/if}}
          {{/each}}
        </div>
        <hr />
        Replay Old Game: <input class="kingdom-id" placeholder="Game ID">
        <br class="clear" />
        <button id="propose-game" class="btn btn-primary" type="submit" value="Start Game">Propose Game</button>
      </form>
    {{/unless}}

    <br />

    <pre id="lobby-chat"></pre>

    <form id="chat">
      <input type="text" name="message" id="message" class="form-control" autocomplete="off" />
    </form>
  </div>
{{/with}}
</template>