{% load i18n horizon humanize %}

{% block help_message %}
{% endblock %}

<div class="row">
    <div class="col-sm-12">
        <p>{% blocktrans %}Drag actions in the order they will be executed on the client.{% endblocktrans %}</p>
    </div>
</div>

<div class="sortable_lists row">

    <div class="col-md-6">
        <div class="panel panel-default">
            <div class="panel-heading">{% blocktrans %}Available Actions{% endblocktrans %}</div>
            <div class="panel-body">
                <ul id="actions_available" class="connectedSortable list-group dark_stripe">
                    {% for action in form.available_actions %}
                    <li class="list-group-item" id="{{ action.action_id }}"
                        data-action="{{ action.freezer_action.action|default:'' }}"
                        data-mode="{{ action.freezer_action.mode|default:'' }}"
                        data-storage="{{ action.freezer_action.storage|default:'' }}"
                        data-engine="{{ action.freezer_action.engine_name|default:action.freezer_action.engine|default:'' }}">
                        ({{ action.freezer_action.action }}) {{ action.freezer_action.backup_name }}
                    </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </div>

    <div class="col-md-6">
        <div class="panel panel-default">
            <div class="panel-heading">{% blocktrans %}Selected Actions In Order{% endblocktrans %}</div>
            <div class="panel-body">
                <ul id="actions_selected" class="connectedSortable list-group dark_stripe">
                    {% for action in form.selected_actions %}
                    <li class="list-group-item" id="{{ action.action_id }}"
                        data-action="{{ action.freezer_action.action|default:'' }}"
                        data-mode="{{ action.freezer_action.mode|default:'' }}"
                        data-storage="{{ action.freezer_action.storage|default:'' }}"
                        data-engine="{{ action.freezer_action.engine_name|default:action.freezer_action.engine|default:'' }}">
                        ({{ action.freezer_action.action }}) {{ action.freezer_action.backup_name }}
                    </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </div>

</div>

<div class="col-sm-6">
    {% include "horizon/common/_form_fields.html" %}
    {{ table.render }}
</div>
<div class="col-sm-12">
    {{ step.get_help_text }}
</div>
<script>
  window.allClients = {{ form.clients_json|default:'[]'|safe }};
</script>