<?php 
    global 
    $ST_OPTION_st_proqyz__leaderboard, 
    $ST_OPTION_st_proqyz__result_message,
    $ST_OPTION_st_proqyz__result_message_gov_competitive_exam,
    $ST_OPTION_st_proqyz__result_message_pdf_quiz,
    $ST_OPTION_st_proqyz__result_message_ielts_reading_quiz,
    $ST_OPTION_st_proqyz__result_message_ielts_listening_quiz,
    $ST_OPTION_st_proqyz__result_message_ielts_writing_quiz,
    $ST_OPTION_st_proqyz__result_message_ielts_speaking_quiz;

    if(count($_POST) > 0) {
        if(isset($_POST['submit'])){
            $enable_leaderboard = isset($_POST[$ST_OPTION_st_proqyz__leaderboard])? $_POST[$ST_OPTION_st_proqyz__leaderboard] : 0;
            update_option($ST_OPTION_st_proqyz__leaderboard, $enable_leaderboard);
            $enable_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message])? $_POST[$ST_OPTION_st_proqyz__result_message] : 0;
            update_option($ST_OPTION_st_proqyz__result_message, $enable_custom_result);
            $pdf_quiz_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message_pdf_quiz])? $_POST[$ST_OPTION_st_proqyz__result_message_pdf_quiz] : '';
            update_option($ST_OPTION_st_proqyz__result_message_pdf_quiz, $pdf_quiz_custom_result);
            $competitive_exam_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message_gov_competitive_exam])? $_POST[$ST_OPTION_st_proqyz__result_message_gov_competitive_exam] : '';
            update_option($ST_OPTION_st_proqyz__result_message_gov_competitive_exam,$competitive_exam_custom_result);
            $reading_quiz_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message_ielts_reading_quiz])? $_POST[$ST_OPTION_st_proqyz__result_message_ielts_reading_quiz] : '';
            update_option($ST_OPTION_st_proqyz__result_message_ielts_reading_quiz, $reading_quiz_custom_result);
            $listening_quiz_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message_ielts_listening_quiz])? $_POST[$ST_OPTION_st_proqyz__result_message_ielts_listening_quiz] : '';
            update_option($ST_OPTION_st_proqyz__result_message_ielts_listening_quiz, $listening_quiz_custom_result);
            $writing_quiz_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message_ielts_writing_quiz])? $_POST[$ST_OPTION_st_proqyz__result_message_ielts_writing_quiz] : '';
            update_option($ST_OPTION_st_proqyz__result_message_ielts_writing_quiz, $writing_quiz_custom_result);
            $speaking_quiz_custom_result = isset($_POST[$ST_OPTION_st_proqyz__result_message_ielts_speaking_quiz])? $_POST[$ST_OPTION_st_proqyz__result_message_ielts_speaking_quiz] : '';
            update_option($ST_OPTION_st_proqyz__result_message_ielts_speaking_quiz, $speaking_quiz_custom_result);
        }
    }










    $enable_leaderboard                 = get_option($ST_OPTION_st_proqyz__leaderboard, 1);
    $enable_custom_result               = get_option($ST_OPTION_st_proqyz__result_message,0);
    $pdf_quiz_custom_result             = get_option($ST_OPTION_st_proqyz__result_message_pdf_quiz,'');
    $reading_quiz_custom_result         = get_option($ST_OPTION_st_proqyz__result_message_ielts_reading_quiz,'');
    $listening_quiz_custom_result       = get_option($ST_OPTION_st_proqyz__result_message_ielts_listening_quiz,'');
    $writing_quiz_custom_result         = get_option($ST_OPTION_st_proqyz__result_message_ielts_writing_quiz,'');
    $speaking_quiz_custom_result        = get_option($ST_OPTION_st_proqyz__result_message_ielts_speaking_quiz,'');
    $competitive_exam_custom_result     = get_option($ST_OPTION_st_proqyz__result_message_gov_competitive_exam,'');

    $pdf_quiz_custom_result             = stripslashes($pdf_quiz_custom_result);
    $reading_quiz_custom_result         = stripslashes($reading_quiz_custom_result);
    $listening_quiz_custom_result       = stripslashes($listening_quiz_custom_result);
    $writing_quiz_custom_result         = stripslashes($writing_quiz_custom_result);
    $speaking_quiz_custom_result        = stripslashes($speaking_quiz_custom_result);
    $competitive_exam_custom_result     = stripslashes($competitive_exam_custom_result);
    

?>

<style>
    .content__area {
        padding: 12px;
    }
    .notice{ display: none; }
    .switch {
        position: relative;
        display: inline-block;
        width: 40px;
        height: 20px;
        margin-right: 10px;
    }

    .switch input { 
        opacity: 0;
        width: 0;
        height: 0;
    }

    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: .1s;
        transition: .1s;
    }

    .slider:before {
        position: absolute;
        content: "";
        height: 14px;
        width: 14px;
        left: 4px;
        bottom: 3px;
        background-color: white;
        -webkit-transition: .1s;
        transition: .1s;
    }

    input:checked + .slider {
        background-color: #2196F3;
    }

    input:focus + .slider {
        box-shadow: 0 0 1px #2196F3;
    }

    input:checked + .slider:before {
        -webkit-transform: translateX(18px);
        -ms-transform: translateX(18px);
        transform: translateX(18px);
    }

    /* Rounded sliders */
    .slider.round {
        border-radius: 34px;
    }

    .slider.round:before {
        border-radius: 50%;
    }
</style>
<style>
    .d-flex {
        display: flex;
    }

    .flex-row {
        flex-direction: row;
    }

    .flex-column {
        flex-direction: column;
    }

    .align-items-start {
        align-items: flex-start;
    }

    .mb-2 {
        margin-bottom: 1.2rem;
    }
    .fade{ opacity: 0;}
    .show { display: block !important; transition: opacity 0.3s; }
    .in { opacity: 1 !important; }
</style>
<h2>Result Page</h2>
<div>
    <p>
        Result page show the content when result came out
    </p>
