• Tidak ada hasil yang ditemukan

BAB IV HASIL DAN PEMBAHASAN

4.2. Implementasi Sistem

4.2.1. Berbasis Desktop

4.2.1.3. Form Tampilan Absensi

Pada melakukan absensi proses yang dilakukan tidak jauh beda dengan proses regestrasi yaitu pertama kita dengan mengetikan NIS lalu akan tampil form Absensi siwa kemudian melakukan proses absen dengan meletakkan sidik jari kita ke finger print kemudian tekan tombol absen maka akn ada verifikasi terlambat atau masuk seperti gambar

Gambar 4.5. Form Proses Absensi

j = 8

Case "Right Pinkie" j = 9 Case "(None)" j = 10 Case Else j = 10 End Select GetFingerNumber = j End Function

4.2.2. Berbasis Website

Penggunaan sarana website sebagai antar muka sistem dikarenakan sistem penyajian data ini ditujukan untuk menjadi website dari

www.smaululalbab/absensi.sch.id yang merupakan website utama SMA Ulul Alb@b.

Website ini terdiri atas dua halaman yaitu Halaman User, Halaman Administrator. Halaman User adalah halaman yang pertama kali diakses oleh pengunjung website yang merupakan inti dari sistem penyajian data ini. Sedangkan Halaman Administrator adalah halaman bagi administrator website untuk mengelola content website. Halaman Administrator diakses melalui back-end.

4.2.2.1. Halaman Utama

Halaman Utama memiliki tampilan seperti yang ditunjukkan pada Gambar 4.1 berikut ini.

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title> ULUL ALB@B LOGIN</title> <link rel="stylesheet" type="text/css"

href="css/jquery/jquery.ui.all.css" media="screen"/>

<link rel="stylesheet" type="text/css" href="css/table_data.css" media="screen"/>

<link rel="stylesheet" type="text/css"

href="css/lightbox/style.css" media="screen"/>

<link rel="stylesheet" type="text/css" href="css/style.css" title="style_blue" media="screen"/>

<link rel="alternate stylesheet" type="text/css"

href="css/style_green.css" title="style_green" media="screen" /> <link rel="alternate stylesheet" type="text/css"

href="css/style_red.css" title="style_red" media="screen" /> <link rel="alternate stylesheet" type="text/css"

href="css/style_purple.css" title="style_purple" media="screen" />

<!--[if IE]><script type="text/javascript" src="js/excanvas.js"></script><![endif]--> <script type="text/javascript" src="js/jquery-1.4.2.js"></script>

<script type="text/javascript" src="js/jquery-ui-1.8.2.js"></script>

<script type="text/javascript" src="js/jquery.fancybox-1.3.2.js"></script>

<script type="text/javascript" src="js/jquery.validate.js" ></script>

<script type="text/javascript" src="js/jquery.wysiwyg.js" ></script>

<script type="text/javascript"

src="js/jquery.dataTables.js"></script>

<script type="text/javascript" src="js/jquery.flot.js"></script> <script type="text/javascript"

src="js/jquery.flot.stack.js"></script>

<script type="text/javascript" src="js/styleswitch.js"></script> <script type="text/javascript" src="js/custom.js"></script> </head>

<body>

<div id="wrapper"> <ul id="topbar">

<li><a class="button white fl" title="preview" href="index.php"><span class="icon_single preview"></span></a></li>

<li class="s_1"></li>

<li class="logo"><strong>LUL ALB@B</strong> LOGIN user</li> </ul>

<div id="content-login"> <div class="logo"></div>

<h2 class="header-login">Form Login </h2>

<form id="box-login" action="cek_login.php" method="post"><p> <label class="req"> username </label>

<br/>

<input type="text" name="username" value="" id="username"/> </p>

<label class="req"> password </label> <br/>

<input type="password" name="password" value="" id="password"/> </p>

<p class="fl">

<input type="checkbox" name="remember" value="1" id="remember"/> <label class="rem"> Remember me </label>

</p>

<p class="fr">

<input type="button" value="Error test" class="button black" id="error"/>

<input type="submit" value="Login" class="button themed" id="login"/>

</p>

<div class="clear"></div> </form>

