<?php
    @include('../../controller/config/config.php');

    @include('../../../controller/config/config.php');
    
    // // Get the encrypted data from the URL parameter
    // $encrypted_message = $_GET['const']; // Replace 'encrypted_data' with the actual parameter name

    
    // // Encryption algorithm and mode (must be the same algorithm used for encryption)
    // $encryption_algo = "AES-256-CBC"; // Replace with the correct encryption algorithm used


    // // Decode the encrypted message from base64
    // $decoded_message = base64_decode($encrypted_message);

    // // Extract the IV and ciphertext from the decoded message
    // $iv_size = openssl_cipher_iv_length($encryption_algo); // Ensure $encryption_algo matches the encryption algorithm used in the encryption process
    // $iv = substr($decoded_message, 0, $iv_size);
    // $cipher_text = substr($decoded_message, $iv_size);

    // // Secret key (must be the same key used for encryption)
    // $secret_key = "16-character-secret"; // Replace with your secure secret key

    // // Perform decryption
    // $decrypted_data = openssl_decrypt($cipher_text, $encryption_algo, $secret_key, OPENSSL_RAW_DATA, $iv);

    // // Parse the string as a URL-encoded query string
    // parse_str($decrypted_data, $parsedData);

   
    
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="author" content="EduMESS" />
    <meta name="description"
        content="EduMESS (Education Management and E-Learning Software Solution) 
        is a leading school management, automation and elearning solution. Since its 
        launch, EduMESS has grown to become a leader. Our clients say that the simplicity 
        of our interface, ease of use, cost effectiveness and excellent customer care is 
        the reason they prefare EduMESS. We have watched schools move from softwares they 
        are using to EduMESS." />
    <meta name="keywords"
        content="Best, School, Management, Best School, Best School Management, 
        Best School Management Software, Free School Management Software, Portal, 
        School Owner, Group of School Owner, Consultants, Brand Promoters | School Portal Generator">
        <title>EduMESS</title>
        <!-- FAVICON AND TOUCH ICONS -->
    <link rel="shortcut icon" href="../../assets/images/website_images/favicon.png" type="image/x-icon">
    <link rel="icon" href="../../assets/images/website_images/favicon.png" type="image/x-icon">
    <link rel="apple-touch-icon" sizes="152x152" href="../../assets/images/website_images/favicon.png">
    <link rel="apple-touch-icon" sizes="120x120" href="../../assets/images/website_images/favicon.png">
    <link rel="apple-touch-icon" sizes="76x76" href="../../assets/images/website_images/favicon.png">
    <link rel="apple-touch-icon" href="../../assets/images/website_images/favicon.png">
    <link rel="icon" href="../../assets/images/website_images/favicon.png" type="image/x-icon">

    <link href="../../assets/plugins/bootstrap5/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Arvo&display=swap" rel="stylesheet">
    <script src="../../assets/plugins/jquery/code.jquery.com_jquery-3.5.1.min.js"></script>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Sharp" rel="stylesheet">
    <link href='https://unpkg.com/boxicons@2.0.7/css/boxicons.min.css' rel='stylesheet'>

    <link href='https://cdn.datatables.net/1.13.7/css/jquery.dataTables.min.css' rel='stylesheet'>
    <!-- fontawesome cdn -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />

    <!-- Animate.css CDN -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" integrity="sha512-..." crossorigin="anonymous" />

    <!-- style sheet -->
    <link rel="stylesheet" href="../../css/admin_css/appStyle.css">

    <!-- style sheet -->
    <link rel="stylesheet" href="../../css/user_css/students_css/studentsStyle.css">

	<!-- Profile CSS -->
	<link rel="stylesheet" href="../../css/user_css/teacher_css/page-profile.css">
	<link rel="stylesheet" href="../../css/user_css/teacher_css/profile.css">

   
    <script src="../../assets/plugins/dselect.js"></script>

    <!-- notification css-->
    <link href="../../assets/plugins/notify/wnoty.css" rel="stylesheet">

    <!-- image Croppie -->
    <link rel="stylesheet" href="../../assets/plugins/Croppie/croppie.css"></link>
    
   

     <!-- fontawesome cdn -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />

        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

        <!-- Phone Number CDN -->
        <link href="../../css/website_css/wnoty/wnoty.css" rel="stylesheet" />

        <script src="./tinymce5/tinymce.min.js"></script>




    <style>
            .selectSubject {
			display: flex;
			flex-wrap: wrap;
			flex-direction: column;
		}
		.selectSubject label {
			display: flex;
			cursor: pointer;
			font-weight: 700;
			position: relative;
			overflow: hidden;
			margin-bottom: 0.375em;
		    font-size: calc(0.1em + 1.20vw);
			
		}
		.selectSubject label input {
			position: absolute;
			left: -9999px;
		}
		.selectSubject label input:checked + span {
			background-color: #e6e6ff;
		}
		.selectSubject label input:checked + span:before {
			box-shadow: inset 0 0 0 0.4375em #00005c;
		}
		.selectSubject label span {
			display: flex;
			align-items: center;
			padding: 0.75em 0.75em 0.375em 0.375em;
			border-radius: 99em;
			transition: 0.25s ease;
		}
		.selectSubject label span:hover {
			background-color: #e6e6ff;
		}
		.selectSubject label span:before {
			display: flex;
			flex-shrink: 0;
			content: "";
			background-color: #fff;
			width: 1.5em;
			height: 1.5em;
			border-radius: 50%;
			margin-right: 0.375em;
			transition: 0.25s ease;
			box-shadow: inset 0 0 0 0.125em #00005c;
		}

       
         /* Icon delete Css */
         .icon-box {
			width: 80px;
			height: 80px;
			margin: 0 auto;
			border-radius: 50%;
			z-index: 9;
			text-align: center;
			border: 3px solid green;
			
		}
		 .icon-box i {
			color: green;
			font-size: 46px;
			display: inline-block;
			margin-top: 13px;
		}
    

    </style>
    
</head>

