• Tidak ada hasil yang ditemukan

Perancangan Aplikasi Ujian Berbasis Komputer untuk SMA GKPI Padang Bulan Medan

N/A
N/A
Protected

Academic year: 2017

Membagikan "Perancangan Aplikasi Ujian Berbasis Komputer untuk SMA GKPI Padang Bulan Medan"

Copied!
28
0
0

Teks penuh

(1)

Main.php

<div class="row col-md-12" style="background: none">

<div class="panel panel-info" style="border: none; text-align: center"> <img src="Halaman Utama.png" style="width: 250px">

<div class="panel-heading" style="background: none; border: none; font-family: Gabriola; font-size: 20pt; text-align: center; color: #673ab7; font-weight: bold">Selamat datang di Aplikasi Ujian Berbasis Komputer </div>

</div>

<div class="panel-body">

<div class="alert alert-info" style="text-align: center; background: #d3cedc; border: none; color: #673ab7;">Selamat datang <b><?php echo $this->session->userdata('admin_nama')."</b>. Username : <b>".$sess_user; ?></b></div>

<?php

if (!empty($p_mapel)) {

echo "<h3>Mata pelajaran yang Anda ikuti : </h3><ul>"; foreach ($p_mapel as $p) {

echo '<li>'.$p->nama.'</li>'; }

echo '</ul>'; }

?> </div> </div> </div> </div>

Login.php

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

<meta charset="utf-8">

<title>Dashboard - Aplikasi Ujian Online</title>

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

<meta name="apple-mobile-web-app-capable" content="yes"> <link href="<?php echo base_url(); ?>___/css/bootstrap.css" rel="stylesheet">

<link href="<?php echo base_url(); ?>___/css/style.css" rel="stylesheet"> </head>

<body style="background-size: cover; background: #0b7daf">

<div class="container">

<div class="col-md-4"></div>

<div class="col-md-4" style="background: none;"> <form action="" method="post" name="fl" id="f_login">

<div class="panel panel-default top150" style="background: none; text-align: center">

<img src="../handayani.png" style="width: 150px; margin-bottom: 10px">

<div class="panel-heading" style="text-align: center"><h4 style="margin: 5px; border-radius: none"><span style="color: #0b7daf; font-weight: bold">LOGIN APLIKASI UJIAN ONLINE</span></h4></div>

<div class="panel-body">

(2)

<input type="text" id="username"

name="username" autofocus value="" placeholder="username" class="form-control" style="width: 318px; padding-left: 5px; text-align: center; font-family: Calibri Light; border: none; border-radius: 3px"/>

</div> <!-- /field -->

<div class="input-group top15">

<input type="password" id="password" name="password" value="" placeholder="password" class="form-control" style="width: 318px; padding-left: 5px; text-align: center; font-family: Calibri Light; border: none; border-radius: 3px"/>

</div> <!-- /password --> <div class="login-actions">

<button id="button" class="button btn btn-dafault btn-large col-lg-12 top15" style="background: white; font-family: Calibri Light; font-weight: bold; color: #0b7daf; border-radius:

3px">LOGIN</button>

</div> <!-- .actions --> </div>

</div> <!-- /login-fields -->

</form> </div>

<div class="col-md-4"></div> </div>

<div class="ctr" style="color: white"> &copy; 2017 <a style="text-decoration: none; color: white;" href="<?php echo base_url(); ?>adm">Aplikasi Ujian Online</a></div>

<!-- /footer --> <!-- Le javascript

================================================== -->

<!-- Placed at the end of the document so the pages load faster --> <script src="<?php echo base_url();

?>___/js/jquery-1.11.3.min.js"></script>

<script src="<?php echo base_url(); ?>___/js/bootstrap.js"></script> <script src="<?php echo base_url(); ?>___/js/aplikasi.js"></script>

<script type="text/javascript">

$("#f_login").submit(function(event) { event.preventDefault();

var data = $('#f_login').serialize();

$("#konfirmasi").html("<div class='alert alert-info' style='font-family: Calibri Light'><i class='icon spinner icon-spin'></i> Checking...</div>")

$.ajax({

type: "POST", data: data,

url: "<?php echo base_URL(); ?>adm/act_login", success: function(r) {

if (r.log.status == 0) {

$("#konfirmasi").html("<div class='alert alert-danger' style='font-family: Calibri

Light'>"+r.log.keterangan+"</div>"); } else {

$("#konfirmasi").html("<div class='alert alert-success' style='font-family: Calibri

Light'>"+r.log.keterangan+"</div>");

(3)

} }

}); });

</script>

<input type="checkbox" id="cek">

<label id="tombol" for="cek"></label> <div id="box">

<div id="konten">

<span style="font-family: Calibri Light; font-size: 15pt; font-weight: bold; color: #0b7daf">APLIKASI UJIAN ONLINE</span>

<br><br>

<p style="text-align: justify;">Selamat datang kepada para siswa di Aplikasi Ujian Online. Salam kami,<br>

Admin Aplikasi Ujian Online</p> </div>

</div> <style type="text/css">

input#cek{ display: none; }

label#tombol{

position: fixed; top: 40px;

left: 850px; z-index: 30; width: 20px; height: 50px;

background: url('../close.gif') 0 10px no-repeat; cursor: pointer;

}

label#tombol:hover{

background: url('../close.gif') -20px 10px no-repeat; }

