{% extends "layout.html" %}
{% import "macros/_project.html" as proj %}

{% block page_title %}{{current_event.name}}{% endblock %}

{% block page_meta %}
  <meta property="og:type" content="website"/>
  <meta property="og:url" content="{{ url_for('public.event', event_id=current_event.id, _external=True) }}"/>
  <meta property="og:title" content="{{current_event.name}}"/>
  <meta property="og:image" content="{{current_event.logo_url}}"/>
  <meta property="og:description" content="{{current_event.oneliner}}"/>
  <meta name="description" content="{{current_event.oneliner}}"/>
  <script type="application/ld+json">{{ current_event.get_schema(request.host_url)|safe }}</script>
  <meta name="dribdat:event:id" content="{{current_event.id}}"/>
{% endblock %}

{% block body_class %}event-home event-{{ current_event.id }} event-{% if current_event.has_finished %}finished{% elif current_event.has_started %}started{% else %}prep{% endif %}{% endblock %}

{% block content %}

{% if current_user and current_user.active %}
  {% if not current_event.has_finished and not current_user.has_joined(current_event) %}
    <div class="start-project">
      {% include "includes/eventjoin.html" %}
    </div>
  {% endif %}

  {% if current_event.instruction and not current_event.has_finished %}
    <div class="jumbotron event-instruction mt-2 alert alert-dismissible bg-body text-body">
      <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
      <div class="container scroll-after-200">
        {{current_event.instruction|markdown}}
      </div>
      <center>
        <a href="{{ url_for('public.event_instruction', event_id=current_event.id) }}" 
          class="btn btn-sm btn-info" id="event-instruction-tip"
          title="Special instructions for participants">
          <i class="fa fa-info" aria-hidden="true"></i>
          Get info
        </a>
      </center>
    </div>
  {% endif %}

  {% if may_certify %}
    <div class="p-0 m-0" style="float:left">
      <a id="get-certified" class="btn btn-success btn-lg"
        href="{{ url_for('public.user_cert') }}" download
        title="Download my certificate">
        Get Certificate
      </a>
    </div>
  {% endif %}
{% else %}

  <div class="start-project">
    {% if current_event.webpage_url %}
      <a href="{{ current_event.webpage_url }}" class="btn btn-lg btn-dark" target="_blank">
      {% if not current_event.has_finished %}
        <i class="fa fa-ticket" aria-hidden="true"></i>
        Register
      {% else %}
        About
      {% endif %}
      </a>
    {% endif %}
    {% if current_event.community_url %}
      <a href="{{ current_event.community_url }}" target="community" class="btn btn-lg btn-info">
        <i class="fa fa-comment"></i>
        Connect</a>
    {% endif %}
  </div>

  {% if current_event.has_started and not current_event.has_finished %}
    <div category-id="infobox" class="category-container category-tip">
      <center><h4><i class="fa fa-lightbulb-o"></i> &nbsp;The event has started! Join a team after
          <a href="/enter">you log in</a>.</h4></center>
    </div>
  {% endif %}
{% endif %}

{% cache 300, 'event-%d' % current_event.id %}

<center class="nav-categories mt-4">
  {% if current_event.has_categories %}
    <div class="btn-group" data-bs-toggle="buttons" role="group" aria-label="Filter by category">
      <label class="btn btn-default active" title="All projects">
        <input type="radio" name="category" id="" autocomplete="off" checked>
          <i class="fa fa-cube"></i><br>
          <span> </span>
      </label>
      {% for category in current_event.categories_for_event() %}
        <label class="btn btn-default">
          <input type="radio" name="category" id="{{category.id}}" autocomplete="off">
            {% if category.logo_icon %}
              {% if category.logo_icon|length==1 %}
                <span class="logo_icon">{{category.logo_icon}}</span><br>
              {% else %}
                <i class="fa fa-{{category.logo_icon}}"></i><br>
              {% endif %}
            {% endif %}
            <span>{{ category.name }}</span>
        </label>
      {% endfor %}
    </div>
  {% endif %}
</center>

{% if project_count > 0 %}
  <div class="honeycomb mb-5">
    <a name="projects"></a>
    <div class="ibws-fix">
      {% for project in summaries %}
        {{ proj.render_project_hexagon(project) }}
      {% endfor %}
      {% if current_event.can_start_project %}
        <a class="hexagon challenge new"
          href="{{ url_for('project.project_new', event_id=current_event.id) }}">
          <div class="hexagontent">
            {% if current_event.lock_resources %}
              <i title="Share a resource" class="fa fa-life-ring"></i>
            {% elif current_event.has_started %}
              <i title="Add your project" class="fa fa-plus"></i>
            {% elif not current_event.has_finished %}
              <i title="Post a challenge" class="fa fa-cube"></i>
            {% endif %}
          </div>
        </a>
      {% elif project_count % 2 != 0 %}
        {{ proj.render_empty_hexagon() }}
      {% endif %}
    </div>
  </div><!-- /honeycomb -->
{% endif %}

