{% extends 'base.html' %}
{% load i18n %}
{% block title %}{% trans "Data Processing" %}{% endblock %}

{% block main %}

<div class="cluster_templates">
    {{ cluster_templates_table.render }}
</div>

<script type="text/javascript">
    addHorizonLoadEvent(function () {
        horizon.modals.addModalInitFunction(function (modal) {
            var $navbar = $(modal).find(".nav-tabs");
            if ($navbar.find("li").size() == 1) {
                // hide tab bar for plugin/version modal wizard
               $navbar.hide();
            }
            var add_ng_btn_label = '{% trans "Add Node Group" %}';
            $(".hidden_nodegroups_field").after("<input type='button' id='add_nodegroup' value='" + add_ng_btn_label + "'/><br/>");
            $("#add_nodegroup").click(function() {
                $(".hidden_nodegroups_field").val("create_nodegroup");
                $(".hidden_configure_field").val("create_nodegroup");
                var form = $(".hidden_nodegroups_field").closest("form");
                form.submit();
            });


            $(".hidden_nodegroups_field").val("");
            $(".hidden_configure_field").val("");

            if ($(modal).find(".hidden_create_field").length > 0) {
                var form = $(".hidden_create_field").closest("form");
                var successful = false;
                form.submit(function (e) {
                        var oldHref = $(".configure-clustertemplate-btn")[0].href;
                        var plugin = $("#id_plugin_name option:selected").val();
                        var version = $("#id_" + plugin + "_version option:selected").val();
                        form.find(".close").click();
                        $(".configure-clustertemplate-btn")[0].href = oldHref +
                                "?plugin_name=" + encodeURIComponent(plugin) +
                                "&hadoop_version=" + encodeURIComponent(version);
                        $(".configure-clustertemplate-btn").click();
                        $(".configure-clustertemplate-btn")[0].href = oldHref;
                        return false;
                });
                $(".plugin_version_choice").closest(".form-group").hide();
            }

            //display version for selected plugin
            $(document).on('change', '.plugin_name_choice', switch_versions);
            function switch_versions() {
                $(".plugin_version_choice").closest(".form-group").hide();
                var plugin = $(this);
                $("." + plugin.val() + "_version_choice").closest(".form-group").show();
            }
            $(".plugin_name_choice").change();
        });

    });
</script>

{% endblock %}