#box{

width: 400px; height: 500px; padding: 10px; top: 40px; left: 480px; position: fixed; background: #fff;

border: 1px solid #ccc; z-index: 20;

border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; box-shadow: 0 0 10px #ccc; -moz-box-shadow: 0 0 10px #ccc; -webkit-box-shadow: 0 0 10px #ccc; }

#konten{

border-top: 1px solid #ccc; padding-top: 20px;

margin-top: 30px; }

(4)

-moz-animation: turun 1s ease; -webkit-animation: turun 1s ease; }

input#cek:checked ~ label#tombol,input#cek:checked ~ #box{ top: -500px;

-moz-animation: naik 1s ease; -webkit-animation: naik 1s ease; }

@-moz-keyframes turun{ 0%{top: -500px;} 100%{top: 40px;} }

@-webkit-keyframes turun{ 0%{top: -500px;} 100%{top: 40px;} }

@-moz-keyframes naik{ 0%{top: 40px;} 100%{top: -500px;} }

@-webkit-keyframes naik{ 0%{top: 40px;} 100%{top: -500px;} }

</style> </body>

</html>

Guru.php

<div class="row col-md-12">

<div class="panel panel-info" style="border: none">

<div class="panel-heading" style="color: #673ab7; font-family: Gabriola; font-size: 20pt; font-weight: bold; background: none; border: none">Data Guru

<div class="tombol-kanan">

<a style="font-family: Calibri Light; font-weight: bold" class="btn btn-success btn-sm tombol-kanan" href="#" onclick="return m_guru_e(0);"><i class="glyphicon glyphicon-plus"></i> &nbsp;&nbsp;Tambah</a>

</div> </div>

<div class="panel-body">

<table class="table table-bordered"> <thead>

<tr>

<th style="background: #673ab7; color: white; font-weight: normal" width="5%">No</th>

<th style="background: #673ab7; color: white; font-weight: normal" width="60%">Nama</th>

<th style="background: #673ab7; color: white; font-weight: normal" width="35%">Aksi</th>

</tr> </thead>

(5)

if (!empty($data)) { $no = 1;

foreach ($data as $d) { echo '<tr>

<td class="ctr">'.$no.'</td> <td>'.$d->nama.'</td>

<td style="text-align: center" class=""> <div class="btn-group">

<a href="#" onclick="return

m_guru_e('.$d->id.');" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-pencil" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Edit</a>

<a href="#" onclick="return m_guru_h('.$d->id.');" class="btn btn-danger btn-xs"><i class="glyphicon glyphicon-remove" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Hapus</a> <a href="#" onclick="return m_guru_matkul('.$d->id.');" class="btn btn-success btn-xs"><i class="glyphicon glyphicon-th-list" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Mata

Kuliah</a>

';

if ($d->ada == "0") {

echo ' <a href="#" onclick="return m_guru_u('.$d->id.');" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-user" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Aktifkan User</a>'; }

echo '</div> </td> </tr> '; $no++; } } ?> </tbody> </table>

</div> </div> </div> </div>

<div class="modal fade" id="m_guru" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

<div class="modal-dialog" role="document"> <div class="modal-content">

<div class="modal-header">

<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

<h4 id="myModalLabel">Data Guru</h4> </div>

<div class="modal-body">

<form name="f_guru" id="f_guru" onsubmit="return m_guru_s();"> <input type="hidden" name="id" id="id" value="0">

(6)

<tr><td style="width: 25%">Nama</td><td style="width: 75%"><input type="text" class="form-control" name="nama" id="nama" required></td></tr>

</table> </div>

<div class="modal-footer">

<button class="btn btn-primary">Simpan</button> <button class="btn" data-dismiss="modal" aria-hidden="true">Tutup</button>

</div> </form> </div> </div> </div>

Siswa.php

<div class="row col-md-12">

<div class="panel panel-info" style="border: none">

<div class="panel-heading" style="color: #673ab7; font-family: Gabriola; font-size: 20pt; font-weight: bold; background: none; border: none">Data Siswa

<div class="tombol-kanan">

<a style="font-family: Calibri Light; font-weight: bold" class="btn btn-success btn-sm tombol-kanan" href="#" onclick="return m_siswa_e(0);"><i class="glyphicon glyphicon-plus"></i> &nbsp;&nbsp;TAMBAH</a>

</div> </div>

<div class="panel-body">

<table class="table table-bordered" style="border: none"> <thead>

<tr>

<th style="background: #673ab7; color: white; font-weight: normal" width="5%">No</th>

<th style="background: #673ab7; color: white; font-weight: normal" width="25%">Nama</th>

<th style="background: #673ab7; color: white; font-weight: normal" width="15%">NIS</th>

<th style="background: #673ab7; color: white; font-weight: normal" width="20%">Jurusan</th>

<th style="background: #673ab7; color: white; font-weight: normal" width="35%">Aksi</th>

</tr> </thead>

