{% extends "part/part_app_base.html" %}

{% load static %}

{% block content %}

<div class="row">
    {% if part.active == False %}
    <div class='alert alert-danger' style='display: block;'>
        This part ({{ part.name }}) is not active:
    </div>
    {% endif %}
<div class="col-sm-6">
    <div class="media">
      <div class="media-left">
        <img class="part-thumb" id="part-thumb"
        {% if part.image %}
        src="{{ part.image.url }}"
        {% else %}
        src="{% static 'img/blank_image.png' %}"
        {% endif %}/>
      </div>
    <div class="media-body">
        <h4>{{ part.name }}{% if part.active == False %} <i>- INACTIVE</i>{% endif %}</h4>
        {% if part.description %}
        <p><i>{{ part.description }}</i></p>
        {% endif %}
        {% if part.IPN %}
        <tr>
            <td>IPN</td>
            <td>{{ part.IPN }}</td>
        </tr>
        {% endif %}
        {% if part.URL %}
        <tr>
            <td>URL</td>
            <td><a href="{{ part.URL }}">{{ part.URL }}</a></td>
        </tr>
        {% endif %}
    </div>
    </div>
</div>
<div class="col-sm-6">
    <h4>Stock Status - {{ part.available_stock }}{% if part.units %} {{ part.units }} {% endif%} available</h4>
    <table class="table table-striped">
        <tr>
            <td>In Stock</td>
            <td>{{ part.total_stock }}</td>
        </tr>
        {% if part.buildable %}
        <tr>
            <td>Can Build</td>
            <td>{{ part.can_build }}</td>
        </tr>
        {% if part.quantity_being_built > 0 %}
        <tr>
            <td>Underway</td>
            <td>{{ part.quantity_being_built }}</td>
        </tr>
        {% endif %}
        {% endif %}
        {% if part.allocation_count > 0 %}
        <tr>
            <td>Allocated</td>
            <td>{{ part.allocation_count }}</td>
        </tr>
        {% endif %}
    </table>

    <h4>Attachments</h4>
    <ul>
    {% for attachment in part.attachments.all %}
    <li><a href="/media/{{ attachment.attachment }}">{{ attachment.basename }}</a></li>
    {% endfor %}
    </ul>
</div>
</div>

<hr>
<div class='container-fluid'>
{% block details %}

<!-- Specific part details go here... -->

{% endblock %}
</div>

{% include 'modals.html' %}

{% endblock %}

{% block js_ready %}
{{ block.super }}
    $("#part-thumb").click(function() {
        launchModalForm(
                        "{% url 'part-image' part.id %}",
                        {
                            reload: true
                        }
                        );
    });

{% endblock %}