{% extends "layout.html" %}
{% import "macros/_misc.html" as misc %}
{% import "macros/_social.html" as social %}
{% import "macros/_detail.html" as detail %}

{% block page_title %}{{project.name}} - {{project.event.name}}{% endblock %}

{% block page_meta %}
  <meta property="og:type" content="website"/>
  <meta property="og:url" content="{{ url_for('project.project_view', project_id=project.id, _external=True) }}"/>
  <meta property="og:title" content="{{project.name}}"/>
  <meta property="og:image" content="{{project_image_url|quote_plus}}"/>
  <meta property="og:description" content="{% if project.summary %}{{project.summary}}{% else %}{{ project.longtext|striptags|truncate(120) }}{% endif %}"/>
  <meta name="description" content="{{project.summary}}"/>
  <meta name="author" content="{{project.user.username}}"/>
  <meta name="dribdat:project:id" content="{{project.id}}"/>
{% endblock %}

{% block css %}
<link href="{{ url_for('static', filename='css/rainbow/zenburnesque.css') }}" rel="stylesheet" type="text/css">
{% endblock %}
{% block js %}
<script type="text/javascript" src="{{ url_for('static', filename='css/rainbow/rainbow-custom.min.js') }}"></script>
{% endblock %}

{% block body_class %}project-home{% endblock %}

{% block content %}

{% if project.score and project.score < 1 and allow_edit and current_event.aftersubmit %}
  <div class="jumbotron projectnew-boilerplate alert alert-dismissible">
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    <div class="container scroll-after-500">
      {{ current_event.aftersubmit|markdown }}
    </div>
  </div>
{% endif %}

{{ detail.render_project_buttons(project, project_starred, past_version, allow_edit, lock_editing, allow_revert, allow_post, current_user, True) }}
{{ detail.render_project_image(project) }}
{{ detail.render_project_head(project) }}

<div class="project-content-nav text-end mt-2 mb-2">
{% if project_team %}
  <a id="team-tab-md" href="#team-md"
    title="Show team members">
    <i class="fa fa-user m-2" aria-hidden="true"></i>Team</a>
{% endif %}
{% if project.autotext %}
  <a id="readme-tab-md" href="{{ url_for('project.project_view', project_id=project.id) }}#readme-md"
     title="Readme content">
    <i class="fa fa-star m-2" aria-hidden="true"></i>Readme</a>
{% endif %}
</div>

<span class="project-badges">
  {% for s in project_badge %}
    <a class="boost float-left me-2" href="{{ url_for('project.get_log', project_id=project.id) }}#log" title="{{ s.title }}">
      <i class="fa fa-{{ s.icon }}" aria-hidden="true"></i>
    </a>
  {% endfor %}
</span>

{% if project.download_url %}
  <a href="{{ project.download_url }}" target="_blank" rel="noopener noreferrer"
     class="project-download-link btn btn-lg border border-info fw-bolder"
     title="Download link">
      <span>&#x2728;</span> Demo
  </a>
{% endif %}