<tbody> <?php

if (!empty($data)) { $no = 1;

foreach ($data as $d) { echo '<tr>

<td class="ctr">'.$no.'</td> <td>'.$d->nama.'</td>

<td style="text-align: center">'.$d->nim.'</td> <td>'.$d->jurusan.'</td>

(7)

<a href="#" onclick="return

m_siswa_e('.$d->id.');" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-pencil" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Edit</a>

<a href="#" onclick="return m_siswa_h('.$d->id.');" class="btn btn-danger btn-xs"><i class="glyphicon glyphicon-remove" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Hapus</a> <a href="#" onclick="return m_siswa_matkul('.$d->id.');" class="btn btn-success btn-xs"><i class="glyphicon glyphicon-th-list" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Mata

Pelajaran</a>

';

if ($d->ada == "0") {

echo ' <a href="#" onclick="return m_siswa_u('.$d->id.');" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-user" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Aktifkan User</a>'; }

echo '</div> </td> </tr> '; $no++; } } ?> </tbody> </table>

</div> </div> </div> </div>

<div class="modal fade" id="m_siswa" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

<div class="modal-dialog" role="document"> <div class="modal-content">

<div class="modal-header">

<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

<h4 id="myModalLabel">Data Siswa</h4> </div>

<div class="modal-body">

<form name="f_siswa" id="f_siswa" onsubmit="return m_siswa_s();"> <input type="hidden" name="id" id="id" value="0">

<table class="table table-form">

<tr><td style="width: 25%">Nama</td><td style="width: 75%"><input type="text" class="form-control" name="nama" id="nama" required></td></tr>

<tr><td style="width: 25%">NIM</td><td style="width: 75%"><input type="text" class="form-control" name="nim" id="nim" required></td></tr>

<tr><td style="width: 25%">Jurusan</td><td style="width: 75%"><input type="text" class="form-control" name="jurusan" id="jurusan" required></td></tr>

</table> </div>

<div class="modal-footer">

(8)

<button class="btn" data-dismiss="modal" aria-hidden="true">Tutup</button>

</div> </form> </div> </div> </div>

Soal.php

<?php

$uri4 = $this->uri->segment(4); ?>

<div class="row col-md-12">

<div class="panel panel-info" style="border: none">

<div class="panel-heading" style="color: #673ab7; font-family: Gabriola; font-size: 20pt; font-weight: bold; background: none; border: none">Data Soal

<div class="tombol-kanan">

<a style="font-family: Calibri Light; font-weight: bold" class="btn btn-success btn-sm" onclick="return m_soal_e(0);"><i class="glyphicon

glyphicon-plus" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Tambah Data</a>

<a style="font-family: Calibri Light; font-weight: bold" href='<?php echo base_url(); ?>adm/m_soal/cetak/<?php echo $uri4; ?>' class='btn btn-info btn-sm' target='_blank'><i class='glyphicon glyphicon-print'></i> Cetak</a>

</div> </div>

<div class="panel-body">

<!-- accordion -->

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">

<?php

echo form_dropdown("pilih_mapel", $p_mapel, $uri4, "id='pilih_mapel' class='form-control col-md-12'")."<br><br>";

if (!empty($data)) { $no = 1;

foreach ($data as $d) { ?>

<div class="panel panel-default">

<div class="panel-heading" role="tab" id="headingOne"> <a role="button" toggle="collapse"

data-parent="#accordion" href="#collapse<?php echo $no; ?>" aria-expanded="true" aria-controls="collapseOne">

#<?php echo $no." : ".substr($d->soal, 0, 100); ?> </a>

<div class="btn-group tombol-kanan">

<a class="btn btn-default btn-xs">Pembuat: <?php echo $d->nama_guru; ?></a>

<a class="btn btn-info btn-xs" onclick="return

(9)

<a class="btn btn-warning btn-xs" onclick="return

m_soal_h('<?php echo $d->id; ?>');"><i class="glyphicon glyphicon-remove" style="margin-left: 0px; color: #fff"></i> &nbsp;&nbsp;Hapus</a>

</div> </div>

<div id="collapse<?php echo $no; ?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">

<div class="panel-body">

<?php

if ($d->gambar != "") { ?>

<img src="<?php echo base_url(); ?>upload/gambar_soal/<?php echo $d->gambar; ?>" class="thumbnail" style="width: 300px; height: 280px; display: inline; float: left">

<a href="<?php echo base_url(); ?>adm/m_soal/hapus_gambar/<?php echo $this->uri->segment(4); ?>/<?php echo $d->id; ?>" style="display: inline; margin-left: 20px" onclick="return confirm('Anda yakin..?');">Hapus Gambar</a>

<table class="table table-bordered"><tbody> <?php

$arra = array("a","b","c","d","e"); for ($i=0; $i<sizeof($arra);$i++) { $opsi = "opsi_".$arra[$i];

if ($d->jawaban == strtoupper($arra[$i])) { echo "<tr style='background: #dff0d8'><td

width='2%'>".$arra[$i]."</td><td width='98%'>".$d->$opsi."</td></tr>"; } else {

echo "<tr><td width='2%'>".$arra[$i]."</td><td width='98%'>".$d->$opsi."</td></tr>";

} } ?>

</tbody> </table>

<?php } else { ?>

<table class="table table-bordered"><tbody> <?php

$arra = array("a","b","c","d","e"); for ($i=0; $i<sizeof($arra);$i++) { $opsi = "opsi_".$arra[$i];

if ($d->jawaban == strtoupper($arra[$i])) { echo "<tr style='background: #dff0d8'><td

width='2%'>".$arra[$i]."</td><td width='98%'>".$d->$opsi."</td></tr>"; } else {

echo "<tr><td width='2%'>".$arra[$i]."</td><td width='98%'>".$d->$opsi."</td></tr>";

} } ?>

</tbody> </table> <?php } ?> </div> </div> </div>

(10)

}

} else {

echo '<div class="alert alert-danger">Belum ada soal untuk mata pelajaran tersebut. Silakan pilih mata pelajaran..</div>';

} ?> </div> </div> </div> </div> </div>

