Skip to content

Instantly share code, notes, and snippets.

@Gleek

Gleek/cpi.html

Created September 8, 2014 11:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Gleek/a41910001a628fd34982 to your computer and use it in GitHub Desktop.
Save Gleek/a41910001a628fd34982 to your computer and use it in GitHub Desktop.
Download ZIP
JMI CGPI Calculator
Raw
cpi.html
<html>
<head>
<!-- Latest compiled and minified CSS -->
<title>JMI CPI Calculator</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.1/css/bootstrapValidator.min.css"/>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.1/js/bootstrapValidator.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script>
var max = 0;
var spis = new Array();
$(document).ready(function() {
$('#formspi').bootstrapValidator({
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
spi: {
validators: {
between: {
min: 0.0,
max: 10.0,
message: 'The SPI must be between 0.00 and 10.00'
}
}
},
}
});
});
</script>
</head>
<body>
<div id="main" class="container">
<div id="content">
<h1>JMI CPI Calculator</h1>
<br><br>
<form id="formspi" class="form-horizontal">
<div class="row">
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="1" placeholder="I Semester SPI">
</div>
<div class="col-md-2"></div>
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="2" placeholder="II Semester SPI">
</div>
</div>
<div class="row">
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="3" placeholder="III Semester SPI">
</div>
<div class="col-md-2"></div>
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="4" placeholder="IV Semester SPI">
</div>
</div>
<div class="row">
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="5" placeholder="V Semester SPI">
</div>
<div class="col-md-2"></div>
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="6" placeholder="VI Semester SPI">
</div>
</div>
<div class="row">
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="7" placeholder="VII Semester SPI">
</div>
<div class="col-md-2"></div>
<div class="form-group col-md-5">
<input type="text" name="spi" class="form-control" id="8" placeholder="VIII Semester SPI">
</div>
</div>
</form>
<div class="row">
<h1 class="col-md-2"></h1>
<h1 class="col-md-2" id="cpifin"></h1>
<h1 class="col-md-4"></h1>
<h1 class="col-md-2" id="percfin"></h1>
<h1 class="col-md-2"></h1>
</div>
</div>
</div>
<script>
$( "input" ).blur(function() {
var cpi = 0;
var total = new Array(0,4,4/3,2/3,0.4);
var value = $( this ).val();
var id = $(this).attr('id');
id-- ;
if (!(isNaN(value) || value == "" || value == 0)) {
spis[id] = value;
}
else
spis.splice(id,1);
max = spis.length;
if(spis.length % 2 == 1)
max++;
for (var i = 0; i< max; i= i + 2 ) {
if( isNaN(spis[i+1]) )
spis[i+1] = spis[i];
cpi = cpi + ((+spis[i] + +spis[i+1])/2)*(0.25*(i/2 + 1));
}
cpi = cpi * total[max/2];
max = 0;
if(!isNaN(cpi)){
cpi = Math.round(cpi * 100) /100;
if(cpi <= 10 && cpi > 0) {
$("#cpifin").hide();
$( "#cpifin" ).text( cpi );
$("#cpifin").fadeIn("slow");
var per = (20*cpi*cpi*cpi - 380*cpi*cpi +2725*cpi-1690)/84;
per = Math.round(per * 100) /100;
if(!isNaN(per)) {
$("#percfin").hide();
$("#percfin").text( per+"%");
$("#percfin").fadeIn("slow");
}
}
}
})
.blur();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment