<?php error_reporting(0);?>
<?php 
    $this->db->select('user_id, user_atp, user_name, user_reg_id, user_photo');
    $this->db->where('user_reg_id', $reg_id);
    $st_id = $this->db->get('users')->row();

    $this->db->where('user_id', $st_id->user_atp);
    $atp = $this->db->get('users')->row();
    
     $this->db->select('a.*, b.title, b.exam_time, b.course_duration, b.total_questions, b.exam_time, b.online_exam_marks, b.practical_exam_marks, b.viva_exam_marks, b.course_duration_in_month,  c.*');
    $this->db->from('student_course a');
    $this->db->join('course b', 'b.id = a.st_course_course_id', 'left');
    $this->db->join('users c', 'c.user_id = a.st_course_student_id', 'left');
    $this->db->where('a.st_course_course_id', $course_id);
    $this->db->where('st_course_student_id', $st_id->user_id);
    $exam_data = $this->db->get()->row();


    $this->db->select('a.*, b.*');
    $this->db->from('student_exam_answer a');
    $this->db->join('exam_questions b', 'b.q_id = a.question_id AND b.q_ans_correct = a.answer');
    $this->db->where('a.student_id', $exam_data->user_id);
    $this->db->where('a.exam_id', $exam_data->st_course_id);
    $obtmarks_details = $this->db->get()->num_rows();

   $exam_mark = $exam_data->online_exam_marks / $exam_data->total_questions;
   if($obtmarks_details)
   {
      $obtmarks = $exam_mark * $obtmarks_details; 
   }
   else
   {
      $obtmarks = 0;
   }

    ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Cookie&display=swap" rel="stylesheet"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <title>Document</title>
    <style>
        #srno{
        position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:0;
        right:660px;
        top: 1.60%; /* Adjust this value to move the positioned div up and down */
        text-align: right;
        width: 10%; 
        color: rgb(231, 7, 7);
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        }
        #foto{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:925px;
        right:0px;
        top: 38%; /* Adjust this value to move the positioned div up and down */
        }
        #name{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:30px;
        right:5px;
        top: 49%; /* Adjust this value to move the positioned div up and down */
        width: 60%; 
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif; 
        }
        #prn1{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:0px;
        right:20px;
        top: 38.5%; /* Adjust this value to move the positioned div up and down */
        width: 60%; 
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif; 
        }
        #prn{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:0px;
        right:80px;
        top: 64%; /* Adjust this value to move the positioned div up and down */
        /* text-align: right; */
        width: 40%; 
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif; 
        }
        #gra{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:970px;
        right:0px;
        top: 63.7%; /* Adjust this value to move the positioned div up and down */
        /* text-align: right; */
        width: 40%; 
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif; 
        }
        #crse{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:30px;
        right:5px;
        top: 59%; /* Adjust this value to move the positioned div up and down */
        width: 60%; 
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif; 
        }
        #date{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:690px;
        right:0px;
        top: 81.7%; /* Adjust this value to move the positioned div up and down */
        /* text-align: right; */
        width: 40%; 
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        }
        #addr{
            position: absolute;
        z-index: 999;
        margin: 0 auto;
        left:0px;
        right:0px;
        top: 86%; /* Adjust this value to move the positioned div up and down */
        text-align: center;
        width: 100%; 
        font-size: 20px;
        font-weight: bold;
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        }
        #qr_code
        {
            position: absolute;
            z-index: 999;
            left:50px;
            right:0px;
            top: 16%; /* Adjust this value to move the positioned div up and down */
        }
@page {
  size: A4;
  margin: 0;
}
@media print {
  html, body {
    width: 210mm;
    height: auto;
  }
}
body
{
    padding: 0;
    margin:0;
}
.button {
          background-color: red; /* Green */
          border: none;
          color: white;
          padding: 15px 32px;
          text-align: center;
          text-decoration: none;
          display: inline-block;
          font-size: 16px;
        }
        .button_2
        {
            background-color: green; /* Green */
          border: none;
          color: white;
          padding: 15px 32px;
          text-align: center;
          text-decoration: none;
          display: inline-block;
          font-size: 16px;
        }
        .button_3
        {
            background-color: green; /* Green */
          border: none;
          color: white;
          padding: 15px 32px;
          text-align: center;
          text-decoration: none;
          display: inline-block;
          font-size: 16px;
        }
        .button_2
        {
            display: none;
        }
</style>
</head>
<body >
    <?php //if($exam_data->is_digital_certificate == 1):?>
        <div style="position:fixed; text-align:left;top: 0px;right:0px;font-size:21px">
            <button class="button" onclick="remove_bg()">X Remove Background</button>
            <button class="button_2" onclick="add_bg()">+ Add Background</button>
        </div>
    <?php //endif; ?>
    <div style="position:fixed; text-align:left;bottom: 0px;right:0px;font-size:21px">
        <button class="button_3" onclick="window.print()">Print</button>
    </div>