<!-- Modal -->

<div class="modal fade" id="m_soal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

<div class="modal-dialog" role="document"> <div class="modal-content">

<div class="modal-header">

<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

<h4 class="modal-title" id="myModalLabel">Input Soal</h4> </div>

<div class="modal-body">

<form method="post" action="" name="f_soal" id="f_soal" onsubmit="return m_soal_s();">

<input type="hidden" name="id" id="id" value="0"> <div id="konfirmasi"></div>

<table class="table table-form">

<tr><td class="" colspan="2" style="width: 20%">Mapel</td> <td style="width: 80%">

<?php echo form_dropdown('id_mapel', $p_mapel, '', 'class="form-control" id="id_mapel" required'); ?>

</td></tr>

<tr><td class="" colspan="2">Guru</td> <td>

<?php echo form_dropdown('id_guru', $p_guru, '', 'class="form-control" id="id_guru" required'); ?>

</td></tr>

<tr><td class="" colspan="2" style="width: 20%">Gambar Soal</td><td style="width: 80%">

<input type="file" name="gambar_soal" id="gambar_soal" class="form-control"></td></tr>

<tr><td class="" colspan="2" style="width: 20%">Bobot</td><td style="width: 80%">

<?php echo form_input('bobot', '1', 'class="form-control" id="bobot" required'); ?>

</td></tr>

<tr><td class="" colspan="2" style="width: 20%">Soal</td><td style="width: 80%"><textarea autofocus class="form-control" style="height: 70px" name="soal" id="soal" required></textarea></td></tr>

<tr><td style="width: 4%" class="ctr">A</td><td style="width: 96%" colspan="2"><input type="text" class="form-control" name="opsi_a" id="opsi_a" required></td></tr>

<tr><td class="ctr">B</td><td colspan="2"><input type="text" class="form-control" name="opsi_b" id="opsi_b" required></td></tr>

<tr><td class="ctr">C</td><td colspan="2"><input type="text" class="form-control" name="opsi_c" id="opsi_c" required></td></tr>

(11)

<tr><td class="ctr">E</td><td colspan="2"><input type="text" class="form-control" name="opsi_e" id="opsi_e" required></td></tr>

<tr><td class="" colspan="2" style="width: 20%">Jawaban</td><td style="width: 80%">

<select class="form-control" name="jawaban" id="jawaban" required>

<option value="">-Jawaban-</option> <option value="A"> A</option>

<option value="B"> B</option> <option value="C"> C</option> <option value="D"> D</option> <option value="E"> E</option> </select>

</td></tr> </table> </div>

<div class="modal-footer">

<button class="btn btn-primary">Simpan</button>

<button class="btn btn-default" data-dismiss="modal">Tutup</button> </div>

</form> </div> </div> </div>

<script type="text/javascript"> <?php

$xid_guru = "";

if ($sess_level == "guru" && $sess_konid != "") { $xid_guru = $sess_konid;

} ?>

var id_guru_ = "<?php echo $xid_guru; ?>";

var id_mapel_ = "<?php echo $this->uri->segment(4); ?>"; </script>

Tes_ujian.php

<div class="wrapper col-md-8 col-md-offset-2" style="margin-top: 30px"> <div id="clock"></div>

<form role="form" name="_form" method="post" id="_form"> <?php

$no = 1;

$jawaban = array("A","B","C","D","E"); if (!empty($data)) {

foreach ($data as $d) {

echo '<input type="hidden" name="id_soal_'.$no.'" value="'.$d->id.'">';

echo '<div class="step well"><table class="table table-form" style="font-size: 25px">';

echo '<tr><td>'.$no.'</td><td colspan="2">'.$d->soal.'</td></tr>';

for ($j=0; $j<sizeof($jawaban);$j++) {

$kecil_jawaban = strtolower($jawaban[$j]); $opsyen = "opsi_".$kecil_jawaban;

$opsyens = $d->$opsyen;

(12)

echo '<tr><td width="3%">'.$jawaban[$j].'</td><td width="3%"><input checked type="radio" id="opsi_'.$jawaban[$j].'_'.$d->id.'" name="opsi_'.$no.'" value="'.$jawaban[$j].'"></td><td><label

for="opsi_'.$jawaban[$j].'_'.$d->id.'">'.$opsyens.'</label></td></label></tr>'; } else {

echo '<tr><td width="3%">'.$jawaban[$j].'</td><td width="3%"><input type="radio" id="opsi_'.$jawaban[$j].'_'.$d->id.'" name="opsi_'.$no.'" value="'.$jawaban[$j].'"></td><td><label

for="opsi_'.$jawaban[$j].'_'.$d->id.'">'.$opsyens.'</label></td></label></tr>'; }

}

echo '</table></div>'; $no++;

} }