<div class="category-info clearfix">
  {% for category in current_event.categories_for_event() %}

    <div category-id="{{category.id}}"
        class="category-container card card-border-secondary" style="display:none">
      <div class="card-header"
          style="border-bottom:5px solid {{category.logo_color}}">

        {% if current_user and current_user.active and current_user.is_admin %}
          <a href="{{ url_for('admin.category', category_id=category.id) }}"
            class="btn btn-info btn-sm float-right">
            <i class="fa fa-pencil" aria-hidden="true"></i>
            Edit
          </a>
        {% endif %}

        <span class="category-name">{{ category.name }}</span>
      </div>
      <div class="card-body">
        {{ category.description|onebox|markdown|safe }}
      </div>
    </div>

  {% endfor %}
</div><!-- /category-info -->

{% if not current_event.lock_resources %}
<div class="event-nav text-center pt-5 mt-5 mb-4" role="group" aria-label="Event navigation">

  {% if not current_event.has_started %}
    <a href="{{ url_for('public.event_challenges', event_id=current_event.id) }}" class="btn btn-sm"
      title="List all challenges">
      <i class="fa fa-trophy" aria-hidden="true"></i>
      <span>Challenges</span>
    </a>

  {% elif current_event.countdown %}
    <a href="{{ url_for('public.event_stages', event_id=current_event.id) }}" class="btn btn-sm"
      title="Show projects by Stage">
      <i class="fa fa-signal" aria-hidden="true"></i>
      <span>Stages</span>
    </a>

    <a href="{{ url_for('public.event_participants', event_id=current_event.id) }}" class="btn btn-sm"
      title="Show users who have joined projects here">
      <i class="fa fa-child" aria-hidden="true"></i>
      <span>Contributors</span>
    </a>

    <a href="{{ url_for('api.info_event_ical', event_id=current_event.id) }}" class="btn btn-sm"
        download="dribdat.ics" title="Download event for a reminder in your calendar (ICS file)">
      <sup class="time-remaining">
        {{ current_event.countdown|until_date }}
      </sup>
      <i class="fa fa-calendar ms-2" aria-hidden="true"></i>
      <span>Add to calendar</span>
    </a>

  {% elif current_event.has_finished %}
    <a href="{{ url_for('public.event_print', event_id=current_event.id) }}" class="btn btn-sm"
       title="Get an overview of results">
      <i class="fa fa-print" aria-hidden="true"></i>
      <span>Report</span>
    </a>

  {% endif %}
</div>
{% endif %}

{% if current_event.description %}
<div class="event-info mt-2 mb-2">
  <div class="content">
    <a name="info"></a>
    <div class="event-description bg-body">
      {{current_event.description|markdown}}
    </div>
  </div>
</div><!-- /.event-info -->
{% endif %}

{% if current_event.countdown and 'off' not in config.DRIBDAT_CLOCK and not current_event.lock_resources %}
<center class="container-countdown-bottom">
  <a class="container-countdown"
    href="{{ url_for('public.dashboard') }}"
    title="{{ current_event.countdown }}">
    <div id="clockEvent" class="event-countdown flipdown" data-start="{{ current_event.countdown }}"></div>
  </a>
</center>
{% endif %}

{% if current_event.community_embed %}
<div class="panel panel-default community-embed">
  <a name="community"></a>
  <div class="panel-body">
    {{current_event.community_embed|safe}}
  </div>
</div>
{% endif %}

{% endcache %}

<div class="event-nav m-4 text-center" role="group" aria-label="Event navigation">

  {% if current_event.can_start_project %}
    <div role="group" aria-label="Project creation" class="btn-group">
      <a href="{{ url_for('project.project_new', event_id=current_event.id) }}" class="btn btn-lg btn-warning">
        {% if current_event.lock_resources %}
            <i class="fa fa-life-ring"></i>
            <span title="Add another resource here">Share a resource</span>
        {% elif current_event.has_started %}
            <i class="fa fa-plus"></i>
            <span title="Add a project for your team">Start project</span>
        {% elif not current_event.has_finished %}
            <i class="fa fa-cube"></i>
            <span title="Write a challenge statement">Post a challenge</span>
        {% endif %}
        </a>
        <a href="{{ url_for('project.import_new_project', event_id=current_event.id) }}" class="btn btn-lg btn-dark">
            <i class="fa fa-plus"></i>
            <span title="Import a project from repository">Import</span>
        </a>
    </div>
  {% endif %}
  {% if current_event.community_url %}
    <a href="{{ current_event.community_url }}" target="community" class="btn btn-lg btn-info">
      <i class="fa fa-comment"></i>
      Connect</a>
  {% endif %}
  {% if may_edit %}
      <a class="btn btn-lg btn-light"
        href="{{ url_for('public.event_edit', event_id=current_event.id) }}"
        title="Manage details of this event">
        <i class="fa fa-pencil"></i>
        Edit event</a>
  {% endif %}
</div>

{% endblock %}