<h2 class="edit">Commands</h2>

<% @record.script_commands.each do |script_command| %>
    <%= erb :command_config, locals: {command: script_command.command_config.command_class, action: "#{url_prefix}admin/scripts/#{@record.id}/commands/#{script_command.id}", command_options: script_command.command_config.options} %>
<% end %>

<p id="add-command">
    Add command:
    <select id="command-select">
        <option></option>
        <% command_actions.each do |command| %>
            <option value="<%= command.name %>"><%= command.human_name %></option>
        <% end %>
    </select>
</p>

<% command_actions.each do |command| %>
    <%= erb :command_config, locals: {command: command, action: "#{url_prefix}admin/scripts/#{@record.id}/commands"} %>
<% end %>

<script>
    $('#command-select').change(function() {
        $('form.command.new').hide();
        $('form.command.new[data-command="' + $(this).val() + '"]').show();
    });

    $('form.command').submit(function(event) {
        // there are three possible submit buttons in a form: Delete, Update and Add
        var submitAction = $(this).find("input[type=submit]:focus").val();

        if (submitAction == 'Delete') {
            if (!confirm('Are you sure you want to delete this action?'))
                event.preventDefault();
        }
    });
</script>