{% extends "base.html" %}
{% load compress static %}

{% block content %}

{{ registration_dict|json_script:"registration" }}
<div class="row">
<form
    id="add-credential-form"
    class="col-sm-6 col-sm-offset-3"
    data-options="{{ options }}"
    method="post"
    encrypt="multipart/form-data">
    <h1>Add Credential</h1>

    {% csrf_token %}
    <input id="attestation_object" type="hidden" name="attestation_object">
    <input id="client_data_json" type="hidden" name="client_data_json">

    <div class="form-group">
        <label for="name">Name</label>
        <input type="text" class="form-control" id="name" name="name">
        <div class="help-block">
            Give this credential a descriptive name. Example: "My primary Yubikey"
        </div>
    </div>

    <div id="add-credential-error" class="alert alert-danger hide">
        <strong>Something went wrong.</strong>
        <span></span>
    </div>

    <div id="add-credential-success" class="alert alert-success hide">
        <strong>Success!</strong>
        Credential acquired.
    </div>


    <input
        id="add-credential-submit"
        class="btn btn-default pull-right"
        type="submit"
        name=""
        value="Save Credential" disabled>
</form>
</div>
{% endblock %}

{% block scripts %}
{% compress js %}
<script src="{% static 'js/jquery-2.1.4.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<script src="{% static 'js/cbor.js' %}"></script>
<script src="{% static 'js/add_credential.js' %}"></script>
{% endcompress %}
{% endblock %}