Xiaohong-Deng/mooqita-icccg

<div id="game_attr row">
  <%= render 'games/attributes', game_player: @game_player, game: @game %>

  <% if @is_end %>
    <%= button_to "Next Round", game_path, method: :patch, class: "btn btn-lg btn-primary"%>
  <% else %>
    <%= button_to "Next Round", game_path, method: :patch, class: "btn btn-lg btn-primary hidden"%>
  <% end %>
</div>

<%= javascript_tag "$(document).on('DOMContentLoaded', function() { setDocDataHeight(); });" %>
<%= javascript_tag "$(window).resize(function() { setDocDataHeight(); });" %>

<div id='game-info' class="container">

  <div class="titles row">
    <% if @document %>
      <div class="col-sm-6">
        <h1>Document</h1>
      </div>
    <% end %>

    <div class="<%= 'col-sm-offset-3 ' if @document.nil? %>col-sm-6">
      <h1>Whiteboard</h1>
    </div>
  </div>

  <div id="doc-info" class="doc-info row">
    <% if @document %>
      <div id="document" class="doc-data col-sm-6">
        <%= render @document %>
      </div>
    <% end %>

    <div id="whiteboard" class="doc-data <%= 'col-sm-offset-3 ' if @document.nil? %>col-sm-6">
      <%= render 'games/whiteboard', game: @game, round: @game_player.round %>
    </div>
  </div>

</div>


<div class="panel panel-default">
  <div class="panel-body" id="current_question" data-game=<%= @game.id %>>
  <!-- could be Question.new or some question from db -->
    <% if @question.persisted? %>
      <%= render @question %>
    <% end %>
  </div>
</div>

<div>
  <% if (!@question.persisted?) && policy(@game).raise_question? %>
    <%= render partial: 'questions/question_form', locals: {question: @question, game: @game, round: @game_player.round}%>
  <% end %>
</div>

<div class="panel panel-default">
  <div class="panel-body" id="current_answers" data-game=<%= @game.id %>>
    <% if @answers && @answers.any? %>
      <div class="current_answer">
        <% @answers.each_with_index do |answer, index| %>
          <div class='answer_content'>
            One answer has been submitted.
          </div>
          <% if index == 0 %>
            <div class='answer_warning'>Waiting the other answer to be submitted...</div>
          <% end %>
        <% end %>
      </div>
    <% end %>
  </div>
</div>

<div>
  <% if policy(@game).raise_answer? %>
  <!-- @answers nil means question is nil, question should be inputted first, so give a hidden input form -->
  <!-- if it's not nil and current user is not an author for any existed answer, give a visible input form -->
    <% if @answers.nil? %>
      <%= render partial: 'answers/answer_form', locals: {answer: @answer, question: @question, hidden: "hidden"} %>
    <% elsif @answers.find_by(user: current_user).nil? %>
      <%= render partial: 'answers/answer_form', locals: {answer: @answer, question: @question, hidden: ""} %>
    <% end %>
  <% end %>
</div>

<% if policy(@game).judge? %>
  <div id="judge_form">
    <% if @answers && @answers.size == 2 && !@answers.exists?(judge_choice: true) %>
      <%= render 'judge_forms', answers: @answers %>
    <% end %>
  </div>
<% end %>

<div class="panel panel-default">
  <div class="panel-body" id="info">
    <% if @is_end %>
      <p>Judge has made his choice</p>
    <% end %>
  </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {
      startGameCable();
    });
</script>