{# Template5FCMC}
{# <!--
    use to render template
        |-> template for JCET UG  
--> #}
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fontfaceobserver/2.1.0/fontfaceobserver.standalone.js"></script>

<meta http-equiv="Content-type" content="text/html; charset=utf-8" /><meta charset="UTF-8" />
<link href='http://fonts.googleapis.com/css?family=Book+Antiqua' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="{{data.baseUrl}}libcommon/font/font_css/font_style.css" type="text/css" charset="utf-8"/>
<link href='https://fonts.googleapis.com/css2?family=Times New Roman:ital,wght@0,400;0,700;1,400;1,700&display=swap' rel='stylesheet'>
<link href="http://fonts.cdnfonts.com/css/bookman-old-style" rel="stylesheet">    
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>         

<style>
	/* FONT CHECK */
	/* Initially hide the body */
	/* body {
		visibility: hidden;
		opacity: 0;
		transition: opacity 0.5s ease-in;
	} */
	/* Show the body when the font is loaded */
	body.fonts-loaded {
		visibility: visible;
		opacity: 1;
	}
	/* END FONT CHECK */

	.p-5 {
		padding: 5mm;
	}
	.primary-table table,
	.secondary-table table {
		border-collapse: collapse !important;
		page-break-inside: auto;
	}
	.primary-table th {
		text-align: center;
		background: none !important;
		height: 5mm !important;
		border: 1px solid #C0C0C0;
		padding: 1mm 2mm !important;
	}
	.primary-table td {
		padding: 1mm;
		line-height: 15px !important;
		height: 6mm !important;
		border: 1px solid #C0C0C0;
		text-align: center;
		vertical-align: middle !important;
	}
	.student-details td{
		padding: 2mm;
		line-height: 15px !important;
		height: 6mm !important;
		/* border: 1px solid #C0C0C0; */
		text-align: center;
		vertical-align: middle !important;
		font-size:13pt!important;
	}
	.b-r-0{
		border: 1px solid #C0C0C0!important;
		border-style: solid none solid solid!important;
	}
	.b-l-0{
		border: 1px solid #C0C0C0!important;
		border-style: solid solid solid none!important;
	}
	.grade-table td,th {
		padding: 0mm 1mm;
		line-height:13px!important;
		height: 5mm !important;
		border: 1px solid #C0C0C0;
		text-align: center;
		vertical-align: middle !important;
	}
	.page-a4 {
		width: 100%;
		border: none;
		padding: 4mm;
		margin: auto;
		/* page-break-after: always; */
	}
	.border-0 {
		border: none !important;
	}
	.bold {
		font-weight: 700 !important;
	}
	.text-center {
		text-align: center;
	}
	.text-left {
		text-align: left !important;
	}
	.text-right {
		text-align: right !important;
	}
	.secondary-table td {
		/* font-family: 'Book Antiqua' !important; */
		font-weight: 700 !important;
		font-size: 10pt !important;
		padding: 10px 0px 0px 0px;
		/* line-height: 7px !important;
		height: 4mm !important; */
		border: none;
		/* text-align: left; */

	}
	.abbr td{
		font-size: 11pt !important;
	}
	.border-top-0 td{
        border:1px solid #C0C0C0 !important;
        border-style: none solid none solid!important;
    }
	.border-full{
        border:1px solid #C0C0C0 !important;
        border-style: solid solid solid solid!important;
    }
	.unbold ,.unbold th{
		font-weight:normal!important;
	}

	.font-2{
		font-family: 'Times New Roman', serif!important;
	}
	.font-6{
		font-family: 'Bookman Old Style', sans-serif!important;
	}
	.font-7{
		 font-family: 'Carlito', sans-serif;
	}
	.font-8{
		font-family: verdana, arial, 'sans serif';
	}
	.fsize-10{
		font-size: 10pt !important;
	}
	.p-l-p{
		padding-left:20%!important;
	}
	body{
		color: #181818!important;
	}
	.fsize-11{
		font-size: 11pt !important;
	}
	.fsize-8{
		font-size: 8pt !important;
	}
	.p-l-30{
		padding-left:30px!important;
	}
	.p-r-80{
		padding-right:80px!important;
	}
	.p-l-10{
		padding-left:10px!important;
	}
    .college-header {
		height: 15mm;
		width: 200mm;
	}
	tr {page-break-inside: avoid !important;}
	.coe{
		font-size:16px;
		padding-right:10mm;
		padding-bottom:5mm
	}
	.fsize-14{
			font-size: 14pt !important;
	}
	.failed{
		margin:20% auto auto auto;
	}

	/* formula */
       .formula {
            width: 100%;
            white-space: nowrap;
            text-align: left;
        }
        .fraction {
            display: inline-block;
            vertical-align: middle;
        }
        .numerator, .denominator {
            display: inline-block;
            padding: 0 0.5em;
        }
        .bar {
            display: block;
            border-top: 1px solid #000;
            width: 1cm; /* Adjust width as needed */
            margin: 0.5em 0; /* Adjust margin for spacing */
        }
		.page-a4:last-child {
			page-break-after: avoid;
		}
</style>

{# CHECK FONT LOADED #}
<script>
checkFont('Times New Roman');
checkFont('Bookman Old Style');
checkFont('Carlito');
checkFont('verdana');
function checkFont(fontName){
  var font = new FontFaceObserver(fontName);
  // Wait for the font to be loaded
  font.load().then(function () {
	// Add a class to the body once the font is loaded
    document.body.classList.add('fonts-loaded');
  }).catch(function () {
	// Handle the case where the font fails to load
    console.error(fontName + ' font could not be loaded.');
    document.body.classList.add('fonts-loaded'); // Ensure content is shown even if font fails to load
  });
}
</script>
{# END CHECK FONT LOADED #}

</head>

{% for student in  data.studentData %}
	{% if student.failedStatus == 'FAILED' %}
		{# NOT AVAILABALE #}
		<div class="page-a4" style="page-break-after: always;">
			<div class='text-danger bold text-center fsize-14 failed'>MARK CARD NOT AVAILABLE FOR {{student.name|raw |upper}} ({{student.regNo|raw}}) </div>
		</div>
		<div class="page-a4" style="page-break-after: always;">
			<div class='text-danger bold text-center fsize-14 failed'>MARK CARD NOT AVAILABLE FOR {{student.name|raw |upper}} ({{student.regNo|raw}}) </div>
		</div>
	{% else %}
		<div class="page-a4" style="page-break-after:always!important;">
			<table style="width:100% !important; margin:20mm 0 0 0;" class="primary-table">
				<tr>
					{% if data.displayContentOptions.displayBanner %}
					<td colspan='4' class="border-0" width="100%"><img style='width:auto; height:48px; margin-top:5mm !important' src="{{data.collegeData.collegeHeaderConsolidated}}" class="college-header"></td>
					{% else %}
					<td colspan='4' class="border-0" width="100%" style="height:70px;"></td>
					{% endif %}
				</tr>
				<tr>
					<td  colspan='4'class="border-0 font-2" width="100%" style="font-size:14pt;padding-top:1mm!important;"><b>BACHELOR OF TECHNOLOGY (B.Tech) DEGREE EXAMINATIONS</b></td>
				</tr>
				<tr>
					<td  colspan='4'class="border-0 font-2" width="100%" style="font-size:14pt;padding-top:1mm!important;"><b>CONSOLIDATED STATEMENT OF GRADES</b></td>
				</tr>
			</table>
			<table style="width:100% !important; margin:2mm 0 0 0;" class="student-details">
				<tr>
					<td class="text-left b-r-0 font-6">Name of the Candidate</td>
					<td class="text-left b-l-0 font-7" colspan='3'>: {{student.name|raw |upper}}</td>
				</tr>
				<tr>
					<td class="text-left b-r-0 font-6">Programme</td>
					<td class="text-left b-l-0 font-7" colspan='3'> : BACHELOR OF TECHNOLOGY 
						{% if student.minorHonours.minor and student.minorHonours.honours and student.minorHonoursBasketName %}
							(Honours) with Minor in {{student.minorHonoursBasketName}}
						{% elseif student.minorHonours.minor and student.minorHonoursBasketName %}
							with Minor in {{student.minorHonoursBasketName}}
						{% elseif student.minorHonours.honours %}
							(Honours)
						{% endif %}
					</td>

				</tr>
				<tr>
					<td class="b-r-0 text-left font-6">Branch</td>
					<td class="b-l-0 text-left font-7" colspan='3'>: {{student.departmentDesc |raw |upper}}</td>
				</tr>
				<tr>
					<td class="b-r-0 text-left font-6">Duration of Programme</td>
					<td class="b-l-0 text-left font-7" colspan='3'>: 4 years (8 Semesters)</td>
				</tr>
				<tr>
					<td class="text-left b-r-0 font-6">College Register Number</td>
					<td class="text-left b-l-0 font-7">: {{student.regNo|raw}}</td>
					<td class="text-left b-r-0 font-6">University Register Number</td>
					<td class="text-left b-l-0 font-7">: {{student.ktuCode|raw}}</td>
				</tr>
				<tr>
					<td class="text-left b-r-0 font-6">Year of Admission</td>
					<td class="text-left b-l-0 font-7">: {{student.admissionYear}}</td>
					<td class="text-left b-r-0 font-6">Month and Year of Passing</td>
					<td class="text-left b-l-0 font-7">: {{student.lastExamMonthYear | upper}}</td>
				</tr>
				<tr>
					<td class="text-left b-r-0 font-6">Date of Birth</td>
					<td class="text-left b-l-0 font-7">: {{student.dob}}</td>
					<td class="text-left b-r-0 font-6">Medium of Instruction</td>
					<td class="text-left b-l-0 font-7">: English</td>
				</tr>
				<tr>
					<td  class="text-left b-r-0 font-6">Sequence No</td>
					<td  class="text-left b-l-0 font-7">: {{student.slNo}}</td>
					<td  class="text-left b-r-0 font-6">Date of Issue</td>
					<td  class="text-left b-l-0 font-7">: {{data.dateOfIssue}}</td>
				</tr>
			</table>
			<table style="width:100% !important; margin:2mm 0 0 0;" class="primary-table font-8 fsize-10">
				<thead>
					<tr class="unbold">
						<th class='font-8 fsize-10' width="12%">Course Code</th>
						<th class='font-8 fsize-10' width="58%" colspan='2'>Course Name</th>
						<th class='font-8 fsize-10' width="5%">Credits</th>
						<th class='font-8 fsize-10' width="5%">Grade</th>
						<th class='font-8 fsize-10' width="20%">Month & Year of Pass</th>
					</tr>
				</thead>
				{% set semCount = 0 %}
				{% for index,semMark in student.academicTerms %}
					{% set semCount = semCount + 1 %}
					{% if semCount == 5 %}
						</table>
						<div class="page-a4" style="page-break-before:always !important; padding:0px">
						<table style="width:100% !important; margin:5mm 0 0 0;" class="primary-table font-8">
					{% endif %}
					<tr class="subject-details fsize-10">
						<td class="text-left" colspan="6" style=' text-decoration: underline; width:40%'><b>{{semMark.semInFullName}} Semester</b></td>
					</tr>
					{% for subject in semMark.subjects %}
						<tr class="subject-details fsize-10">
							<td class="text-left" width="12%" >{{subject.code|raw}} <sup>{{subject.isElective ? ' #':''}}</sup></td>
							{% if not subject.markDetails.isFinalSemSubject and subject.markDetails.isProjectGroupSubject %}
							<td colspan='4'>
								<span class="text-left" style='width:50%;float:left'>{{subject.name|raw | upper}}</span>
								<span class="text-right" style='width:50%;float:right'>{{subject.failedStatus == 'FAILED' ? 'Incomplete':'Successfully Completed - '~ subject.credit ~' credits'}}</span>
							</td>
							{% else %}
							<td class="text-left" colspan="2" width="58%">{{subject.name|raw | upper}}</td>
							<td width="5%">{{subject.credit | round}}</td>
							<td width="5%">{{(subject.showAb and subject.isAbsent ==1)? 'AB':subject.grade}}</td>
							{% endif %}
							<td width="20%">{{subject.examMonthYear | upper}}</td>
						</tr>
					{% endfor %}
					<tr class="subject-details fsize-10">
						<td class = 'text-right' colspan='4' ><b>Credits Earned : {{semMark.credit}}</b></td>
						<td class = 'text-center' colspan='2'><b>SGPA : {{semMark.failedStatus == 'FAILED'  ? '-': semMark.sgpa |number_format(2)}}</b></td>
					</tr>
				{% endfor %}
				<tr>
					<td colspan='6' class='text-center'>***** END OF STATEMENT *****</td>
				</tr>
			</table>
			<div style='width:50%;float:left;padding-left:10px' class='text-left'># Elective</div><br>
			<table style="width:100% !important; margin:2mm 0 0 0;" class="primary-table font-8 fsize-10">
				<colgroup>
					<col width="20%">
					<col width="30%">
					<col width="30%">
					<col width="20%">
				</colgroup>
				<tr>
					<td class='text-left' rowspan='2'>Credits Earned</td>
					<td class='text-left' colspan='2'><div style="width:150px !important; float:left">Courses </div>: {{student.credit}}</td>
					<td class='text-center' rowspan='2'>Total :  {{ student.credit + student.activityCredit }}</td>
				</tr>
				<tr>
					<td class='text-left' colspan='2'><div style="width:150px !important; float:left">Student Activities  </div>: {{student.activityCredit ? student.activityCredit ~' (Non-Academic) Successfully Completed':'-'}} 
					</td>
				</tr>
				<tr>
					<td class='text-left'>CGPA</td>
					<td class='text-left' colspan='3'>{{student.failedStatus == 'FAILED' ? '-': student.cgpa |number_format(2)}}
						{{student.failedStatus == 'FAILED' ? '':'('}}{{student.failedStatus == 'FAILED' ? '-':student.cgpaInWords}}{{student.failedStatus == 'FAILED' ? '':')'}}&nbsp; {{student.failedStatus == 'FAILED' ? '':  student.class}}</td>
				</tr>
				{% if student.minorHonours.honours or student.minorHonours.minor %}
					<tr>
						{% if student.minorHonours.honours %}
							<td class='text-left' colspan="{{ student.minorHonours.honours and student.minorHonours.minor ? "2" : "4"}}">Honours: Additional Credits Earned : {{student.minorHonours.honours.details.creditEarned}}</td>
						{% endif %}
						{% if student.minorHonours.minor %}
							<td class='text-left' colspan="{{ student.minorHonours.honours and student.minorHonours.minor ? "2" : "4"}}">Minor: Additional Credits Earned : {{student.minorHonours.minor.details.creditEarned}}</td>
						{% endif %}
					</tr>
				{% endif %}
			</table>
			<div style='width:100%;margin-top:15mm' class='font-7'>
				<div style='width:30%;float:left;padding-left:5mm' class='text-left'>Verified by:</div>
				<div style='width:20%;float:left;' class='text-right'></div>
				<div style='width:50%;float:right;' class='text-right coe'>Controller of Examinations</div>
			</div>
		{# ######################### START GRADE TABLE ######################### #}
				{% if student.qrData %}
				<div style="text-align:center; margin-bottom:5mm;">
					<img style="width:25mm; height:25mm;" src="{{ getQr(student.qrData, 250, 0, 'L') }}"/>
				</div>
				{% endif %}
				<div style='margin:1mm'>
					<table style="width:100% !important;" class="grade-table font-7 fsize-8">
						<tr>
							<th colspan='5' class='text-left'>College follows 10 point grading scale</th>
						</tr>
						<tr>
							<td colspan='3'>Grades and Grade Points</td>
							<td colspan='2'>Calculation of SGPA/CGPA</td>
						</tr>
						<tr class="index-table">
							<td style='width:7%'>Grades</td>
							<td style='width:13%'>Grade Point(GP)</td>
							<td style='width:35%'>% of Total Marks obtained in the Course</td>
							<td colspan='2' style="width:45%;text-align:left" rowspan="11">
								<div class="formula">
									Semester Grade Point Average, SGPA =
									<div class="fraction">
										<span class="numerator">∑<i>C<sub>i</sub>
												x GP<sub>i</sub>
											</i>
										</span>
										<hr class="bar">
										<span class="denominator">∑<i>C<sub>i</sub>
											</i>
										</span>
									</div>
								</div>
								<div>
									where ‘𝐶𝑖 ’ is the credit assigned and ‘𝐺𝑃𝑖 ’ is the grade point of a course. <br>
									Summation is done for all courses of a semester for which SGPA is calculated.
								</div>
								<div class="formula">
									Cumulative Grade Point Average, CGPA =
									<div class="fraction">
										<span class="numerator">∑<i>C<sub>i</sub>
												x GP<sub>i</sub>
											</i>
										</span>
										<hr class="bar">
										<span class="denominator">∑<i>C<sub>i</sub>
											</i>
										</span>
									</div>
								</div>
								<div>
									<div style='margin-bottom: 10px;'>Summation is done for all courses up to the semester for which ‘CGPA’ is calculated </div> 
									Equivalent percentage mark = 10 x CGPA<br>
									CGPA 8.0 and above First class with Distinction<br>
									CGPA 6.5 and above First class
								</div>
							</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">S</span>
							</td>
							<td>10</td>
							<td class="text-left">90% and above</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">A+</span>
							</td>
							<td>9.0</td>
							<td class="text-left">85% and above but less than 90%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">A</span>
							</td>
							<td>8.5</td>
							<td class="text-left">80% and above but less than 85%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">B+</span>
							</td>
							<td>8.0</td>
							<td class="text-left">75% and above but less than 80%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">B</span>
							</td>
							<td>7.5</td>
							<td class="text-left">70% and above but less than 75%</td>
							
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">C+</span>
							</td>
							<td>7.0</td>
							<td class="text-left">65% and above but less than 70%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">C</span>
							</td>
							<td>6.5</td>
							<td class="text-left">60% and above but less than 65%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">D</span>
							</td>
							<td>6.0</td>
							<td class="text-left">55% and above but less than 60%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">P</span>
							</td>
							<td>5.5</td>
							<td class="text-left">50% and above but less than 55%</td>
						</tr>
						<tr>
							<td class="text-left">
								<span class="p-l-p">LP</span>
							</td>
							<td>4.0</td>
							<td class="text-left">Low Pass Grade</td>
						</tr>
					</table>
			</div>
		</div>
		
		{# ######################### END GRADE TABLE ######################### #}
		</div>
	{% endif %}
{% endfor %}