?>

<a class="action back btn btn-info btn-lg">Back</a> <a class="action next btn btn-info btn-lg">Next</a>

<a class="action submit btn btn-success btn-lg">Submit</a>

<input type="hidden" name="jml_soal" value="<?php echo $no; ?>"> </form>

</div>

<script type="text/javascript">

$(document).ready(function(){

var jam_selesai = '<?php echo $detiltes->tgl_selesai; ?>';

$('div#clock').countdown(jam_selesai)

.on('update.countdown', function (event) { $(this).html(event.strftime('%H:%M:%S')); })

.on('finish.countdown', function (event) { alert('Waktu telah selesai....!') var f_asal = $("#_form");

var form = getFormData(f_asal);

$.ajax({ type: "POST",

url: b+"adm/ikut_ujian/simpan_akhir", data: JSON.stringify(form),

dataType: 'json',

contentType: 'application/json; charset=utf-8' }).done(function(response) {

if(response.status == "ok") {

window.location.assign("<?php echo base_url(); ?>adm/sudah_selesai_ujian");

} });

return false; });

var current = 1;

(13)

btnsubmit = $(".submit");

// Init buttons and UI

widget.not(':eq(0)').hide(); hideButtons(current);

// Next button click action btnnext.click(function(){ if(current < widget.length){ widget.show();

widget.not(':eq('+(current++)+')').hide(); //console.log(current);

simpan(); }

hideButtons(current); })

// Back button click action btnback.click(function(){ if(current > 1){

current = current - 2;

if(current < widget.length){ widget.show();

widget.not(':eq('+(current++)+')').hide(); }

hideButtons(current); }

hideButtons(current); })

btnsubmit.click(function() { simpan_akhir();

});

});

simpan = function(){ /*

var minsatu = parseInt(currstep) - 1;

var jawaban =

$("input[type='radio'][name='opsi_"+minsatu+"']:checked").val(); var id_soal =

$("input[type='hidden'][name='id_soal_"+minsatu+"']").val();

jawaban = jawaban == undefined ? '-' : jawaban;

var data = {'jawab': jawaban, 'id_soal': id_soal};

console.log(data);

*/

var f_asal = $("#_form");

var form = getFormData(f_asal);

$.ajax({ type: "POST",

(14)

dataType: 'json',

contentType: 'application/json; charset=utf-8' }).done(function(response) {

});

return false; }

simpan_akhir = function() {

if (confirm('Anda yakin akan mengakhiri tes ini..?')) { var f_asal = $("#_form");

var form = getFormData(f_asal);

$.ajax({ type: "POST",

url: b+"adm/ikut_ujian/simpan_akhir", data: JSON.stringify(form),

dataType: 'json',

contentType: 'application/json; charset=utf-8' }).done(function(response) {

if(response.status == "ok") {

window.location.assign("<?php echo base_url(); ?>adm/sudah_selesai_ujian");

} });

return false; }

}

// Hide buttons according to the current step hideButtons = function(current){

var limit = parseInt(widget.length);

$(".action").hide();

if(current < limit) btnnext.show(); if(current > 1) btnback.show();

if (current == limit) { btnnext.hide(); btnsubmit.show(); } }

</script>

IkutUjian.php

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

<meta charset="utf-8">

<title>Dashboard - Aplikasi Ujian Online</title>

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

<meta name="apple-mobile-web-app-capable" content="yes"> <link href="<?php echo base_url(); ?>___/css/bootstrap.css" rel="stylesheet">

<link href="<?php echo base_url(); ?>___/css/style.css" rel="stylesheet"> <!--<link href="<?php echo base_url();

(15)

<link href="<?php echo base_url(); ?>___/css/font-awesome.css" rel="stylesheet">

<!--<link href="<?php echo base_url(); ?>___/css/style.css" rel="stylesheet">-->

<!--<link href="<?php echo base_url(); ?>___/css/pages/dashboard.css" rel="stylesheet">

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements --> <!--[if lt IE 9]>

<script

src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->

</head> <body>

<nav class="navbar navbar-findcond navbar-fixed-top"> <div class="container">

<div class="navbar-header">

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">

<span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span>

<span class="icon-bar"></span> <span class="icon-bar"></span> </button>

<a class="navbar-brand">Aplikasi Ujian Online</a> </div>

<div class="collapse navbar-collapse" id="navbar"> <ul class="nav navbar-nav navbar-right">

<!--<li class="dropdown">

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-fw fa-bell-o"></i> Bildirimler <span class="badge">0</span></a>

<ul class="dropdown-menu" role="menu">