<div class="clear-both mt-2" id="project-content">

  {% if project.is_webembed or project.webpage_url %}
    {% if project.has_embed_longtext %}
      <div class="project-webembed resizable project-render">
        <iframe src="{{ url_for('project.render', project_id=project.id) }}"></iframe>
      </div>
      <a href="{{ url_for('project.render', project_id=project.id) }}"
         class="btn btn-small btn-default float-right"
         target="_blank" rel="noopener noreferrer" title="See presentation in a new tab">
         &#x2193;&nbsp;&nbsp;Open</a>
    {% elif project.embed_webpage %}
      <div class="project-webembed resizable project-embed">
        {{ project.embed_webpage|safe }}
      </div>
      <a href="{{ project.webpage_url }}" class="btn btn-small btn-default float-right"
         target="_blank" rel="noopener noreferrer" title="See presentation in a new tab">
         &#x2193;&nbsp;&nbsp;Open</a>
    {% endif %}
    <br clear="all" />
  {% endif %}

  {% if project.longtext %}
    <div id="project-md" aria-labelledby="project-tab-md">
      <div class="project-longtext">
        {{ project.longtext|onebox|markdown|safe }}
      </div>
    </div><!-- /project-md -->
  {% endif %}

  {% if allow_edit %}
  <div class="project-edit-pitch float-left">
    <a href="{{ url_for('project.project_edit', project_id=project.id) }}#is_webembed"
        title="Edit project pitch" class="btn btn-md btn-default">
      <i class="fa fa-pencil" aria-hidden="true"></i>
      Edit
    </a>
  </div>
  {% endif %}

  {% if project.autotext %}
    <div id="readme-md" aria-labelledby="readme-tab-md">

    {% if allow_edit and project.is_syncable %}
      <a href="{{ url_for('project.project_autoupdate', project_id=project.id) }}"
        title="Sync external Readme data" class="btn btn-sm btn-outline-dark text-light float-right">
        <i class="fa fa-refresh" aria-hidden="true"></i>
        Refresh</a>
    {% endif %}

    <div class="project-autotext">
      {{project.autotext|markdown}}
    </div>

    {% if project.autotext_url and not project.event.lock_resources %}
      <div class="m-2 clearfix">
        <span style="line-height:2.5em">
          <i class="fa fa-asterisk" aria-hidden="true"></i>
          Preview of
          <a href="{{ project.autotext_url }}" target="_blank" rel="noopener noreferrer" title="Source link">
            external content</a>.</span>
      </div>
    {% endif %}

    </div>
  {% endif %}

  <div class="project-buttons mb-5" role="group" aria-label="Project links">
    {% if project.contact_url %}
      {% if project.contact_url.startswith('http') or project.contact_url.startswith('mailto:') %}
        <a href="{{ project.contact_url }}" target="_blank" rel="noopener noreferrer" class="btn btn-lg shadow-none border-light" title="Contact the team"><span>&#x1f44b;</span> Contact</a>
      {% elif '@' in project.contact_url %}
        <a href="mailto:{{ project.contact_url }}" target="_blank" rel="noopener noreferrer" class="btn btn-lg shadow-none border-light" title="Contact the team"><span>&#x1f44b;</span> E-mail</a>
      {% else %}
        <div class="btn btn-lg" title="Contact the team"><span>&#x1f44b;</span> {{ project.contact_url }}</div>
      {% endif %}
    {% endif %}
    {% if project.download_url %}
      <a href="{{ project.download_url }}" target="_blank" rel="noopener noreferrer" class="btn btn-lg shadow-none border-light" title="Download link"><span>&#x2728;</span> Demo</a>
    {% endif %}
    {% if project.source_url %}
      <a href="{{ project.source_url }}" class="btn btn-lg shadow-none border-light" target="_blank" rel="noopener noreferrer" title="Source code"><span>&#x1f4bb;</span> Source</a>
    {% endif %}
  </div>

  {% if project.technai %}
    <div id="technai-md" class="row m-3" title="Tech and skills used in this project">
      <div class="profile-skills col-12 text-center">
        {% for s in project.technai %}
          <a href="{{ url_for('public.all_participants') }}?u=*{{s}}" class="skill">
            {{s}}
          </a>
        {% endfor %}
      </div>
    </div>
  {% endif %}

  {% if project_team %}
    <div id="team-md" aria-labelledby="team-tab-md">

      <div class="widget widget-team m-4">
      {% for user in project_team %}
        {% if project.user == user %}
          <i class="fa fa-star project-owner"
              title="Started this project" aria-hidden="true"></i>
        {% endif %}
        {{ misc.render_user_profile(user) }}
        {% if current_user.is_admin %}
          <a href="{{ url_for('project.project_unstar', project_id=project.id, user_id=user.id) }}" class="kick-user"
            title="Remove this user from team" onclick="if(!window.confirm('Are you sure you wish to remove {{ user.username }} ?')) return false"
            >&times;</a>
        {% endif %}
      {% endfor %}
      </div>

      {% if not lock_editing and not project.event.has_finished and not project.event.lock_resources and not past_version %}
        <center class="team-invite-button">
          {% if project_starred %}
            <a class="btn btn-info btn-md" data-bs-toggle="modal" data-bs-target="#addUser"
               title="Invite someone to this project">
                Team
                <i class="fa fa-child" aria-hidden="true"></i><i class="fa fa-child" aria-hidden="true"></i>
                builder
            </a>
          {% elif project.is_approved %}
            <a class="btn btn-md btn-success project-star"
               href="{{ url_for('project.project_star', project_id=project.id) }}"
               title="{% if project.is_challenge %}Follow this challenge{% else %}Contribute to the project{% endif %}">
                 <i class="fa fa-thumbs-up"></i>
                 Join the team
            </a>
          {% endif %}
          <a class="btn btn-md btn-light" href="{{ url_for('project.get_log', project_id=project.id) }}"
            title="Log and progress review">
            <i class="fa fa-paperclip" aria-hidden="true"></i>
            Log
          </a>
          <a class="btn btn-md btn-light" href="{{ surl }}"
            title="Get a shortlink to this project">
            <i class="fa fa-link" aria-hidden="true"></i>
            Link
          </a>
        </center>
      {% endif %}

    </div>
  {% endif %}

  </div><!-- /project-content -->
