{% extends "base.html" %}

{% block header %}
<h1>Administration</h1>
{{ super() }}
{% endblock %}

{% block main %}

<section id="modproduct">
    <h2>Modify {{ product.name }}</h2>

    <form id="modproduct-form" method="post" action="/modproduct?change=update" enctype="multipart/form-data" accept-charset="UTF-8">
        <label for="modproduct-name">Name: </label>
        <input id="modproduct-name" type="text" name="name" value="{{ product.name }}" /><br/>

        <label for="modproduct-ean">EAN code: </label>
        <input id="modproduct-ean" type="text" name="ean" value="{{ product.ean or '' }}" /><br/>

        <label for="modproduct-price-member">Member price: </label>
        CHF <input id="modproduct-price-member" type="number" step="0.01" name="pricemember" value="{{ product.price_member|chf(False) }}" /><br/>

        <label for="modproduct-price-non-member">Non-member price: </label>
        CHF <input id="modproduct-price-non-member" type="number" step="0.01" name="pricenonmember" value="{{ product.price_non_member|chf(False) }}" /><br/>

        <label for="modproduct-custom-price"><abbr title="When 'Custom Price' is enabled, users choose the price to pay, but at least the prices given above">Custom Price</abbr>: </label>
        <input id="modproduct-custom-price" type="checkbox" name="custom_price" {% if product.custom_price %} checked="checked" {% endif %} /><br/>

        <label for="modproduct-stockable">Stockable: </label>
        <input id="modproduct-stockable" type="checkbox" name="stockable" {% if product.stockable %} checked="checked" {% endif %} /><br/>

        <label for="modproduct-balance">Stock: </label>
        <input id="modproduct-balance" name="stock" type="text" value="{{ product.stock }}" /><br/>

        <label for="modproduct-image">
            <img height="150" src="/static/upload/thumbnails/products/{{ product.id }}.png?cacheBuster={{ now }}" alt="Image of {{ product.name }}" />
        </label><br/>
        <input id="modproduct-image" type="file" name="image" accept="image/*" /><br/>

        <input id="modproduct-productid" type="hidden" name="productid" value="{{ product.id }}" /><br/>

        <input type="submit" value="Save changes">
    </form>

    <form id="modproduct-delproduct-form" method="post" action="/modproduct?change=del" accept-charset="UTF-8">
        <input id="modproduct-delproduct-productid" type="hidden" name="productid" value="{{ product.id }}" /><br/>
        <input type="submit" value="Delete product" />
    </form>

</section>

{{ super() }}

{% endblock %}

{% block eanwebsocket %}
  let eaninput = document.getElementById("modproduct-ean");
  eaninput.value = e.data;
  eaninput.select();
  eaninput.scrollIntoView();
{% endblock %}