<li><a href="#"><i class="fa fa-fw fa-tag"></i> <span class="badge">Music</span> sayfası <span class="badge">Video</span> sayfasında etiketlendi</a></li>

<li><a href="#"><i class="fa fa-fw fa-thumbs-o-up"></i> <span class="badge">Music</span> sayfasında iletiniz beğenildi</a></li>

<li><a href="#"><i class="fa fa-fw fa-thumbs-o-up"></i> <span class="badge">Video</span> sayfasında iletiniz beğenildi</a></li>

<li><a href="#"><i class="fa fa-fw fa-thumbs-o-up"></i> <span class="badge">Game</span> sayfasında iletiniz beğenildi</a></li>

</ul> </li>

<li class="active"><a href="#">Ana Sayfa <span class="sr-only">(current)</span></a></li>

-->

<li class="dropdown">

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><?php echo

$this->session->userdata('admin_nama')." (".$this->session->userdata('admin_user').")"; ?> <span class="caret"></span></a>

<ul class="dropdown-menu" role="menu">

<li><a href="#" onclick="return rubah_password();">Ubah Password</a></li>

<li><a href="<?php echo base_url(); ?>adm/logout" onclick="return confirm('keluar..?');">Logout</a></li>

(16)

<form class="navbar-form navbar-right search-form" role="search"> <input type="text" class="form-control" placeholder="Search" /> </form>

--> </div> </div> </nav>

<?php /*

$sess_level = $this->session->userdata('admin_level'); $uri2 = $this->uri->segment(2);

$menu = array();

if ($sess_level == "guru") { $menu = array(

array("icon"=>"dashboard", "url"=>"", "text"=>"Dashboard"), array("icon"=>"list-alt", "url"=>"m_soal", "text"=>"Soal"), array("icon"=>"file", "url"=>"m_ujian", "text"=>"Ujian"), );

} else if ($sess_level == "siswa") { $menu = array(

array("icon"=>"dashboard", "url"=>"", "text"=>"Dashboard"), array("icon"=>"file", "url"=>"ikuti_ujian", "text"=>"Ujian"), );

} else if ($sess_level == "admin") { $menu = array(

array("icon"=>"dashboard", "url"=>"", "text"=>"Dashboard"), array("icon"=>"list-alt", "url"=>"m_soal", "text"=>"Soal"), array("icon"=>"file", "url"=>"ujian", "text"=>"Ujian"), );

} else {

$menu = array(

array("icon"=>"dashboard", "url"=>"", "text"=>"Dashboard") );

} */

$jam_mulai_pc = explode(" ", $detiltes->tgl_mulai); $jam_selesai_pc = explode(" ", $detiltes->tgl_selesai); ?>

<div class="container" style="margin-top: 70px">

<div class="col-lg-12 row">

<div class="alert alert-warning col-md-5">

<table class="table table-bordered" style="margin-bottom: 0px"> <tr><td width="30%">Nama Peserta</td><td width="70%"><?php echo $detil_user->nama; ?></td></tr>

<tr><td>Pembuat Soal</td><td><?php echo $detil_soal->namaGuru; ?></td></tr>

<tr><td>Mata Kuliah</td><td><?php echo $detil_soal->namaMapel; ?></td></tr>

</table> </div>

<div class="col-md-2"></div>

<div class="alert alert-warning col-md-5">

(17)

<tr><td width="30%">Nama Ujian</td><td width="70%"><?php echo $detil_soal->nama_ujian; ?></td></tr>

<tr><td>Jumlah Soal</td><td><?php echo $detil_soal->jumlah_soal; ?></td></tr>

<tr><td>Waktu</td><td><?php echo $detil_soal->waktu; ?> menit (<?php echo $jam_mulai_pc[1]." s.d. ".$jam_selesai_pc[1]; ?>)</td></tr> </table>

</div> </div> <!--

<div class="col-lg-12 row">

<div class="panel panel-default"> <div class="panel-body">

<?php

