BAB III PERANCANGAN SISTEM Pada bab ini akan dijelaskan perancangan aplikasi dimulai dengan kebutuhan fungsional sistem, desain arsitektur dari sistem, perancangan database, perancangan aplikasi web server, dan perancangan aplikasi mobile. 3.1. Gambaran Sistem Pada sistem yang dibuat ini terbagi menjadi dua yaitu aplikasi mobile dan aplikasi web server. Aplikasi mobile digunakan oleh pengguna bertipe dosen dan mahasiswa, sedangkan aplikasi web server digunakan oleh pengguna bertipe administrator. Aplikasi mobile dijalankan menggunakan smartphone Android, sedangkan aplikasi web server diakses dengan menggunakan Chrome web browser.
3.1.1
Aplikasi Mobile Dalam aplikasi mobile terdapat dua pengguna yaitu dosen dan mahasiswa. Pengguna
bertipe mahasiswa dapat memiliki hak sebagai asisten dosen yang diatur di dalam aplikasi web server. Semua pengguna dapat melihat semua materi yang ada. Pengguna bertipe dosen dan mahasiswa yang memiliki hak asisten dosen dapat membuat materi, perintah tugas, dan pengumuman yang berkaitan dengan kegiatan belajar mengajar. Pengguna bertipe mahasiswa hanya dapat melihat pengumuman dan tugas berdasarkan matakuliah yang diambil yang diambil oleh mahasiswa tersebut. Use case untuk dosen menggunakan aplikasi mobile dapat dilihat pada Gambar 3.1 dan use case untuk mahasiswa dapat dilihat pada Gambar 3.2a dan Gambar 3.2b.
Gambar 3.1 Use Case Dosen Aplikasi Mobile Penjelasannya adalah sebagai berikut: 1.
Melihat Semua Materi, Pengumuman dan Tugas Pengguna dapat melihat materi, pengumuman dan tugas di semua kategori matakuliah.
2.
Membuat dan Mengelola Materi, Surat Tugas, Pengumuman yang dibuat Pengguna dapat membuat materi, tugas, dan pengumuman di semua kategori matakuliah serta dapat mengubah isi maupun menghapus yang telah dibuat oleh pengguna.
3.
Melihat Mahasiswa yang telah Mengirim Tugas Pengguna dapat melihat daftar mahasiswa yang telah mengirimkan tugasnya.
Gambar 3.2a Use Case Mahasiswa dengan Hak Asisten Aplikasi Mobile Penjelasannya adalah sebagai berikut: 1.
Melihat Semua Materi Pengguna dapat melihat materi di semua kategori matakuliah.
2.
Mengirim Tugas berdasarkan Matakuliah yang Diambil Pengguna dapat mengirimkan tugas apabila perintah tugas bertipe submit atau mahasiswa diminta untuk mengumpulkan tugas tersebut.
3.
Membuat dan Mengelola Materi, Surat Tugas, Pengumuman yang dibuat Pengguna dapat membuat materi, tugas, dan pengumuman di semua kategori matakuliah serta dapat mengubah isi maupun menghapus yang telah dibuat oleh pengguna.
4.
Melihat Mahasiswa yang telah Mengirim Tugas Pengguna dapat melihat daftar mahasiswa yang telah mengirimkan tugasnya..
5.
Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang Diambil Pengguna hanya dapat melihat perintah tugas dan pengumuman berdasarkan matakuliah yang diambil oleh pengguna.
Gambar 3.2b Use Case Mahasiswa tanpa Hak Asisten Aplikasi Mobile Penjelasannya adalah sebagai berikut: 1.
Melihat Semua Materi Pengguna dapat melihat materi di semua kategori matakuliah.
2.
Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang diambil Pengguna hanya dapat melihat perintah tugas dan pengumuman berdasarkan matakuliah yang diambil oleh pengguna.
3.
Mengirim Tugas berdasarkan Matakuliah yang diambil Pengguna dapat mengirimkan tugas apabila perintah tugas bertipe submit atau mahasiswa diminta untuk mengumpulkan tugas tersebut.
Dari ketiga use case dalam aplikasi mobile terdapat hubungan dua arah antara dosen dengan mahasiswa ataupun asisten dengan mahasiswa. Seorang dosen ataupun seorang asisten dosen dapat membuat perintah tugas yang disertai batas waktu pengumpulan tugas. Mahasiswa yang menerima tugas ini dapat melakukan pengumpulan dengan menggunakan aplikasi mobile sebelum batas waktu yang telah ditentukan sebelumnya. Pengumpulan setiap tugas hanya dapat dilakukan sekali saja oleh seorang mahasiswa, oleh karena itu mahasiswa harus berhati-hati dalam hal ini agar tidak salah saat mengumpulkan tugasnya. Oleh karena aplikasi mobile lebih dikhususkan sebagai media informasi, maka pembuat perintah tugas hanya dapat melihat daftar mahasiswa yang telah mengumpulkan tugas.
Gaftar alir aplikasi mobile learning dapat dilihat pada Gambar 3.3. Penjelasan gaftar alir aplikasi mobile learning sebagai berikut: 1. Ketika aplikasi mobile dibuka maka aplikasi akan mengecek apakah session pengguna tersimpan atau tidak. Jika session pengguna tersimpan maka aplikasi akan menuju ke halaman utama, namun jika tidak tersimpan session pengguna maka aplikasi akan menampilkan form login dimana pengguna harus melakukan autentikasi diri. Jika autentikasi berhasil maka session baru akan dibuat dan aplikasi akan menuju halaman utama. 2. Pada halaman utama terdapat tiga bagian besar yaitu konten utama, drawer layout, dan quick button. Konten utama akan menampilkan halaman berdasarkan menu yang dipilih oleh pengguna di drawer layout. Saat pertama kali pengguna masuk halaman utama maka menu thread yang dipilih secara otomatis. Bagian kedua adalah drawer layout, dalam drawer layout ini terdapat lima menu yang bisa dipilih yaitu menu thread, menu task, menu news, menu my profile dan menu logout. Bagian ketiga adalah quick button, bagian ini terdapat tiga button yaitu create thread, create task, create news. 3. Saat pengguna memilih menu thread maka konten utama akan menampilkan daftar ulasan singkat materi dengan urutan teratas adalah materi yang terbaru dipublikasikan. Pengguna dapat mengetahui lebih detil isi materi tersebut dengan menyentuh pada bagian materi yang dikehendakinya. 4. Saat pengguna memilih menu task maka konten utama akan menampilkan daftar tugas dengan urutan teratas adalah tugas yang terbaru dipublikasikan. Pengguna dapat mengetahui lebih detil isi tugas tersebut dengan menyentuh pada bagian tugas yang dikehendakinya. 5. Saat pengguna memilih menu news maka konten utama akan menampilkan daftar pengumuman dengan urutan teratas adalah pengumuman yang terbaru dipublikasikan. 6. Saat pengguna memilih menu my profile maka konten utama akan menampilkan halaman yang berisi menu change password untuk mengganti password pengguna, menu my post untuk mengelola materi yang dibuat oleh pengguna, menu my news untuk mengelola pengumuman yang dibuat oleh pengguna, menu my task untuk mengelola perintah tugas yang dibuat oleh pengguna dan melihat siapa saja yang sudah
mengirimkan tugas tersebut, menu my draft untuk mengelola materi yang belum sempat dipublikasikan oleh pengguna. 7. Saat pengguna memilih quick button create thread maka aplikasi akan mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat materi baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke halaman form membuat materi baru. Jika tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses. Apabila pengguna belum menyelesaikan materi yang sedang dibuatnya maka aplikasi akan menyimpan langkah demi langkah yang telah dibuat pengguna sebelumnya dan dapat melanjutkannya dengan masuk ke menu my draft pada menu my profile di drawer layout. 8. Saat pengguna memilih quick button create task maka aplikasi akan mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat tugas baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke halaman form membuat tugas baru. Jika tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses. 9. Saat pengguna memilih quick button create news maka aplikasi akan mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat pengumuman baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke halaman form membuat pengumuman baru. Jika tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses. 10. Saat pengguna memilih menu logout maka aplikasi akan menghapus data session pengguna dan kemudian halaman menuju halaman login.
Simpan di database tabel draft
Tidak
Halaman Preview
Publikasikan Materi?
Tidak
Form Tambah Materi
Mulai
Materi selesai dibuat?
Ya
Ya Session tersimpan?
Ya
Halaman List Materi
User memilih button Create Materi
Ya
Ya
User memiliki akses? Simpan di database tabel thread
Tidak Tidak Tidak Halaman Login
Ya Tidak
User memilih button Create News
Ya
User memiliki akses?
Ya
Form Create Pengumuman
Ya
Form Tambah Tugas
Ya
Halaman Detil Materi
Tidak Tidak Verifikasi Login
Login Sukses?
User memilih button Create Task
Ya
Tidak
Tidak User memilih menu materi?
User memiliki akses?
Ya
User memilih salah satu materi? Tidak
Tidak
User memilih menu Pengumuman?
Ya
Halaman List Pengumuman Tidak
Tidak User memilih menu Tugas?
Ya
Halaman List Tugas
Ya
Halaman My Profile
User memilih salah satu Tugas?
Ya
Halaman Detil Materi
Tidak
User memilih menu My Profile
My Post
Ya
Tampilkan List My Materi
Tidak
Tidak User memilih My News
Sign Out? Tidak
User memilih button
Tidak
Ya
Tampilkan List My News
Kelola
Tidak
Tidak
Ya User memilih My Task
Selesai
Ya
Tampilkan List My Task
Lihat Pengirim Tugas?
Tidak Ya Tampilkan List My Draft
User memilih My Draft
Tampilkan List Pengirim Tugas
Ya
Gambar 3.3 Gaftar Alir Aplikasi Mobile Learning
3.1.2
Aplikasi Web Server Dalam aplikasi web server terdiri dari dua bagian yaitu aplikasi administrator dan
aplikasi e-learning. Aplikasi administrator lebih fokus menangani manajemen data - data yang akan mengalami perubahan secara berkala maupun dalam kondisi mendesak. Data data yang ditangani di aplikasi ini seperti data dosen, data mahasiswa, data matakuliah, data registrasi matakuliah, dan data kegiatan belajar mengajar. Use case untuk administrator menggunakan aplikasi web server dapat dilihat pada Gambar 3.4.
. Gambar 3.4 Use Case Administrator
Penjelasannya adalah sebagai berikut: 1.
Import Data Perkuliahan Administrator dapat mengimpor data - data yang berhubungan dengan perkuliahan agar memudahkan penambahan data dalam jumlah besar.
2.
Manajemen Data Perkuliahan Administrator dapat memanajemen data meliputi melihat data, memasukkan data baru, melakukan perubahan data, atau menghapus data.
Gaftar alir aplikasi administrator dapat dilihat pada gambar 3.5. Tidak
Mulai
Halaman Login
Verifikasi berhasil?
Verifikasi Admin
Ya
Menu Manajemen Pengajar
Ya
Pilih menu Pengajar?
Menu Utama
Tidak
Menu Manajemen Mahasiswa
Ya
Pilih menu Mahasiswa?
Tidak Tidak Menu Manajemen Mahasiswa
Ya
Pilih menu Matakuliah?
Tidak
Menu Manajemen Mahasiswa
Ya
Pilih menu RMK?
Tidak
Sign Out?
Ya
Selesai
Gambar 3.5 Gaftar Alir Aplikasi Administrator
Penjelasannya adalah sebagai berikut: 1.
Ketika aplikasi web server dibuka maka akan ditampilkan halaman sign in dimana administrator harus melakukan autentikasi diri. Jika autentikasi berhasil maka administrator dapat masuk ke menu aplikasi. Jika tidak tetap pada halaman sign in dengan pesan autentikasi tidak berhasil.
2.
Pada halaman menu utama terdapat empat menu utama yaitu pengajar untuk masuk pada manajemen data pengajar, mahasiswa untuk masuk pada manajemen data mahasiswa, matakuliah untuk masuk pada manajemen data matakuliah dan
RMK untuk masuk pada manajemen data registrasi matakuliah. Selain itu terdapat pilihan sign out untuk keluar dari aplikasi. 3.
Jika administrator memilih menu pengajar maka akan masuk pada halaman menu manajemen pengajar dimana admin dapat melakukan aksi menambah, melakukan perubahan, menghapus, atau melakukan pencarian data pengajar. Jika tidak maka tetap pada halaman menu utama.
4.
Jika administrator memilih menu mahasiswa maka akan masuk pada halaman menu manajemen mahasiswa dimana administrator dapat melakukan aksi menambah, melakukan perubahan, menghapus, atau melakukan pencarian data mahasiswa. Jika tidak maka tetap pada halaman menu utama.
5.
Jika administrator memilih menu matakuliah maka akan masuk pada halaman menu manajemen matakuliah dimana administrator dapat melakukan aksi menambah, melakukan perubahan, menghapus, atau melakukan pencarian data matakuliah. Jika tidak maka tetap pada halaman menu utama.
6.
Jika administrator memilih menu RMK maka akan masuk pada halaman menu manajemen registrasi matakuliah dimana admin dapat melakukan aksi import data registrasi matakuliah. Jika tidak maka tetap pada halaman menu utama.
7.
Jika administrator memilih untuk sign out maka akan keluar dari aplikasi. Jika tidak maka tetap pada halaman menu utama.
Aplikasi e-learning memiliki fungsi yang hampir sama dengan aplikasi mobile learning. Dengan adanya aplikasi e-learning akan membantu memudahkan proses belajar mengajar apabila tidak memungkinkan atau menjadi tidak praktis jika menggunakan aplikasi mobile. Use case untuk pengguna menggunakan aplikasi e-learning dapat dilihat pada Gambar 3.6 dan Gambar 3.7.
Gambar 3.6 Use Case Dosen Aplikasi Web Server
Penjelasannya adalah sebagai berikut: 1. Melihat Semua Materi, Pengumuman dan Tugas Pengguna dapat melihat materi, pengumuman dan tugas di semua kategori matakuliah. 2. Membuat dan Mengelola Materi, Surat Tugas, Pengumuman yang dibuat Pengguna dapat membuat materi, tugas, dan pengumuman di semua kategori matakuliah serta dapat mengubah isi maupun menghapus yang telah dibuat oleh pengguna. 3. Mengunduh Tugas yang Dikirimkan Mahasiswa Pengguna dapat mengunduh dokumen yang telah dikirimkan mahasiswa sebagai tanda telah melakukan perintah tugas yang dibuat oleh pengguna.
Gambar 3.7a Use Case Mahasiswa dengan Hak Asisten Aplikasi Web Server
Penjelasannya adalah sebagai berikut: 1. Melihat Semua Materi Pengguna dapat melihat materi di semua kategori matakuliah. 2. Mengirim Tugas berdasarkan Matakuliah yang Diambil Pengguna dapat mengirimkan tugas apabila perintah tugas bertipe submit atau mahasiswa diminta untuk mengumpulkan tugas tersebut. 3. Membuat dan Mengelola Materi, Surat Tugas, Pengumuman yang dibuat Pengguna dapat membuat materi, tugas, dan pengumuman di semua kategori matakuliah serta dapat mengubah isi maupun menghapus yang telah dibuat oleh pengguna. 4. Mengunduh Tugas yang Dikirimkan Mahasiswa Pengguna dapat mengunduh dokumen yang telah dikirimkan mahasiswa sebagai tanda telah melakukan perintah tugas yang dibuat oleh pengguna.
5. Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang Diambil Pengguna hanya dapat melihat perintah tugas dan pengumuman berdasarkan matakuliah yang diambil oleh pengguna.
Gambar 3.7b Use Case Mahasiswa tanpa Hak Asisten Aplikasi Web Server
Penjelasannya adalah sebagai berikut: 1. Melihat Semua Materi Pengguna dapat melihat materi di semua kategori matakuliah. 2. Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang diambil Pengguna hanya dapat melihat perintah tugas dan pengumuman berdasarkan matakuliah yang diambil oleh pengguna. 3. Mengirim Tugas berdasarkan Matakuliah yang diambil Pengguna dapat mengirimkan tugas apabila perintah tugas bertipe submit atau mahasiswa diminta untuk mengumpulkan tugas tersebut.
Gaftar alir aplikasi web e-learning dapat dilihat pada gambar 3.8.
Simpan di database tabel draft
Tidak
Halaman Preview
Publikasikan Materi?
Tidak
Form Tambah Materi
Mulai
Materi selesai dibuat?
Ya
Ya Session tersimpan?
Ya
Halaman List Materi
User memilih button Create Materi
Ya
Ya
User memiliki akses? Simpan di database tabel thread
Tidak Tidak
Tidak
Halaman Login
Ya Tidak
User memilih button Create News
Ya
User memiliki akses?
Ya
Form Create Pengumuman
Ya
Form Tambah Tugas
Ya
Halaman Detil Materi
Tidak Tidak Verifikasi Login
Login Sukses?
User memilih button Create Task
Ya
Tidak
Tidak User memilih menu materi?
User memiliki akses?
Ya
User memilih salah satu materi? Tidak
Tidak
User memilih menu Pengumuman?
Ya
Halaman List Pengumuman Tidak
Tidak User memilih menu Tugas?
Ya
Halaman List Tugas
Ya
Halaman My Profile
User memilih salah satu Tugas?
Ya
Halaman Detil Materi
Tidak
User memilih menu My Profile
My Post
Tampilkan List My Materi
Ya
Tidak
Tidak User memilih My News
Sign Out? Tidak
User memilih button
Tidak
Ya
Tampilkan List My News
Kelola
Tidak
Tidak
Ya User memilih My Task
Selesai
Ya
Tampilkan List My Task
Tidak Tampilkan List My Draft
User memilih My Draft
Ya
Lihat Pengirim Tugas?
Ya Tampilkan List Pengirim Tugas
Unduh File Tugas? Tidak
Gambar 3.8 Gaftar Alir Aplikasi Web E-learning
Ya
Unduh File
Penjelasan gaftar alir aplikasi e-learning sebagai berikut: 1. Ketika aplikasi mobile dibuka maka aplikasi akan mengecek apakah session pengguna tersimpan atau tidak. Jika session pengguna tersimpan maka aplikasi akan menuju ke halaman utama, namun jika tidak tersimpan session pengguna maka aplikasi akan menampilkan form login dimana pengguna harus melakukan autentikasi diri. Jika autentikasi berhasil maka session baru akan dibuat dan aplikasi akan menuju halaman utama. 2. Pada halaman utama terdapat tiga bagian besar yaitu konten utama, drawer layout, dan quick button. Konten utama akan menampilkan halaman berdasarkan menu yang dipilih oleh pengguna di drawer layout. Saat pertama kali pengguna masuk halaman utama maka menu thread yang dipilih secara otomatis. Bagian kedua adalah drawer layout, dalam drawer layout ini terdapat lima menu yang bisa dipilih yaitu menu thread, menu task, menu news, menu my profile dan menu logout. Bagian ketiga adalah quick button, bagian ini terdapat tiga button yaitu create thread, create task, create news. 3. Saat pengguna memilih menu thread maka konten utama akan menampilkan daftar ulasan singkat materi dengan urutan teratas adalah materi yang terbaru dipublikasikan. Pengguna dapat mengetahui lebih detil isi materi tersebut dengan menyentuh pada bagian materi yang dikehendakinya. 4. Saat pengguna memilih menu task maka konten utama akan menampilkan daftar tugas dengan urutan teratas adalah tugas yang terbaru dipublikasikan. Pengguna dapat mengetahui lebih detil isi tugas tersebut dengan menyentuh pada bagian tugas yang dikehendakinya. 5. Saat pengguna memilih menu news maka konten utama akan menampilkan daftar pengumuman dengan urutan teratas adalah pengumuman yang terbaru dipublikasikan. 6. Saat pengguna memilih menu my profile maka konten utama akan menampilkan halaman yang berisi menu change password untuk mengganti password pengguna, menu my post untuk mengelola materi yang dibuat oleh pengguna, menu my news untuk mengelola pengumuman yang dibuat oleh pengguna, menu my task untuk mengelola perintah tugas yang dibuat oleh pengguna dan melihat
siapa saja yang sudah mengirimkan tugas tersebut serta mengunduh file tugas tersebut, menu my draft untuk mengelola materi yang belum sempat dipublikasikan oleh pengguna. 7. Saat pengguna memilih quick button create thread maka aplikasi akan mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat materi baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke halaman form membuat materi baru. Jika tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses. Apabila pengguna belum menyelesaikan materi yang sedang dibuatnya maka aplikasi akan menyimpan langkah demi langkah yang telah dibuat pengguna sebelumnya dan dapat melanjutkannya dengan masuk ke menu my draft pada menu my profile di drawer layout. 8. Saat pengguna memilih quick button create task maka aplikasi akan mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat tugas baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke halaman form membuat tugas baru. Jika tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses. 9. Saat pengguna memilih quick button create news maka aplikasi akan mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat pengumuman baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke halaman form membuat pengumuman baru. Jika tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses. 10. Saat pengguna memilih menu logout maka aplikasi akan menghapus data session pengguna dan kemudian halaman menuju halaman login.
3.2. Desain Arsitektur Sistem Sistem yang dibangun terdiri dari aplikasi mobile sebagai client untuk menampilkan informasi seperti data produk dan aplikasi web server yang menyediakan informasi ke client. Arsitektur dari sistem dapat dilihat pada gambar 3.9. Komputer Server
Internet
JSON HTTP POST/GET
HTTP POST/GET
JSON
DATA
QUERY
Database Server
Aplikasi Mobile
Gambar 3.9 Bagan Arsitektur Sistem
Penjelasan dari arsitektur adalah sebagai berikut: 1.
Web Server Aplikasi ini bertugas mengatur data pengguna, materi, pengumuman, dan lain sebagainya dimana data tersebut disimpan dalam database server. Selain itu aplikasi ini bertugas juga sebagai server web service untuk menerima permintaan dari client melalui HTTP POST atau HTTP GET untuk diolah dan mengirimkan hasilnya kembali ke client dalam format JSON.
2.
Database Server Database server bertugas sebagai media penyimpanan data pengguna, materi, pengumuman, dan lain sebagainya.
3.
Aplikasi Mobile Aplikasi mobile adalah aplikasi client yang digunakan oleh pengguna untuk menampilkan informasi. Data
dan informasi mengenai
pengumuman dan lain sebagainya didapat dari web server.
materi, tugas,
3.3. Perancangan Database Database yang digunakan pada aplikasi web server adalah MySQL. Entity Relationship Diagram (ERD) pada database server ditunjukkan pada Gambar 3.10 dan Enhanced Entity Relationship Diagram ditunjukkan pada Gambar 3.11.
Gambar 3.10 Entity Relationship Diagram Database Server
Gambar 3.11 Enhanced Entity Relationship Diagram Database Server
Tabel pada database yaitu tabel Administrator, User, TypeUser, Category, Thread, ThreadContent, Draft, DraftContent, Task, TaskSubmit, News, KBM
dan RegMakul. Tabel Administrator digunakan untuk menyimpan informasi administrator. Tabel User digunakan untuk menyimpan informasi pengguna client. Tabel TypeUser digunakan untuk informasi macam - macam tipe pengguna client. Tabel Category digunakan untuk menyimpan informasi matakuliah. Tabel Thread digunakan
untuk menyimpan data materi utama dan berhubungan langsung dengan tabel ThreadContent yang menyimpan langkah - langkah dari materi itu sendiri. Tabel Draft
digunakan untuk menyimpan data materi yang belum dipublikasikan atau belum selesai dibuat dan berhubungan langsung dengan tabel DraftContent yang menyimpan langkah – langkah dari draft itu sendiri. Tabel Task digunakan untuk menyimpan informasi perintah tugas, sedangkan tabel TaskSubmit digunakan untuk menyimpan informasi submit tugas. Tabel News digunakan untuk menyimpan informasi pengumuman, tabel KBM digunakan untuk menyimpan informasi kegiatan belajar mengajar di kelas dan tabel RegMakul yang berisi informasi registrasi matakuliah mahasiswa. Attribute masing-masing
tabel dapat dilihat pada Tabel 3.1.
Tabel 3.1. Tabel Atribut Database Server TABLE
ATTRIBUTE
NAME
NAME
CONTENTS
TYPE
FORMAT
REQUIRED
PK/FK
FK REFERENCE TABLE
Administrat
idAdministrator
or
Administrator
int(10)
Yes
PK
number userid
Administrator id
varchar(45)
Yes
password
Password
varchar(45)
Yes
varchar(45)
Yes
Administrator
TypeUser
User
nameAdministrat
Nama
or
Administrator
idTypeUser
tipe user id
int(10)
Yes
nameTypeUser
nama tipe user
varchar(45)
Yes
idUser
id pengguna
int(10)
Yes
Email
email pengguna
varchar(75)
Yes
Password
password
varchar(45)
Yes
PK
PK
pengguna nameUser
nama pengguna
varchar(45)
Yes
noInduk
nomor Induk
varchar(45)
Yes
photoUser
foto pengguna
varchar(45)
Yes
activeUser
status keaktifan
enum(‘0’,’1’)
Yes
TypeUser_idTyp
tipe user id
int(10)
Yes
eUser
FK
TypeUser
Tabel 3.1. Tabel Atribut Database Server (lanjutan) TABLE
ATTRIBUTE
NAME
NAME
CONTENTS
TYPE
FORMAT
REQUIRED
PK/FK
FK REFERENCE TABLE
Category
ThreadCont
idCategory
kategori id
int(10)
Yes
kodeCategory
kode kategori
varchar(45)
Yes
nameCategory
nama kategori
varchar(45)
Yes
statusCategory
status kategori
varchar(45)
Yes
idThreadContent
konten thread id
int(10)
Yes
levelContent
level konten
tinyint(3)
Yes
titleContent
judul konten
varchar(255)
Yes
descContent
deskripsi konten
text
No
imageContent
gambar konten
varchar(255)
No
videoContent
video konten
varchar(255)
No
fileContent
file konten
varchar(255)
No
Thread_idThread
id Thread
int(10)
Yes
PK
PK
ent
FK
Thread
Tabel 3.1. Tabel Atribut Database Server (lanjutan) TABLE
ATTRIBUTE
NAME
NAME
CONTENTS
TYPE
FORMAT
REQUIRED
PK/FK
FK REFERENCE TABLE
Thread
idThread
thread id
int(10)
Yes
timeCreated
waktu thread
timestamp
yyyy-mm-dd hh:mm:ss
Yes
timestamp
yyyy-mm-dd hh:mm:ss
No
PK
dibuat lastEdited
waktu terakhir diubah
Category_idCate
id kategori
int(10)
Yes
FK
Category
id pembuat
int(10)
Yes
FK
User
Yes
PK
gory User_idUser
thread Draft
idThread
draft id
int(10)
timeCreated
waktu draft
timestamp
yyyy-mm-dd hh:mm:ss
Yes
timestamp
yyyy-mm-dd hh:mm:ss
No
dibuat lastEdited
waktu terakhir diubah
Category_idCate
id kategori
int(10)
Yes
FK
Category
id pembuat draft
int(10)
Yes
FK
User
gory User_idUser
Tabel 3.1. Tabel Atribut Database Server (lanjutan) TABLE
ATTRIBUTE
NAME
NAME
CONTENTS
TYPE
FORMAT
REQUIRED
PK/FK
FK REFERENCE TABLE
DraftConte
idThreadContent
konten draft id
int(10)
Yes
PK
levelContent
level konten
tinyint(3)
Yes
titleContent
judul konten
varchar(255)
Yes
descContent
deskripsi konten
text
No
imageContent
gambar konten
varchar(255)
No
videoContent
video konten
varchar(255)
No
fileContent
file konten
varchar(255)
No
Thread_idThread
id Thread
int(10)
Yes
FK
idNews
id berita
int(10)
Yes
PK
contentNews
deskripsi berita
text
Yes
titleNews
judul berita
varchar(255)
Yes
timeNews
waktu berita
timestamp
nt
News
yyyy-mm-dd hh:mm:ss
Draft
Yes
dibuat userNews
pembuat berita
int(10)
Yes
categoryNews
id kategori
int(10)
Yes
berita
FK
Category
Tabel 3.1. Tabel Atribut Database Server (lanjutan) TABLE
ATTRIBUTE
NAME
NAME
CONTENTS
TYPE
FORMAT
REQUIRED
PK/FK
FK REFERENCE TABLE
Task
idTask
id tugas
int(10)
Yes
titleTask
judul tugas
varchar(255)
Yes
contentTask
konten tugas
text
Yes
fileTask
sisipan file
varchar(255)
No
timeTask
waktu tugas
timestamp
yyyy-mm-dd hh:mm:ss
Yes
timestamp
yyyy-mm-dd hh:mm:ss
No
PK
dibuat deadlineTask
batas waktu pengumpulan
submitTask
tipe tugas
tinyint(3)
Yes
categoryTask
kategori tugas
int(10)
Yes
FK
Category
userTask
pembuat tugas
int(10)
Yes
FK
User
id pengumpulan
int(10)
Yes
PK
TaskSubmit idTaskSubmit
tugas fileTaskSubmit
file tugas
varchar(255)
Yes
noTaskSubmit
id tugas
int(10)
Yes
FK
Task
userTaskSubmit
pengumpul
int(10)
Yes
FK
User
tugas dateTaskSubmit
waktu dikumpulkan
timestamp
yyyy-mm-dd hh:mm:ss
Yes
Tabel 3.1. Tabel Atribut Database Server (lanjutan) TABLE
ATTRIBUTE
NAME
NAME
CONTENTS
TYPE
FORMAT
REQUIRED
PK/FK
FK REFERENCE TABLE
KBM
RegMakul
idKBM
id KBM
int(10)
Yes
PK
idCategoryKBM
kategori KBM
int(10)
Yes
FK
Category
tipePengajar
tipe pengajar
int(10)
Yes
FK
TypeUser
idUserKBM
id pengguna
int(10)
Yes
FK
User
idRegMakul
id registrasi
int(10)
Yes
PK
id kategori
int(10)
Yes
FK
Category
id pengguna
int(10)
Yes
FK
User
matakuliah categoryRegMak ul userRegMakul
3.4. Perancangan Aplikasi Web Server Aplikasi web server dirancang dengan menggunakan bahasa script PHP: Hypertext Preprocessor (PHP) versi 5.4.16 dengan framework Codeigniter versi 2.2.0 yang telah mendukung arsitektur Model-View-Controller (MVC). Arsitektur dari aplikasi web server bisa dilihat pada Gambar 3.12. PHP CODEIGNITER HTTP POST / GET
WEB SERVICE CONTROLLER REST CONTROLLER
JSON
MOBILE CLIENT ANDROID
CONTROLLER CI_CONTROLLER
Update Presentation Get Data
Update Data
VIEW HTML
MODEL CI_MODEL
QUERY
DATA
DATABASE MYSQL Gambar 3.12 Arsitektur Aplikasi Web Server
Penjelasan dari arsitektur aplikasi web server adalah sebagai berikut:
CI_Controller CI_Controller adalah class yang berfungsi sebagai controller untuk menangani
dan
menjembatani
model,
libraries,
helpers,
view,
dan
resources
lain.
CI_Controller akan memanggil model, atau resources lain sesuai permintaan,
mengolah data, dan menampilkannya melalui view. Terdapat juga controller khusus untuk menangani operasi web services ke client yaitu REST_Controller. Pada aplikasi ini terdapat 14 buah controller yaitu admin.php untuk menangani fungsi administrator, home.php untuk menangani fungsi manajemen data thread dan sekaligus menjadi halaman utama pada aplikasi web server, login.php untuk menangani fungsi halaman login, task.php untuk menangani fungsi manajemen data tugas, news.php untuk menangani fungsi manajemen data pengumuman, category.php
untuk
menangani
fungsi
manajemen
data
matakuliah,
profile.php untuk menangani fungsi manajemen data yang dimiliki pengguna, download.php untuk menangani fungsi yang berhubungan dengan unduh dokumen, upload.php untuk menangani fungsi yang berhubungan dengan unggah dokumen, lecture.php untuk menangani fungsi manajemen data dosen pada aplikasi administrator, student.php untuk menangani fungsi manajemen data mahasiswa pada aplikasi administrator, rmk.php untuk menangani manajemen data registrasi matakuliah, verifylogin.php untuk menangani fungsi login, dan services.php untuk menangani fungsi web services.
CI_Model CI_Model adalah class yang berfungsi sebagai model dimana berfungsi untuk
menangani operasi pada database, atau fungsi-fungsi pengolahan data. Terdapat tujuh buah model yang dibuat yaitu userModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan client user, adminModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan aplikasi administrator, categoryModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan matakuliah, threadModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan materi, taskModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan tugas, newsModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan pengumuman, dan
rmkModel.php untuk menangani operasi query pada database khusus data yang berhubungan dengan registrasi matakuliah.
View View berfungsi untuk menangani tampilan web pada aplikasi dimana dipanggil secara
spesifik oleh controller. File view mempunyai format PHP. 3.4.1. Konfigurasi Aplikasi Web Server Untuk melakukan konfigurasi pada aplikasi, codeigniter sudah menyediakan file-file konfigurasi yang terletak pada berkas config. Konfigurasi yang dilakukan antara lain:
Konfigurasi Database Untuk dapat mengakses dan melakukan operasi pada database, maka perlu dilakukan konfigurasi database pada codeigniter. Konfigurasi database ditangani oleh file database.php. Konfigurasi database dapat dilihat pada Kode 3.1. $db['default']['hostname'] $db['default']['username'] $db['default']['password'] $db['default']['database'] $db['default']['dbdriver']
= = = = =
'localhost'; 'root'; ''; mlearning'; 'mysql';
Kode 3.1 Konfigurasi Database
Pada kode tersebut dapat dilihat hostname dari database adalah localhost yang berarti database yang digunakan terletak pada mesin server lokal. Database yang digunakan bernama mlearning, dengan username root dan tanpa password. Tipe dari database dapat dilihat pada $db['default']['dbdriver'] yaitu menggunakan mysql.
Konfigurasi URL Konfigurasi URL dilakukan untuk menentukan base url dari aplikasi. Konfigurasi URL pada
codeigniter ditangani oleh file
Konfigurasinya dapat dilihat pada Kode 3.2.
config.php.
$config['base_url'] = 'http://moodlemobile.site40.net '; $config['index_page'] = 'index.php';
Kode 3.2 Konfigurasi URL
Konfigurasi Route Konfigurasi route dilakukan untuk menentukan controller standar dari aplikasi dan halaman yang diakses jika URL tidak valid. Konfigurasi route ditangani oleh file routes.php. Konfigurasinya dapat dilihat pada Kode 3.3. $route['default_controller'] = 'login'; $route['404_override'] = 'errors/error_404';
Kode 3.3 Konfigurasi Route
Pada kode tersebut dapat dilihat controller standar dari aplikasi adalah login yang berarti ketika pertama membuka aplikasi maka akan masuk ke controller login. Sedangkan $route['404_override'] = 'errors/error_404' menjelaskan halaman web yang akan ditampilkan jika alamat URL tidak valid.
Konfigurasi Format Web services Konfigurasi format web services dilakukan untuk menentukan format standar untuk web services. Konfigurasi format web services ditangani oleh file rest.php. Konfigurasinya dapat dilihat pada Kode 3.4. $config['rest_default_format'] = 'json';
Kode 3.4 Konfigurasi Format Web services
Pada Kode tersebut dapat dilihat format standar dari web service adalah JSON. Selain JSON juga dapat ditentukan format standar yang lain seperti XML atau CSV.
3.4.2. Autentikasi User Ketika aplikasi web server pertama kali dibuka maka controller pertama yang dijalankan adalah controller login dimana akan mengecek terlebih dahulu session bernama logged in sudah aktif atau belum. Jika session belum ada maka controller login akan menampilkan halaman sign in, namun jika session ada maka controller home akan dipanggil. Controller verifylogin berfungsi untuk menangani autentikasi user. Proses autentikasi user pada aplikasi dapat dilihat pada Kode 3.5. function check_database($password) { $session = $this->session->userdata('logged_in'); //Field validation succeeded. Validate against database $email = $this->input->post('email'); //query the database $result = $this->user_model->checkLogin($email, $password); if($result) { $sess_array = array(); $sess_array = array( 'id' => $result->idUser, 'nama' => $result->nameUser, 'tipe' => $result->TypeUser_idTypeUser ); $this->session->set_userdata('logged_in', $sess_array); return TRUE; } else { $this->form_validation->set_message('check_database', 'Invalid username or password'); return false; }}
Kode 3.5 Autentikasi User
Dari Kode 3.5 dapat dilihat bahwa aplikasi akan memanggil model user_model untuk menjalankan fungsi pemeriksaan data admin yang tersimpan pada model tersebut melalui
fungsi
$this->user_model->checkLogin().Jika
fungsi
tersebut
mengembalikan nilai true maka aplikasi akan menyimpan data user pada session dan masuk ke halaman home, tetapi jika tidak maka akan kembali ke halaman login_form dengan
pesan
error.
Fungsi
$this->user_model->checkLogin()
bertujuan
melakukan pemeriksaan data user pada database, kode nya dapat dilihat pada Kode 3.6. $this->db>select(array('idUser','photoUser','TypeUser_idTypeUser','name User','noInduk')); $this->db->where('email',$username); $this->db->where('password',$password); $query = $this->db->get('user',1); if($query->num_rows() > 0) { return $query->row(); } else return 0;
Kode 3.6 checkLogin()
Dari Kode 3.6 dapat dilihat bahwa fungsi checkLogin() melakukan query ke database dengan mencocokkan nama username dan password. Jika query memiliki data lebih dari 0 berarti data ditemukan dan menjadi nilai kembalian pada fungsi tersebut.
3.4.3. Halaman User Jika proses autentikasi berhasil, maka pengguna dapat memasuki halaman user. Halaman user ini dikelola oleh controller home, controller task, controller news, controller profile. Untuk melindungi agar semua controller tersebut hanya dapat diakses oleh user, maka setiap controller akan melakukan pemeriksaan pada session apakah pengguna berstatus log in atau tidak. Proses pemeriksaan tersebut dapat dilihat pada Kode 3.7.
function __construct() { parent::__construct(); date_default_timezone_set('Asia/Jakarta'); $session = $this->session->userdata('logged_in'); if(!$session) { redirect('login'); } }
Kode 3.7 Pemeriksaan Session Pada Kode 3.7 dapat dijelaskan bahwa aplikasi akan menjalankan fungsi __construct() terlebih dahulu dimana akan dilakukan pemeriksaan apakah $session
bernilai true atau tidak. Jika true maka halaman user dapat dimasuki, dan jika tidak maka akan menampilkan pesan untuk melakukan login terlebih dahulu. Nilai $session diperoleh dari session $this->session-> userdata('logged_in'). Pada halaman ini, pengguna dapat melihat, menambah, mengubah, menghapus, dan mencari data materi, tugas dan berita. Sebagai contoh pengguna akan melihat data pengumuman dan pengguna melakukan klik pada link berita maka controller news akan dijalankan dan memanggil fungsi userNews() untuk menampilkan list berita. Ketika pengguna memilih untuk menambahkan data baru, maka controller news akan memanggil fungsi create()yang akan menampilkan view user_news_create. Jika pengguna sudah memasukkan data dan melakukan validasi, maka controller news akan memanggil fungsi verifyCreate()yang akan melakukan proses menyimpan data ke database dengan bantuan model news_model->insertNews. Proses yang sama akan dikerjakan untuk proses melihat dan menambah materi atau tugas. Pada saat pengguna melakukan perubahan data semisal data tugas, maka controller task akan memanggil fungsi edit().
Fungsi tersebut akan memanggil view
user_task_edit. Setelah pengguna mengisi data dan melakukan validasi, maka
controller task akan memanggil fungsi verifyUpdate() yang akan melakukan perubahan data pada database dengan bantuan model task_model-> updateTask(). Proses yang sama akan dikerjakan untuk proses mengubah data materi dan berita.
3.4.4. Web Services Untuk menjalankan web service, aplikasi web server menggunakan controller khusus bernama REST_Controller dimana bekerja dengan menerapkan prinsip RESTful web service. Class untuk menjalankan web service dapat dilihat pada Kode 3.8 require(APPPATH.'libraries/REST_Controller.php'); class Service extends REST_Controller{ function thread_post() { $json = array(); $id = $this->input->post('idThread'); $data = $this->thread_model->getThreadContent($id); foreach($data as $row) { $json['thread'][]=$row; } if($data) { $this->response($json, 200); } else { $this->response(array('error' => 'Couldn\'t find any data!'), 404); } }
Kode 3.8 Class Service
Pada kode tersebut dapat dilihat nama class Service merupakan inheritance dari REST_Controller melalui penamaan class Service extends REST_Controller.
Untuk menjalankan fungsi REST_Controller perlu diinisialisasi library kelas tersebut melalui fungsi require(APPPATH.'libraries/REST_Controller.php'). Kelas ini mempunyai fungsi update_post(). Fungsi tersebut mempunyai sufiks _post yang berarti POST, jika dipanggil dengan metode lain maka akan menampilkan pesan error. Fungsi thread_post() berfungsi untuk mengambil data sebuah materi. Client akan mengirim permintaan ke web server dengan menyertakan id dari materi tersebut. Web
server akan mengambil data id materi tersebut dan menjadikan data tersebut sebagai parameter dari fungsi model thread_model->getThreadContent($id). Data hasil dari pengembalian dari fungsi model thread_model->getThreadContent($id) dikirimkan ke client dalam format JSON. Untuk mengakses fungsi web service ini maka URL-nya adalah http://moodlemobile.site40.net/services/thread. Fungsi ini akan menghasilkan JSON yang dapat dilihat pada Kode 3.9. { "thread": [ { "idThreadContent":"50", "levelContent":"0", "titleContent":"Make Arduino Thermometer With LM35", "descContent":"Hello, everyone !!! Today I'm going to show you how to make thermometer with Arduino and LM35 termperature sensor, builded on bread board and conected together with jumpers (bunch of cables :D).", "imageContent":"IMG_23_0.jpg", "videoContent":"VID_23_0.mp4", "fileContent":"", "Thread_idThread":"23" }, { "idThreadContent":"51", "levelContent":"1", "titleContent":"Gathering The Parts", "descContent":"This is the list the parts needed to make the thermometer.\r\n\r\nIf you dont have 10k pot you can use 50k like me !\r\n\r\n1x Arduino board\r\n1x Breadboard\r\n1x 16x2 LCD display\r\n1x LM35 sensor \r\n1x 10k potentiometer - for adjusting the brightness of the display\r\n19x Jumpers - to connect everything", "imageContent":"DRAFT_2_1.jpg", "videoContent":"","fileContent":"FILE_20_1.mp3", "Thread_idThread":"23"} } ] }
Kode 3.9 JSON Thread Data
3.5. Perancangan Aplikasi Mobile Aplikasi mobile dirancang dengan menggunakan Android SDK API 18 atau Android 4.3.
3.5.1
Konfigurasi Permission dan Feature Untuk dapat mengakses perangkat keras dan fitur yang dimiliki oleh perangkat
mobile Android, maka perlu dikonfigurasi terlebih ijin dan akses fitur atas aplikasi. Konfigurasi permission terletak pada AndroidManifest.xml yang dapat dilihat pada Kode 3.10 <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.CAMERA" />
Kode 3.10 Konfigurasi Permission Aplikasi Konfigurasi permission aplikasi antara lain:
Android.permission.INTERNET
Mengijinkan aplikasi untuk mengakses socket network.
Android.permission.ACCESS_NETWORK_STATE
Mengijinkan aplikasi untuk mengakses informasi jaringan perangkat Android.
Android.permission.WRITE_EXTERNAL_STORAGE
Mengijinkan aplikasi untuk menuliskan data pada media penyimpan luar.
Android.permission.CAMERA
Mengijinkan aplikasi untuk mengakses kamera yang ada di perangkat Android.
3.5.2
Activity Aplikasi mobile ditangani oleh berbagai activity, dimana activity tersebut akan
menangani aksi yang ditangani oleh pengguna, dan juga menangani User Interface. Activity yang terdapat dalam aplikasi ini adalah sebagai berikut:
LoginActivity
Activity ini berfungsi sebagai autentikasi pengguna sebelum masuk ke activity utama. Ketika Button btnLogin ditekan maka permintaan verifikasi dikirim ke web server. Kemudian, web server mengirimkan kembali respon dari verifikasi apakah sukses atau gagal beserta pesan yang ditampilkan melalui fungsi Toast. Jika berhasil maka data – data pengguna yang dibutuhkan di aplikasi ini akan disimpan di kelas MyAppHelper dan intent ke MainActivity dieksekusi.
MainActivity MainActivity merupakan activity utama dalam aplikasi ini. Semua fitur dalam
aplikasi ini haruslah melewati activity ini terlebih dahulu. Activity ini memiliki navigation drawer sehingga dapat dengan mudah pengguna memilih menu yang pengguna inginkan. Menu – menu yang terdapat pada navigation drawer ini yaitu menu Thread untuk menampilkan daftar materi pada konten utama pada activity, menu Task untuk menampilkan daftar tugas pada konten utama pada activity, menu News untuk menampilkan daftar pengumuman pada konten utama pada activity, menu My Profile untuk menampilkan menu-menu yang berhubungan dengan kepemilikan dari pengguna, dan menu Logout untuk melakukan autentikasi lagi dengan pengguna berbeda. Dalam activity ini juga terdapat tiga quick button yaitu button create thread yang akan menuju CreateThreadActivity, button create task yang akan menuju CreateTaskActivity,
button
create
news
yang
akan
menuju
CreateNewsActivity.
ThreadActivity
Activity ini berfungsi menampilkan isi lengkap dari materi yang dipilih oleh pengguna di MainActivity. Ketika gambar pada activity ini ditekan maka akan menuju FullScreenImageActivity. Terdapat tautan file yang jika ditekan maka proses mengunduh akan dilakukan. Terdapat tautan video juga yang jika ditekan akan menuju ViewVideoActivity.
FullScreenImageActivity
Activity ini berfungsi menampilkan sebuah gambar dalam bentuk full screen. Fitur memperbesar dan memperkecil ukuran gambar juga disertakan dalam activity ini.
ViewVideoActivity
Activity ini berfungsi menampilkan sebuah video.
TaskDetailActivity
Activity ini berfungsi menampilkan isi lengkap dari tugas yang dipilih oleh pengguna di MainActivity. Terdapat tautan file yang jika ditekan maka proses mengunduh akan dilakukan.
CreateThreadActivity
Activity ini berfungsi memilih category sebagai langkah awal dalam membuat materi baru.
IntroActivity
Activity ini berfungsi sebagai form pembuatan materi yang berisi pengisian judul, pengisian deskripsi, dan penambahan gambar.
OverviewActivity
Activity ini berfungsi menampilkan langkah - langkah yang telah dibuat di IntroActivity dalam bentuk gridview. Pengguna dapat memilih salah satu
langkah yang akan menuju EditStepActivity.
EditStepActivity
Activity ini berfungsi sebagai form ubah langkah materi
yang telah dibuat
sebelumnya.
CreateTaskActivity
Activity ini berfungsi sebagai form pembuatan perintah tugas baru.
EditTaskActivity
Activity ini berfungsi sebagai form ubah perintah tugas yang telah dibuat sebelumnya.
CreateNewsActivity
Activity ini berfungsi sebagai form pembuatan pengumuman baru.
EditNewsActivity
Activity ini berfungsi sebagai form ubah pengumuman yang telah dibuat sebelumnya.
MateriListActivity
Activity ini berfungsi menampilkan semua materi yang dibuat oleh pengguna.
TaskListActivity
Activity ini berfungsi menampilkan semua perintah tugas yang dibuat oleh pengguna.
NewsListActivity
Activity ini berfungsi menampilkan semua pengumuman yang dibuat oleh pengguna.
3.5.3
Web Services Untuk dapat mengakses web server dan menjalankan fungsi web server, aplikasi
mobile menggunakan API org.apache.http dan org.json. Pada proses web service, aplikasi mobile mengirimkan permintaan ke web server melalui protokol HTTP. Kemudian di web server fungsi akan dijalankan dan akan mengembalikan data dalam format JSON. Ada dua tahapan kerja yang dilakukan pada proses web service aplikasi mobile yaitu:
Melakukan koneksi HTTP Aplikasi mobile mengirimkan permintaan web server dan mendapatkan data melalui koneksi HTTP. Proses koneksinya dapat dilihat pada Kode 3.11.
static public public public
String response = null; final static int GET = 1; final static int POST = 2; String makeServiceCall(String url, int method) { return this.makeServiceCall(url, method, null);
} public String makeServiceCall(String url, int method,List
params) { try { DefaultHttpClient httpClient = new DefaultHttpClient(); HttpEntity httpEntity = null; HttpResponse httpResponse = null; if (method == POST) { HttpPost httpPost = new HttpPost(url); if (params != null) { httpPost.setEntity(new UrlEncodedFormEntity(params)); } httpResponse = httpClient.execute(httpPost); } else if (method == GET) { if (params != null) { String paramString = URLEncodedUtils.format(params, "utf-8"); url += "?" + paramString; } HttpGet httpGet = new HttpGet(url); httpResponse = httpClient.execute(httpGet); } httpEntity = httpResponse.getEntity(); response = EntityUtils.toString(httpEntity); } catch (UnsupportedEncodingException e) { e.printStackTrace(); } catch (ClientProtocolException e) { e.printStackTrace(); } catch (IOException e) { e.printStackTrace(); } return response; }
Kode 3.11 Kelas ServiceHandler
Proses yang dikerjakan: a. Menginisialisasi httppost
=
DefaultHttpClient new
HttpPost(url)
httpClient
dan
HttpPost
dimana aplikasi akan melakukan
koneksi dengan HTTP POST ke variabel url. Apabila melakukan koneksi dengan HTTP GET maka HttpGet httpGet = new HttpGet(url); b. Jika ada parameter pada metode POST maka httpPost.setEntity(new UrlEncodedFormEntity(params)), sedangkan pada metode GET maka
akan dilakukan penambahan pada variabel url. c. Melakukan
eksekusi
httpResponse
=
httpclient.execute(httppost). httpResponse berisi hasil respon dari
fungsi httppost yang dieksekusi. Kemudian httpResponse diambil entity nya dan disimpan di httpEntity. d. Melakukan
eksekusi
response
=
EntityUtils.toString(httpEntity). Kode ini berarti mengubah entity
ke bentuk String dan disimpan ke dalam variabel response.
Parsing JSON Pada tahap ini data JSON yang telah diterima dari web server akan diuraikan untuk kemudian dipakai sesuai dengan kebutuhan di activity tersebut. Contoh proses parsing JSON dapat dilihat pada kode 3.12. JSONObject jsonObj = new JSONObject(jsonStr); // Getting JSON Array node tasks = jsonObj.getJSONArray("task"); // looping through All Contacts for (int i = 0; i < tasks.length(); i++) { JSONObject c = tasks.getJSONObject(i); String id = c.getString("idTask"); String title = c.getString("titleTask"); String time = c.getString("timeTask"); String cat = c.getString("nameCategory"); String submit = c.getString("submitTask"); }
Kode 3.12 Parsing JSON
Proses yang dikerjakan: a. Membuat sebuah JSONObject dan mengisinya berdasarkan respon dari web server melalui fungsi JSONObject jsonObj = new JSONObject(response);
b. Melakukan penyaringan data produk dan dimasukkan pada JSONArray tasks melalui fungsi JSONArray products=jsonObj.getJSONArray("task").
c. Mengambil data JSONObject c = tasks.getJSONObject(i). Proses mengambil data ditentukan dengan format data yang akan disimpan semisal data String dengan cara c.getString("idTask").