<body>

    <div class="grid-container" >
        
        <!-- Sidebar -->
		<aside id="sidebar">
			<div class="sidebar-title">
				<div class="sidebar-brand">
					<img src="../home/favicon.png" style="width: 15%;" alt=""> <span>EduMESS </span>
				</div>
				<div class="close-icon" style="cursor: pointer;" onclick="closeSidebar()">
					<span class="material-icons-sharp">close</span>
				</div>
			</div>
			
			<ul class="sidebar-List">

				<li class="sidebar-list-item">
					<a href="#" onclick="history.back()" style="font-weight:600;">
						<i class='bx bx-arrow-back' style="margin-right: 10px;"></i>
						<span >Go Back</span>
					</a>
				</li>
				
			</ul>
		</aside>
		<!-- End Sidebar -->


        <!----Main----->
        <main class="main-container">

            <div class="main-cards" style="margin-top: 20px;">

                    <div class="container-fluid">

                            <div class="row g-2" id="prosloadexamecontenthere"></div>

                            <div id="prosloadathoeryquestionhereeditor">
                                <textarea hidden="hidden"  class="proshidefirstheorycontentdummy example" ></textarea>
                            </div>

                    </div>
            </div>
    	
  
        </main>
     <!--jquery knob -->






     <!-- Delete Question Modal Direct-->
     <div class="modal fade pros-submitexam" id="pros-submitexam" data-bs-backdrop="static" data-bs-keyboard="false"  tabindex="-1" aria-labelledby="pros-submitexamLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header border-0">
                    <!-- <h5 class="modal-title" id="createQuestionLabel">Modal title</h5> -->
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="icon-box text-center">
						<i class="fa fa-check"></i>
					</div>						
					<h4 class="modal-title w-100 text-center">Are you sure you  want to Submit?</h4>
                    <p class="text-center">Make Sure you have answered all the Question</p>
                </div>
                <div class="modal-footer justify-content-center">
                    <button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal" style="font-size: 12px;">Cancel</button>
                    <button type="button" class="btn btn-danger btn-sm pros-subexamfinal" style="font-size: 12px;">Yes, I want to Submit</button>
				</div>
                <!-- <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div> -->
            </div>
        </div>
    </div>


     <script src="../../assets/plugins/knob/jquery.knob.js"></script>

    <!--Script-->
    <script src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js"></script>
    
    
    <!--Custom JS--->
    <script src="../../assets/plugins/bootstrap5/js/bootstrap.bundle.min.js"></script>

    <!-- notification js -->
    <script src="../../assets/plugins/notify/wnoty.js"></script>

    <!-- image cropper js -->
    <script src="../../assets/plugins/Croppie/croppie.js"></script>
    <script src="../../assets/plugins/Croppie/croppie.min.js"></script>





      <!--Custom JS--->
      <script src="../../assets/plugins/bootstrap5/js/bootstrap.bundle.min.js"></script>
    <script src="../../css/website_css/wnoty/wnoty.js"></script>

    <script type="/text/javascript" src="./tinymce5/wirislib.js"></script>


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

            $('#prosloadathoeryquestionhereeditor').hide();

            // Get the URL parameters
            var urlParams = new URLSearchParams(window.location.search);

            // Retrieve the cbt_id and UserID values
            var cbtSettingsID = urlParams.get('cbt_id');
            var StudentID = urlParams.get('userid');
            var examtype = urlParams.get('examtype');

          


          
           
            
            // alert(cbtSettingsID);

            $('#prosloadexamecontenthere').html('<div align="center"> <i class="fa fa-spinner fa-spin fs-1" style="color:#007ffb;"></i></div>');


                $.ajax({
                    type: 'post',
                    url: "../../controller/scripts/student/cbt/tari_get_cbt_question_content.php",
                    data: {cbtSettingsID: cbtSettingsID,StudentID: StudentID,examtype:examtype}, //Pass $id
                    success: function (result) {

                        

                      
                        $('#prosloadexamecontenthere').html(result);

                        $('.proshidefirstheorycontentdummy').fadeOut();

                        var prosquestiontypeheregotten = $('#pros-loadexamtypehere').val();

                          
                        
                     
                        if(prosquestiontypeheregotten == 'Theory')
                        {
                       
                            $('#proscheckwhatquestiontodisplayhere').fadeIn('slow');
                            $("#pros-displaytheoryfirstoptionhere").html('<textarea class="wrs_div_box example question" id="optionA1" ></textarea>');
                            resetEditor();
                            createEditorInstance();

                        }
                        else
                        {
                            $('#proscheckwhatquestiontodisplayhere').fadeIn('slow');
                        }


                        //CLICK ON NEXT START HERE HERE   
                        $("body").on('click', '.next', function () {

                            $("html,body").animate({
                                scrollTop: 0
                            }, 'fast');

                            var currentkeyvalue = parseInt($('#nxtprevquestion').val());
                            var arrayanwer = $('#currentanwernxt').val();
                            var getanswerarr = arrayanwer.split(",");
                            var questionNo = parseInt($('#questionNo').val());

                            var prosquestiontypehere = $('#pros-loadexamtypehere').val();

                            // alert(prosquestiontypehere);

                            // alert(arrayanwer);


                            if (prosquestiontypehere == 'Theory') {

                                tinyMCE.triggerSave();
                                var answer = [];

                                $m = 1;

                                $.each($(".question"), function () {
                                    answer.push($(this).val() + "Nil##");
                                    $m++;
                                });

                                const jsontext = $('#pros-loadjsoncontentforcbt').val();

                                // alert(jsontext);

                                // const result = JSON.stringify(jsontext);
                                const obj = JSON.parse(jsontext);
                                var lengthofquestion_object = Object.keys(obj).length;

                                var newkeyvalue = parseInt(currentkeyvalue);
                                var newarraykey = newkeyvalue + 1;
                                var newquestionNo = questionNo + 1;


                                if(answer == '##' || answer == 'Nil##' || answer == '0Nil##' || answer == 'Nil') {

                                    var newanswer = 'Nil##';
                                    getanswerarr[newkeyvalue] = newanswer;


                                    if (newquestionNo > lengthofquestion_object) {
                                        // newarraykey = newarraykey-1;  

                                        $('#currentanwernxt').val(getanswerarr);
                                        localStorage.setItem("questionansertheory", $('#currentanwernxt').val());

                                        $('.next').prop('disabled', true);
                                        $('.previous').prop('disabled', false);
                                        $('#submitnex').html('<button type="button" class="btn waves-effect waves-light btn-success" data-bs-toggle="modal" data-bs-target="#pros-submitexam" style="font-size: 15px; background: #2CEB6C; border: #2CEB6C;">Submit</button>');

                                    } else {


                                        $('#questionNo').val(newquestionNo);
                                        $('#nxtprevquestion').val(newarraykey);
                                        $('#currentanwernxt').val(getanswerarr);

                                        $('.next').prop('disabled', false);
                                        $('.previous').prop('disabled', false);
                                    }


                                    var newquestion = obj[newarraykey].question;
                                    var newanswerload_new = getanswerarr[newarraykey];

                                    let resultreplacestring = newanswerload_new.toString();
                                    let resultreplace = resultreplacestring.replace(/Nil##/g, "");


                                    if (resultreplace == 'Nil' || resultreplace == '##' || resultreplace == 'Nil##' || resultreplace == '0Nil##') {
                                        var newanswerload = '';

                                    } else {
                                        var newanswerload = resultreplace;
                                    }


                                    // tinyMCE.triggerSave();


                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<textarea class="example question tinymce" id="optionA1">' + newanswerload + '</textarea>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 50px;"><hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4">' +
                                        '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row mt-3" >' +
                                        '<div class="col-sm-12">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.' +
                                        'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');

                                    resetEditor();
                                    createEditorInstance();
                                    tinyMCE.get('optionA1').setContent(newanswerload);


                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());


                                }
                                else{

                                    getanswerarr[newkeyvalue] = answer;

                                    if (newquestionNo > lengthofquestion_object) {
                                        // newarraykey = newarraykey-1;  

                                        $('#currentanwernxt').val(getanswerarr);
                                        localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                        
                                        $('#submitnex').html('<button type="button" class="btn waves-effect waves-light btn-success float-end" data-bs-toggle="modal" data-bs-target="#pros-submitexam" style="font-size: 15px; background: #2CEB6C; border: #2CEB6C;">Submit</button>');
                                        $('.next').prop('disabled', true);
                                        $('.previous').prop('disabled', false);
                                        
                                    } else {
                                        $('#questionNo').val(newquestionNo);
                                        $('#nxtprevquestion').val(newarraykey);
                                        $('#currentanwernxt').val(getanswerarr);

                                        $('.next').prop('disabled', false);
                                        $('.previous').prop('disabled', false);
                                    }


                                    var newquestion = obj[newarraykey].question;
                                    var newanswerload_new = getanswerarr[newarraykey];

                                    let resultreplace = newanswerload_new.toString();

                                    let resultreplacenew = resultreplace.replace(/Nil##/g, "");

                                    if (resultreplacenew == 'Nil' || resultreplacenew == '##' || resultreplacenew == 'Nil##' || resultreplace == '0Nil##') {
                                        var newanswerload = '';
                                    } else {
                                        var newanswerload = resultreplacenew;
                                    }


                                    // tinyMCE.triggerSave();
                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<textarea class="example question tinymce">' + newanswerload + '</textarea>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 50px;"><hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4" id="submitnex">' +
                                        '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row mt-3" >' +
                                        '<div class="col-sm-12">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.' +
                                        'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');

                                    resetEditor();
                                    createEditorInstance();
                                    tinyMCE.get('optionA1').setContent(newanswerload);


                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());
                                }

                            }
                            else{

                                if ($("input[type='radio'].radioBtnClass").is(':checked')) {


                                    var answer = $("input[type='radio'].radioBtnClass:checked").val();

                                    const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                    const result = JSON.stringify(jsontext);
                                    const obj = JSON.parse(jsontext);
                                

                                    var lengthofquestion_object = Object.keys(obj).length;
                                    getanswerarr[currentkeyvalue] = answer;

                                    var newkeyvalue = parseInt(currentkeyvalue);
                                    var newarraykey = newkeyvalue + 1;
                                    var newquestionNo = questionNo + 1;

                                    $('#currentanwernxt').val(getanswerarr);

                                    if (newquestionNo > lengthofquestion_object) {

                                        $('#currentanwernxt').val(getanswerarr);
                                        localStorage.setItem("questionanser", $('#currentanwernxt').val());

                                        $('.next').prop('disabled', true);
                                        $('.previous').prop('disabled', false);
                                        $('#submitnex').html('<button type="button" class="btn waves-effect waves-light btn-success float-end" data-bs-toggle="modal" data-bs-target="#pros-submitexam" style="font-size: 15px;  background-color:#4db8ff; border: #2CEB6C;">Submit</button>');


                                    } 
                                    else{


                                        $('#questionNo').val(newquestionNo);
                                        $('#nxtprevquestion').val(newarraykey);

                                        $('.next').prop('disabled', false);
                                        $('.previous').prop('disabled', false);
                                        
                                        
                                        
                                                                                                       // Function to decode HTML entities
                                                                function decodeHTMLEntities(str) {
                                                                    return String(str)
                                                                        .replace(/&amp;/g, '&')
                                                                        .replace(/&lt;/g, '<')
                                                                        .replace(/&gt;/g, '>')
                                                                        .replace(/&quot;/g, '"')
                                                                        .replace(/&#039;/g, "'");
                                                                }
                                                                
                                                                // Function to remove HTML tags
                                                                function removeHTMLTags(str) {
                                                                    return str.replace(/<\/?[^>]+(>|$)/g, "");
                                                                }
                                                                
                                                                // Function to format text
                                                                function formatText(text) {
                                                                    return removeHTMLTags(decodeHTMLEntities(text));
                                                                }
                                                                
                                                                // Usage example
                                                                var newquestion = obj[newarraykey].question;
                                                                var newoptionA = obj[newarraykey].optionA;
                                                                var newoptionB = obj[newarraykey].optionB;
                                                                var newoptionC = obj[newarraykey].optionC;
                                                                var newoptionD = obj[newarraykey].optionD;
                                                                
                                                                newquestion = formatText(newquestion);
                                                                newoptionA = formatText(newoptionA);
                                                                newoptionB = formatText(newoptionB);
                                                                newoptionC = formatText(newoptionC);
                                                                newoptionD = formatText(newoptionD);
                                                                                                         
                                         
                                         
                                           
                                            
                                        $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                            '<div class="myborder"></div>' +
                                            '<div style="margin-top: 50px; margin-left: 20px;">' +
                                            '<h4>' + newquestion + '</h4>' +
                                            '<form class="selectSubject">'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                                    '<span class="myclassforoption">A. ' + newoptionA + '</span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                                    '<span class="myclassforoption">B. ' + newoptionB + '</span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                                    '<span class="myclassforoption">C. ' + newoptionC + '</span>'+
                                                '</label>' +
                                                '<label>' +
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                                    '<span class="myclassforoption">D. ' + newoptionD +'</span>'+
                                                '</label>'+
                                            '</form>'+
                                            '</div>'+

                                            '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                            '<div class="col-8">' +
                                            '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous float-start" id="prevbtn">Previous</button>' +
                                            '</div>' +
                                            '<div class="col-4" id="submitnex" >' +
                                            '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                            '</div>' +
                                            '</div>' +

                                            '<div class="row" style="margin-top: 75px;">' +
                                            '<div class="col-sm-10">' +
                                            '<div>' +
                                            '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                            '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                            ' by the right before the time runs out. You can also select any question below to answer.' +
                                            ' Don\'t forget to click Submit when you are done.' +
                                            '</small>' +
                                            '</div>' +
                                            '</div>' +
                                            '</div>');
                                        

                                        if (getanswerarr[newarraykey] == 'A') {
                                            $('#radio_1').prop('checked', true);
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', false);
                                        } else if (getanswerarr[newarraykey] == 'B') {
                                            $('#radio_2').prop('checked', true);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', false);
                                        } else if (getanswerarr[newarraykey] == 'C') {
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', true);
                                            $('#radio_4').prop('checked', false);
                                        } else if (getanswerarr[newarraykey] == 'D') {
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', true);
                                        } else {
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', false);
                                        
                                        }

                                        localStorage.setItem("questionkey", $('#nxtprevquestion').val());
                                        localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                        localStorage.setItem("questionNo", $('#questionNo').val());

                                        // alert($('#currentanwernxt').val());
                                    

                                    }


                                } 
                                else {


                                    var answer = 0;
                                    const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                    const obj = JSON.parse(jsontext);

                                    // alert(jsontext);

                                    var lengthofquestion_object = Object.keys(obj).length;

                                    var newkeyvalue = parseInt(currentkeyvalue);
                                    var newarraykey = newkeyvalue + 1;
                                    var questionAswered = $("#currentanwernxt").val();
                                    var answerToArray = questionAswered.split(",");
                                    var newquestionNo = questionNo + 1;

                                    if (newquestionNo > lengthofquestion_object) {
                                        $('.next').prop('disabled', true);
                                        $('#currentanwernxt').val(getanswerarr);
                                        localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                        $('#submitnex').html('<button type="button" class="btn waves-effect waves-light btn-success float-end" data-bs-toggle="modal" data-bs-target="#pros-submitexam" style="font-size: 15px;  background-color:#4db8ff; border: #2CEB6C;">Submit</button>');
                                    } else {
                                        $('#questionNo').val(newquestionNo);
                                        $('#nxtprevquestion').val(newarraykey);
                                        $('.next').prop('disabled', false);
                                    }

                                      
                                        
                                        
                                        
                                        
                                             function decodeHTMLEntities(str) {
                                                    return String(str)
                                                        .replace(/&amp;/g, '&')
                                                        .replace(/&lt;/g, '<')
                                                        .replace(/&gt;/g, '>')
                                                        .replace(/&quot;/g, '"')
                                                        .replace(/&#039;/g, "'");
                                                }
                                                
                                                // Function to remove HTML tags
                                                function removeHTMLTags(str) {
                                                    return str.replace(/<\/?[^>]+(>|$)/g, "");
                                                }
                                                
                                                // Function to format text
                                                function formatText(text) {
                                                    return removeHTMLTags(decodeHTMLEntities(text));
                                                }
                                                
                                                // Usage example
                                                var newquestion = obj[newarraykey].question;
                                                var newoptionA = obj[newarraykey].optionA;
                                                var newoptionB = obj[newarraykey].optionB;
                                                var newoptionC = obj[newarraykey].optionC;
                                                var newoptionD = obj[newarraykey].optionD;
                                                
                                                newquestion = formatText(newquestion);
                                                newoptionA = formatText(newoptionA);
                                                newoptionB = formatText(newoptionB);
                                                newoptionC = formatText(newoptionC);
                                                newoptionD = formatText(newoptionD);



                                        $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                            '<div class="myborder"></div>' +
                                            '<div style="margin-top: 50px; margin-left: 20px;">' +
                                            '<h4>' + newquestion + '</h4>' +
                                            '<form class="selectSubject">'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                                    '<span>A. ' + newoptionA + ' </span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                                    '<span>B. ' + newoptionB + '</span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                                    '<span>C. ' + newoptionC + '</span>'+
                                                '</label>' +
                                                '<label>' +
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                                    '<span>D. ' + newoptionD +'</span>'+
                                                '</label>'+
                                            '</form>'+
                                            '</div>'+

                                            '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                            '<div class="col-8">' +
                                            '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded  Previous float-start" id="prevbtn">Previous</button>' +
                                            '</div>' +
                                            '<div class="col-4" id="submitnex" >' +
                                            '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                            '</div>' +
                                            '</div>' +

                                            '<div class="row" style="margin-top: 75px;">' +
                                            '<div class="col-sm-10">' +
                                            '<div>' +
                                            '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                            '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                            ' by the right before the time runs out. You can also select any question below to answer.' +
                                            ' Don\'t forget to click Submit when you are done.' +
                                            '</small>' +
                                            '</div>' +
                                            '</div>' +
                                            '</div>');
                                        

                                        if (getanswerarr[newarraykey] == 'A') {
                                            $('#radio_1').prop('checked', true);
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', false);
                                        } else if (getanswerarr[newarraykey] == 'B') {
                                            $('#radio_2').prop('checked', true);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', false);
                                        } else if (getanswerarr[newarraykey] == 'C') {
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', true);
                                            $('#radio_4').prop('checked', false);
                                        } else if (getanswerarr[newarraykey] == 'D') {
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', true);
                                        } else {
                                            $('#radio_2').prop('checked', false);
                                            $('#radio_1').prop('checked', false);
                                            $('#radio_3').prop('checked', false);
                                            $('#radio_4').prop('checked', false);
                                        
                                        }

                                    localStorage.setItem("questionkey", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNo", $('#questionNo').val());


                                }


                            }

                        });
                        //CLICK ON NEXT END HERE HERE  

                        //CLICK ON PREVIOUS BTN START HERE HERE   
                        $("body").on('click', '.Previous', function () {

                            $("html,body").animate({
                                scrollTop: 0
                            }, 'fast');


                            var currentkeyvalue = parseInt($('#nxtprevquestion').val());
                            var arrayanwer = $('#currentanwernxt').val();
                            var getanswerarr = arrayanwer.split(",");
                            var questionNo = parseInt($('#questionNo').val());

                            


                            var prosquestiontypehere = $('#pros-loadexamtypehere').val();

                            if(prosquestiontypehere == 'Theory'){
                                tinyMCE.triggerSave();

                                var answer = [];

                                $m = 1;
                                $.each($(".example"), function () {
                                    answer.push($(this).val() + "Nil##");
                                    $m++;
                                });


                                const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                // const result = JSON.stringify(jsontext);

                                const obj = JSON.parse(jsontext);
                                var lengthofquestion_object = Object.keys(obj).length;

                                var newkeyvalue = parseInt(currentkeyvalue);
                                var newarraykey = newkeyvalue - 1;
                                var newquestionNo = questionNo - 1;


                                // alert(answer);


                                if (answer == '##' || answer == 'Nil##' || answer == '0Nil##' || answer == 'Nil') {

                                    if (newarraykey == '-1') {
                                        // newarraykey = newarraykey-1;  
                                        $('.Previous').prop('disabled', true);
                                        // $('.next').prop('disabled', false);

                                    } else {

                                        var tar = $('#questionNo').val(newquestionNo);

                                    

                                        $('#nxtprevquestion').val(newarraykey);
                                        $('#currentanwernxt').val(getanswerarr);

                                        
                                        $('.next').prop('disabled', false);
                                        $('.Previous').prop('disabled', false);
                                    }


                                    var newquestion = obj[newarraykey].question;
                                    var newanswerload_new = getanswerarr[newarraykey];

                                    let resultreplacestring = newanswerload_new.toString();
                                    let resultreplace = resultreplacestring.replace(/Nil##/g, "");




                                    if (resultreplace == 'Nil' || resultreplace == '##' || resultreplace == 'Nil##') {
                                        var newanswerload = '';

                                    } else {
                                        var newanswerload = resultreplace;

                                    }


                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<textarea class="example question tinymce" id="optionA1">' + newanswerload + '</textarea>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 50px;"><hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4">' +
                                        '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row mt-3" >' +
                                        '<div class="col-sm-12">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.' +
                                        'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');

                                    resetEditor();
                                    createEditorInstance();
                                    tinyMCE.get('optionA1').setContent(newanswerload);

                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());


                                } else {

                
                                        // alert('rita');
                                        
                                    if (newarraykey == '-1') {

                                        // newarraykey = newarraykey-1;  
                                        $('.Previous').prop('disabled', true);
                                        // $('.next').prop('disabled', false);

                                    } else {

                                        $('#questionNo').val(newquestionNo);
                                        $('#nxtprevquestion').val(newarraykey);
                                        $('#currentanwernxt').val(getanswerarr);

                                        $('.next').prop('disabled', false);
                                        $('.Previous').prop('disabled', false);
                                    }

                                    // alert(newarraykey);

                                    var newquestion = obj[newarraykey].question;
                                    var newanswerload_new = getanswerarr[newarraykey];
                                    

                                    let resultreplacestring = newanswerload_new.toString();
                                    let resultreplace = resultreplacestring.replace(/Nil##/g, "");

                                    // alert(newquestion);


                                    if (resultreplace == 'Nil' || resultreplace == '##' || resultreplace == 'Nil##') {
                                        var newanswerload = '';

                                    } else {
                                        var newanswerload = resultreplace;

                                    }
                                    
                                   

                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<textarea class="example question tinymce" id="optionA1">' + newanswerload + '</textarea>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4">' +
                                        '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row mt-3" >' +
                                        '<div class="col-sm-12">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.' +
                                        'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');

                                    resetEditor();
                                    createEditorInstance();
                                    tinyMCE.get('optionA1').setContent(newanswerload);

                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());



                                }



                            } 
                            else{

                                if($("input[type='radio'].radioBtnClass").is(':checked')){


                                    var answer = $("input[type='radio'].radioBtnClass:checked").val();
                                    const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                    const obj = JSON.parse(jsontext);
                                    var lengthofquestion_object = Object.keys(obj).length;
                                    var newkeyvalue = parseInt(currentkeyvalue);
                                    var newarraykey = newkeyvalue - 1;
                                    var newquestionNo = questionNo - 1;
                                    getanswerarr[currentkeyvalue] = answer;

                                  
                                        
                                        
                                         function decodeHTMLEntities(str) {
                                                    return String(str)
                                                        .replace(/&amp;/g, '&')
                                                        .replace(/&lt;/g, '<')
                                                        .replace(/&gt;/g, '>')
                                                        .replace(/&quot;/g, '"')
                                                        .replace(/&#039;/g, "'");
                                                }
                                                
                                                // Function to remove HTML tags
                                                function removeHTMLTags(str) {
                                                    return str.replace(/<\/?[^>]+(>|$)/g, "");
                                                }
                                                
                                                // Function to format text
                                                function formatText(text) {
                                                    return removeHTMLTags(decodeHTMLEntities(text));
                                                }
                                                
                                                // Usage example
                                                var newquestion = obj[newarraykey].question;
                                                var newoptionA = obj[newarraykey].optionA;
                                                var newoptionB = obj[newarraykey].optionB;
                                                var newoptionC = obj[newarraykey].optionC;
                                                var newoptionD = obj[newarraykey].optionD;
                                                
                                                newquestion = formatText(newquestion);
                                                newoptionA = formatText(newoptionA);
                                                newoptionB = formatText(newoptionB);
                                                newoptionC = formatText(newoptionC);
                                                newoptionD = formatText(newoptionD);


                                        // alert(newquestion);

                                        $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                            '<div class="myborder"></div>' +
                                            '<div style="margin-top: 50px; margin-left: 20px;">' +
                                            '<h4>' + newquestion + '</h4>' +
                                            '<form class="selectSubject">'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                                    '<span>A. ' + newoptionA + ' </span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                                    '<span>B. ' + newoptionB + '</span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                                    '<span>C. ' + newoptionC + '</span>'+
                                                '</label>' +
                                                '<label>' +
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                                    '<span>D. ' + newoptionD +'</span>'+
                                                '</label>'+
                                            '</form>'+
                                            '</div>'+

                                            '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                            '<div class="col-8">' +
                                            '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded btn-success Previous float-start" id="prevbtn">Previous</button>' +
                                            '</div>' +
                                            '<div class="col-4" id="submitnex" >' +
                                            '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                            '</div>' +
                                            '</div>' +

                                            '<div class="row" style="margin-top: 75px;">' +
                                            '<div class="col-sm-10">' +
                                            '<div>' +
                                            '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                            '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                            ' by the right before the time runs out. You can also select any question below to answer.' +
                                            ' Don\'t forget to click Submit when you are done.' +
                                            '</small>' +
                                            '</div>' +
                                            '</div>' +
                                            '</div>');

                                    if (newquestionNo < 1) {

                                        $('#prevbtn').fadeOut('slow');
                                        $('.Previous').prop('disabled', true);

                                    } else {

                                        $('#currentanwernxt').val(getanswerarr);
                                        $('#nxtprevquestion').val(newarraykey);
                                        $('#questionNo').val(newquestionNo);
                                        // $.notify("Question Succesfully Answered", "success"); 
                                        $('.Previous').prop('disabled', false);
                                    }


                                    if (getanswerarr[newarraykey] == 'A') {
                                        $('#radio_1').prop('checked', true);
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    } else if (getanswerarr[newarraykey] == 'B') {
                                        $('#radio_2').prop('checked', true);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    } else if (getanswerarr[newarraykey] == 'C') {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', true);
                                        $('#radio_4').prop('checked', false);


                                    } else if (getanswerarr[newarraykey] == 'D') {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', true);
                                    } else {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);
                                    }




                                    localStorage.setItem("questionkey", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNo", $('#questionNo').val());

                                }else{


                                    var answer = 0;
                                    const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                    const obj = JSON.parse(jsontext);
                                    var lengthofquestion_object = Object.keys(obj).length;
                                    var newkeyvalue = parseInt(currentkeyvalue);
                                    var newarraykey = newkeyvalue - 1;
                                    var newquestionNo = questionNo - 1;

                                
                                 

                                    // alert(newquestion);
                                    
                                    
                                    
                                    
                                               function decodeHTMLEntities(str) {
                                                    return String(str)
                                                        .replace(/&amp;/g, '&')
                                                        .replace(/&lt;/g, '<')
                                                        .replace(/&gt;/g, '>')
                                                        .replace(/&quot;/g, '"')
                                                        .replace(/&#039;/g, "'");
                                                }
                                                
                                                // Function to remove HTML tags
                                                function removeHTMLTags(str) {
                                                    return str.replace(/<\/?[^>]+(>|$)/g, "");
                                                }
                                                
                                                // Function to format text
                                                function formatText(text) {
                                                    return removeHTMLTags(decodeHTMLEntities(text));
                                                }
                                                
                                                // Usage example
                                                var newquestion = obj[newarraykey].question;
                                                var newoptionA = obj[newarraykey].optionA;
                                                var newoptionB = obj[newarraykey].optionB;
                                                var newoptionC = obj[newarraykey].optionC;
                                                var newoptionD = obj[newarraykey].optionD;
                                                
                                                newquestion = formatText(newquestion);
                                                newoptionA = formatText(newoptionA);
                                                newoptionB = formatText(newoptionB);
                                                newoptionC = formatText(newoptionC);
                                                newoptionD = formatText(newoptionD);



                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + newquestionNo + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<form class="selectSubject">'+
                                            '<label>'+
                                                '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                                '<span>A. ' + newoptionA + ' </span>'+
                                            '</label>'+
                                            '<label>'+
                                                '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                                '<span>B. ' + newoptionB + '</span>'+
                                            '</label>'+
                                            '<label>'+
                                                '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                                '<span>C. ' + newoptionC + '</span>'+
                                            '</label>' +
                                            '<label>' +
                                                '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                                '<span>D. ' + newoptionD +'</span>'+
                                            '</label>'+
                                        '</form>'+
                                        '</div>'+

                                        '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded btn-success Previous float-start" id="prevbtn">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4" id="submitnex" >' +
                                        '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 75px;">' +
                                        '<div class="col-sm-10">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                        ' by the right before the time runs out. You can also select any question below to answer.' +
                                        ' Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');


                                    if (newquestionNo < 0) {

                                        $('#prevbtn').fadeOut('slow');
                                        $('.previous').prop('disabled', true);

                                    } else {
                                        $('#nxtprevquestion').val(newarraykey);
                                        $('#questionNo').val(newquestionNo);
                                        $('.previous').prop('disabled', false);
                                    }

                                    if (getanswerarr[newarraykey] == 'A') {
                                        $('#radio_1').prop('checked', true);
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);
                                    } else if (getanswerarr[newarraykey] == 'B') {
                                        $('#radio_2').prop('checked', true);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);
                                    } else if (getanswerarr[newarraykey] == 'C') {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', true);
                                        $('#radio_4').prop('checked', false);
                                    } else if (getanswerarr[newarraykey] == 'D') {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', true);
                                    } else {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    }

                                    localStorage.setItem("questionkey", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNo", $('#questionNo').val());

                                }
                            }
                            
                        });
                        //CLICK ON PREVIOUS BTN END HERE HERE  
                        
                        //CLICK ON NUMBERS TO LOAD QUESTION
                        $("body").on("click", ".viewer", function () {

                            // alert('tari');

                            
                            $("html,body").animate({
                                scrollTop: 0
                            }, 'fast');



                            var questionid = $(this).attr("id");
                            var arrayanwer = $('#currentanwernxt').val();
                            var getanswerarr = arrayanwer.split(",");
                            var countkey = $(this).data("id");
                            var previouskeyvalue = parseInt($('#nxtprevquestion').val());
                            var questionNo = parseInt($('#questionNo').val());

                            var prosquestiontypehere = $('#pros-loadexamtypehere').val();

                            if (prosquestiontypehere == 'Theory') {
                                
                            
                                    tinyMCE.triggerSave();

                                        var answer = [];
                                        
                                        $m = 1;
                                        $.each($(".question"), function () {
                                            answer.push($(this).val() + "Nil##");
                                            $m++;
                                        });


                                        const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                        // const result = JSON.stringify(jsontext);
                                        const obj = JSON.parse(jsontext);

                                        var lengthofquestion_object = Object.keys(obj).length;
                                    
                                        var getanswerarr = arrayanwer.split(",");

                                
                                        
                            
                                if(answer == '##' || answer == 'Nil##' || answer == '0Nil##' || answer == 'Nil' || answer == '0Nil##') 
                                {
                                  
                                    
                                        
                                        var answernew = "Nil##";
                                        var newquestion = obj[countkey].question;

                                        getanswerarr[previouskeyvalue] = answer;
                                        

                                        var questionkey = localStorage.getItem('questionkeytheory');
                                        var questionansernew = localStorage.getItem('questionansertheory');
                                        var questionno = localStorage.getItem('questionNotheory');


                                        

                                        var questionanswer2_again = questionansernew.split(",");
                                        var newanswerload_new = questionanswer2_again[countkey];

                                    

                                        let resultreplacestring = newanswerload_new.toString();
                                        let resultreplace = resultreplacestring.replace(/Nil##/g, "");



                                    if (resultreplace == 'Nil' || resultreplace == '##' || resultreplace == 'Nil##' || answer == '0Nil##' || answer == '0') {
                                        
                                        var newanswerload = '';

                                        
                                    } else {

                                        var newanswerload = resultreplace;

                                    }
                                    
                                    $('#nxtprevquestion').val(countkey);
                                    $('#currentanwernxt').val(getanswerarr);
                                    $('#questionNo').val(questionid);


                                    // tinyMCE.triggerSave();
                                    
                                    
                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + questionid + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<textarea class="example question tinymce" id="optionA1">' + newanswerload + '</textarea>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded btn-success Previous">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4">' +
                                        '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row mt-3" >' +
                                        '<div class="col-sm-12">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.' +
                                        'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');
                                        
                                        resetEditor();
                                        createEditorInstance();
                                        tinyMCE.get('optionA1').setContent(newanswerload);
                                


                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());


                                } 
                                else 
                                {

                                    var answernew = "Nil##";
                                    var newquestion = obj[countkey].question;

                              

                                    getanswerarr[previouskeyvalue] = answer;

                                   
                            

                                    var questionkey = localStorage.getItem('questionkeytheory');
                                    var questionansernew = localStorage.getItem('questionansertheory');
                                    var questionno = localStorage.getItem('questionNotheory');

                                    var questionanswer2_again = questionansernew.split(",");
                                    var newanswerload_new = questionanswer2_again[countkey];

                                    let resultreplacestring = newanswerload_new.toString();
                                    let resultreplace = resultreplacestring.replace(/Nil##/g, "");


                                    if (resultreplace == 'Nil' || resultreplace == '##' || resultreplace == 'Nil##' || resultreplace == '0Nil##' || resultreplace == '0') {

                                        var newanswerload = '';


                                    } else {

                                          var newanswerload = resultreplace;

                                    }

                                    $('#nxtprevquestion').val(countkey);
                                    $('#currentanwernxt').val(getanswerarr);
                                    $('#questionNo').val(questionid);
                                    
                                    // tinyMCE.triggerSave();
                                    $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + questionid + ')</h1>' +
                                        '<div class="myborder"></div>' +
                                        '<div style="margin-top: 50px; margin-left: 20px;">' +
                                        '<h4>' + newquestion + '</h4>' +
                                        '<textarea class="example question tinymce" id="optionA1">' + newanswerload + '</textarea>' +
                                        '</div>' +

                                        '<div class="row" style="margin-top: 50px;"><hr/>' +
                                        '<div class="col-8">' +
                                        '<button type="button" style="font-size: 15px;  background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded  Previous">Previous</button>' +
                                        '</div>' +
                                        '<div class="col-4">' +
                                        '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                        '</div>' +
                                        '</div>' +

                                        '<div class="row mt-3">' +
                                        '<div class="col-sm-12">' +
                                        '<div>' +
                                        '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                        '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.' +
                                        'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.' +
                                        '</small>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>');

                                        resetEditor();
                                        createEditorInstance();
                                        tinyMCE.get('optionA1').setContent(newanswerload);
                                    



                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());

                                }


                            }
                            else{



                                const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                // const result = JSON.stringify(jsontext);
                                const obj = JSON.parse(jsontext);
                                var lengthofquestion_object = Object.keys(obj).length;

                                if ($("input[type='radio'].radioBtnClass").is(':checked')) {

                                        var answer = $("input[type='radio'].radioBtnClass:checked").val();

                                     

                                     
                                        
                                        
                                        
                                        
                                               function decodeHTMLEntities(str) {
                                                    return String(str)
                                                        .replace(/&amp;/g, '&')
                                                        .replace(/&lt;/g, '<')
                                                        .replace(/&gt;/g, '>')
                                                        .replace(/&quot;/g, '"')
                                                        .replace(/&#039;/g, "'");
                                                }
                                                
                                                // Function to remove HTML tags
                                                function removeHTMLTags(str) {
                                                    return str.replace(/<\/?[^>]+(>|$)/g, "");
                                                }
                                                
                                                // Function to format text
                                                function formatText(text) {
                                                    return removeHTMLTags(decodeHTMLEntities(text));
                                                }
                                                
                                                // Usage example
                                                var newquestion = obj[countkey].question;
                                                var newoptionA = obj[countkey].optionA;
                                                var newoptionB = obj[countkey].optionB;
                                                var newoptionC = obj[countkey].optionC;
                                                var newoptionD = obj[countkey].optionD;
                                                
                                                newquestion = formatText(newquestion);
                                                newoptionA = formatText(newoptionA);
                                                newoptionB = formatText(newoptionB);
                                                newoptionC = formatText(newoptionC);
                                                newoptionD = formatText(newoptionD);

                                        
                                        
                                        
                                        
                                        getanswerarr[previouskeyvalue] = answer;

                                        // alert(newquestion);

                                        $('#nxtprevquestion').val(countkey);
                                        $('#currentanwernxt').val(getanswerarr);
                                        $('#questionNo').val(questionid);



                                        $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + questionid + ')</h1>' +
                                            '<div class="myborder"></div>' +
                                            '<div style="margin-top: 50px; margin-left: 20px;">' +
                                            '<h4>' + newquestion + '</h4>' +
                                            '<form class="selectSubject">'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                                    '<span>A. ' + newoptionA + ' </span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                                    '<span>B. ' + newoptionB + '</span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                                    '<span>C. ' + newoptionC + '</span>'+
                                                '</label>' +
                                                '<label>' +
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                                    '<span>D. ' + newoptionD +'</span>'+
                                                '</label>'+
                                            '</form>'+
                                            '</div>'+

                                            '<div class="row mt-2"> <hr/>' +
                                            '<div class="col-8">' +
                                            '<button type="button" style="font-size: 15px;  background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous float-start" id="prevbtn">Previous</button>' +
                                            '</div>' +
                                            '<div class="col-4" id="submitnex" >' +
                                            '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                            '</div>' +
                                            '</div>' +

                                            '<div class="row mt-1">' +
                                            '<div class="col-sm-10">' +
                                            '<div>' +
                                            '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                            '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                            ' by the right before the time runs out. You can also select any question below to answer.' +
                                            ' Don\'t forget to click Submit when you are done.' +
                                            '</small>' +
                                            '</div>' +
                                            '</div>' +
                                            '</div>');

                                    if (getanswerarr[countkey] == 'A') {
                                        $('#radio_1').prop('checked', true);
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);
                                    } else if (getanswerarr[countkey] == 'B') {
                                        $('#radio_2').prop('checked', true);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);
                                    } else if (getanswerarr[countkey] == 'C') {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', true);
                                        $('#radio_4').prop('checked', false);
                                    } else if (getanswerarr[countkey] == 'D') {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', true);
                                    } else {
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    }


                                    localStorage.setItem("questionkey", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNo", $('#questionNo').val());
                                }
                                else {



                                        answer = 0;
                                       
                                        
                                      function decodeHTMLEntities(str) {
                                            return String(str)
                                                .replace(/&amp;/g, '&')
                                                .replace(/&lt;/g, '<')
                                                .replace(/&gt;/g, '>')
                                                .replace(/&quot;/g, '"')
                                                .replace(/&#039;/g, "'");
                                        }
                                        
                                        // Function to remove HTML tags
                                        function removeHTMLTags(str) {
                                            return str.replace(/<\/?[^>]+(>|$)/g, "");
                                        }
                                        
                                        // Function to format text
                                        function formatText(text) {
                                            return removeHTMLTags(decodeHTMLEntities(text));
                                        }
                                        
                                        // Usage example
                                        var newquestion = obj[countkey].question;
                                        var newoptionA = obj[countkey].optionA;
                                        var newoptionB = obj[countkey].optionB;
                                        var newoptionC = obj[countkey].optionC;
                                        var newoptionD = obj[countkey].optionD;
                                        
                                        newquestion = formatText(newquestion);
                                        newoptionA = formatText(newoptionA);
                                        newoptionB = formatText(newoptionB);
                                        newoptionC = formatText(newoptionC);
                                        newoptionD = formatText(newoptionD);

                                        $('#nxtprevquestion').val(countkey);
                                        $('#questionNo').val(questionid);



                                            $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + questionid + ')</h1>' +
                                            '<div class="myborder"></div>' +
                                            '<div style="margin-top: 50px; margin-left: 20px;">' +
                                            '<h4>' + newquestion + '</h4>' +
                                            '<form class="selectSubject">'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                                    '<span>A. ' + newoptionA + ' </span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                                    '<span>B. ' + newoptionB + '</span>'+
                                                '</label>'+
                                                '<label>'+
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                                    '<span>C. ' + newoptionC + '</span>'+
                                                '</label>' +
                                                '<label>' +
                                                    '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                                    '<span>D. ' + newoptionD +'</span>'+
                                                '</label>'+
                                            '</form>'+
                                            '</div>'+

                                            '<div class="row mt-2"> <hr/>' +
                                            '<div class="col-8">' +
                                            '<button type="button" style="font-size: 15px; background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded btn-success Previous float-start" id="prevbtn">Previous</button>' +
                                            '</div>' +
                                            '<div class="col-4" id="submitnex" >' +
                                            '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                            '</div>' +
                                            '</div>' +

                                            '<div class="row mt-1">' +
                                            '<div class="col-sm-10">' +
                                            '<div>' +
                                            '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                            '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                            ' by the right before the time runs out. You can also select any question below to answer.' +
                                            ' Don\'t forget to click Submit when you are done.' +
                                            '</small>' +
                                            '</div>' +
                                            '</div>' +
                                            '</div>');




                                    if (getanswerarr[countkey] == 'A') {

                                        $('#radio_1').prop('checked', true);
                                        $('#radio_2').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    } else if (getanswerarr[countkey] == 'B') {

                                        $('#radio_2').prop('checked', true);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    } else if (getanswerarr[countkey] == 'C') {

                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', true);
                                        $('#radio_4').prop('checked', false);


                                    } else if (getanswerarr[countkey] == 'D') {


                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', true);

                                    } else {


                                        $('#radio_2').prop('checked', false);
                                        $('#radio_1').prop('checked', false);
                                        $('#radio_3').prop('checked', false);
                                        $('#radio_4').prop('checked', false);

                                    }

                                    localStorage.setItem("questionkey", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionanser", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNo", $('#questionNo').val());

                                }
                            }
                        });
                        //CLICK ON NUMBERS TO LOAD QUESTION


                         // TARI New Timer
                        $(document).ready(function() {

                            var savedRemainingTime = localStorage.getItem("remainingTime");

                            // alert(savedRemainingTime);

                            if (savedRemainingTime !== null) {
                                // If there is saved remaining time, use it
                                var hours = parseInt(savedRemainingTime / 3600);
                                var minutes = parseInt((savedRemainingTime % 3600) / 60);
                                var seconds = savedRemainingTime % 60;
                                startTimer(hours, minutes, seconds);

                            } else {
                                // If there is no saved time, start from the beginning

                                let timeInterval = $('#prostimedifference').val();

                                // alert(timeInterval);

                                var timeParts = timeInterval.split(':');
                                var hours = parseInt(timeParts[0]);
                                var minutes = parseInt(timeParts[1]);
                                var seconds = parseInt(timeParts[2]);

                                startTimer(hours, minutes, seconds);

                                // startTimer(0, 0, 0); // Replace with your desired initial time
                            }

                            function startTimer(hours, minutes, seconds) {

                                var totalSeconds = hours * 3600 + minutes * 60 + seconds;

                                var timer = setInterval(function () {
                                    var hours = parseInt(totalSeconds / 3600);
                                    var minutes = parseInt((totalSeconds % 3600) / 60);
                                    var seconds = totalSeconds % 60;

                                    document.getElementById("examhour").innerHTML =  padZero(hours); 
                                    document.getElementById("examminutes").innerHTML =  padZero(minutes); 
                                    document.getElementById("examseconds").innerHTML =  padZero(seconds);

                                    // var formattedTime = padZero(hours) + ':' + padZero(minutes) + ':' + padZero(seconds);
                                    // $("#timer").text(formattedTime);

                                    // Save the remaining time in local storage
                                    localStorage.setItem("remainingTime", totalSeconds);

                                    if (totalSeconds <= 0) {
                                        clearInterval(timer);

                                        var prosquestiontypeheregotten = $('#pros-loadexamtypehere').val();

                                        var getanswerarr = [];
                                        $.each($('#currentanwernxt'),function(){
                                            getanswerarr.push($(this).val());
                                        }); 

                                        // alert(getanswerarr);

                                        $.ajax({
                                            type: 'POST',
                                            url: "../../controller/scripts/student/cbt/tari_student_submit_cbt.php",
                                            data: {
                                                cbtSettingsID:cbtSettingsID,
                                                StudentID:StudentID,
                                                getanswerarr:getanswerarr,
                                                prosquestiontypeheregotten:prosquestiontypeheregotten,
                                                examtype:examtype
                                            }, //Pass $id
                                            success: function (result) {

                                              

                                                if(result.trim() == 'Success')
                                                {

                                                    localStorage.removeItem("questionkey");
                                                    localStorage.removeItem("questionanser");  
                                                    localStorage.removeItem("questionNo");

                                                    localStorage.removeItem("questionkeytheory");
                                                    localStorage.removeItem("questionansertheory");  
                                                    localStorage.removeItem("questionNotheory");
                                                    localStorage.removeItem('questiontype');
                                                    localStorage.removeItem('remainingTime');


                                                    $.wnoty({
                                                        type: 'success',
                                                        message: 'Great!! Quiz submitted successfully.',
                                                        autohideDelay: 3000, // 3 seconds
                                                        autohide: true
                                                    }); 



                                                    if(examtype == 'admission')
                                                    {

                                                        location.href = '../../apply/candidate/';
                                                    }
                                                    else
                                                    {
                                                        location.href = '../assesement/';
                                                    }
                                                            
                                                        
                                                   

                                                }
                                                else
                                                {
                                                    $.wnoty({
                                                        type: 'error',
                                                        message: result,
                                                        autohideDelay: 5000, // 3 seconds
                                                        autohide: true
                                                    }); 

                                                    $('.pros-subexamfinal').html('Save!');

                                                }
                                            }
                                        });


                                       
                                    } else {
                                        totalSeconds--;
                                        // alert('Time Continue')
                                    }
                                }, 1000);
                            }

                            function padZero(num) {
                                return (num < 10 ? '0' : '') + num;
                            }
                        });


                        $("body").on("click", ".pros-subexamfinal", function () {
                            submitCBT();
                        });


                        // Submit CBT Exam Function
                        function submitCBT(){

                            $('.pros-subexamfinal').html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>');


                            // Get the URL parameters
                            var urlParams = new URLSearchParams(window.location.search);

                            // Retrieve the cbt_id and UserID values
                            var cbtSettingsID = urlParams.get('cbt_id');
                            var StudentID = urlParams.get('userid');

                            


                            var prosquestiontypeheregotten = $('#pros-loadexamtypehere').val();

                          

                            var getanswerarr = [];
                            $.each($('#currentanwernxt'),function(){
                                getanswerarr.push($(this).val());
                            }); 

                            




                            $.ajax({
                                type: 'POST',
                                url: "../../controller/scripts/student/cbt/tari_student_submit_cbt.php",
                                data: {
                                    cbtSettingsID:cbtSettingsID,
                                    StudentID:StudentID,
                                    getanswerarr:getanswerarr,
                                    prosquestiontypeheregotten:prosquestiontypeheregotten,
                                    examtype:examtype
                                }, //Pass $id
                                success: function (result) {


                                    // alert(result);
                                  //    alert(result);
                                  

                                    if(result.trim() == 'Success')
                                    {

                                        localStorage.removeItem("questionkey");
                                        localStorage.removeItem("questionanser");  
                                        localStorage.removeItem("questionNo");

                                        localStorage.removeItem("questionkeytheory");
                                        localStorage.removeItem("questionansertheory");  
                                        localStorage.removeItem("questionNotheory");
                                        localStorage.removeItem('questiontype');
                                        localStorage.removeItem('remainingTime');


                                        $.wnoty({
                                            type: 'success',
                                            message: 'Great!! Quiz submitted successfully.',
                                            autohideDelay: 3000, // 3 seconds
                                            autohide: true
                                        }); 
                                                

                                        
                                        
                                                  if(examtype == 'admission')
                                                    {

                                                        location.href = '../../apply/candidate/';

                                                    }else if(examtype == 'assignment')
                                                    {




                                                        location.href = '../my-class/';


                                                    }
                                                    
                                                    else
                                                    {
                                                        location.href = '../assesement/';
                                                    }

                                    }
                                    else
                                    {
                                        $.wnoty({
                                            type: 'error',
                                            message: result,
                                            autohideDelay: 5000, // 3 seconds
                                            autohide: true
                                        }); 

                                        $('.pros-subexamfinal').html('Save!');

                                    }
                                    $('.pros-subexamfinal').html('Yes, I want to Submit');
                                }
                            });

                        }
                        // End Submit CBT Exam


                         // LOAD QUESTION ANSWERED ON PAGE RELOAD
                        $(document).ready(function(){

                            var prosquestiontypehere = $('#pros-loadexamtypehere').val();
                                       
                            if(prosquestiontypehere == 'Theory')
                            {

                                var questionkey = localStorage.getItem('questionkeytheory');
                                var questionanser= localStorage.getItem('questionansertheory');
                                var questionno = localStorage.getItem('questionNotheory');

                            
                                const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                // const result  = JSON.stringify(jsontext)
                                const obj = JSON.parse(jsontext);
                                var lengthofquestion_object = Object.keys(obj).length;
                    
                                var newquestion = obj[questionkey].question;

                    
                                var questionanswer2 = questionanser.split(",");
                                var newanswerload_new = questionanswer2[questionkey];


                                let resultreplacestring = newanswerload_new.toString();
                            
                                let resultreplace = resultreplacestring.replace(/Nil##/g, "");

                                
                                
                                if(resultreplace == 'Nil' || resultreplace == '##' ||  resultreplace == 'Nil##')
                                {
                                        var  newanswerload  = '';
                                }else
                                {        
                                        var newanswerload  = resultreplace; 
                                        
                                       
                                }
                            
                                $('#nxtprevquestion').val(questionkey);
                                $('#currentanwernxt').val(questionanswer2); 
                                $('#questionNo').val(questionno);
                            
                                

                                // tinyMCE.triggerSave();
                                $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + questionno + ')</h1>'+
                                            '<div class="myborder"></div>'+
                                            '<div style="margin-top: 50px; margin-left: 20px;">'+
                                                '<h4>'+newquestion+'</h4>'+
                                                '<textarea class="example question tinymce">'+newanswerload+'</textarea>'+
                                            '</div>'+

                                        '<div class="row" style="margin-top: 50px;"><hr/>'+
                                            '<div class="col-8">'+
                                                    '<button type="button" style="font-size: 15px;  background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous">Previous</button>'+
                                                '</div>'+
                                                '<div class="col-4">'+
                                                    '<button type="button" style="font-size: 15px;" class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>'+
                                                '</div>'+
                                            '</div>'+
            
                                            '<div class="row mt-3" >'+
                                                '<div class="col-sm-12">'+
                                                    '<div>'+
                                                        '<small style="color: red; font-size: 12px; text-align: justify;">'+
                                                            '<b>Note:</b> Kindly Input your answer in the field provided above <br> click on next to get the next question if wish before the time runs out.'+ 
                                                            'You can also click on Previous to go backward.  Don\'t forget to click Submit when you are done.'+
                                                        '</small>'+
                                                    '</div>'+
                                                '</div>'+
                                            '</div>');


                                    localStorage.setItem("questionkeytheory", $('#nxtprevquestion').val());
                                    localStorage.setItem("questionansertheory", $('#currentanwernxt').val());
                                    localStorage.setItem("questionNotheory", $('#questionNo').val());

                                        
                                    resetEditor();
                                    createEditorInstance();
                                    tinyMCE.get('optionA1').setContent(newanswerload);

                                    // alert(newanswerload);
                                
                            }
                            else
                            {

                                // OBJECT AND THEORY ON DOCUMENT READY LOAD QUSETION 
                                var questionkey = localStorage.getItem('questionkey');
                                var questionanser = localStorage.getItem('questionanser');
                                var questionno = localStorage.getItem('questionNo');

                                if(isNaN(questionkey) || isNaN(questionno) || questionanser == '')
                                {

                                }
                                else
                                {
                                        
                                var questionanswer2 = questionanser.split(",")

                                // alert(questionanswer2);

                                $('#nxtprevquestion').val(questionkey);
                                $('#currentanwernxt').val(questionanser); 
                                $('#questionNo').val(questionno); 

                                const jsontext = $('#pros-loadjsoncontentforcbt').val();
                                const result  = JSON.stringify(jsontext)
                                const obj = JSON.parse(jsontext);
                                var lengthofquestion_object = Object.keys(obj).length;

                              
                                
                              function decodeHTMLEntities(str) {
                                    return String(str)
                                        .replace(/&amp;/g, '&')
                                        .replace(/&lt;/g, '<')
                                        .replace(/&gt;/g, '>')
                                        .replace(/&quot;/g, '"')
                                        .replace(/&#039;/g, "'");
                                }
                                
                                // Function to remove HTML tags
                                function removeHTMLTags(str) {
                                    return str.replace(/<\/?[^>]+(>|$)/g, "");
                                }
                                
                                // Function to format text
                                function formatText(text) {
                                    return removeHTMLTags(decodeHTMLEntities(text));
                                }
                                
                                // Usage example
                                var newquestion = obj[questionkey].question;
                                var newoptionA = obj[questionkey].optionA;
                                var newoptionB = obj[questionkey].optionB;
                                var newoptionC = obj[questionkey].optionC;
                                var newoptionD = obj[questionkey].optionD;
                                
                                newquestion = formatText(newquestion);
                                newoptionA = formatText(newoptionA);
                                newoptionB = formatText(newoptionB);
                                newoptionC = formatText(newoptionC);
                                newoptionD = formatText(newoptionD);

                              

                                $("#displayResults").html('<h1 style="font-style: italic; margin-top: 10px;">(Question ' + questionno + ')</h1>' +
                                    '<div class="myborder"></div>' +
                                    '<div style="margin-top: 50px; margin-left: 20px;">' +
                                    '<h4>' + newquestion + '</h4>' +
                                    '<form class="selectSubject">'+
                                        '<label>'+
                                            '<input type="radio" name="group1" class="radioBtnClass"  value="A"  id="radio_1"/>'+
                                            '<span>A. ' + newoptionA + ' </span>'+
                                        '</label>'+
                                        '<label>'+
                                            '<input type="radio" name="group1" class="radioBtnClass"  value="B"  id="radio_2"/>'+
                                            '<span>B. ' + newoptionB + '</span>'+
                                        '</label>'+
                                        '<label>'+
                                            '<input type="radio" name="group1" class="radioBtnClass"  value="C"  id="radio_3"/>'+
                                            '<span>C. ' + newoptionC + '</span>'+
                                        '</label>' +
                                        '<label>' +
                                            '<input type="radio" name="group1" class="radioBtnClass"  value="D"  id="radio_4"/>'+
                                            '<span>D. ' + newoptionD +'</span>'+
                                        '</label>'+
                                    '</form>'+
                                    '</div>'+

                                    '<div class="row" style="margin-top: 50px;"> <hr/>' +
                                    '<div class="col-8">' +
                                    '<button type="button" style="font-size: 15px;  background-color:#0d6efd;" class="btn waves-effect waves-light btn-rounded Previous float-start" id="prevbtn">Previous</button>' +
                                    '</div>' +
                                    '<div class="col-4" id="submitnex" >' +
                                    '<button type="button"  style="font-size: 15px; " class="btn waves-effect waves-light btn-rounded btn-secondary next float-end">Next</button>' +
                                    '</div>' +
                                    '</div>' +

                                    '<div class="row" style="margin-top: 75px;">' +
                                    '<div class="col-sm-10">' +
                                    '<div>' +
                                    '<small style="color: red; font-size: 12px; text-align: justify;">' +
                                    '<b>Note:</b> Kindly pick the correct option using the mouse to select the answer to the question' +
                                    ' by the right before the time runs out. You can also select any question below to answer.' +
                                    ' Don\'t forget to click Submit when you are done.' +
                                    '</small>' +
                                    '</div>' +
                                    '</div>' +
                                    '</div>');
                                            

                                    if(questionanswer2[questionkey] == 'A')
                                    {
                                    
                                        $('#radio_1').prop('checked',true);
                                        $('#radio_2').prop('checked',false);
                                        $('#radio_3').prop('checked',false);
                                        $('#radio_4').prop('checked',false);
                                    }else if(questionanswer2[questionkey]  == 'B')
                                    {
                                    
                                        $('#radio_2').prop('checked',true);
                                        $('#radio_1').prop('checked',false);
                                        $('#radio_3').prop('checked',false);
                                        $('#radio_4').prop('checked',false);
                                    }else if(questionanswer2[questionkey]  == 'C')
                                    {
                                        $('#radio_2').prop('checked',false);
                                        $('#radio_1').prop('checked',false);
                                        $('#radio_3').prop('checked',true);
                                        $('#radio_4').prop('checked',false);
                                    }else if(questionanswer2[questionkey]  == 'D')
                                    {
                                        $('#radio_2').prop('checked',false);
                                        $('#radio_1').prop('checked',false);
                                        $('#radio_3').prop('checked',false);
                                        $('#radio_4').prop('checked',true);          
                                    }else
                                    {
                                    
                                        $('#radio_2').prop('checked',false);
                                        $('#radio_1').prop('checked',false);
                                        $('#radio_3').prop('checked',false);
                                        $('#radio_4').prop('checked',false);     
                                    }


                                            
                                }
                            }

                                    
                        });
                        // LOAD QUESTION ANSWERED ON PAGE RELOAD

                       
                    }
                       

                });            
		
	    });
	</script>

<script  src="./tinymce5/wirislib.js"></script>




	

</body>

</html>