{% extends "django_classified/_base.html" %}

{% load humanize thumbnail i18n %}

{% block title %}{{ object.title }}{% endblock title %}
{% block meta_description %}{{ object.description }}{% endblock meta_description %}
{% block meta_keywords %}{{ object.get_keywords }}{% endblock meta_keywords %}

{% block meta_og %}
  <meta property="og:url" content="{{ request.scheme }}://{{ request.get_host }}{{ object.get_absolute_url }}"/>
  <meta property="og:title" content="{{ object.title }}"/>
  <meta property="og:description" content="{{ object.description }}"/>
  {% for img in object.image_set.all %}
    {% thumbnail img.file "x800" as im %}
      <meta property="og:image" content="{{ request.scheme }}://{{ request.get_host }}{{ im.url }}"/>
      <meta property="og:image:alt" content="{{ object.title }}"/>
    {% endthumbnail %}
  {% endfor %}
{% endblock %}

{% block body %}

  <div itemscope itemtype="http://schema.org/Product">

    <div class="row">
      <div class="col-md-12">
        <h3>
          {% if object.area %}
            {{ object.area }}&nbsp;&gt;&nbsp;
          {% endif %}
          <a href='{{ object.group.get_absolute_url }}'>{{ object.group }}</a>
        </h3>
      </div>
    </div>

    {% include "django_classified/admin_toolbar.inc.html" %}

    <div class="row">
      <div class="col-lg-9">
        <h2 itemprop="name">{{ object.title }}</h2>
      </div>
      <div class="col-lg-3">
                <span itemprop="offers" itemscope itemtype="http://schema.org/Offer">
                <meta itemprop="priceCurrency" content="{{ DCF_CURRENCY }}"/>
                <h2 itemprop="price" content="{{ object.price|floatformat }}">{{ object.price|default:"" }}</h2>
                </span>
      </div>
    </div>

    <div class="row">
      <div class="col-lg-12" itemprop="description">
        {{ object.description|linebreaks }}
      </div>
    </div>

    <div class="row">
      <div class="col-lg-12">
        {% for img in object.image_set.all %}
          {% thumbnail img.file "150x150" crop="center" as im %}
            <a href='{{ img.file.url }}' data-lightbox="lightbox[{{ object.id }}]"
               title="{{ object.title }}">
              <img itemprop="image" src='{{ im.url }}' alt='{{ object.title }}' title='{{ object.title }}'
                   width="{{ im.width }}" height="{{ im.height }}" class="img-rounded"/>
            </a>
          {% endthumbnail %}
        {% endfor %}
      </div>
    </div>
  </div>

  <div class="row">
    <div class="col-md-12">
      <hr/>
      {% if DCF_LOGIN_TO_CONTACT and not user.is_authenticated %}
        {% trans "Please" %} <a href='{% url 'django_classified:profile' %}'>{% trans "login" %}</a>
        {% trans "to see contact information." %}
      {% else %}
        {% if object.contact_phone %}
          {% trans "Phone" %}: {{ object.contact_phone }}
        {% endif %}
      {% endif %}
    </div>
  </div>

  <div class="row">
    <div class="col-lg-12">
      <hr/>
    </div>
    {% for item in object.related_items %}
      <div class="col-md-2">
        {% if item.featured_image %}
          {% thumbnail featured_image.file "70x70" crop="center" as im %}
            <a href='{{ item.get_absolute_url }}' title="{{ item.title }}">
              <img
                      src='{{ im.url }}'
                      alt='{{ item.title }}'
                      title='{{ item.title }}'
                      width="{{ im.width }}"
                      height="{{ im.height }}"
                      class="img-rounded"
              />
            </a>
          {% endthumbnail %}
        {% endif %}
        <br/>
        <a href='{{ item.get_absolute_url }}' title="{{ item.title }}">{{ item.title|truncatewords:3 }}</a>
      </div>
    {% endfor %}
  </div>
{% endblock %}