foreach ($menu as $m) {

if ($uri2 == $m['url']) {

echo '<a href="'.base_url().'adm/'.$m['url'].'" class="btn btn-sq btn-warning"><i class="glyphicon glyphicon-'.$m['icon'].'

g3x"></i><br><br/>'.$m['text'].' </a>'; } else {

echo '<a href="'.base_url().'adm/'.$m['url'].'" class="btn btn-sq btn-primary"><i class="glyphicon glyphicon-'.$m['icon'].'

g3x"></i><br><br/>'.$m['text'].' </a>'; }

} ?> </div> </div> </div> -->

<div class="row col-md-12">

<div class="alert alert-danger">

Waktu mengerjakan tinggal : <div id="clock" style="display: inline; font-weight: bold"></div>

</div>

<form role="form" name="_form" method="post" id="_form"> <?php

$no = 1;

$jawaban = array("A","B","C","D","E"); if (!empty($data)) {

foreach ($data as $d) {

echo '<input type="hidden" name="id_soal_'.$no.'" value="'.$d->id.'">';

echo '<div class="step well">';

if ($d->gambar == "") {

echo '<table class="table table-form" style="font-size: 16px">

<tr><td style="v-align: top">'.$no.'</td><td colspan="2">'.$d->soal.'</td></tr>';

for ($j=0; $j<sizeof($jawaban);$j++) {

$kecil_jawaban = strtolower($jawaban[$j]); $opsyen = "opsi_".$kecil_jawaban;

$opsyens = $d->$opsyen;

if ($jawaban[$j] == $d->jawaban) {

(18)

for="opsi_'.$jawaban[$j].'_'.$d->id.'">'.$opsyens.'</label></td></label></tr>'; } else {

echo '<tr><td width="3%">'.$jawaban[$j].'</td><td width="3%"><input type="radio" id="opsi_'.$jawaban[$j].'_'.$d->id.'" name="opsi_'.$no.'" value="'.$jawaban[$j].'"></td><td><label

for="opsi_'.$jawaban[$j].'_'.$d->id.'">'.$opsyens.'</label></td></label></tr>'; }

}

echo '</table></div>'; } else {

echo '<table class="table table-form" style="font-size: 16px">

<tr><td rowspan="6" width="25%"><img

src="'.base_url().'upload/gambar_soal/'.$d->gambar.'" class="polaroid" style="width: 300px; height: 250px"></td>

<td style="v-align: top">'.$no.'</td><td colspan="2">'.$d->soal.'</td></tr>';

for ($j=0; $j<sizeof($jawaban);$j++) {

$kecil_jawaban = strtolower($jawaban[$j]); $opsyen = "opsi_".$kecil_jawaban;

$opsyens = $d->$opsyen;

if ($jawaban[$j] == $d->jawaban) {

echo '<tr><td width="3%">'.$jawaban[$j].'</td><td width="3%"><input checked type="radio" id="opsi_'.$jawaban[$j].'_'.$d->id.'" name="opsi_'.$no.'" value="'.$jawaban[$j].'"></td><td><label

for="opsi_'.$jawaban[$j].'_'.$d->id.'">'.$opsyens.'</label></td></label></tr>'; } else {

echo '<tr><td width="3%">'.$jawaban[$j].'</td><td width="3%"><input type="radio" id="opsi_'.$jawaban[$j].'_'.$d->id.'" name="opsi_'.$no.'" value="'.$jawaban[$j].'"></td><td><label

for="opsi_'.$jawaban[$j].'_'.$d->id.'">'.$opsyens.'</label></td></label></tr>'; }

}

echo '</table></div>'; }

$no++; }

}

?>

<a class="action back btn btn-info btn-lg">Back</a>

<a class="action next btn btn-info btn-lg">Berikutnya</a>

<a class="action submit btn btn-success btn-lg">Selesai Ujian</a> <input type="hidden" name="jml_soal" value="<?php echo $no; ?>"> </form>

</div>

<div class="col-md-12" style="border-top: solid 1px #eee; padding-top: 10px; margin-top: 50px; margin-bottom: 20px">

<div class="span12"> &copy; 2015 <a href="<?php echo base_url(); ?>adm">Aplikasi Ujian Online</a>. </div>

(19)

<script src="<?php echo base_url(); ?>___/js/jquery-1.11.3.min.js"></script>

<script src="<?php echo base_url(); ?>___/js/bootstrap.js"></script> <script src="<?php echo base_url();

?>___/js/jquery.countdown.min.js"></script> <script type="text/javascript">

var base_url = "<?php echo base_url(); ?>"; </script>

<script src="<?php echo base_url(); ?>___/js/aplikasi.js"></script> <script type="text/javascript">

$(document).ready(function(){

var jam_selesai = '<?php echo $detiltes->tgl_selesai; ?>';

$('div#clock').countdown(jam_selesai)

.on('update.countdown', function (event) { $(this).html(event.strftime('%H:%M:%S')); })

.on('finish.countdown', function (event) { alert('Waktu telah selesai....!') var f_asal = $("#_form");

var form = getFormData(f_asal);

simpan_akhir(<?php echo $detiltes->id_tes; ?>); window.location.assign("<?php echo base_url(); ?>adm/sudah_selesai_ujian/<?php echo $detiltes->id_tes; ?>");

return false; });

var current = 1;

widget = $(".step"); btnnext = $(".next"); btnback = $(".back"); btnsubmit = $(".submit");

// Init buttons and UI

widget.not(':eq(0)').hide(); hideButtons(current);

// Next button click action btnnext.click(function(){ if(current < widget.length){ widget.show();

widget.not(':eq('+(current++)+')').hide(); //console.log(current);

simpan(<?php echo $detiltes->id_tes; ?>); }

hideButtons(current); })

// Back button click action btnback.click(function(){ if(current > 1){

current = current - 2;

if(current < widget.length){ widget.show();

(20)

}

hideButtons(current); }

hideButtons(current); })

btnsubmit.click(function() {

simpan_akhir(<?php echo $detiltes->id_tes; ?>); });

});

simpan = function(id){

var f_asal = $("#_form");

var form = getFormData(f_asal);

$.ajax({ type: "POST",

url: base_url+"adm/ikut_ujian/simpan_satu/"+id, data: JSON.stringify(form),

dataType: 'json',

contentType: 'application/json; charset=utf-8' }).done(function(response) {

});

return false; }