<a class="forgot" href="#"> Forgot password? </a>

<span class="message error">Error Test <strong>Username</strong> and/or <strong>Password</strong> are wrong</span>

<span class="message information">hanya tekan

<strong>Login</strong> atau <strong>Error Test</strong></span> </div>

</div>

<div id="footer">

<p class="copy fl">Copyright 2010<strong> ULUL ALB@B </strong>LOGIN user. All rights reserved.</p>

<ul class="button language_button white fr"> <li class="icon_single language fl"></li> <li class="clear"></li>

</ul> </body> </html> }

Ketika tombol Login ditekan, maka sesuai dengan action form Login di atas, inputan user akan dikirim dengan metode POST, kemudian akan akan diperiksa dengan skrip di bawah ini.

<?php include "config/koneksi.php"; include "config/fungsi_anti_injeksi.php"; if(empty($_POST[username]) OR empty($_POST[password])) header('location:index.php?warning=1'); elseif(strlen($_POST[password])<4) header('location:index.php?warning=2'); elseif(!ctype_alnum($_POST[username]) OR !ctype_alnum($_POST[password])) header('location:index.php?warning=3'); else { $username=anti_injection($_POST[username]);

$cari_username=mysql_query("SELECT * FROM user WHERE kode_user='$username'");

$ketemu_username=mysql_num_rows($cari_username); if($ketemu_username>0)

$password=md5(anti_injection($_POST[password])); $verifikasi=mysql_query("SELECT * FROM user WHERE kode_user='$username' AND password_user='$password'");

$cocok=mysql_num_rows($verifikasi); if($cocok>0) { $r=mysql_fetch_array($verifikasi); if($r[blokir_user]=='N') { session_start(); $_SESSION[login_date] =date("d-m-Y"); $_SESSION[login_time] =date("H:i:s"); $_SESSION[kode_user] =$r[kode_user]; $_SESSION[nama_user] =$r[nama_user]; $_SESSION[password_user] =$r[password_user]; $_SESSION[level_user] =$r[level_user]; session_regenerate_id(); $id_session=session_id(); $_SESSION[session_user] =$id_session;

mysql_query("UPDATE user SET session_user='$id_session' WHERE kode_user='$r[kode_user]'"); header('location:user/media.php?module=home'); } else header('location:index.php?warning=4'); } else header('location:index.php?warning=5'); } else header('location:index.php?warning=6'); } ?>

inputan user tadi akan diperiksa dulu, apakah berupa huruf atau angka, inputan disaring lagi dengan fungsi anti_injeksi() yang penulis tambah. Fungsi ini mengandung fungsi-fungsi bawaan PHP, seperti mysql_real_escape_string(), stripslashes(), strip_tags() dan htmlspecialchars() yang berguna untuk menyaring setiap karakter atau tag membahayakan yang terkandung dalam inputan user.

Setelah lolos dari filter, barulah username yang dimasukkan oleh user tadi diperiksa apakah ada atau tidak di dalam database. Proses pemeriksaan ini sekaligus mengambil semua data user dari database, yang apabila proses login ini berhasil, semua data tersebut akan langsung didaftarkan pada session untuk memberikan hak akses pada user. Selain username dan password, proses login juga memeriksa status user di blokir

atau tidak, sebelum memberikan hak akses. Untuk lebih jelasnya dapat dilihat pada potongan script berikut ini:

Statement header ('location:user/media.php?module=home'); di dalam potongan script di atas menandakan apabila user berhasil melakukan proses Login, maka dia akan diarahkan pada halaman lain yang merupakan Halaman User.

4.2.2.2. Halaman User

Halaman User adalah halaman bagi user yang telah terdaftar dan telah berhasil melakukan proses Login. Halaman User ini digunakan oleh 3 kelompok user, yaitu Wali murid, Wali kelas, Kepala Sekolah. Perbedaan bagi kedua kelompok user itu ada pada menu yang ditampilkan. Untuk lebih jelas, perhatikan Gambar 4.7., Gambar 4.8. dan Gambar 4.9. berikut ini.

Gambar 4.8. Halaman User Wali Kelas

Gambar 4.9. Halaman User Kepala Sekolah