</div><!-- /.jumbotron .project-page -->

<center class="project-footer-controls mt-5">

<div role="group" aria-label="Project controls" class="btn-group project-controls">
  {% if current_user and current_user.active %}
    {% if allow_post %}
      <a id="project-post" href="{{ url_for('project.project_post', project_id=project.id) }}"
          title="Post to this project" class="btn btn-lg btn-success">
        <i class="fa fa-clock-o" aria-hidden="true"></i>
        Post
      </a>
    {% else %}
      <a id="project-comment" href="{{ url_for('project.project_comment', project_id=project.id) }}"
          title="Write a public comment" class="btn btn-lg btn-info">
        <i class="fa fa-comment" aria-hidden="true"></i>
        Comment
      </a>
    {% endif %}
    {% if allow_edit %}
      <a href="{{ url_for('project.project_edit', project_id=project.id) }}" class="btn btn-lg btn-warning"
        title="Edit basic project data">
        <i class="fa fa-pencil" aria-hidden="true"></i>
        Edit</a>
      {% if project.is_syncable %}
        <a href="{{ url_for('project.project_autoupdate', project_id=project.id) }}"
          title="Refresh external Readme data" class="btn btn-lg btn-dark">
          <i class="fa fa-refresh" aria-hidden="true"></i>
          Sync</a>
      {% endif %}
    {% endif %}
      <a href="{{ url_for('project.project_fork', project_id=project.id) }}" class="btn btn-lg btn-light"
        title="Create another project with a reference to this one">
        <i class="fa fa-copy" aria-hidden="true"></i>
        Fork</a>
    {% if project.event.user == current_user or current_user.is_admin %}
      <a href="{{ url_for('project.project_approve', project_id=project.id) }}" class="btn btn-lg btn-primary project-approve"
        title="Promote to next project level">
        <i class="fa fa-rocket" aria-hidden="true"></i>
        Approve
      </a>
    {% endif %}
  {% endif %}
</div><!-- / .project-controls -->

{% if allow_edit and config.LLM_API_KEY and not project.is_challenge and not project.event.lock_resources %}
  <div role="group" aria-label="Team controls" class="ms-3 me-3 btn-group project-controls">
    <button data-bs-toggle="modal" data-bs-target="#autopostModal"
       title="Get tips from an AI coach" class="btn btn-lg btn-dark">
      &#x1F170;&#xFE0F;&#x2139;&#xFE0F;
    </button>
  </div>
{% endif %}

