{% extends 'skins/master.twig' %}

{% set title = 'Skins' %}

{% block content %}
    <div class="section skins-header">
        <h1>Skins</h1>
        <p>Because our servers run in offline mode with our own authentication plugin, skins are downloaded from Mojang's servers. To make up for this we also have a client side mod that substitutes the skin and cape server with our own. You can find the mod on the <a href="/downloads">downloads page</a>. Please keep your textures clean.</p>
    </div>

    <div class="section skin">
        <h2>Changing your Skin</h2>
        <p>Change your in-game appearance. You can change the model type of your skin by hitting upload without selecting a new image.</p>

        {% if error is defined and error.section == 'skin' %}
            <p style="color: red;">{{ error.message }}</p>
        {% endif %}

        <div class="skins-form">
            <form method="post" action="/skins/upload-skin" enctype="multipart/form-data">
                <input type="hidden" name="csrfp" value="{{ globals.csrfp }}">
                <input type="file" name="texture">
                <select name="model">
                    {% set selected_model = skin.model|default() %}
                    <option value="classic"{% if selected_model == 'classic' %} selected{% endif %}>Classic (Steve, 4px)</option>
                    <option value="slim"{% if selected_model == 'slim' %} selected{% endif %}>Slim (Alex, 3px)</option>
                </select>
                <input type="submit" value="Upload Skin" class="skins-form-upload">
            </form>
            {% if skin is not null %}
                <form method="post" action="/skins/delete-skin">
                    <input type="hidden" name="csrfp" value="{{ globals.csrfp }}">
                    <input type="submit" value="Delete Skin" class="skins-form-delete">
                </form>
            {% endif %}
        </div>

        {% if skin_path is not null %}
            <div class="skins-preview">
                <img src="{{ skin_path }}" alt="Your skin">
            </div>
        {% endif %}
    </div>

    <div class="section cape">
        <h2>Changing your Cape</h2>
        <p>Change your cape.</p>

        {% if error is defined and error.section == 'cape' %}
            <p style="color: red;">{{ error.message }}</p>
        {% endif %}

        <div class="skins-form">
            <form method="post" action="/skins/upload-cape" enctype="multipart/form-data">
                <input type="hidden" name="csrfp" value="{{ globals.csrfp }}">
                <input type="file" name="texture">
                <input type="submit" value="Upload Cape" class="skins-form-upload">
            </form>
            {% if cape is not null %}
                <form method="post" action="/skins/delete-cape">
                    <input type="hidden" name="csrfp" value="{{ globals.csrfp }}">
                    <input type="submit" value="Delete Cape" class="skins-form-delete">
                </form>
            {% endif %}
        </div>

        {% if cape_path is not null %}
            <div class="skins-preview">
                <img src="{{ cape_path }}" alt="Your cape">
            </div>
        {% endif %}
    </div>

    <div class="section skinimport">
        <h2>Import from Mojang account</h2>
        <p>Import skin and cape textures from a Mojang Minecraft account. If you linked the same username as your actual Minecraft account, you can just press Import without anything.</p>
        <form method="post" action="/skins/import">
            <input type="hidden" name="csrfp" value="{{ globals.csrfp }}">
            <label>
                <div class="label-header">Minecraft Username</div>
                <div class="label-input"><input type="text" name="username" spellcheck="false" placeholder="{{ link_info.name }}"></div>
            </label>
            <input type="submit" value="Import" class="form-btn-green">
        </form>
    </div>
{% endblock %}