Pada Halaman User Wali Murid, menu yang ditampilkan hanyalah menu-menu standar untuk mendapatkan data Absensi, serta melihat Grafik kehadiran dan grafik

kedatangan sedangkan pada Halaman User Wali Kelas terdapat menu tambahan yaitu Grafik Kelas dan Grafik antar Kelas.khusus untuk Halaman User Kepala Sekolah terdapat menu tambahan berupa Grafik Tingkatan dan Grafik Angkatan

Menu Manajemen User adalah menu yang diperuntukkan bagi user Wali Murid untuk merubah informasi profil mereka. Informasi yang dimaksud melingkupi password, email serta notlp/hp, untuk username dan nama_lengkap tidak bisa dirubah, untuk User Internal menu Menejemen User merupakan menu untuk menambah user baru seperti pada Gambar 4.10. berikut ini.

Gambar 4.10. Menu Manajamen User Wali Murid

Sama seperti form Login pada Halaman Utama, form Manajemen User ini sangat terbuka dengan kemungkinan injeksi oleh user yang tidak bertanggung jawab. Karena itu semua fungsi filter inputan yang diimplementasikan pada form Login juga dilakukan di sini. Hanya saja bedanya pada form Manajemen User ini menu filter

ditambah lagi dengan pencocokan format inputan dengan format field pada database, dengan tujuan agar inputan user dapat disimpan dengan sukses ke dalam database.

Untuk mendukung kerapian file yang digunakan, terutama untuk Halaman User ini, maka penulis mengembangkan sistem sederhana yang memanfaatkan potongan script di bawah ini:

if ($_GET[siswa]=='mainmenu'){

if ($_SESSION[leveluser]=='admin'){

include "modul/mod_mainmenu/mainmenu.php"; }

}

Dengan statement GET yang ada di atas, maka setiap menu yang dipilih oleh user akan dibedakan berdasarkan module-nya. Jika module-nya sudah didapatkan, maka akan dicocokkan dengan daftar menu yang ada di dalam database. Kemudian setelah ketemu yang cocok dengan module tersebut, maka statement include akan dieksekusi. Hal ini berarti setiap script menu terletak di dalam directory “modul/mod_mainmenu/mainmenu.php” Dengan cara itu maka setiap script tertata rapi di dalam folder modul dan terpisah-pisah berdasarkan namanya. Hal ini juga memudahkan apabila ada penambahan menu di kemudian hari, karena hanya perlu menambahkan data module-nya di database menu_user dan meletakkan script menunya pada folder menu.

Penulis menggunakan cara seperti di atas pada Halaman Administrator juga. Dengan begitu, jadilah sebuah manajemen konten yang dinamis. Hal ini sangat menguntungkan untuk pengembangan selanjutnya.

4.2.2.3. Halaman Administrator

Halaman Administrator website diakses melalui back-end begitu juga yang SMS Akademik seperti yang terlihat pada Gambar 4.11 berikut.

Gambar 4.11 Back-end Administrator

Script yang digunakan untuk membuat form Login di atas dan untuk memeriksa dan menyaring inputan administrator sama persis dengan yang telah diimplementasikan pada Halaman User sebelumnya. Jika administrator berhasil melewati proses Login ini, maka dia akan diarahkan pada Halaman Administrator yang berfungsi sebagai sarana pengelolaan konten website terutama konten yang disajikan pada user yang terigistrasi. Hal itu ditunjukkan dengan menu-menu yang tersedia bagi administrator, seperti yang terlihat pada Gambar 4.12 berikut ini.

Gambar 4.12 Halaman Admin Website

Sama seperti Halaman User, pada Halaman Administrator ini juga terdapat lebih dari satu kelompok user yang bisa mengaksesnya, yaitu Administartor dan Editor. Administrator di sini adalah super administrator yang berhak penuh atas segala pengaturan konten website. Pada Halaman Administrator ini, administrator diberikan keleluasaan dalam navigasi halaman. Di bagian kana disediakan menu-menu untuk mengatur konten website, Manajemen Absensi, Manajemen Siswa, Manajemen User untuk mengelola user administrator, Manajemen Modul untuk mengelola menu di Halaman Administrator ini sendiri.

Dokumen terkait