SISTEM PEMESANAN DAN PEMUTARAN LAGU MELALUI WEBSITE DALAM JARINGAN LOKAL Oleh Christophorus Dwicella Marino NIM: 622007016 Skripsi Untuk melengkapi salah satu syarat memperoleh Gelar Sarjana Teknik Program Studi Sistem Komputer Fakultas Teknik Elektro dan Komputer Universitas Kristen Satya Wacana Salatiga Januari 2015
SISTEM PEMESANAN DAN PEMUTARAN LAGU MELALUI WEBSITE DALAM JARINGAN LOKAL Oleh Christophorus Dwicella Marino NIM : 622007016 Skripsi ini telah diterima dan disahkan Untuk melengkapi salah satu syarat memperoleh Gelar Sarjana Teknik dalam Konsentrasi Sistem Komputer Progam Studi Sistem Komputer Fakultas Teknik Elektronika dan Komputer Universitas Kristen Satya Wacana Salatiga Disahkan oleh: Pembimbing I Pembimbing II Saptadi Nugroho, M.Sc. Darmawan Utomo, M.Eng. Tanggal : Tanggal :
PERNYATAAN BEBAS PLAGIAT Saya, yang bertanda tangan di bawah ini: NAMA : Christophorus Dwicella Marino NIM : 622007016 JUDUL SKRIPSI : Sistem Pemesanan dan Pemutaran Lagu Melalui Website dalam Jaringan Lokal Menyatakan bahwa skripsi tersebut di atas bebas plagiat. Apabila ternyata ditemukan unsur plagiat di dalam skripsi saya, maka saya bersedia mendapatkan sanksi apapun sesuai aturan yang berlaku. Salatiga, Januari 2013 Materai Rp, 6000,- Christophorus Dwicella Marino
INTISARI Pada skripsi ini dibuat sebuah sistem yang dapat menerima pemesanan dan pemutaran lagu dari user pada sebuah café atau restaurant dengan antarmuka web yang dapat diakses menggunakan jaringan lokal melalui laptop atau smartphone. Sistem ini memungkinkan setiap user dengan login yang berbeda memiliki playlist lagu yang berbeda antara satu user dengan user lainnya. Terdapat satu buah modul server dan beberapa modul client, dengan cara kerja sistem adalah modul Cubieboard2 berperan sebagai modul server yang berfungsi menjadi webserver dan penyimpanan database lagu, sedangkan Raspberry Pi berperan sebagai modul client yang berfungsi memutar lagu dan menyimpan playlist lagu yang telah dipilih oleh user. User memesan lagu melalui tampilan web yang kemudian diterima oleh webserver. Data url dari lagu yang dipesan akan dikirim ke client untuk diputar dan dimasukkan ke dalam playlist. Pada hasil pengujian keseluruhan sistem, pemesanan dan pemutaran lagu berhasil dilakukan melalui laptop dan smartphone dengan tingkat keberhasilan 100%. Pengujian ini dilakukan melalui user dengan login meja yang berbeda, serta lagu yang dipesan berjumlah lebih dari satu. Pada saat user memilih lagu, webpage kembali ke pemilihan kategori lagu dan pada saat perpindahan ke lagu berikutnya, lagu tetap diputar, tetapi webpage harus direfresh agar menampilkan lagu yang sedang diputar. Untuk lama buffering, terjadi buffering selama sekitar 11 detik. Buffering terjadi pada saat server pertama kali melakukan koneksi dengan client dan pada saat lagu distop selama sekitar 31 detik. Kata Kunci : Cubieboard2, Raspberry Pi, dan Pemutar Lagu
ABSTRACT This system can handle request and play songs from a user at café or restaurant through website interfaces that can be accessed using local network with laptop or smartphone. There is a server module and several client modules. As a server, Cubieboard2 functions as a web server and storage of the song database. As a client, Raspberry Pi functions as a media player and save the song playlist that has been choosen by the user. All user requests are sent to the web server, and then the web server sends the song url to the client to be played and to be listed on the playlist. On the result of testing, the entire system performs the request and plays songs using local network via laptop and smatphone in which the succes rate is 100%. This testing uses different users and different login at the same time with more than one song. When the users choose a song, the webpage back to the song category and when there is a shift from one song to another, the webpage has to be refreshed to show the status of the song that played. There is buffering about 11 seconds when the client first connects to the server and when the song stops for about 31 seconds. Keyword : Cubieboard2, Raspberry Pi, and Song Player
KATA PENGANTAR Puji dan syukur penulis ucapkan kepada Tuhan Yang Maha Esa atas segala rahmat yang diberikan kepada penulis sehingga dapat menyelesaikan perancangan serta penulisan skripsi sebagai syarat untuk menyelesaikan studi di Fakultas Teknik Elektronika dan Komputer Universitas Kristen Satya Wacana. Pada kesempatan ini penulis juga hendak mengucapkan terima kasih kepada berbagai pihak yang baik secara langsung maupun tidak telah membantu penulis dalam menyelesaikan skripsi ini : 1. Tuhan Yesus dan Bunda Maria terima kasih atas nafas kehidupan, penyertaan, cobaan, dan rejeki yang telah diberikan, sehingga penulis mampu untuk menyelesaikan studi demi meraih gelar ST. 2. Papi (almarhum) dan Mami, terima kasih atas semua tetes keringat dan darah kalian untuk mengkuliahkan anak anak mu demi menggapai masa depan. Keringat dan darah yang telah Papi dan Mami keluarkan akan Rino balas dengan gelar ST. Mbak Icha, Riki, Riko atas doa dan dukungannya selama ini. 3. Bapak Saptadi Nugroho, M.Sc dan Bapak Darmawan Utomo, M.Eng selaku pembimbing I dan pembimbing II, terima kasih untuk bimbingan dan masukannya selama pembuatan skripsi ini. 4. Keluarga besar Bapak Yohanes Susanto terima kasih atas doa dan dukungannya dan untuk Theresia Setianingtyas terima kasih atas dukungan dan doanya selama 6 tahun dan selalu menemani selama penulis membuat skripsi ini. 5. Pembimbing 3, Mas Wani 04, Mas DK 04, Mas Daniel 05, terima kasih banyak atas saran, masukan, dan bantuannya. Skripsi ini tidak bias selesai tanpa bantuan kalian. 6. Seluruh staff dosen, karyawan, dan laboran FTEK, Mbak Rista, Mbak Dita, Mbak Vera. 7. Keluarga besar FTEK angkatan 2007, kenangan kita tidak akan lekang dimakan waktu hingga ajal menjemput.
8. Penghuni lab skripsi yang tidak dapat penulis sebut satu persatu yang selalu menemani penulis di hari hari akhir perjuangan di FTEK. 9. Seluruh keluar besar mahasiswa FTEK atas dukungannya selama penulis berkuliah di FTEK. 10. Berbagai pihak yang tidak dapat dituliskan satu persatu, penulis mengucapkan terima kasih. Penulis menyadari bahwa skripsi ini masih jauh dari kata sempurna, oleh karena itu penulis sangat mengharapkan kritik maupun saran dari pembaca sekalian sehingga skripsi ini dapat berguna bagi kemajuan teknik elektronika. Salatiga, Januari 2014 Penulis
DAFTAR ISI INTISARI... i ABSTRACT... ii KATA PENGANTAR... iii DAFTAR ISI... v DAFTAR GAMBAR... vii DAFTAR TABEL... ix DAFTAR SINGKATAN... x BAB I PENDAHULUAN... 1 1.1. Tujuan... 1 1.2. Latar Belakang... 1 1.3. Spesifikasi Sistem... 2 1.4. Sistematika Penulisan... 3 BAB II DASAR TEORI... 4 2.1 Cubieboard2... 4 2.2 Raspberry Pi... 5 2.3 Web Server... 6 2.4 Apache Web Server... 7 2.5 HyperText Markup Language ( HTML )... 8 2.6 PHP: HyperText Prepocessor ( PHP )... 9 2.7 Transmission Control Protocol/Internet Protocol ( TCP/IP )... 10 BAB III PERANCANGAN SISTEM... 12 3.1 Gambaran Sistem... 12 3.2 Perancangan Perangkat Keras... 13 3.2.1 Perangkat Keras Modul Server... 13 3.2.2 Perangkat Keras Modul Client... 16 3.3 Perancangan Perangkat Lunak... 17 3.3.1 Perangkat Lunak Modul Server... 17 3.3.1.1 Perancangan Database... 17 3.3.1.2 Perancangan Tampilan Halaman Web... 22
BAB IV PENGUJIAN DAN ANALISIS... 26 4.1 Pengujian Web Server... 26 4.2 Pengujian Halaman Web... 27 4.2.1 Pengujian Halaman admin.php... 27 4.2.2 Pengujian Halaman meja.php... 29 4.3 Pengujian Pemutaran Lagu... 42 4.4 Pengujian Buffering Lagu... 43 BAB V KESIMPULAN DAN SARAN... 45 5.1 Kesimpulan... 45 5.2 Saran Pengembangan... 46 DAFTAR PUSTAKA... 47 LAMPIRAN... 48
DAFTAR GAMBAR Gambar 2.1. Cubieboard2... 4 Gambar 2.2. Raspberry Pi... 6 Gambar 2.3. Proses request dari pengguna dan response dari server... 7 Gambar 2.4. Contoh Program PHP di dalam script HTML... 10 Gambar 3.1. Gambaran keseluruhan sistem yang dirancang... 12 Gambar 3.2. Aplikasi Win32 Disk Imager... 14 Gambar 3.3. Pengaturan alamat IP dan jaringan internet... 15 Gambar 3.4. Login ke MYSQL server... 18 Gambar 3.5. ERD Database Music... 19 Gambar 3.6. Membuat Database... 19 Gambar 3.7. Berpindah ke database MUSICS... 20 Gambar 3.8. Melihat kolom dari setiap tabel... 21 Gambar 3.9. Melihat data tabel... 22 Gambar 3.10. Tampilan halaman login.php... 23 Gambar 3.11. Peringatan nomor meja atau password salah... 23 Gambar 3.12. Tampilan halaman meja.php... 24 Gambar 3.13. Tampilan halaman admin.php... 25 Gambar 4.1. Tampilan halaman web yang muncul pertama kali yang diakses melalui komputer... 26 Gambar 4.2. Halaman admin.php... 27 Gambar 4.3. Coding rand(int A, int B)... 29 Gambar 4.4. Tampilan halaman awal meja.php... 30 Gambar 4.5. Coding tag <form> dan <input>... 30 Gambar 4.6. Coding PHP pemilihan kategori... 31 Gambar 4.7. Coding koneksi database... 32 Gambar 4.8. Coding query dan penampilan daftar artis... 32 Gambar 4.9. Daftar artis berdasarkan kategori yang dipilih... 33 Gambar 4.10. Coding javascript untuk menampilkan daftar lagu... 34 Gambar 4.11. Coding PHP untuk menampilkan daftar lagu... 35
Gambar 4.12. Daftar lagu berdasarkan artis... 35 Gambar 4.13. Fungsi javascript penambahan lagu ke dalam playlist... 36 Gambar 4.14. Pemilihan lagu dan penambahan ke dalam playlist... 37 Gambar 4.15. Tag yang digunakan dalam pemilihan jenis pencarian... 38 Gambar 4.16. Coding javascript untuk pemilihan jenis pencarian... 38 Gambar 4.17. Coding XML untuk mengirim passingan inputan ke halaman pencarian... 39 Gambar 4.18. Coding pada halaman pencarian... 40 Gambar 4.19. Pencarian berdasarkan artis dan lagu... 41 Gambar 4.20. Sampel lima buah lagu dengan lagu assign key 0 sedang diputar... 42 Gambar 4.21. Pemberitahuan proses instalasi... 48 Gambar 4.22. Tampilan default halaman web saat pertama kali pemasangan web server... 49 Gambar 4.23. Proses inisialisasi keygen ssh... 50 Gambar 4.24. Koneksi ssh berhasil... 51 Gambar 4.25. Pengecekan mpd pada modul client... 53
DAFTAR TABEL Tabel 4.1. Hasil pengujian pengacakan password... 28 Tabel 4.2. Pemutaran jumlah lagu... 42 Tabel 4.3. Pengujian lama buffering... 43 Tabel 4.3. Pengujian lama buffering (lanjutan )... 44
DAFTAR SINGKATAN HTML PHP TCP/IP PC SoC CPU GPU RAM IC OS SD USB HTTP HTTPS SSL SSH MPD ERD XML HyperText Markup Language PHP: HyperText Prepocessor Transmission Control Protocol/Internet Protocol Personal Computer System on Chip Central Processing Unit Grapichs Processing Unit Random Access Memory Integrated Circuit Operating System Secure Digital Universal Serial Bus HyperText Transfer Protocol HyperText Transfer Protocol Secure Secure Socket Layer Secure Shell Music Player Daemon Entity Relationship Diagram Extended Markup Language