simpan_akhir = function(id) {

if (confirm('Anda yakin akan mengakhiri tes ini..?')) { var f_asal = $("#_form");

var form = getFormData(f_asal);

$.ajax({ type: "POST",

url: base_url+"adm/ikut_ujian/simpan_akhir/"+id, data: JSON.stringify(form),

dataType: 'json',

contentType: 'application/json; charset=utf-8' }).done(function(response) {

if(response.status == "ok") {

window.location.assign("<?php echo base_url(); ?>adm/sudah_selesai_ujian/"+id);

} });

return false; }

}

// Hide buttons according to the current step hideButtons = function(current){

var limit = parseInt(widget.length);

$(".action").hide();

if(current < limit) btnnext.show(); if(current > 1) btnback.show();

(21)

</script>

</body> </html>

Guru_tes_hasil.php

<?php

$uri4 = $this->uri->segment(4); ?>

<div class="row col-md-12"> <div class="panel panel-info">

<div class="panel-heading">Daftar Hasil Tes <div class="tombol-kanan">

<a href='<?php echo base_url(); ?>adm/hasil_ujian_cetak/<?php echo $uri4; ?>' class='btn btn-info btn-sm' target='_blank'><i class='glyphicon glyphicon-print'></i> Cetak</a>

</div> </div>

<div class="panel-body">

<div class="col-lg-12 alert alert-warning" style="margin-bottom: 20px">

<div class="col-md-6">

<table class="table table-bordered" style="margin-bottom: 0px"> <tr><td>Mata Kuliah</td><td><?php echo $detil_tes->namaMapel; ?></td></tr>

<tr><td>Nama Guru</td><td><?php echo $detil_tes->nama_guru; ?></td></tr>

<tr><td width="30%">Nama Ujian</td><td width="70%"><?php echo $detil_tes->nama_ujian; ?></td></tr>

<tr><td>Waktu</td><td><?php echo $detil_tes->waktu; ?> menit</td></tr>

</table> </div>

<!--<div class="col-md-2"></div>--> <div class="col-md-6">

<table class="table table-bordered" style="margin-bottom: 0px"> <tr><td width="30%">Jumlah Soal</td><td><?php echo

$detil_tes->jumlah_soal; ?></td></tr>

<tr><td>Tertinggi</td><td><?php echo $statistik->max_; ?></td></tr>

<tr><td>Terendah</td><td><?php echo $statistik->min_; ?></td></tr>

<tr><td>Rata-rata</td><td><?php echo number_format($statistik->avg_); ?></td></tr> </table>

</div> </div>

<table class="table table-bordered"> <thead>

<tr>

<th width="5%">No</th>

(22)

<th width="15%">Nilai Bobot</th> </tr>

</thead>

<tbody> <?php

if (!empty($hasil)) { $no = 1;

foreach ($hasil as $d) { echo '<tr>

<td class="ctr">'.$no.'</td> <td>'.$d->nama.'</td>

<td class="ctr">'.$d->jml_benar.'</td> <td class="ctr">'.$d->nilai.'</td>

<td class="ctr">'.$d->nilai_bobot.'</td> </tr>

'; $no++; } } else {

echo '<tr><td colspan="5">Belum ada data</td></tr>'; }

?> </tbody> </table>

(23)
(24)
(25)
(26)
(27)
(28)

Referensi

Dokumen terkait

Teknik Pengumpul data dalam penelitian tindakan kelas ini menggunakan teknik tes(Teknik tes digunakan untuk memperoleh data hasil belajar siswa tentang penguasaan

Dr.. Latar Belakang ... Dasar Hukum ... Ruang lingkup ... Lanscape Prioritas Potensi Unggulan Wilayah, Tenaga Kerja, dan Bidang Keahlian Di SMK ... Kerangka Acuan Pelaksanaan

Berdasarkan pembelajaran bahasa Indonesia dengan menggunakan media audio visual pada keterampilan berbicara siswa kelas VC Sekolah Dasar Negeri 03 Pontianak Kota dapat

Sedangkan menurut pendapat Prayitno dan Amti (2004:206) upaya yang dapat dilakukan konselor/guru BK dalam rangka melaksanakan fungsi pencegahan yaitu (1) Mendorong

Kawasan Permukiman Belanja Barang dan Jasa 3.540.000 23 Penyediaan Makanan dan Minuman 1 Kegiatan APBD Dinas Perumahan dan. Kawasan Permukiman Belanja

Peran pemerintah desa dalam meningkatkan partisipasi masyarakat dalam pembangunan di Desa Takisung Kecamatan Takisung Kabupaten Tanah Laut berdasarkan hasil kuesioner

Apabila Pihak Pertama tidak bisa memenuhi kewajiban sebagaimana yang tercantum dalam Pasal 4 ayat (3) selama 3 (tiga) hari berturut-turut, maka Pihak Kedua pada tanggal

Peningkatan Jalan Sentra Produksi Ataran Benuaran Desa Bandung Ayu Kecamatan Pino Rava. 1 Paket APBD Kabupaten Bengkulu