{% extends "layers/layer_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 %}{{ layer.title|default:layer.typename }} — {{ block.super }}{% endblock %}

{% block head %}
{% include "layers/layer_map.html" %}

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


{% block body_class %}data{% endblock %}

{% block body_outer %}
  <div class="span5">
    <h2 class="page-title">{{ layer.title|default:layer.typename }}</h2>
  </div>
  <div class="span7 action-group">
    <div class="btn-group pull-right">
      <!-- download layer -->
      <div class="btn-group">
        <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
          {% trans "Download Layer" %}
          <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          {% for link in links %}
            <li><a href="{{ link.url }}">{% trans link.name %} <i class="icon-chevron-right"></i></a></li>
          {% endfor %}
        </ul>
      </div>
      <!-- download metadata -->
      <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 metadata %}
            <li><a href="{{ link.url }}">{{ link.name }} <i class="icon-chevron-right"></i></a></li>
          {% endfor %}
        </ul>
      </div>
      {% has_obj_perm user layer "layers.change_layer" as can_edit_layer %}
      {% if can_edit_layer %}
      <!-- edit layer dropdown -->
      <div class="btn-group">
        <a class="btn btn-large btn-info dropdown-toggle" data-toggle="dropdown" href="#">
          {% trans "Edit Layer" %}
          <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          <!--li><a href="">Edit Layer Data <i class="icon-chevron-right"></i></a></li-->
          <li><a href="{% url "layer_metadata" layer.typename %}">{% trans "Edit Metadata" %} <i class="icon-chevron-right"></i></a></li>
          {% if GS_SECURITY_ENABLED %}
            {% has_obj_perm user layer "layers.change_layer_permissions" as can_change_permissions %}
            {% if can_change_permissions %}
              <li><a href="#modal_perms" data-toggle="modal">{% trans "Edit Permissions" %} <i class="icon-chevron-right"></i></a></li>
            {% endif %}
          {% endif %}
          {% if GEOSERVER_BASE_URL %}
          <li><a href="{% url "layer_style_manage" layer.typename %}">{% trans "Manage Styles" %} <i class="icon-chevron-right"></i></a></li>
          <li><a class="style-edit" href="#">{% trans "Edit Styles" %} <i class="icon-chevron-right"></i></a></li>
          <li><a href="{% url "layer_replace" layer.typename %}">{% trans "Replace this Layer" %} <i class="icon-chevron-right"></i></a></li>
          <li><a href="{% url "layer_remove" layer.typename %}">{% trans "Remove this Layer" %} <i class="icon-chevron-right"></i></a></li>
          {% endif %}
        </ul>
      </div>
      {% endif %}
    </div>
  </div>
  <div class="span12">
    <div id="embedded_map" class="mrg-btm">
        <div id="preview_map"></div>
    </div>
  </div>
  <div class="span8">
    <div class="layer-actions">
      {% include "layers/_actions.html" %}
    </div>
    <div class="tab-content">

    {% include "base/resourcebase_info_panel.html" with resourcebase=layer %}

      <article id="attributes" class="tab-pane">
        {% if layer.attribute_set.all %}
            <table class="table table-striped table-bordered table-condensed">
              <thead>
                <tr>
                  <th>{% trans "Attribute Name" %}</th>
                  <th>{% trans "Range" %}</th>
                  <th>{% trans "Average" %}</th>
                  <th>{% trans "Median" %}</th>
                  <th>{% trans "Standard Deviation" %}</th>
                </tr>
              </thead>
              <tbody>
                {% for attribute in layer.attribute_set.all %}
                  <tr>
                    <td>{{ attribute }}</td>
                    {% if attribute.unique_values == "NA" %}
                    <td>{{ attribute.unique_values }}</td>
                    {% else %}
                    <td>
                      <select name="unique_values">
                      {% for value in attribute.unique_values_as_list %}
                        <option value="{{ value }}">{{ value }}</option>
                      {% endfor %}
                      </select>
                    </td>
                    {% endif %}
                    <td>{{ attribute.average|floatformat:"2" }}</td>
                    <td>{{ attribute.median|floatformat:"2" }}</td>
                    <td>{{ attribute.stddev|floatformat:"2" }}</td>
                  </tr>
                {% endfor %}
              </tbody>
            </table>
        {% endif %}
      </article>
      {% 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 layer 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 layer" %}</h3>
        {% user_rating request.user layer "layer" as user_layer_rating %}
        <div id="user_rating" class="category-layer"></div>
        {% endif %}
        <h3>{% trans 'Average Rating' %}</h3>
        {% overall_rating layer "layer" as layer_rating %}
        {% num_ratings layer as num_votes %}
        <div class="overall_rating" style="float:left" data-rating="{{ layer_rating }}"></div> ({{num_votes}})
        
        <!-- TODO: Add display of who gave what rating based -->
      </article>
    </div>
  </div>
  <aside class="span4">
    
<div class="well">
	<!-- Need to make this based on a listener -->
	
	<h2>{%trans "Legend" %}</h2>
	<p>{{ style.sld_title }}</p>
	<p><img src="{{ GEOSERVER_BASE_URL }}/wms?request=GetLegendGraphic&format=image/png&WIDTH=20&HEIGHT=20&LAYER=
{{ WORKSPACE }}:{{ layer.name }}&legend_options=fontAntiAliasing:true;fontSize:12;forceLabels:on"></p>
    </div>
    <div class="well">
        <h2>{% trans "Maps using this layer" %}</h2>
        {% if layer.maps %}
        <p>{% trans "List of maps using this layer:" %}</p>
        {% endif %}
        <ul class="unstyled space">
          {% for maplayer in layer.maps %} 
            <li><a href="{{ maplayer.map.get_absolute_url }}">{{ maplayer.map.title }}</a></li>
          {% empty %}
            <li>{% trans "This layer is not currently used in any maps." %}</li>
          {% endfor %}
        </ul>
    </div>
    {% if documents.count > 0 %}
    <div class="well">
        <h2>{% trans "Documents related to this layer" %}</h2>
        <p>{% trans "List of documents related to this layer:" %}</p>
        <ul class="unstyled space">
          {% for document in documents %} 
            <li><a href="{{ document.get_absolute_url }}">{{ document.title }}</a></li>
          {% endfor %}
        </ul>
    </div>
    {% endif %}
    <div class="well">
        <h2>{% trans "Create a map using this layer" %}</h2>
        <p>{% trans "Click the button below to generate a new map based on this layer." %}</p>
        <a href="{% url "new_map" %}?layer={{layer.typename}}" class="btn btn-large">{% trans "Create a Map" %}</a>
    </div>
    {% if GS_SECURITY_ENABLED %}
    {% has_obj_perm user layer "layers.change_layer_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 layer." %}</p>
        <p><a href="#modal_perms" data-toggle="modal" class="btn btn-large">{% trans "Change Layer Permissions" %}</a></p>
    </div>
    {% endif %}
    {% endif %}
    {% if user.is_authenticated %}
    <div class="well">
        <h2>{% trans "Styles" %}</h2>
        <p>{% trans "The following styles are associated with this layer. Choose a style to view it in the preview map." %}</p>
        <ul class="unstyled space">
          {% for style in layer.styles.all %}
            <li>
                {% if layer.default_style == style %}
                    <input type="radio" checked name="style" id="{{ style.name }}" value="{{ style.title }}"/>
                    (default style)
                {% else %}
                    <input type="radio" name="style" id="{{ style.name }}" value="{{ style.title }}"/>
                {% endif %}
                <a href="{{ GEOSERVER_BASE_URL }}styles/{{ style.name }}.sld" >{{ style.sld_title }}</a>
            </li>
          {% empty %}
            <li>{% trans "No styles associated with this layer" %}</li>
          {% endfor %}
        </ul>
    </div>
    {% endif %}
    <div class="well">
      <h2>{% trans "About" %}</h2>
      {% if layer.owner.profile == layer.poc and layer.owner.profile == layer.metadata_author %}
          <p>{% trans "Layer Owner, Point of Contact, Metadata Author" %}</p>
          {% with layer.owner.profile as profile %}
            {% include "people/_profile_about_item.html" %}
          {% endwith %}
      {% else %}
          <p>{% trans "Layer Owner" %}</p>
          {% with layer.owner.profile as profile %}
            {% include "people/_profile_about_item.html" %}
          {% endwith %}
          <p>{% trans "Point of Contact" %}</p>
          {% with layer.poc as profile %}
            {% include "people/_profile_about_item.html" %}
          {% endwith %}
          <p>{% trans "Metadata Author" %}</p>
          {% with layer.metadata_author as profile %}
            {% include "people/_profile_about_item.html" %}
          {% endwith %}
      {% endif %}
    </div>
  </aside>
  {% if GS_SECURITY_ENABLED %}   
  {% include "_permissions_form.html" %}
  {% endif %}
{% 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 layer "layer" %}
    {% else %}
      {% overall_rating layer 'layer' as the_layer_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_layer_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 %}
        $("#comment_submit_btn").click(function(event) {
            $.ajax({
              type: "POST",
              url: $("#form_post_comment").attr('action'),
              data: $("#form_post_comment").serialize(),
              success: function() {
                $('#form_post_comment_div').modal('hide');
                $('#comments_section').load(window.location.pathname + ' #comments_section', 
                		function(){$(this).children().unwrap()})
              }
            });
            return false;
          });        
    </script>
    {% if GS_SECURITY_ENABLED %}
    {% include "_permissions_form_js.html" %}
    {% endif %}
{% endblock extra_script %}
