{% extends "documents/document_base.html" %}
{% load geonode_auth %}
{% load i18n %}
{% load dialogos_tags %}
{% load agon_ratings_tags %}
{% load bootstrap_tags %}
{% load url from future %}
{% load base_tags %}

{% block title %}{{ document.title }} — {{ block.super }}{% endblock %}

{% block head %}

{{ block.super }}
{% endblock %}


{% block body_class %}documents{% endblock %}

{% block body_outer %}
  <div class="span6">
    <h2 class="page-title">{{ document.title }}</h2>
  </div>
  <div class="span6 action-group">
	<div class="btn-group pull-right">
        <div class="btn-group">
        <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
          {% trans "Download Metadata" %}
          <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          {% for link in document.link_set.metadata %}
            <li><a href="{{ link.url }}">{{ link.name }} <i class="icon-chevron-right"></i></a></li>
          {% endfor %}
        </ul>
     </div>
    {% has_obj_perm user document "documents.change_document" as can_edit_document %}
    {% if can_edit_document %}
    <div class="btn-group">
      <a class="btn btn-large btn-info dropdown-toggle" data-toggle="dropdown" href="#">
        {% trans "Edit Document" %}
        <span class="caret"></span>
      </a>
      <ul class="dropdown-menu">
        <li><a href="{% url "document_metadata" document.id %}">{% trans "Edit Metadata" %} <i class="icon-chevron-right"></i></a></li>
        <li><a href="#modal_perms" data-toggle="modal">{% trans "Edit Permissions" %} <i class="icon-chevron-right"></i></a></li>
        <li><a href="{% url "document_replace" document.id %}">{% trans "Replace this Document" %} <i class="icon-chevron-right"></i></a></li>
        <li><a href="{% url "document_remove" document.id %}">{% trans "Remove this Document" %} <i class="icon-chevron-right"></i></a></li>
      </ul>
    </div>
    {% endif %}
    </div>
  </div>
  <div class="span8">
   
      {% if document.extension|lower in imgtypes and document.doc_file %}
      <div id="embedded_map">
        <img src="{% url "document_download" document.id %}" width='100%' />
      </div>
      {% elif document.doc_file %}
        <a href="{% url "document_download" document.id %}" target="_blank">Download the {{ document }} document</a>
      {% elif  document.doc_url %}
        <a href="{{ document.doc_url }}" target="_blank">Download the {{ document }} document.</a> <i>({% trans 'External Resource' %})</i>
      {%  endif %}
       
      <div class="map-actions">
        <ul class="nav nav-tabs">
          <li class="active"><a href="#info" data-toggle="tab"><i class="icon-info-sign"></i>{% trans "Info" %}</a></li>
          <li><a href="#comments" data-toggle="tab"><i class="icon-comment"></i> {% trans "Comments" %}</a></li>
          <li><a href="#rate" data-toggle="tab"><i class="icon-star"></i>{% trans "Ratings" %}</a></li>
          <li><a href="#share" data-toggle="tab"><i class="icon-share"></i>{% trans "Share" %}</a></li>
          <!-- li><a href="#flag" data-toggle="tab"><i class="icon-flag"></i>{% trans "Flag" %}</a></li -->
        </ul>
      </div>
      <div class="tab-content">
        {% include "base/resourcebase_info_panel.html" with resourcebase=document %}

        {% block social_links %}
        {% include "social_links.html" %}
        {% endblock %}

        <!--article id="flag" class="tab-pane">
          <p>Flag this Layer</p>
        </article-->
        
        <article id="comments" class="tab-pane">
          {% with document as obj %}
            {% include "_comments.html" %}
          {% endwith %}
        </article>
        
        <article id="rate" class="tab-pane">
          <!-- TODO: Move this to a reusable template snippet -->
          {% if request.user.is_authenticated %}
          <h3>{% trans "Rate this document" %}</h3>
          {% user_rating request.user document "document" as user_document_rating %}
          <div id="user_rating" class="category-layer"></div>
          {% endif %}
          <h3>{% trans 'Average Rating' %}</h3>
          {% overall_rating document "document" as document_rating %}
          {% num_ratings document as num_votes %}
          <div class="overall_rating" style="float:left" data-rating="{{ document_rating }}"></div> ({{num_votes}})
          <!-- TODO: Add display of who gave what rating based -->
        </article>
      </div>
  </div>
  <aside class="span4">
    <div class="well">
        <h2>{% trans "Resource using this document" %}</h2>
        {% if layer.maps %}
        <p>{% trans "List of resources using this document:" %}</p>
        {% endif %}
        <ul class="unstyled space">
          {% if related.title %}
          <p>{% trans "This document is related to a " %} {{ document.content_type.name }}</p>
          <a href='{{ related.get_absolute_url }}'>{{ related.title }}</a>
          {% else %}
          <p>{% trans "This document is not related to any maps or layers" %}</p>
          {% endif %}
        </ul>
    </div>
    {% has_obj_perm user document "documents.change_document_permissions" as can_change_permissions %}
    {% if can_change_permissions %}
    <div class="well">
        <h2>{% trans "Permissions" %}</h2>
        <p>{% trans "Click the button below to change the permissions of this document." %}</p>
        <p><a href="#modal_perms" data-toggle="modal" class="btn btn-large">{% trans "Change Document Permissions" %}</a></p>
    </div>
    {% endif %}
    <div class="well">
      <h2>{% trans "About" %}</h2>
      <p>{% trans "Document Owner" %}</p>
      {% with document.owner.profile as profile %}
        {% include "people/_profile_about_item.html" %}
      {% endwith %}
      <p>{% trans "Point of Contact" %}</p>
      {% with document.poc as profile %}
        {% include "people/_profile_about_item.html" %}
      {% endwith %}
      <p>{% trans "Metadata Author" %}</p>
      {% with document.metadata_author as profile %}
        {% include "people/_profile_about_item.html" %}
      {% endwith %}
    </div>
  </aside>
  {% include "_permissions_form.html" %}
{% endblock %}
{% block extra_script %}
{% if SOCIAL_BUTTONS %}
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
{% endif %}
    {% if request.user.is_authenticated %}
        {% user_rating_js request.user document "document" %}
    {% else %}
        {% overall_rating document "document" as the_doc_rating %}
    {% endif %}
    <script type="text/javascript">
    $(function() {
        $('div.overall_rating').raty({
            half: true,
            readOnly: true,
            start: $('div.overall_rating').data('rating'),
            path: "{{ STATIC_URL }}lib/img/"
            {% if not request.user.is_authenticated %},
            score: {{ the_doc_rating }}
            {% endif %}
        });
        var activeTab = $('[href=' + location.hash + ']');
        activeTab && activeTab.tab('show');
    });
        {% if SOCIAL_BUTTONS %}
        (function() {
            var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
            po.src = 'https://apis.google.com/js/plusone.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
        })();
        {% endif %}
    </script>
    {% include "_permissions_form_js.html" %}
{% endblock extra_script %}
