<script type="text/javascript">
  var played = false;

  $(document).ready(function() {
    $.PeriodicalUpdater("/gathers/" + <%= @gather.id %> + ".js", {
      method: "GET",
      type: "script",
      minTimeout: 5000,
      maxTimeout: 15000,
      success: function(response) {
        if (response.match(/Gather:voting/)) {
          if (!played) {
            $("#jquery_jplayer_1").jPlayer({
              ready: function() {
                $(this).jPlayer("setMedia", {
                  mp3: "http://www.ensl.org/sounds/gather-5.mp3"
                }).jPlayer("play");
                
                var click = document.ontouchstart === undefined ? 'click' : 'touchstart';
                var kickoff = function () {
                  $("#jquery_jplayer_1").jPlayer("play");
                  document.documentElement.removeEventListener(click, kickoff, true);
                };

                document.documentElement.addEventListener(click, kickoff, true);
              },
              loop: true,
              volume: 0.6,
              swfPath: "/flash"
            });

            played = true
          }
        }
        else if (response.length > 10) {
          $("#jquery_jplayer_1").jPlayer("stop");
        }
      }
    });
  });
</script>

<div id="jquery_jplayer_1"></div>

<div class="wide">
  <h2 class="center">
    <div class="left">
      <small><small><%= link_to raw("&#171;&#171; First"), @gather.first %></small></small>
      <%= link_to raw("Previous &#8249;&#8249;"), @gather.previous_gather %>
    </div>
    <%= link_to @gather do %>
      <%= @gather.category.to_s %> Gather
    <% end %>
    <div class="right">
      <% if @gather.next_gather %>
        <%= link_to raw("&#8250;&#8250; Next"), @gather.next_gather%>
        <small><small><%= link_to raw("Last &#187;&#187;"), @gather.last %></small></small>
      <% else %>
        <%= raw("&#8250;&#8250; Next") %>
        <small><small><%= raw("Last &#187;&#187;") %></small></small>
      <% end %>
    </div>
  </h2>

  <% if @gather and @gather.status != Gather::STATE_FINISHED %>
    <div class="box wide" id="gatherInfo">
      <h3 class="center">

      </h3>

      <table class="wide" id="gatherInfoText">
        <tr>
          <td>
            <b>Requirements</b><br />
            - <a href="https://www.google.com/adsense/support/bin/answer.py?hl=en&amp;answer=12654">Javascript</a> needs to enabled<br />
            - Read <%= link_to "gather rules", article_url(Article::G_RULES) %> <br />
            - Remove yourself if you leave
          </td>

          <td>
            <b>Captains:</b><br />
            - Vote for the <b>best</b> players<br />
            - Captain 1 = 2nd most voted<br />
            - Captain 2 = 1st most voted<br />
          </td>

          <td>
            <b>Voice Comunication:</b><br />
            - <%= link_to "Teamspeak 3", "http://www.teamspeak.com/?page=downloads" %> <br />
            - <b>Server:</b> <a href="ts3server://ensl.org">ensl.org</a><br />
            - <b>Password:</b> ns2nsl
          </td>
        </tr>
      </table>

      <div class="center">
        <a href="javascript:;" id="gatherInfoHide">Hide information</a>
      </div>
    </div>
  <% end  %>

  <div id="gatherArea">
    <%= render_gather %>
  </div>

  <%= render :partial => "shoutmsgs/index", :locals => {:object => @gather} %>
</div>
