<!DOCTYPE html>
{% extends "site_base.html" %}
{% load i18n %}
{% load base_tags %}
{% load theme_tags %}
{% load static from staticfiles %}
{% block title %} {% trans "Welcome!" %} - {{ block.super }} {% endblock %}

{% block body_class %}home{% endblock %}

{% block middle %}
  <link href="{% static "theme/css/default.css"%}" rel="stylesheet"/>
  {% block hero %}
  {% get_theme as theme %}
  {% if theme.background_logo %}
    <div class="jumbotron" style="background: url('{{ theme.background_logo_url }}'); background-size: cover;">
  {% else %}
    <div class="jumbotron" style="background: url('{% static "theme/img/default-background.png" %}'); background-size: cover;">
  {% endif %}
    <div class="container">
      <h1>
        {% if theme.primary_logo %}
          <img src="{{ theme.primary_logo_url }}">
        {% else %}
          <!-- Added a blank src image, to remove the gray box -->
          <img class="logo" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAA‌​AAALAAAAAABAAEAAAIBR‌​AA7">
        {% endif %}
        {% if theme.title %}
          <span class="title">{{ theme.title }}</span>
        {% else %}
          <span class="title">Boundless Exchange</span>
        {% endif %}
      </h1>
      <p>
        {% if theme.tagline %}
          {{theme.tagline}}
        {% else %}
          A Platform for Geospatial Collaboration
        {% endif %}
      </p>
    </div>
  {% endblock %}
  </div>

  {% block mainbody %}
  <div class="container">
    <div class="row">
    {% with facet_type='home' %}
     {% facets as facets %}
      <div class="col-md-4">
       <a class="info-blurb" href="{% url "layer_browse" %}?limit=100&offset=0">
          <p class="text-center">
            <span class="fa-stack fa-hero fa-rotate-90 fa-2x" >
              <i class="fa fa-stop fa-layers fa-stack-1x fa-2x" style="left: 0;"></i>
              <i class="fa fa-stop fa-layers fa-stack-1x fa-2x" style="left: -.15em;color:#E6E9ED;"></i>
              <i class="fa fa-stop fa-layers fa-stack-1x fa-2x" style="left: -.3em;"></i>
              <i class="fa fa-stop fa-layers fa-stack-1x fa-2x" style="left: -.45em;color:#E6E9ED;"></i>
              <i class="fa fa-stop fa-layers fa-stack-1x fa-2x" style="left: -.6em;"></i>
            </span>
          </p>
          <h2 class="text-center stacked">{{ facets.layer|default:"No" }} Layer{{ facets.layer|pluralize }}</h2>
          <p class="text-center blurb">{% trans "Browse or upload geospatial data into an Exchange layer. Download them in the format you need." %}</p>
          <p class="text-center">
              <a class="btn btn-default" href="{% url "layer_browse" %}?limit=100&offset=0" role="button">{% trans "Browse" %} &raquo;</a>
              <a class="btn btn-default" href="{% url "layer_upload" %}"  role="button">{% trans "Upload" %} &raquo;</a>
          </p>
        </a>
      </div>
      <div class="col-md-4">
        <a class="info-blurb" href="{% url "document_browse" %}?limit=100&offset=0">
          <p class="text-center"><i class="fa fa-files-o fa-5x"></i></p>
          <h2 class="text-center">{{ facets.document|default:"No" }} Document{{ facets.document|pluralize }}</h2>
          <p class="text-center blurb">{% trans "Browse or upload non geospatial data and associate your data to a layer or map." %}</p>
          <p class="text-center">
              <a class="btn btn-default" href="{% url "document_browse" %}?limit=100&offset=0" role="button">{% trans "Browse" %} &raquo;</a>
              <a class="btn btn-default" href="{% url "document_upload" %}" role="button">{% trans "Upload" %} &raquo;</a>
          </p>
        </a>
      </div>
      <div class="col-md-4">
        <a class="info-blurb" href="{% url "maps_browse" %}?limit=100&offset=0">
          <p class="text-center"><i class="fa fa-map fa-5x"></i></p>
          <h2 class="text-center">{{ facets.map|default:"No" }} Map{{ facets.map|pluralize }}</h2>
          <p class="text-center blurb">{% trans "Browse or create a map and allow others to collaborate on your map with comments or edits." %}</p>
          <p class="text-center">
              <a class="btn btn-default" href="{% url "maps_browse" %}?limit=100&offset=0" role="button">{% trans "Browse" %} &raquo;</a>
              <a class="btn btn-default" href="{% url "new_map" %}" role="button">{% trans "Create" %} &raquo;</a>
          </p>
        </a>
      </div>
    {% endwith %}
    </div>
  </div>
  {% verbatim %}
  <div ng-app="featured">
    <div ng-repeat="item in featured">
      <!--{{ item.title }}-->
    </div>
  </div>
  {% endverbatim %}
  {% endblock %}

{% endblock %}
