4.2. Implementasi Proses
Pada bagian bab ini membahas mengenai implementasi bagian dari program atau potongan script program.
4.2.1. Implementasi Proses Login
Agar pengguna baik admin, dosen ataupun mahasiswa dapat mengakses menu-menu yang telah disediakan sesuai dengan hak aksesnya masing-masing,
oleh karena itu harus melakukan identifikasi data login user dengan memasukkan username dan password yang kemudian jika data tersebut benar maka data
pengguna akan disimpan di session. Script untuk form login dapat dilihat pada gambar 4.1.
Gambar 4.1 Script form login
Dalam animasi form login tersebut, akan dilakukan oleh ajax jQuery. Script javascript untuk login dapat dilihat pada gambar 4.2 :
Gambar 4.2 Javascript animasi login
Pada script gambar 4.2 menjelaskan bahwa pada tampilan form login menggunakan jQuery versi-1.4.2.min. Untuk menampilkan dan menutup form
login secara responsive menggunakan slideToggle. Dan dalam proses tersebut untuk melakukan proses login akan dilakukan
pada cek_login.php, script cek_login.php dapat dilihat pada gambar 4.3 :
Gambar 4.3 Script cek_login.php
Pada script gambar 4.3 menjelaskan : a.
Melakukan pengecekan apakah username kosong atau tidak, jike kosong akan muncul peringatan “username masih kosong” jika sudah terisi proses
selanjutnya melakukan pencarian data dengan username yang dimasukkan. b.
Lalu mencocokkan password dari username tersebut. c.
Apabila tidak sama dengan yang terdaftar dalam database maka akan terdapat peringatan “login gagal”.
d. Apabila username dan password cocok dan terdaftar dalam database maka
“login sukses”. e.
Dan setelah “login sukses” maka akan masuk kedalam halaman utama e- learning
.
4.2.2. Implementasi Proses Upload Materi
Untuk upload materi menggunakan form dengan jQuery yaitu menggunakan “jquery.form.js”. dengan javascript ini. Hasil dari file yang
diupload dapat update secara otomatis pada tabel yang ada dibawahnya. Tabel tersebut berisi judul materi, nama file dari materi yang diupload, tipe materi dan
ukuran materi. Dengan begitu pada proses upload materi ini membuat aplikasi e- learning
terlihat responsive. Javascript untuk menampilkan form dengan hasil yang responsive dapat
dilihat pada gambar 4.4.
Gambar 4.4 Javascript untuk form JQuery
Sedangkan script untuk menampilkan form upload materi dapat dilihat pada gambar 4.5.
Gambar 4.5 Script form upload materi
Form upload materi tersebut akan diproses pada file “upload_materi.php”,
script untuk proses ini dapat dilihat pada gambar 4.6.
Gambar 4.6 Script proses upload materi
Pada script gambar 4.6 menjelaskan tentang : a.
File yang diupload dicopy ke folder materi. b.
Atribut-atributnya seperti : nama file, type, dan size disimpan pada database
tepatnya pada tabel materi. c.
Setelah sukses menyimpan ke-database, atribut dari file tersebut dipanggil untuk ditampilkan.
4.2.3. Implementasi Proses Manajemen Kuliah
Pada proses manajemen data kuliah, ada proses insert, edit, delete dan view
. Proses delete pada manajemen kuliah ini juga bersifat responsive, karena setelah konfirmasi hapus telah disetujui, baris dari data kuliah yang ingin dihapus
otomatis terhapus. Script untuk proses ini dapat dilihat pada gambar 4.7.
Gambar 4.7 Script halaman manajemen kuliah
Dan untuk javascript pada proses manajemen kuliah dapat dilihat pada gambar 4.8.
Gambar 4.8 Javascript untuk halaman manajemen kuliah
Gambar 4.8 menjelaskan tentang : a.
Menampilkan halaman sesuai menu yang diinginkan. b.
Jika tombol hapus diKlik maka akan muncul peringatan “yakin data ini mau di delete?” jika sukses dihapus baris dengan id nim yang ingin
dihapus akan dihapus otomatis, tanpa me-refresh halaman keseluruhan.
4.3. Implementasi Antarmuka
Pada tahap ini akan dijabarkan tentang implementasi antarmuka dari aplikasi yang dibuat berdasarkan perancangan sistem yang telah dibahas pada bab
III. Sistem ini berfungsi untuk memberikan layanan untuk mahasiswa mulai dari mendownload materi, sampai proses pembelajaran selesai.
Pada sistem ini terdapat 4 empat halaman utama yaitu halaman yang ditujukan untuk administrator, halaman yang ditujukan untuk dosen dan halaman
yang ditujukan untuk mahasiswa, halaman forum. Halaman yang ditujukan untuk administrator terdiri dari :
a. Halaman login.
b. Halaman manajemen data mahasiswa.
c. Halaman manajemen data dosen.
d. Halaman manajemen data jurusan.
e. Halaman manajemen data mata kuliah.
f. Halaman manajemen data kuliah.
g. Halaman ubah password.
Halaman yang ditujukan untuk dosen terdiri dari : a.
Halaman selamat datang b.
Halaman profil dosen c.
Halaman kuliah d.
Halaman peserta perkuliahan e.
Halaman penilaian f.
Halaman penugasan
Halaman yang ditujukan untuk mahasiswa terdiri dari : a.
Halaman awal e-learning b.
Halaman utama e-learning c.
Halaman perkuliahan d.
Halaman Profil Halaman Forum terdiri dari :
a. Halaman Utama forum
b. Halaman Kategori
c. Halaman Topik dan reply
4.3.1. Implementasi Halaman Administrator
1 Halaman Login Administrator
Halaman login ini akan tampil ketika admin pertama kali membuka aplikasi direktori admin. Di halaman login admin memasukan username dan
password untuk verifikasi data, setelah itu halaman login administrator akan
memproses otentifikasinya. Berikut ini tampilan dari halaman login seperti pada gambar 4.9.
Gambar 4.9 Halaman login administrator