<script type="text/javascript">
        
        function remove_bg()
        {
            $('#image').hide();
            $('.button_2').show();
            $('.button').hide();
            // var myElement = document.getElementById("page1-div-2");
            // myElement.style.top = "390px";
            
            var myElement_3 = document.getElementById("page1-div-3");
            myElement_3.style.top = "305px";
            myElement_3.style.left = "636px";
           
            
            // var myElement_4 = document.getElementById("page1-div-4");
            // myElement_4.style.top = "600px";
            
            // var myElement_5 = document.getElementById("page1-div-5");
            // myElement_5.style.top = "850px";
            
            // var myElement_6 = document.getElementById("page1-div-6");
            // myElement_6.style.top = "850px";
            
            var myElement_7 = document.getElementById("page1-div-7");
            myElement_7.style.bottom = "140px";
            myElement_7.style.top = "";
            myElement_7.style.left = "58px";
            
        }
        function add_bg() {
            $('#image').show();
            $('.button').show();
            $('.button_2').hide();
            // var myElement = document.getElementById("page1-div-2");
            // myElement.style.top = "350px";
            
            var myElement_3 = document.getElementById("page1-div-3");
            myElement_3.style.top = "307px";
            myElement_3.style.left = "645px";
            
            // var myElement_4 = document.getElementById("page1-div-4");
            // myElement_4.style.top = "570px";
            
            // var myElement_5 = document.getElementById("page1-div-5");
            // myElement_5.style.top = "800px";
            
            // var myElement_6 = document.getElementById("page1-div-6");
            // myElement_6.style.top = "800px";
            
            var myElement_7 = document.getElementById("page1-div-7");
            myElement_7.style.top = "930px";
            myElement_7.style.left = "55px";

        }
    </script>    
<div id="page1-div">
    <?php //if($exam_data->is_digital_certificate == 1):?>
        <img src="<?php echo base_url() ?>assets/Certificate-2023.jpg" id="image" style="position:absolute;width: 210mm;">
    <?php //endif; ?>


    <?php
    $totalmarks = doubleval($exam_data->online_exam_marks) + doubleval($exam_data->practical_exam_marks) + doubleval($exam_data->viva_exam_marks);
    $totalobtainedmarks = doubleval($obtmarks) + doubleval($exam_data->prc_obtained_marks) + 
                 doubleval($exam_data->viva_obtained_marks);
    $grade='';
   
    // $per=round((($marks->obtainedmarks) /($marks->totalmarks))*100);   
    $per=round(($totalobtainedmarks/$totalmarks)*100);
    
    if(($per >= 90) && ($per <= 100)){
        $grade='O';
    }
    else if(($per >= 80) && ($per <= 89)){
        $grade='A+';
    }
    else if(($per >= 60) && ($per <= 79)){
        $grade='A';
    }
    else if(($per >= 55) && ($per <= 59)){
        $grade='B';
    }
    else if(($per >= 50) && ($per <= 54)){
        $grade='C';
    }
    else if(($per >= 45) && ($per <= 49)){
        $grade='D (Fail)';
    }
    else if(($per >= 40) && ($per <= 44)){
        $grade='E (Fail)';
    }
    else {
        $grade='F (Fail)';
    }
     ?>
<div style="position:absolute;z-index:999;top: 50px;left: 70px;color:red"><h3><b></b></h3></div>
<div style="position:absolute;z-index:999;font-size:20px;top: 50px;left: 60px;">Candidate PRN : <?=$st_id->user_reg_id  ?></div>

<img src="<?=base_url()?><?=$st_id->user_photo;?>"  style="position:absolute;z-index:999;font-size:20px;top: 310px;left: 645px;"  width="85" height="105" id="page1-div-3"> 

<div class="content" style="position:absolute;z-index:999;font-size:30px;top: 360px;left: 80px;width:650px">
        <div style="font-family: 'Cookie', cursive;text-align:center">This Certificate Accredits That</div> 
        <div style="font-family: Arial, Helvetica, sans-serif;font-size:20px;text-transform: uppercase;font-weight:700;text-align:center"><?=$st_id->user_name;?></div>
        <div style="font-family: 'Cookie', cursive;text-align:center">Has Successfully Completed  The Examination For </div> 
        <div style="font-family: Arial, Helvetica, sans-serif;font-size:20px;text-transform: uppercase;font-weight:700;text-align:center"><?=$exam_data->title  ?></div>
        <div style="font-family: 'Cookie', cursive;text-align:center">With <b style="font-family: Arial, Helvetica, sans-serif;font-size:25px"><?=$per?>%</b> Percentage and Awarded  With Grade <b style="font-family: Arial, Helvetica, sans-serif;font-size:25px"><?=$grade;?></b></div> 
        <div style="font-family: 'Cookie', cursive;text-align:center">And Is Entitled To All Honors And Privileges Associated With<br/> This Achievement. </div> 
        <div style="font-family: 'Cookie', cursive;text-align:center">The Exam Held in Month Of <b style="font-family: Arial, Helvetica, sans-serif;font-size:25px"><?=date('M - Y',strtotime($exam_data->st_student_exam_date));?></b> At</div> 
        <div style="font-family: Arial, Helvetica, sans-serif;font-size:20px;text-transform: uppercase;font-weight:700;text-align:center"><?=strtoupper($atp->user_business_name)?> <br></div>
        <div style="font-family: 'Cookie', cursive;text-align:center">In testimony whereof are set the seal & Signature of Director <b style="font-family: Arial, Helvetica, sans-serif;font-size:23px">TECKHUB EDUCATION,Pune.</b></div> 

    </div>
    <div id="page1-div-7" style="position:absolute;z-index:999;font-size:30px;top: 930px;left: 60px;"><img src="<?php echo base_url().atp_details()->user_atp_logo ?>" width="100"></div>
    <img style="position:absolute;top:880px;left: 340px;" src="https://chart.googleapis.com/chart?chs=300x300&cht=qr&chl=<?php echo base_url(); ?>verify_certificate?cer_no=<?php echo $st_id->user_reg_id; ?>&choe=UTF-8" title="Link to Google.com" width="100px"/>
    <div style="position:absolute;top:975px;left: 343px;font-size: 12px;"><b>SCAN & VERIFY</b></div>
<style>
.content div
{
    padding-top:10px;
}
@media print {
  .removeBg, .button_2, .button_3 {
    display: none!important;
  }
}
</style>


</div>
</body>
</html>
