Form Tampilan Halaman Login Form Pendaftaran User Form Halaman User

4.4 Implementasi Aplikasi Web Device Controller

Pada sub bab implementasi aplikasi Web Device Controller menjelaskan form apa saja yang terlibat dalam aplikasi tersebut yang menampilkan beberapa aplikasi form yaitu :

4.4.1 Form Tampilan Halaman Login

Pada form tampilan utama didesain sedemikian rupa sehingga menjadi tampilan utama yang menarik pengguna. Pada halaman utama langsung disuguhkan pada halaman login. Sedangkan untuk pengunjung yang tidak mempunyai hak akses dalam login pada halaman utama disediakan halaman pendaftaran user, dimana pengunjung yang sudah terdaftar dapat melihat dan mencoba aplikasi web device controller ini. Tampilan tersebut dapat dilihat pada Gambar 4.1. Gambar 4.1 Form Halaman Login Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

4.4.2 Form Pendaftaran User

Form pendaftaran user adalah seperti pada Gambar 4.2 . Gambar 4.2 Form Pendaftaran User Pengunjung yang ingin menggunakan fasilitas yang ada didalam web device controller ini, terlebih dahulu harus mendaftarkan diri menjadi user resmi dalam sistem dengan masuk kedalam halaman form seperti pada gambar 4.2 dan melengkapi segala data sesuai dengan form yang telah disediakan, setelah seluruh data selesai dimasukkan dengan benar maka user dapat masuk atau ke halaman login dengan menggunakan data username dan password yang telah dimasukkan pada halaman daftar user tadi. Dalam form login user akan diminta untuk memasukkan username dan password sesuai dengan data yang dimasukkan pada Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. saat mendaftar, apabila benar maka member akan dibawa pada halaman user, apabila salah maka akan kembali pada halaman login itu kembali, Form login pada web device controller akan terlihat seperti pada gambar 4.3 Gambar 4.3 Form Halaman Login

4.4.3 Form Halaman User

Pada gambar 4.4 merupakan halaman user yang didalamnya terdapat menu inputan yang terdiri dari 4 buah device yaitu device 1-4 dan juga terdapat tabel- tabel yang terkait dengan aplikasi web device controller. Menu inputan tersebut terdiri dari 2 perintah yaitu ON dan OFF. Sedangkan tabel yang berada dihalaman user ini terdiri dari tabel yang menunjukkan status device terakhir, status engine controller terakhir dan untuk status device terakhir akan terlihat jika status engine Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. aktif dan inputan akan berhasil masuk. Setelah inputan masuk kedalam database maka akan ditampilkan di tabel halaman user ini. Gambar 4.4 Status Engine Aktif Pada Gambar 4.4 adalah status engine sedang aktif sehingga data atau inputan yang diberikan di tampilan web ini akan ditampilkan kembali kepada user yang sedang aktif. Dan jika status engine tidak aktif akan ditunjukkan oleh gambar 4.5 Gambar 4.5 Status Engine Non Aktif Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Pada gambar 4.5 inputan tidak akan bisa berhasil disimpan oleh database karena status engine sedang tidak aktif. dan web akan menampilkan pesan atau message box yang memberitahukan kalau status engine sedang tidak aktif. Dan untuk lebih lengkapnya akan ditunjukkan oleh gambar 4.6 Gambar 4.6 Pesan Engine Non Aktif Jika tampil pesan message box seperti diatas maka inputan yang telah dimasukkan tidak akan pernah disimpan oleh database dan tidak akan dibaca oleh engine serta tidak akan pernah di eksekusi oleh hardware yang telah dibuat. Dan langkah selanjutnya adalah klik tombol oke pada message box tersebut. Dan web akan mengarahkan kembali ke halaman user. Jika status engine tidak aktif lebih baik logout saja. Sebab, jika memasukkan inputan lagi maka inputan yang baru juga tetap tidak akan disimpan oleh database. Kalau memilih logout maka web akan membawa user ke halaman login lagi. Sebelum logout user atau admin bisa melakukan set waktu kapan device akan di matikan atau dipadamkan. Untuk hasil interface halaman set waktu akan ditunjukkan oleh gambar 4.7 dibawah. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Gambar 4.7 Set Waktu Off

4.5 Implementasi Aplikasi Engine Device Controller