{% if current_user.is_admin %}
<div role="group" aria-label="Project administration" class="ml-3 btn-group admin-area" title="Admin area">

  {% if project.is_hidden %}
    <a href="{{ url_for('admin.project_toggle', project_id=project.id) }}"
       title="Make this project visible" class="btn btn-lg btn-dark">
      <i class="fa fa-eye" aria-hidden="true"></i>
      <!--Show--></a>

  {% else %}
    <a href="{{ url_for('project.project_boost', project_id=project.id) }}" class="btn btn-lg btn-success project-boost"
      title="Boost this project">
      <i class="fa fa-trophy" aria-hidden="true"></i>
    <!--  Boost--></a>

    <a class="btn btn-secondary btn-lg" data-bs-toggle="modal" data-bs-target="#addUser"
       title="Invite someone to this project">
        <i class="fa fa-child" aria-hidden="true"></i><i class="fa fa-child" aria-hidden="true"></i>
    </a>

    <a href="{{ url_for('admin.project_toggle', project_id=project.id) }}"
       title="Toggle visibility of this project" class="btn btn-lg btn-dark">
      <i class="fa fa-eye" aria-hidden="true"></i>
    <!--  Hide--></a>
  {% endif %}

  <a href="{{ url_for('admin.project_view', project_id=project.id) }}" class="btn btn-lg btn-warning"
     title="Edit full details (admin)">
    <i class="fa fa-pencil" aria-hidden="true"></i>
    <!--Edit--></a>

</div><!-- / .admin-area -->
{% endif %}

</center><!-- /.project-footer-controls -->

<div class="panel panel-default community-embed mt-5">
  <div class="panel-body">
    {{project.event.community_embed|safe}}
  </div>
</div>

{% if project.terms_reuse %}
  <div id="project-terms" class="fs-5" title="Legal conditions of reuse for this project">
    {% if project.terms_reuse == 'C' or project.terms_reuse.startswith('C+') %}
      <a href="https://creativecommons.org/ai-and-the-commons/cc-signals/" target="_blank" rel="noopener noreferrer" class="cc-signal">
        <i class="fa fa-cc"></i><i class="fa fa-plus"></i>
        {{ project.terms_reuse }}
      </a>
    {% elif project.terms_reuse.startswith('CC') %}
      <a href="https://creativecommons.org/licenses/" target="_blank" rel="noopener noreferrer" class="cc-by">
        <i class="fa fa-cc"></i>
        {{ project.terms_reuse }}
      </a>
    {% elif project.terms_reuse.startswith('http') %}
      <a href="{{ project.terms_reuse }}" target="_blank" rel="noopener noreferrer" class="cc-by">
        Terms of Reuse
      </a>
    {% else %}
      {{ project.terms_reuse }}
    {% endif %}
  </div>
{% endif %}


{% if config.DRIBDAT_SOCIAL_LINKS and share %}
  {{ social.share_links(share.text, share.url) }}
{% endif %}

{% include "includes/projectnav.html" %}

{% if allow_edit %}
  {% include "includes/projectdialogs.html" %}
{% endif %}

{% if project.category %}
  <div class="modal fade" id="categoryModal" role="dialog" tabindex="-1">
    <div class="modal-dialog category-details">
      <div class="modal-content" category-id="{{project.category.id}}" class="category-container">
        <div class="modal-header text-center">
          <h3 class="modal-title">{{ project.category.name }}</h3>
        </div>
        <div class="modal-body" style="border-top:5px solid {{project.category.logo_color}}">
          {{ project.category.description|markdown }}
        </div>
        <div class="modal-footer text-center">
          <button class="btn btn-lg btn-dark" type="button" data-bs-dismiss="modal" aria-label="Close">
            Close
          </button>
        </div>
      </div>
    </div>
  </div><!-- /.modal -->
{% endif %}

{% endblock %}