MediaWiki:Gadget-FormCheck.js

$('#TfacsSubmission').ready( function() {

    $('.section-nav-toggles').click( function(event) {
        setTimeout( function() {
            var activeTable = $('.mw-collapsible:not(.mw-collapsed)')
            var atOffset = $(activeTable).offset().top
            var navBarHeight = $('#mw-navigation').outerHeight()
            $([document.documentElement, document.body]).animate({
                scrollTop: atOffset - ( navBarHeight * 2 ) - 7
            }, 0);
        }, "1");
        $(this).next().next('.section-nav-toggles').toggle();
        $(this).prev().prev('.section-nav-toggles').toggle();
        var nextText = 'Next section <i class="fa-duotone fa-diagram-next pl-1"></i>'
        var prevText = 'Previous section <i class="fa-duotone fa-diagram-previous pl-1"></i>'
        if ( $(this).html() == nextText ) {
           $(this).html(prevText);
        } else {
           $(this).html(nextText);
        }
    });


    function checkForm() {
        $('#TfacsSubmission input, #TfacsSubmission select, #TfacsSubmission textarea').prop('disabled', false);
        if( $('select[name="retreattype[]"]').val() === 'Three-year retreat') {
            if( $('.MustField, .ThreeMustField').filter(function() { return this.value === ''; }).length === 0 ) {
                if($('input[name="status"]').val() === 'Saved'){
                    $('.form-status').addClass('alert-success').html('Current status: <b>SAVED</b>. <br> All filled! Status will change to complete upon next save.');
                    $('input[name="status"]').val("Complete");
                } else {
                    $('.form-status').addClass('alert-danger').html('Current status: <b>COMPLETE</b>. <br> Please revise carefully all the fields in the form and verify that your information is correct. <br> You can then click "Submit your final application" at the bottom.');
                }
            } else {
                console.log("Fields missing... Three-year retreat");
                var fieldsMissing = ''
                $('.MustField, .ThreeMustField').each( function(index, val) {
                    if( !$(this).val() ){
                        var name = $(this).attr("name");
                        console.log( index + ': ' + name );
                        fieldsMissing = fieldsMissing + '<div>' + index + ': ' + name + '</div>'
                    }
                });
                $('input[name="status"]').val("Saved");
                $('.form-status').addClass('alert-warning').html('Current status: <b>SAVED</b>. <br> Some fields are still missing.' );
            }
        } else if( $('select[name="retreattype[]"]').val() === 'Solitary hermitage') {
            if( $('.MustField, .SolMustField').filter(function() { return this.value === ''; }).length === 0 ) {
                console.log("All filled, setting status to 'Complete'.");
                $('input[name="status"]').val("Complete");
                if($('input[name="status"]').val() === 'Saved'){
                    $('#CompletedFields').show();
                }
                $('.form-status').addClass('alert-success').html('Current status: <b>SAVED</b>. <br> All filled, status will change to complete upon next save.');
            } else {
                console.log("Fields missing... Solitary hermitage");
                var fieldsMissing = ''
                $('.MustField, .SolMustField').each( function(index, value) {
                    if( !$(this).val() ){
                        var name = $(this).attr("name");
                        console.log( index + ': ' + name );
                        fieldsMissing = fieldsMissing + '<div>' + index + ': ' + name + '</div>'
                    }
                });
                $('input[name="status"]').val("Saved");
                $('.form-status').addClass('alert-info').html('Current status: <b>SAVED</b>. <br> Some fields are still missing.' );
            }
        } else {
            console.log("Retreat type not set." + $('select[name="retreattype[]"]').val());
            $('.form-status').addClass('alert-warning').html('Current status: <b>SAVED</b>. <br> Retreat type not set.' );
        }
    }

    if( ($('input[name="status"]').val() === 'Saved') || ($('input[name="status"]').val() === 'Complete') ) {
        jQuery(document).ready( checkForm() );
        $('#TfacsSubmission input, #TfacsSubmission select, #TfacsSubmission textarea').on( "keyup", checkForm() );
    } else {
        $('#TfacsSubmission input, #TfacsSubmission select, #TfacsSubmission textarea').not('#DummyField, #TfacsSubmitApplication').prop('disabled', true);
        $('.form-status').addClass('alert-dark').html('Current status: <b>SUBMITTED</b>. <br> Your application has been submitted. The contemplative scholarship administrator will contact you shortly.' );
    }
})