<script type="text/javascript">

jQuery(document).ready(function($){

    var form = $("#create-account-form").show();
     
        form.steps({
        headerTag: "h3",
        bodyTag: "fieldset",
        stepsOrientation: "vertical",
        transitionEffect: "slideLeft",
        //saveState: true,
        onStepChanging: function (event, currentIndex, newIndex)
        {

            // Trigger loading of the 'select_sp' with the selected SP entityid as parameter
            // Result gets included in the next tab
            if (currentIndex === 0 && newIndex === 1)
            {
                form.steps("remove", 1);
                form.steps("insert", 1, {
                    title: "Send email challenge",
                    contentMode: "async",
                    contentUrl: "https://dev-edugain.renater.fr/accountmanager?action=select_sp&style=nobanner&sp_entityid="+
                        encodeURIComponent($('#sp_entityid').val())
                });
            }

            // Trigger loading of the 'generate_token' with the selected SP entityid as parameter
            // Result gets included in the next tab
            if (currentIndex === 1 && newIndex === 2)
            {
                form.steps("remove", 2);
                form.steps("insert", 2, {
                    title: "Validate challenge",
                    contentMode: "async",
                    contentUrl: "https://dev-edugain.renater.fr/accountmanager?action=generate_token&style=nobanner&sp_entityid="+
                        encodeURIComponent($('#sp_entityid').val())+"&email_address="+encodeURIComponent($("input:checked[name='email_address']").val())
                });
            }

            // Trigger loading of the 'validate_token' with the list of test accounts created
            // Result gets included in the next tab
            if (currentIndex === 2 && newIndex === 3)
            {
                form.steps("remove", 3);
                form.steps("insert", 3, {
                    title: "Get test accounts",
                    contentMode: "async",
                    contentUrl: "https://dev-edugain.renater.fr/accountmanager?action=validate_token&style=nobanner&sp_entityid="+
                        encodeURIComponent($('#sp_entityid').val())+"&authentication_token="+encodeURIComponent($('#authentication_token').val())
                });
            }

            // Allways allow previous action even if the current form is not valid!
            if (currentIndex > newIndex)
            {
              return true;
            }
            // Needed in some cases if the user went back (clean up)
            if (currentIndex < newIndex)
            {
                // To remove error styles
                form.find(".body:eq(" + newIndex + ") label.error").remove();
                form.find(".body:eq(" + newIndex + ") .error").removeClass("error");
            }
            form.validate().settings.ignore = ":disabled,:hidden";
            return form.valid();
        
         },
        onStepChanged: function (event, currentIndex, priorIndex)
        {
        },
        onFinishing: function (event, currentIndex)
        {
            form.validate().settings.ignore = ":disabled";
            return form.valid();
        },
        onFinished: function (event, currentIndex)
        {
            alert("Submitted!");
        }
    });
    
    form.validate({
        errorPlacement: function errorPlacement(error, element) { element.before(error); },
    });

});

</script>


<form id ="create-account-form"
      action="[% env.SCRIPT_NAME %]"
      method="POST">

      <h3>Select your Service Provider</h3>
<fieldset>
    <h3>Select your Service Provider</h3>
<div>
This Test Identity Provider allows you to create test accounts with different profiles to validate the behaviour of your own Service Provider registered
in eduGAIN inter-federation. Note that only a Service Provider administrator can create accounts here.
<br/><br/>

<label for="sp_entityid">Please select your Service Provider below</label>
    
    <select id="sp_entityid" name="sp_entityid" class="required">
        <option value="">Select your Service Provider below</option>
        [% FOREACH entity IN federation_metadata_as_hashref.sort('default_display_name') %]
<option value="[% entity.entityid %]">[% IF entity.default_display_name %][% entity.default_display_name %] [% END %]([% entity.entityid %])</option>
        [% END %]
    </select>
    <br/>
</div>

</fieldset>

<h3>Send email challenge</h3>
<fieldset>
        <div data-mode="async" data-url="/rest/service/0"></div>
</fieldset>

<h3>Validate challenge</h3>
<fieldset></fieldset>

<h3>Get test accounts</h3>
<fieldset></fieldset>


</form>