</div>
<form method="POST">
    <div class="content__area">
        <div class="row mb-2">
            <div class="col-12 mb-2">
                <div class="d-flex flex-row align-items-start gap-2">
                    <label class="switch">
                        <input 
                            value="1"
                            type="checkbox" 
                            name="<?php echo $ST_OPTION_st_proqyz__leaderboard; ?>" 
                            <?php echo ($enable_leaderboard == 1)? 'checked' : ''; ?>
                        />
                        <span class="slider round"></span>
                    </label>
                    <div class="details d-flex flex-column align-items-start">
                        <span class="title"><b>Leaderboard</b></span>
                        <span class="description">A Leaderboard for Student Results is a dynamic ranking system that displays students' scores and positions based on their academic or test performance. It visually represents top-performing students, encouraging healthy competition and motivation.</span>
                    </div>
                </div>
            </div>
            <div class="col-12 mb-2">
                <div class="d-flex flex-row align-items-start gap-2">
                    <label class="switch">
                        <input 
                            type="checkbox" 
                            name="<?php echo $ST_OPTION_st_proqyz__result_message; ?>"
                            data-proqyz-type="expand"
                            data-proqyz-target="#poststuff"
                            <?php echo ($enable_custom_result == 1)? 'checked' : ''; ?> 
                            value="1"
                        />
                        <span class="slider round"></span>
                    </label>
                    <div class="details d-flex flex-column align-items-start">
                        <span class="title"><b>Result message(s)</b></span>
                        <span class="description">When enabled, the first message will be displayed to ALL users. To customize the message based on earned score, add new Graduation Levels and set the 'From' field to the desired grade.</span>
                    </div>
                </div>
            </div>
            <div id="poststuff" class="col-12 mb-2 fade <?php echo ($enable_custom_result == 1)? 'in show' : ''; ?>" style="display:none;">
                <div class="postbox st-proqyz__evaluation-metabox">
                    <div class="postbox-header">
                        <h2 class="hndle">Result Message(s) for Each Quiz type</h2>
                    </div>
                    <div class="inside" style="display:block;">
                        <table class="form-table">
                            <tbody>
                                <!-- begin::pdf quiz -->
                                <tr class="">
                                    <th scope="row" class="titledesc">PDF Quiz</th>
                                    <td class="forminp forminp-checkbox ">
                                        <fieldset>
                                            <legend class="screen-reader-text">
                                                <span>PDF Quiz</span>
                                            </legend>
                                            <?php wp_editor($pdf_quiz_custom_result, $ST_OPTION_st_proqyz__result_message_pdf_quiz); ?>
                                        </fieldset>
                                    </td>
                                </tr>
                                <!-- end::pdf quiz -->

                                <!-- begin::ielts listening -->
                                <tr class="">
                                    <th scope="row" class="titledesc">IELTS Listening</th>
                                    <td class="forminp forminp-checkbox ">
                                        <fieldset>
                                            <legend class="screen-reader-text">
                                                <span>IELTS Listening</span>
                                            </legend>
                                            <?php wp_editor($listening_quiz_custom_result, $ST_OPTION_st_proqyz__result_message_ielts_listening_quiz); ?>
                                        </fieldset>
                                    </td>
                                </tr>
                                <!-- end::ielts listening -->

                                <!-- begin::ielts reading -->
                                <tr class="">
                                    <th scope="row" class="titledesc">IELTS Reading</th>
                                    <td class="forminp forminp-checkbox ">
                                        <fieldset>
                                            <legend class="screen-reader-text">
                                                <span>IELTS Reading</span>
                                            </legend>
                                            <?php wp_editor($reading_quiz_custom_result, $ST_OPTION_st_proqyz__result_message_ielts_reading_quiz); ?>
                                        </fieldset>
                                    </td>
                                </tr>
                                <!-- end::ielts reading -->

                                <!-- begin::ielts writing -->
                                <tr class="">
                                    <th scope="row" class="titledesc">IELTS Writing</th>
                                    <td class="forminp forminp-checkbox ">
                                        <fieldset>
                                            <legend class="screen-reader-text">
                                                <span>IELTS Writing</span>
                                            </legend>
                                            <?php wp_editor($writing_quiz_custom_result, $ST_OPTION_st_proqyz__result_message_ielts_writing_quiz); ?>
                                        </fieldset>
                                    </td>
                                </tr>
                                <!-- end::ielts Writing -->

                                <!-- begin::ielts speaking -->
                                <tr class="">
                                    <th scope="row" class="titledesc">IELTS Speaking</th>
                                    <td class="forminp forminp-checkbox ">
                                        <fieldset>
                                            <legend class="screen-reader-text">
                                                <span>IELTS Speaking</span>
                                            </legend>
                                            <?php wp_editor($speaking_quiz_custom_result, $ST_OPTION_st_proqyz__result_message_ielts_speaking_quiz); ?>
                                        </fieldset>
                                    </td>
                                </tr>
                                <!-- end::ielts Speaking -->

                                <!-- begin::Gov Competitive exam -->
                                <tr class="">
                                    <th scope="row" class="titledesc">Competitive Exam</th>
                                    <td class="forminp forminp-checkbox ">
                                        <fieldset>
                                            <legend class="screen-reader-text">
                                                <span>Competitive Exam</span>
                                            </legend>
                                            <?php wp_editor($competitive_exam_custom_result, $ST_OPTION_st_proqyz__result_message_gov_competitive_exam); ?>
                                        </fieldset>
                                    </td>
                                </tr>
                                <!-- end::Gov Competitive exam -->
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <p class="submit">
                

                <button name="save" class="button-primary woocommerce-save-button" type="submit" value="Save changes">
                    Save changes
                </button>
        
                <input type="hidden" name="submit" value="1" />		
            </p>
        </div>
    </div>
</form>

<script>
    jQuery(document).ready(function($) {

        $(document).on('change', '[data-proqyz-type="expand"]', function(){
            let isChecked   = $(this).prop('checked');
            let target      = $(this).data('proqyz-target');
            if(isChecked){
                $(target).addClass('show');
                $(target).addClass('in');
            } else {
                $(target).removeClass('in');
                $(target).removeClass('show');
            }
        });

    });
</script>
