Futsal Usu 2018

SISTEM INFORMASI PENYEWAAN LAPANGAN FUTSAL
BERBASIS WEB
LAPORAN TUGAS AKHIR
BAYU SEGARA S
152406112
PROGRAM STUDI D3 TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SUMATERA UTARA
MEDAN
2018

BERBASIS WEB
LAPORAN TUGAS AKHIR
Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh gelar

Ahli Madya
BAYU SEGARA S
152406112
PROGRAM STUDI TEKNIK INFORMATIKA D3

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
MEDAN
2018

PERNYATAAN

BERBASIS WEB
LAPORAN TUGAS AKHIR
Saya menyatakan bahwa laporan tugas akhir ini adalah hasil karya sendiri, kecuali
beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.
Medan, Juli 2018
Bayu Segara S
152406112
i
SISTEM INFORMASI PENYEWAAN LAPANGAN FUTSAL BERBASIS
WEB
ABSTRAK
Futsal merupakan salah satu olahraga yang sangat digemari oleh seluruh kalangan,
dikarenakan olahraga ini sangat mudah dan tidak membutuhkan tempat yang besar dan
orang yang banyak untuk memainkannya. Tujuan perancangan sistem informasi
geografis pencarian lokasi penyewaan lapangan futsal ini adalah untuk memberikan
informasi kepada masyarakat tentang letak lapangan futsal di kota Medan. Selain itu
untuk menghemat waktu website ini juga membantu masyarakat untuk melakukan
pemesanan lapangan futsal langsung melalui website ini. Dengan banyaknya pilihan
lapangan futsal yang tersedia pada website ini, masyarakat dapat memilih lapangan
futsal yang sesuai dengan keinginannya masing-masing. Adapun metode penelitian
yang diguanakan dalam pembuatan website sistem informasi penyewaan lapangan
futsal berbasis web ini adalah dengan metode waterfall. Dalam pengembangannya
metode waterfall memiliki beberapa tahapan yang berurut yaitu: analisis
kebutuhan, desain sistem, pengkodean & pengujian, Penerapan Program, serta
pemeliharaan. Dalam pengembangannya website ini menggunakan bahasa
pemrograman PHP dan MySQL sebagai database. Dengan dibuatnya website ini
diharapkan dapat mempermudah masyarakat dalam mendapatkan informasi tentang
letak lapangan futsal dan mempermudah pengambilan keputusan untuk memilih
lapangan futsal yang sesuai dengan keinginan.
Kata Kunci : Sistem Informasi Geografis, Futsal, Kota Medan, PHP, MySQL
iii
INFORMATION SYSTEM WEB-BASED FUTSAL FIELD RENTAL
ABSTRACT
Futsal is one sport that is very popular by all circles, because the sport is very easy
and does not require a big place and a lot of people to play it. The purpose of
geographic information system design of this futsal field rental location is to provide
information to the public about the location of futsal field in Medan city. In addition
to saving time this website also helps people to make futsal field booking directly
through this website. With so many futsal field options available on this website,
people can choose futsal field that suits their wishes. The research method in making
website information system web-based futsal field rental is the method waterfall. In
the development of waterfall method has several sequential stages are: needs analysis,
system design, coding & testing, Application Program, and maintenance. In the
development of this website using PHP and MySQL programming language as a
database. With the creation of this website is expected to facilitate the public in
obtaining information about the location of futsal field and facilitate decision making
to choose futsal field in accordance with the wishes.
Keywords: Geographic Information System, Futsal, Medan City, PHP, MySQL
iv
PENGHARGAAN
Puji dan syukur penulis panjatkan kepada Tuhan Yang Maha Pemurah dan Maha
Penyayang dengan limpahan karunia-nya penulis dapat menyelesaikan penyusunan laporan tugas
akhir dengan judul Pencarian Lokasi Penyewaan Lapangan Futsal.
Terima kasih penulis sampaikan kepada Bapak Dr. Poltak Sihombing, M.Kom. selaku
pembimbing yang telah meluangkan waktu selama penyusunan laporan tugas akhir ini. Terima
kasih kepada Ibu Dra. Normalina Napitupulu M.Sc dan Bapak Drs. James Piter Marbun, M.Kom
selaku ketua program studi dan sekretaris program studi D3 Teknik Informatika FMIPA-USU
Medan, dekan dan wakil dekan FMIPA-USU, seluruh staf dan dosen program studi D3 Teknik
Informatika FMIPA-USU, pegawai dan rekan-rekan kuliah. Akhirnya tidak terlupakan kepada
Bapak, Ibu, dan keluarga yang selama ini memberikan bantuan dan dorongan yang diperlukan.
Semoga Tuhan Yang Maha Esa akan membalasnya.
Medan, Juli 2018
Bayu Segara S
152406112
v
DAFTAR ISI
PERNYATAAN ORISINALITAS i
PENGESAHAN LAPORAN TUGAS AKHIR ii
ABSTRAK iii
ABSTRACT iv
PENGHARGAAN v
DAFTAR ISI vi
DAFTAR TABEL viii
DAFTAR GAMBAR ix
DAFTAR LAMPIRAN x
BAB 1 PENDAHULUAN
1.1 Latar Belekang 1
1.2 Rumusan Masalah 2
1.3 Batasan Masalah 2
1.4 Tujuan 2
1.5 Manfaat 3
1.6 Sistematika Penulisan 3
BAB 2 LANDASAN TEORI

1.1 Sistem Informasi 4
1.1.1 Informasi 4
1.1.2 Sistem 4
1.1.3 Sistem Informasi 5
1.1.4 Manfaat Sistem Informasi 6
1.1.5 Pemakai Sistem Informasi 6
1.1.6 Komponen Sistem Informasi 6
2.2 Sistem Informasi Geografis 7
2.2.1 Karakteristik SIG 7
2.2.2 Kesalahan Pada Sistem Informasi Geografis 8
2.2.3 Sistem Informasi Geografis Berbasis Web 8
2.3 Peta 9
2.4 PHP 9
2.4.1 Kelebihan PHP 9
2.4.2 Penulisan PHP 10
2.4.2.1 Case Sensitife 10
2.4.2.2 Penulisan Baris Perintah 11
2.4.2.3 Karakter Spasi dan Tab 11
2.4.2.4 Variabel 12
2.5 CSS 13
2.6 HTML 13
2.7 World Wide Web (WWW) 14
2.8 Basis Data 14
2.9 MySQL 14
2.9.1 Menamai Elemen-Elemen Database 15
vi
2.9.2 Tipe Kolom 15
2.10 Google Maps API 16
2.11 Flowchart 16
BAB 3 PERANCANGAN SISTEM

3.1 Gambaran Umum Sistem Perancangan 20
3.2 Metode Penelitian 20
3.3 Flowchart 21
3.4 Diagram Konteks 25
3.5 Diagram Nol ( Overview Diagram) 25
3.6 Entity Relationship Diagram 26
3.7 Perancangan Database 26
3.8 Perancangan Antar Muka 29
3.8.1 Perancagan Antar Muka Menu Home 29
3.8.2 Perancagan Antar Muka Menu Data Lapangan 29
3.8.3 Perancagan Antar Muka Menu Konfirmasi Pembayaran 30
3.8.4 Perancagan Antar Muka Menu Tentang 31
3.8.5 Perancagan Antar Muka Menu Admin 32
BAB 4 IMPLEMENTASI SISTEM

4.1 Pengertian Implementasi 33
4.2 Komponen Sistem 32
4.2.1 Hardware 33
4.2.2 Software 34
4.2.3 Brainware 34
4.2.4 Jaringan Internet 34
4.3 Prosedur Penggunaan Program 35
4.4 Implementasi Program 35
4.4.1 Halaman Utama Website 35
4.4.2 Halaman Utama Data Lapangan 36
4.4.3 Halaman Utama Konfirmasi Pembayaran 38
4.4.4 Halaman Utama About 38
4.4.5 Halaman Utama Admin 39
BAB 5 KESIMPULAN DAN SARAN

5.1 Kesimpulan 41
5.2 Saran 41
DAFTAR PUSTAKA 42
LAMPIRAN 43
vii

DAFTAR TABEL
Nomor Judul Halaman

Tabel
2.1 Flowchart 17
3.1 Tabel Admin 27
3.2 Tabel Data Lapangan 27
3.3 Tabel Pembayaran 27
3.4 Tabel reservasi 28
viii
DAFTAR GAMBAR
Nomor Judul Halaman

Gambar
2.1 Komponen Sistem Informasi 6

3.1 Flowchart User 22
3.2 Flowchart Login Admin 23
3.3 Flowchart Halaman Admin 24
3.4 Diagram Konteks 25
3.5 Data Flow Diagram 25
3.6 Entity Relationship Diagram 26
3.7 Halaman Menu Utama 29
3.8 Halaman Data Lapangan 30
3.9 Halaman Konfirmasi Pembayaran 31
3.10 Halaman About 32
3.11 Halaman Home Admin 32
4.1 Halaman utama website 35
4.2 Halaman data lapangan 36
4.3 Halaman deskripsi lapangan 37
4.4 Halaman Reservasi Lapangan 37
4.5 Halaman Konfirmasi Pembayaran 38
4.6 Halaman About 39
4.7 Halaman Admin Lihat Data 40
4.8 Halaman Admin Tambah Data 40
ix

DAFTAR LAMPIRAN
Nomor Judul Halaman

Lampiran
1. Listing Program 44
2. Surat Keterangan Hasil Uji Program 99
3. Surat Keterangan Dosen 100
4. Kartu Bimbingan 102

BAB 1
PENDAHULUAN
1.1 Latar Belakang Masalah

Futsal adalah salah satu jenis permainan dengan menggunakan bola yang saat
ini sangat digandrungi di Indonesia. Permainan ini sendiri dimainkan oleh dua tim,
dimana masing-masing tim terdiri dari lima orang anggota. Tujuan dalam permainan
ini adalah memasukkan bola ke gawang lawan yang dilakukan dengan cara
memanipulasi bola dengan kaki, serta dengan catatan tim yang paling banyak
memasukkan bola ke gawang lawan adalah dinyatakan sebagai tim pemenang.
Dikarenakan sangat digandrunginya jenis olahraga ini, banyak sekali orang
yang membuat jasa penyewaan lapangan futsal. Akibatnya banyak pula masyarakat
yang membandingkan satu lapangan dengan lapangan yang lainnya. Untuk
mempermudah hal tersebut perlu suatu aplikasi yang mengumpulkan informasi-
informasi mengenai lapangan futsal yang ada di kota Medan
Untuk teknologi pemetaan pada sistem informasi ini menggunakan teknologi
yang sudah ada yaitu menggunakan Google Maps Api yang telah disediakan oleh
google. Pada dasarnya Google Maps memanfaatkan teknologi digital dan gambar yang
bisa digunakan untuk mengamati peta dunia yang telah tersimpan dalam basisdata
google, sehingga mempermudah untuk memonitoring. Terdapat beberapa kriteria yang
bisa ditampilkan secara visual yaitu secara map ataupun satelit, Semua fitu tersebut
telah disediakan oeh google. Dengan adanya sistem informasi geografis, ini
diharapkan mempermudah dalam memperoleh informasi mengenai lokasi penyewaan
lapangan futsal yang diinginkan serta mempermudah dalam pengolahan lapangan
futsal yang tersebar di kota Medan.
Pada dasarnya sistem pemetaan menggunakan Google Maps API ini sudah
umum dipakai oleh pengembang Web untuk membuat aplikasi-aplikasi yang berbasis
GIS contohnya saja jejaring sosial Foursquare. Berdasarkan dari pengamatan
tersebut, penulis ingin mengeksplorasi Google Maps API dengan studi kasus yang

2
berbeda tetapi pada prinsipnya sama-sama memanfaatkan grafik pemetaan yang

telah disediakan oleh Google.
1.2 Rumusan Masalah

Perumusan masalah pada penelitian akhir ini adalah bagaimana menghasilkan
sistem informasi pemetaan lapangan futsal yang ada di Medan dengan menggunakan
teknologi Google Maps API. Adapun permasalahan yang harus dihadapi adalah :
1. Bagaimana menyediakan lokasi lapangan futsal yang akurat kepada masyrakat.
2. Bagaimana membuat suatu sistem informasi geografis yang menarik dan mudah
dipahami.
1.3 Batasan Masalah

Adapun batasan masalah dalam pemetaan lokasi lapangan futsal kali ini adalah
1. Daerah yang menjadi objek dalam penelitian kali ini adalah kota Medan dan
sekitarnya.
2. Sistem dapat melakukan reservasi lapangan futsal.
3. Pada aplikasi ini terdapat dua pengguna, yaitu pengguna terdaftar dan pengguna
tidak terdaftar.
4. Base Map didapatkan dari Google Maps, sehingga memerlukan koneksi internet
untuk bisa menampilkan petanya.
1.4 Tujuan
Adapun tujuan dari pengembangan penelitian ini antara lain :
1. Untuk penyelesaian tugas akhir yang merupakan syarat kelulusan program D3
Teknik Informatika Universitas Sumatera Utara.
2. Merancang dan membuat sistem informasi pemetaan penyedia jasa lapangan
futsal dengan memanfaatkan Google Map API.
3. Menghubungkan sistem dengan Google Maps API untuk mendapatkan peta
digital online dan juga memberikan informasi lokasi penyewaan lapangan futsal.

3
1.5 Manfaat
Manfaat yang dapat diperoleh dari pembangunan Aplikasi web GIS pemetaan
penyebaran lapangan futsal di kota medan menggunakan google map api adalah :
1. Memahami secara lebih tentang pembangunan sistem GIS dengan menggunakan
pemograman web.
2. Memudahkan masyarakat untuk memperoleh informasi letak jasa penyewaan
lapangan futsal di kota medan.
3. Sebagai sarana promosi pihak penyedia lapangan untuk memperkenalkan lokasi
lapangan futsalnya kepada masyarakat.
1.6 Sistematika Penulisan
BAB 1 : PENDAHULUAN
Mengenai latar belakang pembuatan tugas akhir ini, identifikasi, batasan
dan rumusan masalah, tujuan, serta manfaat dari tugas akhir ini.
BAB 2 : LANDASAN TEORI
Landasan teori tentang masalah yang sedang dibahas pada tugas akhir ini.
Masalah yang penulis pilih adalah tentang aplikasi web gis pemetaan
jasa penyewaan lapangan futsal di kota Medan menggunakan Google Maps
API.
BAB 3 : PERANCANGAN SISTEM
Pada bab ini penulis menjelaskan tentang perancangan pembuatan aplikasi
web gis pemetaan ini.
BAB 4 : IMLEMENTASI SISTEM
Menyajikan tentang pengertian implementasi sistem, komponen utama
dalam implementasi sistem, prosedur penggunaan program, serta
implementasi program.
BAB 5 : KESIMPULAN DAN SARAN
Mengenai kesimpulan dari masalah yang dibahas dan saran untuk kemajuan.

BAB 2
LANDASAN TEORI
2.1 Sistem Informasi

2.1.1 Informasi
Informasi adalah suatu data yang telah diproses sehingga dapat mengurangi
ketidakjelasan tentang keadaan atau suatu kejadian. Sedangkan kata data itu sendiri
adalah fakta atau kenyataan yang sebenarnya. Informasi juga dapat didefinisikan
sebahai hasil dari pengolahan data dalam suatu bentuk yang lebih beguna dan lebih
berarti bagi penerimanya yang menggambarkan suatu kejadian-kejadian (event) yang
nyata (fact) yang digunakan untuk pengambilan keputusan. (Hartono, 1999, dalam
Agung Triadi 2017)
2.1.2 Sistem
Dengan berbagai pendekatan, beragam pula istilah sistem didefinisikan.
Menurut Lucas (1992), sistem adalah suatu pengorganisasian yang saling berinteraksi,
saling tergantung dan terintegrasi dalam kesatuan variable atau komponen. Sedangkan
menurut Jogiyanto, terdapat dua kelompok pendekatan, yaitu menekankan pada
prosedur dan komponen atau elemennya.
Pendekatan sistem yang lebih menekankan pada prosedur mendefinisikan
sistem adalah suatu jaringan kerja dari prosedur-prosedur yang saling berhubungan,
berkelompok dan bekerja sama untuk melakukan kegiatan pencapaian sasaran tertentu.
Makna dari prosedur sendiri, yaitu urutan yang tepat dari tahapan-tahapan instruksi
yang menerangkan apa (what) yang harus dikerjakan, siapa (who) yang mengerjakan,
kapan (when) dikerjakan dan bagaimana (how) mengerjakannya.
Sedangkan pendekatan yang menekankan pada komponen mendefiniskan
sistem sebagai berikut : Sistem adalah kumpulan elemen-elemen yang berinteraksi
untuk mencapai suatu tujuan tertentu.

5
Beberapa penulis yang mendefinisikan sistem yang menekankan pada elemen

atau komponennya diantaranya adalah Barry E. Cushing (1974:12), Gordon B.Davis
(1974:81) dan lain-lainnya (Jogiyanto, 1992:2)
Berkaitan dengan sistem informasi geografis, dimana implementasinya
memanfaatkan teknologi komputer, penulis mencoba membawa sistem yang
dimaksud adalah berbasis komputer. Dengan meminjam definisi dari Webster’s
Dictionary sebagaimana dikutip oleh Roger S. Pressman dalam bukunya Rekayasa
Perangkat Lunak, sistem berbasis komputer didefinisikan sebagai : Serangkaian atau
tatanan elemen-elemen yang diatur untuk mencapai tujuan yang ditentukan
sebelumnya melalui pemrosesan informasi (Hendi Indelarko et al. 2009:21-22)
2.1.3 Sistem Informasi

Definisi dari sistem informasi adalah sebagai kumpulan elemen yang saling
berhubungan satu sama lain yang membentuk satu kesatuan untuk mengintegrasikan
data, memproses dan menyimpan serta mendistribusikan informasi (Oetomo,
2006:11). Menurut Alter (dalam Kadir, 2003:11) sistem informasi adalah kombinasi
antara prosedur kerja, informasi, orang, dan teknologi informasi yang diorganisasikan
untuk mencapai tujuan dalam organisasi. Sedangkan Kristanto (2008:12) berpendapat
bahwa sistem informasi merupakan kumpulan dari perangkat keras dan perangkat
lunak komputer serta perangkat manusia yang akan mengolah data menggunakan
perangkat keras dan perangkat lunak tersebut (Deny Wiria Nugraha : 2012)
Sebagaimana yang dikutip Jogiyanto dalam bukunya Analisis dan Desain
Sistem Informasi, Robert A. Leitch dan K. Roscoe Davis mendefinisikan Sistem
Informasi sebagai berikut ”Sistem Informasi adalah suatu sistem di dalam suatu
organisasi yang mempertemukan kebutuhan pengolahan transaksi harian, mendukung
operasi, bersifat manajerial dan kegiatan strategi dari suatu organisasi dan
menyediakan pihak luar tertentu dengan laporan-laporan yang diperlukan” (Hendi
Inderlako et al. 2009:26)

6
2.1.4 Manfaat Sistem Informasi

Organisasi menggunakan sistem informasi untuk mengolah transaksi-
transaksi, mengurangi biaya dan menghasilkan pendapatan sebagai salah satu produk
dan pelayanan mereka.
Bank menggunakan sistem informasi untuk mengolah cek-cek nasabah dan
membuat laporan rekening koran dan transaksi nasabah.
Perusahaan menggunakan sistem informasi untuk mempertahankan persediaan
pada tingkat paling rendah agar konsisten dengan jenis barang yang tersedia.
2.1.5 Pemakai Sistem Informasi

Sebagai besar sistem informasi berlandaskan komputer terdapat di dalam suatu
organisasi dalam berbagai jenis. Anggota organisasi adalah pemakai informasi yang
dihasilkan sistem tersebut termasuk manager yang bertanggung atas pengalokasian
sumber daya untuk pengembangan dan pengoperasian perusahaan.
2.1.6 Komponen Sistem Informasi

Terdapat lima komponen dalam sistem informasi. Kelima komponen tersebut dapat
diklasifikasikan sebagai berikut :
1. Hardware dan software yang berfungsi sebagai mesin.
2. People dan procedures yang merupakan manusia dan tata cara menggunakan
mesin.
3. Data merupakan jembatan penghubung antara manusia dan mesin agar terjasi suatu
proses pengolahan data (Al-Bahra bin Ladjamudin : 2005).
Hardware Software DATA Procedure People
Mesin Manusia
Gambar 2.1 Komponen Sistem Informasi

7
2.2 Geographic Information System (GIS)

Geofrafis adalah ilmu yang mempelajari permukaan bumi dengan
menggunakan pendekatan keruangan, ekologi, dan kompleks wilayah. (Hendi
Inderlako et al, 2009)
Menurut Aronoff (1989) dalam Hendi Inderlako (2009) mendefinisikan SIG
sebagai sebuah sistem berbasiskan komputer yang digunakan untuk menyimpan dan
memanipulasi informasi-informasi geografis. SIG dirancang untuk mengumpulkan,
menyimpan, dan menganalisis objek-objek dan fenomena dimana lokasi geografis
merupakan karakteristik yang penting atau kritis untuk dianalisis.
Menurut Subaryono (2005) dalam Hendi Inderlako (2009) mendefenisikan
SIG sebagau suatu himpunan terpadu dari hardware, software, data, liveware (orang-
orang yang bertanggung jawab dalam mendesain, mengimplementasi, dan
menggunakan SIG).
Terakhir menurut ESRI (Environmental System Research Institute) dalam
Hendi Inderlako (2009) mendefenisikan SIG adalah kumpulan yang terorganisir dari
perangkat keras komputer, perangkat lunak, data geografis dan personil yang
dirancang secara efisien untuk memperoleh, menyimpan, mengupdate, memanipulasi,
menganalisis, menampilkan semua bentuk informasi yang berefernsi geografis.
2.2.1 Karakteristik SIG

Tidak berbeda dengan perangkat lunak lainnya, SIG juga memiliki karakteristik yang
membedakannya dengan software lainnya. Rahmad Husein (2006) mengemukakan
bahwa karakteristik SIG dapat dilihat sebagai berikut :
1. Merupakan suatu sistem hasil pengenbangan perangkat lunak untuk tujuan
pemetaan, sehingga fakta wilayah dapat disajikan dalan satu sistem berbasis
komputer.
2. Melibatkan ahli geografi, informatika dan komputer, serta aplikasi terkait.
3. Masalah dalam pengembangan meliputi : cakupan, kualitas dan standar data,
struktur, model dan visualisasi data, koordianasi kelembagaan dan etika,
pendidikan, expert system dan decision support system serta penerapannya.
4. Perbedaannya dengan sistem informasi lainnya : data dikaitkan dengan letak
geografis, dan terdiri dari data tekstual maupun grafik.

8
5. Mampu mengumpulkan, menyimpan mentransformasikan, menampilkan,

memanipulasi, memadukan dan menganalisis data spasial dari fenomena geografis
suatu wilayah
6. Mampu menyimpan data dasar yang dibutuhkan untuk penyelesaian suatu
masalah. Contoh : penyelesaian masalah perubahan iklim memerlukan informasi
dasar seperti curah hujan, suhu, kondisi awan. Data dasar biasanya dikumpulkan
secara berkala dalam jangka yang cukup panjang.
2.2.2 Sumber Kesalahan dalam SIG

Untuk mendapatkan hasil sistem informsi geografis yang baik dan informatif,
Maka perlu penecgahan terhadap kesalahan-kesalahan dalam pengolahan SIG,
setidaknya dapat diminimalisir kesalahn sekecil mungkin.
Sumber kesalahan dalam SIG menurut subaryono (2005) dalam Hendi
Inderlako et al (2009), yaitu :
1. Sumber kesalahan yang jelas (Obvious Sources of Errors) yaitu umur data, luasan
daerah sebagian atau lengkap, skala, kerapatan (destiny) pengamatan, relevansi,
format, aksesbilitas, biaya.
2. Kesalahan yang bersumber pada variasi ilmiah (Natural Variation) dan pada
sumber pengukuran aslinya yaitu ketelitian posisi, ketelitian isi kualitatif-
kuantitatif, variasi yang ada dalam data (data entry, observer bias, natural
variation).
3. Kesalahan yang terjadi karena proses yaitu kesalaham numeris komputer,
kekeliruan dalam analisis topologi, masalah klasifikasi, dan generalisasi
2.2.3 Sistem Informasi Geografis Berbasis Web

Web GIS adalah sistem informasi geografis yang didistribusikan di seluruh
lingkungan jaringan komputer untuk mengintegrasikan, menyebarkan, dan
mengkomunikasikan informasi geografis secara visual di World Wide Web melalui
internet (Riyanto, 2010, dalam Septya Maharani et al., 2017)

9
2.3 Peta
Erna Kharistiani dan Eko Aribowo (2013) mengemukakan bahwa peta adalah
gambaran sebagian atau seluruh muka bumi baik yang terletak di atas maupun di
bawah permukaan dan disajikan pada bidang datar pada skala dan proyeksi tertentu
(secara matematis).
Peta merupakan penyajian grafis dari permukaan bumi dalam skala tertentu
dan digambarkan pada bidang datar melalui sistem proyeksi peta dengan
menggunakan simbol-simbol tertentu sebagai perwakilan dari objek-objek spasial di
permukaan bumi (Hendi Inderlako et al., 2009 : 3-4)
2.4 PHP
PHP Hypertext Preprocessor (PHP) adalah bahasa pemrograman yang
memungkinkan pengembang web untuk membuat konten dinamis yang berinteraksi
dengan basis data. PHP pada dasarnya digunakan untuk mengembangkan aplikasi
perangkat lunak berbasis web.
PHP adalah bahasa pemrograman yang bisa disisipkan ke dalam script HTML
dan berjalan di sisi server, biasanya dipakai untuk membuat website agar lebih
dinamis. Selain itu menggunakan bahasa PHP kita bisa terhubung dengan database
dan banyak lagi kegunaanya. PHP merupakan server-side scripting language, seperti
ASP Skrip PHP dieksekusi di server, PHP mendukung banyak database (MySQL,
Informix, Oracle, Sybase, Solid, PostgreSQL, Generic ODBC, dll), PHP merupakan
perangkat lunak open source.
2.4.1 Kelebihan PHP

Beberapa kelebihan PHP dari bahasa pemrograman web, antara lain:
1 Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan
sebuah kompilasi dalam penggunaannya.
2 Web Server yang mendukung PHP dapat ditemukan di mana - mana dari mulai
apache, IIS, Lighttpd, hingga Xitami dengan konfigurasi yang relatif mudah.
3 Dalam sisi pengembangan lebih mudah, karena banyaknya milis - milis dan
developer yang siap membantu dalam pengembangan.

10
4 Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah karena
memiliki referensi yang banyak.
5 PHP adalah bahasa open source yang dapat digunakan di berbagai mesin (Linux,
Unix, Macintosh, Windows) dan dapat dijalankan secara runtime melalui console
serta juga dapat menjalankan perintah-perintah system.
2.4.2 Penulisan PHP

Seperti bahasa pemograman lainnya, PHP juga memiliki aturan penulisan
seperti case sensitifity (perbedaan antara huruf besar dan kecil), cara
mengakhiri sebuah baris perintah, dan pengaruh penggunakan spasi dalam membuat
kode program PHP.
2.4.2.1 Case Sensitivity (Perbedaan Huruf Besar Dan Kecil)

PHP tidak membedakan huruf besar dan kecil (case insensitive) untuk
penamaan fungsi (function), nama class, maupun keyword bawaan PHP seperti echo,
while, dan class. Ketiga baris berikut akan dianggap sama dalam PHP:
<?php
Echo “Hello World”;
ECHO “Hello World”;
EcHo “Hello World”;
?>
Akan tetapi, PHP membedakan huruf besar dan huruf kecil (case sensitive) untuk
penamaan variabel, sehingga $nama, $Nama dan $NAMA akan dianggap sebagai 3
variabel yang berbeda. Sering kali error terjadi dikarenakan salah menuliskan nama
variabel, yang seharusnya menggunakan huruf kecil, ditulis dengan huruf besar.
<?php
$bayu="Bayu";
echo $Bayu; // Notice: Undefined variable: Bayu
?>
Untuk mengatasi perbedaan ini, disarankan menggunakan huruf kecil untuk seluruh
kode PHP, termasuk variabel, fungsi maupun class. Jika membutuhkan nama variabel
yang terdiri dari 2 kata, karakter spasi bisa digantikan dengan underscore (_)

11
2.4.2.2 Penulisan Baris Perintah

Statement (baris perintah) di dalam PHP adalah kumpulan perintah PHP yang
menginstruksikan PHP untuk melakukan sesuatu. Baris perintah ini bisa terdiri dari
satu baris singkat (seperti perintah echo untuk menampilakan text di layar) atau bisa
sesuatu yang lebih rumit dan terdiri dari beberapa baris, seperti kondisi if, atau kode
perulangan (loop). Berikut adalah contoh beberapa baris perintah dalam PHP:
<?php
$txt = "Hello world!";
$x = 5;
$y = 10.5;
echo $txt;
echo "<br>";
echo $x;
echo "<br>";
echo $y;
?>
Terlihat dari beberapa contoh baris perintah diatas, PHP menggunakan tanda
semicolon (titik koma) “;” sebagai tanda akhir baris perintah.
Kumpulan baris perintah yang menggunakan tanda kurung kurawal seperti
kodisi IF atau perulangan (loop) tidak membutuhkan tanda titik koma setelah kurung
penutup.
<?php
if (true) {
echo "Perintah dijalankan"; // tanda titik koma harus
ditulis
} // tidak diperlukan tanda titik koma setelah tanda kurung
kurawal
?>
2.4.2.3 Karakter Spasi dan Tab

Secara umum, karakter spasi dan tab diabaikan di dalam eksekusi program
PHP. Anda boleh memecah sebuah statement menjadi beberapa baris, atau

12
menyatukan beberapa statement dalam sebuah baris yang panjang. Seperti contoh
berikut:
<?php
echo "Ini kalimat pertama"; echo "Ini kalimat kedua";
$nama="bayu";
?>
Baris perintah itu sama artinya dengan
<?php
echo "Ini kalimat pertama";
echo "Ini kalimat kedua";
$nama = "bayu";
?>
Walaupun contoh pertama lebih menghemat tempat, namun saya lebih menyarankan
contoh kedua, dimana kita mengusahakan agar setiap statement berada pada satu baris
saja, dan menambahkan beberapa spasi di awal untuk memudahkan membaca kode
program.
2.4.2.4 Variabel
Variabel adalah kontainer yang dipakai secara temporer menyimpan nilai-nilai
(Sianipar, 2015). Nilai-nilai ini dapat berupa teks, angka, atau data yang lebih
kompleks. PHP mempunyai delapan jenis variabel, yaitu empat tipe skalar (TRUE atau
FALSE, integer, floating point(desimal), dan string), dua tak-skalar (array dan objek),
ditambah dengan resource (yang anda lihat ketika berinteraksi dengan database), dan
NULL (tipe data yang tidak memiliki nilai).
Adapun tipe data yang digunakan, semua variabel di dalam PHP mengikuti
beberapa aturan sintaks berikut:
1. Nama variabel harus diawali dengan tanda dollar ($), misalnya, $nama.
2. Nama variabel dapat memuat gabungan dari string, angka, dan karakter garis
bawah (_), misalnya, $nilai_ku1.
3. Karakter pertama setelah tanda dollar harus berupa huruf atau garis bawah (tidak
bleh berupa angka).

13
4. Nama variabel di dalam PHP bersifat case-sensitive. Ini aturan yang sangat
penting. Ini berarti bahwa $nama dan $Nama adalah dua variabel yang berbeda.
2.5 CSS (Cascading Style Sheets)

Cascading Style Sheet (CSS) merupakan aturan untuk mengatur beberapa
komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan
merupakan bahasa pemograman. CSS dapat mengendalikan ukuran gambar, warna
bagian tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink,
warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas,
bawah, dan parameter lainnya. CSS adalah bahasa style sheet yang digunakan untuk
mengatur tampilan dokumen.
2.6 HTML
HTML adalah kependekan dari (HyperText Markup Language), merupakan
sebuah bahasa scripting yang berguna untuk menulis halaman web. Pada halaman
web, HTML dijadikan sebagai bahasa script dasar yang berjalan bersama berbagai
bahasa scripting pemrograman lainnya.
Semua tag-tag HTML bersifat dinamis, artinya kode HTML tidak dapat
dijadikan sebagai file Executable program. Hal ini disebabkan HTML hanyalah
sebuah bahasa scripting yang dapat berjalan apabila dijalankan didalam browser.
Browser-browser yang mendukung HTML antara lain adalah Internet Exproler,
Opera, Mozila, Chrome, dan lain-lain. Jadi pada saat ingin membuka halaman yang
berasal dari HTML anda dapat melihat bentuk pengkodeannya dengan cara mengklik
menu View  Source, Maka disana akan ditampilkan semua tag beserta isi dari
halaman web tersebut.
Semua bahasa scripting yang berjalan dibawah web dapat didukung oleh
HTML, biasanya bahasa-bahasa tersebut melakukan Embeded Script pada tag-tag
HTML.
Karena HTML hanyalah merupakan sebuah kode scripting dan bukan
merupakan program kompiler maka anda dapat menuliskan semua kode-kode
program dengan menggunakan editor yang anda sukai, adapun editor yang dapat
digunakan adalah Macromrdia Dreamweaver, Front Page, Home Site atau anda juga

14
dapat menggunakan NotePad sebagai editor standart bawaan windows. Jika anda
menggunakan Linux sebagai sistem operasinya anda dapat menggunakan mc edit, joe,
vi sebagai editornya ataupun Quanta pada GUI nya.
2.7 World Wide Web (WWW)

Internet adalah sebuah solusi jaringan yang daoat menghubungkan beberapa
jaringan lokal yang ada pada suatu daerah, kota, atau bahkan pada sebuah negara.
Dengan adanya internet kita dapat menghubungkan beberapa jaringan local pada
setiap tempat. Tidak hanya itu juga dengan adanya fasilitas internet setiap orang dapat
melakukan kegiatan apa saja seperti mengirim email, mencari data, bermain game,
akses bank, atau bahkan melakukan pembelanjaan pada toko online antar negara.
Untuk dapat menghubungkan beberapa komputer sehingga menjadi sebuah
kelompok jaringan, kita membutuhkan suatu media penghubung yang bernama
TCP/IP (Transmission Control Protocol / Internet Protocol), yaitu sebuah protocol
yang mengidentifikasi sebuah komputer yang terhubung dalam jaringan. TCP/IP
memiliki teknik mengidentifikasi dengan menggunakan penomoran yang dinamakan
nomor IP /IP address. Dengan menggunakan nomor ini sebuah komputer dapat
terhubung dengan komputer lain dalam sebuah jaringan atau dalam jaringan global
yang disebut internet.
2.8 Basis Data

Basis data merupakan kumpulan dari data yang saling berhubungan satu dengan yang
lainnya, tersimpan diperangkat keras komputer dan digunakan perangkat lunak untuk
memanipulasinya. Penerapan basis data (database) dalam sistem informasi disebut
juga dengan database system. (Jogiyanto, 2005, dalam Eko Aribowo dan Erna, 2013)
2.9 MySQL
2.9.1 Menamai Elemen-Elemen Database
Ketika menamai database dan tabel, diperlukan nama (atau secara formal
dikenal dengan pengenal) yang jelas, berarti, dan mudah dikenali. Selain itu, pengenal
1. Harus memuat huruf, angka, dan garis bawah

15
2. Harus tidak sama dengan kata kunci yang ada (seperti nama fungsi atau
terminologi pada SQL)
3. Berwatak case-sensitive
4. Tidak lebih dari 64 karakter
5. Harus unik
Aturan terakhir tersebut berarti bahwa sebuah tabel tidak bisa memiliki dua
kolom dengan nama sama dan sebuah database tidak bisa memiliki dua tabel dengan
nama sama. Anda bisa menggunakan nama kolom sama pada dua tabel yang berbeda
di dalam database yang sama.
2.9.2 Tipe Kolom

Setelah mengidentifikasi semua tabel dan kolom yang diperlukan oleh
database, selanjutnya perlu menentukan tipe data setiap kolom. Ketika menciptakan
sebuah tabel, MySQL mensyaratkan bahwa perlu secara eksplisit menyatakan jenis
informasi yang akan disimpan pada setiap kolom. Ada tiga tipe primer, yang ada pada
setiap aplikasi database:
1. Text
2. Number
3. Date and Time
Didalam tiap tipe data primer tersebut, ada sejumlah varian yang dapat anda
gunakan. Dengan memilih tipe data pada kolom secara benar, tidak hanya mendiktasi
informasi apa saja yang dapat disimpan tetapi bagaimana juga tipe data ini dapat
mempengaruhi kinerja dari database.
2.10 Google Maps API

Google Maps API adalah API yang paling populer di internet. Pencatatan yang
dilakukan pada bulan Mei tahun 2010 ini menyatakan bahwa 43% mashup (aplikasi
dan situs website yang menggabungkan dua atau lebih sumber data) menggunakan
Google Maps API. Beberapa tujuan dari penggunaan Google Maps API adalah untuk
melihat lokasi, mencari alamat, mendapatkan petunjuk mengemudi dan lain sebaginya.
Hampir semua hal yang berhubungan dengan peta dapat memanfaatkan Google Maps.
(Svennerberg, 2011, Septya Maharani et al., 2017)

16
Dalam pembutan program Google Map API menggunakan urutan sebagai

berikut:
1 Memasukkan Maps API JavaScript ke dalam HTML kita.
2 Membuat element div dengan nama map_canvas untuk menampilkan peta.
3 Membuat beberapa objek literal untuk menyimpan property-properti pada peta.
4 Menuliskan fungsi JavaScript untuk membuat objek peta.
5 Meng-inisiasi peta dalam tag body HTML dengan event onload.
Pada Google Maps API terdapat 4 jenis pilihan model peta yang disediakan
oleh Google, diantaranya adalah:
1 ROADMAP, ini yang saya pilih, untuk menampilkan peta biasa 2 dimensi
2 SATELLITE, untuk menampilkan foto satelit
3 TERRAIN, untuk menunjukkan relief fisik permukaan bumi dan menunjukkan
seberapa tingginya suatu lokasi, contohnya akan menunjukkan gunung dan sungai
4 HYBRID, akan menunjukkan foto satelit yang diatasnya tergambar pula apa yang
tampil pada ROADMAP (jalan dan nama kota)
2.11 Flowchart
Flowchart adalah bagan-bagan yang mempunyai arus yang menggambarkan
langkah-langkah penyelesaian suatu masalah. Flowchart merupakan cara penyajian
dari suatu algoritma (Al-Bahra bin Ladjamudin : 2005).
Ada dua macam flowchart yang menggambarkan proses dengan komputer,
yaitu :
1. Sistem flowchart
Bagan yang memperlihatkan urutan proses dalam sistem dengan menunjukkan alat
media input, output, serta jenis media penyimpanan dalam proses pengolahan data.
2. Program flowchart
Bagan yang memperlihatkan urutan intruksi yang digambarkan dengan simbol tertentu
untuk memecahkan masalah dalam suatu program.
Flowchart merupakan langkah awal pembuatan program. Dengan adanya
flowchart urutan poses kegiatan menjadi lebih jelas. Jika ada penambahan proses maka
dapat dilakukan lebih mudah. Setelah flowchart selesai disusun, selanjutnya
pemrogram (programmer) menerjemahkannya ke bentuk program dengan bahsa

17
pemrograman. Bila seorang analisis dan progammer akan membuat flowchart, ada
beberapa petunjuk yang harus diperhatikan, seperti :
1. Flowchart digambarkan dari halaman atas ke bawah dan kiri ke kanan.
2. Aktifitas yang digambarkan harus didefenisikan secara hati-hati dan defenisi ini
harus dapat dimengerti oleh pembacanya.
3. Kapan aktifitas dimulai dan berakhir harus ditentukan secara jelas.
4. Setiap langkah dari aktifitas harus berada pada urutan yang benar.
5. Setiap langkah dari aktifitas harus berada pada urutan yang benar.
6. Lingkup, range dan aktifitas yang sedang digambarkan harus ditelusuri dengan
hati-hati. Percabangan-percabangan yang memotong aktifitas yang sedang
digambarkan tidak perlu digunakan dan percabangannya diletakkan pada halaman
yang terpisah atau hilangkan seluruhnya bila percabangan tidak berkaitan dengan
sistem.
7. Gunakan simbol-simbol flowchart yang standar
Berikut ini gambar simbol-simbol standar dalam flowchart beserta dengan arti
dari masing-masing simbol :
Tabel 2.2 Flowchart
Simbol Nama Keterangan
Arrow Menyatakan arus suatu proses
Digunakan untuk mewakili simbol

Terminator
star dan end
Rectangle Menunjukkan lankah pemrosesan
Trapezium Simbol untuk input dan output

18
Document Digunakan untuk mewakili output
Simbol yang menyatakan untuk

Decision
mengambil keputusan
Simbol yang digunakan untuk

Preparation proses inisialisai atau pemberian
harga awal
Simbol untuk keluar-masuk atau

Connector penyambung proses pada halaman
yang berbeda
Simbol untuk memasukkan data

Manual Input
secara manual melalui keyboard
Simbol untuk menunjukkan

Manual
pengolahan yang tidak dilakukan
operation
oleh komputer
Predifine Simbol untuk pelaksanaan suatu

process bagian
Simbol yang menyatakan peralatan

Display output yang digunakan seperti layar,
printer, plotter, dan sebagainya
Simbol yang digunakan untuk

Magnetic disk
penyimpanan data ke database

19
Digunakan untuk menyatakan

Punched Card masukan dan keluaran yang berasal
dari card
Digunakan untuk menyatakan

Magnetic Tape masukan dan keluaran yang berasal
dari pita magnetic
Simbol yang menyatakan input yang

Storage data berasal dari disk atau disimpan ke
disk

BAB 3
PERANCANGAN SISTEM
Sebelum melakukan perancangan sistem informasi, maka harus dilakukan

analisis sistem terlebih dahulu untuk memperoleh gambaran yang jelas mengenai
kelebihan dan kekurangan sistem yang sedang berjalan.
3.1 Gambaran Umum Sistem Perancangan

Secara umum sistem GIS ini bertujuan untuk menampilkan informasi letak
lokasi penyewaan lapangan futsal di kota Medan. Kode dasar dari peta diambil dari
google map yang dibagikan oleh google untuk kalangan pengembang.
Desain yang userfriendly diperlukan oleh semua aplikasi. Program aplikasi ini
dikemas secara userfriendly baik secara tampilan, maupun posisi elemen pembangun
aplikasi. Kemudahan-kemudahan yang telah dirangkai, untuk membuat user
menggunakan aplikasi ini dengan efektif dan efisien dalam mencari data lapangan
futsal yang diinginkan.
Terdapat dua tipe pengguna pada aplikasi ini yaitu pengguna aplikasi terdaftar
dan pengguna aplikasi tidak terdaftar. Pengguna aplikasi terdaftar akan bisa
mengakses ke halaman admin, dan dapat melakukan beberapa eksekusi terhadap data
seperti lihat, tambah, hapus, penambahan data. Sedang pada pengguna aplikasi tidak
terdaftar hanya dapat melihat informasi mengenai letak dan info lapangan futsal yang
tersedia di dalam database. Pengguna aplikasi tidak terdaftar juga dapat melakukan
transaksi yang memudahkan pengguna untuk melakukan pemesanan lapangan futsal
melalui aplikasi ini.
3.2 Metode Penelitian

Metode adalah suatu cara atau teknik yang sistematik untuk mengerjakan atau
menyelesaikan sesuatu. Berikut ini metodologi penelitian yang gunakan dalam
membangun aplikasi ini, yaitu :

20
1. Pengumpulan Data
Mengumpulkan data berupa informasi, gambar dan sebagainya yang dibutuhkan untuk
perancangan aplikasi dengan cara mengobservasi terlebih dahulu.
2. Analisis Sistem
Dilakukan untuk memperoleh informasi tentang sistem, menganalisis data–data yang
ada dalam sistem dan juga menganalisis poin – poin masalah pada sistem terutama
mengenai kelebihan dan kekurangan sistem.
3. Perancangan (Desain)
Membangun / mengembangkan sistem yang diusulkan berupa perancangan sistem
data flow diagram (DFD), dimana tahapan ini dapat dibangun dengan memperoleh
informasi diantaranya memastikan informasi yang didapat akurat, memberikan ulasan-
ulasan yang terperinci.
4. Penulisan Program (Coding)
Mebuat program didalam aplikasi yang dibuat agar dapat berjalan sesuai dengan yang
difungsikan.
5. Uji Program.
Pengujian akan dilaksanakan jika program telah selesai dikerjakan. Bila
saat pengujian terdapat kesalahan maka perlu adanya perbaikan terhadap program
agar menghasilkan hasil yang maksimal.
3.3 Flowchart
Flowchart merupakan bagan yang menunjukkan alir didalam program atau
prosedur sistem secara logika. Adapun flowchart yang didesain penulis adalah sebagai
berikut :

21
Gambar 3.1 Flowchart User

22
Gambar 3.2 Flowchart Login Admin

23
Gambar 3.3 Flowchart Admin

24
3.4 Diagram Konteks

Diagram konteks menggambarkan satu lingkaran besar yang dapat mewakili
seluruh proses yang terdapat dalam suatu sistem. Adapun diagram konteks yang
didesain oleh penulis adalah sebagai berikut :
Data user, data pesanan, Data pemesanan, data user

data pembayaran data pembayaran
SISTEM
USER ADMIN
Nota Pemesanan, Login,
Peta lokasi Update data lapangan
Gambar 3.4 Diagram Konteks
3.5 Diagram Nol (Overview Diagram)

Diagram nol adalah diagram yang menggambarkan proses dari dataflow diagram.
Diagram nol memberikan pandangan secara menyeluruh mengenai sistem yang
ditangani, menunjukkan tentang fungsi-fungsi utama atau proses yang ada, aliran data,
dan eksternal entity (Al-Bahra bin Ladjamudin 2005:64)
Gambar 3.5 Data Flow Diagram (DFD)

25
3.6 Entity Relationship Diagram

ERD adalah suatu model jaringan yang menggunakan susunan data yang disimpan
dalam sistem secara abstrak (Al-Bahra bin Ladjamudin 2005: 142). Adapun ERD
yang didesain oleh penulis adalah sebagai berikut :
Gambar 3.6 Entity Relationship Diagram
3.7 Perancangan Database

Database atau basis data merupakan kumpulan dari data-data yang saling
berhubungan yang disebut relasi. Sebuah database website disimpan dalam alat
penyimpanan dan membutuhkan database server untukmelayani user dalam
memanipulasi data.
Dalam aplikasi Web GIS ini dibutuhkan data-data penting mengenai lapangan
futsal seperti nama lapangan futsal, alamat, harga, dan lainnya. Data-data ini nantinya
akan disimpan kedalam sebuah database yang dikelompokkan secara terstruktur
dalam beberapa tabel sesuai dengan informasi yang dikandungnya. Berikut rancangan
database yang digunakan :
1. Tabel Admin
Tabel admin merupakan tabel basis data yang digunakan untuk menyimpan
data berisi username dan password untuk melakukan proses login. Sebelum
melakukan proses login.

26
Tabel 3.1 Tabel Admin

Nama Field Tipe Data Besar Penjelasan
Nama varchar 25 Nama admin
Username varchar 25 Nama login
password varchar 25 Password login
2. Tabel Data Lapangan

Tabel data lapangan merupakan tabel database yang digunakan untuk
menyimpan data identitas lapangan futsal dan juga terdapat penanda koordinat pada
google map. Untuk menambahkan basisdata ini seseorang harus mempunyai hak
akses dalam aplikasi.
Tabel 3.2 Tabel Data Lapangan
Nama Varchar 25 Nama Futsal
Semen Int 10 Harga lapangan semen
Rumput Int 10 Harga lapangan rumput
Keterangan Varchar 1000 Alamat lapangan futsal
Lokasi Varchar 1000 Lokasi lapangan futsal pada google
map
Id Int 11 Primery key
Foto Varchar 25 Foto kualitas lapangan
3. Tabel Pembayaran
Tabel pembayaran merupakan tabel yang digunakan untuk menyimpan data
yang berguna untuk menjadi bukti sah bahwa pengguna yang telah melakukan
transaksi pemesanan lapangan futsal.
Tabel 3.3 Tabel Pembayaran
Kode Varchar 25 Kode transaksi
Nama pengirim Varchar 25 Nama pengirim
Bank pengirim Varchar 25 Bank yang digunakan pengguna untuk
melakukan transaksi pembayaran

27
Bank tujuan Varchar 25 Bank yang tertera di aplikasi yang

dipilih pengguna untuk melakukan
transaksi
Gambar Varchar 25 Bukti struk pembayaran
Tanggal Varchar 25 Tanggal pengguna melakukan
pembayaran
Pukul Varchar 25 Jam pengguna melakukan pembayaran
No. telepon Integer 13 Nomor telepon pengguna yang dapat
dihubungi
4. Tabel Reservasi
Tabel reservasi merupakan tabel yang digunakan untuk menyimpan
permintaan pengguna untuk penyewaan lapangan futsal.
Tabel 3.4 Tabel reservasi
Kode Varchar 25 Kode pemesanan
Nama futsal Varchar 25 Nama lapangan futsal
Jenis lapangan Varchar 25 Jenis lapangan yang dipilih
Lama Integer 5 Lama bermain
Tanggal Varchar 25 Tanggal bermain
Pukul Varchar 25 Jam melakukan permainan futsal
Nama pemesan Varchar 25 Nama pengguna yang melakukan
pemesanan
No.telepon Varchar 15 Nomor telepon pemesan yang dapat
dihubungi
Total Varchar 15 Total harga yang harus dibayar
pemesan

28
3.8 Perancangan Antar Muka

Interface yang menarik dan user frindly sangat diperlukan dalam
mengembangkan suatu aplikasi. Hal ini dikarenakan agar user mudah memahami dan
menggunakan aplikasi tersebut.
3.8.1 Perancangan Antar Muka Menu Home

Halaman ini merupakan yang pertama kali user lihat ketika mengakses website
futsal ini. Padala halaman ini hanya berisi beberapa gambar dari lapangan futsal yang
bergeser secara otomatis
Futsal Medan Data Lapangan Konfirmasi pembayaran About Admin
SLIDE IMAGE
Gambar 3.7 Halaman Menu Utama
3.8.2 Perancangan Antar Muka Menu Data Lapangan

Pada halaman ini terdapat berbagai pilihan lokasi penyewaan lapangan futsal yang
tersedia. Dihalaman ini user dapat melihat detail informasi pada lapangan futsal yang
diinginkan, mulai dari alamat, peta, harga sewa per jam sesuai dengan jenis lapangan,
dan dapat pula melakukan reservasi pada lapangan yang diinginkan

29
Data Lapangan
Terminal Futsal The Kop Futsal
Image Image
View Detail View Detail
Tibor Futsal Total Futsal
Image Image
Qs Futsal Gajah Mada Futsal
Image Image
Gambar 3.8 Halaman Data Lapangan
3.8.3 Perancangan Antar Muka Menu Konfirmasi Pembayaran

Dihalaman ini user yang telah melakukan reservasi pada halaman data
lapangan dapat mengirimkan data bukti pembayaran yang sah yang telah dilakukan

30
Futsal Medan Data Lapangan Konfirmasi pembayaran About

Admin
Konfirmasi Pembayaran
Kode Pemesanan
Kode pemesanan
Nama Pengirim
Nama Pengirim
Bank Pengirim
Bank Pengirim
Bank Tujuan
Bank Tujuan
Bukti Pembayaran
Pilih File
*Bukti pembayaran harus difoto dalam bentuk .jpg atau .png
Tanggal Pembayaran hh/bb/tttt Pukull Pembayaran --:--
No.Handphone
+628xxxx
Konfirmasi
Gambar 3.9 Halaman Konfirmasi Pembayaran
3.8.4 Perancangan Antar Muka Menu Tentang

Halaman ini berisi tentang penjelasan singkat sejarah futsal, contact person, dan peta
lokasi-lokasi lapangan futsal yang tesedia di kota Medan.

31
About
TEXT
Contact Person Peta kota Medan
Gambar 3.10 Halaman About
3.8.5 Perancangan Antar Muka Menu Admin

Halaman ini hanya bisa diakses oleh user yang memiliki hak akses, pada halaman ini
admin dapat mengontrol informasi data lapangan. Terdapat dua menu di dalam
halaman admin yaitu menu lihat data lapangan dan menu tambah data.
Futsal Medan Hi,admin Logout
Lihat Data Tambah Data
Futsal Medan
Home Admin
Gambar 3.11 Halaman Home Admin

BAB 4
IMPLEMENTASI SISTEM
4.1 Pengertian Implementasi

Tahap implementasi sistem merupakan tahap inti dari pekerjaan sebuah proyek. Pada
tahap ini semua rancangan diterapkan dan dikerjakan guna menjadi sebuah sistem
yang diinginkan. Implementasi sistem yang dimaksud merupakan proses pembuatan
dan pemasangan sistem secara utuh baik dari sisi hardware (perangkat keras), software
(perangkat lunak), brainware (manusia), dan koneksi jaringan (internet).
4.2 Komponen Sistem

Komppnen-komponen sistem yang dibutuhkan dalam membangun aplikasi ini
diantaranya adalah :
4.2.1 Hardware
Hardware adalah perangkat keras yang terlihat dan dapat disentuh oleh tangan.
Hardware merupakan suatu komponen yang sangat dibutuhkan dalam mewudjukan
sistem yang diusulkan. Dalam hal ini penulis merekomendasikan perangkat hardware
yang standar, artinya aplikasi dapat berjalan normal. Spesifikasi kompenen hardware
bisa saja anda gunakan lebih rendah atau lebih tinggi, sesuai yang anda inginkan.
Adapun spesifikasi komponen hardware yang penulis gunakan dalam pembuatan
aplikasi ini yaitu :
1. Processor Intel Core i3-4030U
2. Memory 2GB
3. Hard disk 500GB
4. Monitor LCD
5. Keyboard
6. Mouse
7. Perangkat Jaringan

33
4.2.2 Software
Software dapat berjalan jika tersedianya hardware yang memnuhi spesifikasi
bejalannya software. Stelah hardware terpenuhi maka, langkah selanjutnya adalah
instalasi software. Adapun software yang penulis gunakan agar program berjalan
dengan baik untuk digunakan dalam pembuatan aplikasi website ini adalah :
1. Sistem Operasi windows 8.1 Pro 64-bit
2. Xampp 5.6.12
3. Sublime Text 3
4. Google Chrome
4.2.3 Brainware
Brainware merupakan factor manusia yang mengenai fasilitas komputer yang ada.
Faktor manusia yang dimaksud adalah orang-orang yang memiliki bagian untuk
mengenai sistem dan merupakan unsur manusia. Perangkat operator (brainware)
memiliki tiga bagian yaitu :
1. Analisis Sitem, yaitu orang yang membentuk dan membangun fasilitas sistem atau
program.
2. Progammer, yaitu orang yang mengerti bahasa pemrograman yang digunakan
dalam membuat dan membangun suatu program.
3. Operator (Administrator), yaitu orang yang mengoperasikan sistem seperti
memasukkan data untuk dioperasikan dan menghasilkan informasi.
4. Pengguna (Public), yaitu orang yang memakai sistem yang telah dirancang untuk
mendapatkan informasi yang dibutuhkan.
4.2.4 Jaringan Internet

Hubungan kepada jaringan internet sangat dibutuhkan untuk mengkoneksikan citra
google map ke dalam aplikasi ini. Kita bisa menggunakan koneksi seperti modem gsm,
wifi, atau koneksi yang lainnya yang terhubung ke internet. Kecepastan internet
mempengaruhi lama tidaknya data internet yang tampil pada aplikasi web.

34
4.3 Prosedur Penggunaan Program

Ketika telah selesai mengerjakan tahap perancangan sistem, baik dalam merancang
tabel-tabel didalam database dengan menggunakan phpMyAdmin maupun dalam
merancang halaman-halaman website, kini program tersebut dapat dijalankan.
Ketikkan pada addres bar http:localhost untuk melihat tampilan Apache web pada
browser.
Adapun prosedur penggunaan program secara manual dapat diuraikan sebagai
berikut :
1. Aktifkan Apache, dan MySQL pada XAMPP Control Panel Aplication.
2. Kemudian buka web browser anda.
3. Setelah web browser terbuka, ketikkan alamat website yang telah dirancang pada
address bar untuk menampilkan halaman utama website.
4.4 Implementasi Program

Implementasi ini dilakukan agar pemakai sistem dapat mengerti tentang bagaimana
cara kerja dari sistem ini. Beriku adalah cara kerja dari sistem informasi lapangan futsal
berbasis web.
4.4.1 Halaman Utama Website

Halaman utama interface dari website Sistem Informasi Geografis Lokasi Penyewaan
Lapangan Futsal berisi tentang slide yang menampilkan fota-foto tentang lapangan
futsal.
Gambar 4.1 Halaman Utama Website

35
4.4.2 Halaman Data Lapangan

Halaman ini berisi tentang data lapangan futsal yang tersedia didalam aplikasi ini yang
meliputi harga sewa lapangan, alamat lapangan, peta lokasi lapangan, dan terdapat fitur
untuk melakukan reservasi lapangan.
Gambar 4.2 Halaman Data Lapangan

36
Gambar 4.3 Halaman Deskripsi Lapangan
Gambar 4.4 Halaman Reservasi Lapangan

37
4.4.3 Halaman Konfirmasi Pembayaran

Pada halaman ini pengguna yang telah melakukan reservasi lapangan dapat melakukan
konfirmasi pembayaran dengan menyertakan bukti foto pembayaran agar dapat
diproses oleh admin.
Gambar 4.5 Halaman Konfirmasi Pembayaran
4.4.4 Halaman About

Halaman about berisi tentang tata cara bermain dan sejarah futsal secara singkat,
contact person, dan juga peta lokasi lapangan futsal.

38
Gambar 4.6 Halaman About
4.4.5. Halaman Admin

Ketika admin berhasil masuk melalui halaman login, maka admin akan dibawa ke
halaman berikutnya yang berisi menu. Terdapat dua menu utama pada alaman ini,
yaitu lihat data dan tambah data. Menu lihat data nantinya akan membawa admin
ke halaman untuk melihat semua data lapangan, data reservasi, dan data bukti
pembayaran , sedangkan menu tambah data akan membawa admin ke halaman
dimana admin untuk menambah data lapangan dan menambah akun admin
lainnya.

39
Gambar 4.7 Halaman Admin Lihat Data Lapangan
Gambar 4.8 Halaman Admin Lihat Data Pembayaran

40
Gambar 4.9 Halaman Admin Lihat Data Reservasi
Gambar 4.10 Halaman Admin Tambah Data Lapangan
Gambar 4.11 Halaman Admin Tambah Data Admin

BAB 5
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Dalam penulisan tugas akhir ini telah diuraikan bagaimana perancangan sistem dalam
pembangunan website Sistem Informasi Geografis Lokasi Penyewaan Lapangan
Futsal. Maka dapat disimpulkan bahwa :
1. Website merupakan sarana informasi online yang dapat diakses oleh siapapun.
2. Dalam menyelesaikan pembuatan program aplikasi web GIS pemetaan lapangan
futsal di kota Medan menggunakan google maps api ini, usaha yang dilakukan
adalah mengumpulkan, mengkaji buku-buku, browsing internet, menyajikan data,
pembuatan desain untuk proses user interface program, melakukan implementasi
sebagai dasar pembuatan program.
3. Aplikasi web GIS lokasi penyewaan lapangan futsal ini dikemas secara
userfriendly agar dapat digunakan dengan mudah bagi user awam sekalipun.
4. Dalam membangun sebuah website tidak harus terhubung dengan internet.
5. Kemudahan menambahkan data lapangan futsal baru serta mengubah data
tersebut, menjadikan aplikasi ini digunakan secara maksimal oleh user yang
terdaftar.
5.2 Saran
Dengan selesainya pengimplementasian sistem ini, banyak saran-saran yang masuk
baik kepada penulis seperti berikut :
1. Memastikan sistem memberikan keakuratan data pada suatu data yang
menyangkut letak geografis.
2. Besar harapan agar sistem dapat dibangun lebih lagi mengingat masih banyak
kekurangan yang menempel pada sistem.
3. Sistem yang dibuat diharapkan mampu menaungi dan meringankan masalah-
masalah yang tadinya kurangnya informasi, kini mendapatkan informasi secara
fokus untuk kota medan oleh sistem.

42
DAFTAR PUSTAKA
Aribowo, Eko dan Erna Kharistiani. 2013. Sistem Informasi Geografis Pemetaan
Potensi Sma/Smk Berbasis Web (Studi Kasus : Kabupaten Kebumen). Jurnal
Sarjana Teknik Informatika e-ISSN: 2338-5197 Volume 1 Nomor 1, Juni.
Diambil dari : https://media.neliti.com/media/publications/211222-sistem-
informasi-geografis-pemetaan-pote.pdf. (29 Juni 2018)
Hamidi. 2012. Aplikasi Sistem Informasi Geografis Berbasis Web Penyebaran Dana
Bantuan Operasional Sekolah. Jurnal Masyarakat Informatika, Volume 2,
Nomor 3, ISSN 2086-4930. Diambil dari : https://ejournal.undip.ac.id/index.
php/jmasif/article/view/2643. (1 Juli 2018)
Husein, Rahmad. 2006. Konsep Dasar Sistem Informasi Geografis (Geographics
Information System). Diambil dari : https://academia.edu/download/37034315
/GIS_Info.pdf. (2 Juli 2018)
Indelarko, Hendi dkk. 2009. Pengembangan Aplikasi Sistem Informasi Geografis
Berbasis Desktop dan Web. Yogyakarta ; Gava Media
Ladjamudin, Al-Bahra. 2005. Analisis dan Desain Sistem Informasi.
Yogyakarta : GRAHA ILMU
Maharani,Septya et al. 2017. Sistem Informasi Geografis Pemetaan Masjid Di
Samarinda Berbasis Web. Jurnal Informatika, Vol.11, No1, Januari. Diambil
dari:https://www.researchgate.net/publication/321714166_SISTEM_INFOR
MASI_GEOGRAFIS_PEMETAAN_MASJID_DI_SAMARINDA_BERBAS
IS_WEB. (2 Juli 2018)
Nugraha, Deny Wiria. 2012. Perancangan Sistem Informasi Geografis Menggunakan
Peta Digital. Jurnal Ilmiah Foristek Vol. 2, No. 1, Maret. Diambil dari :
http/jurnal.untad.ac.id/jurnal/index.php/FORISTEK/article/view/662. (1 Juli
2018)
Nugroho, Bunafit. 2004. Aplikasi Pemrogramman Web Dinamis dengan PHP dan
MySQL (Studi Kasus, Membuat Sistem Informasi Pengolahan Data Buku).
Yogyakarta : Gava Media
Sianipar, R.H., 2015. PHP & MySQL Langkah Demi Langkah. Yogyakarta : ANDI
OFFSET

LAMPIRAN
1. Index.php
<!DOCTYPE html>
<html lang="en" id="home">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,
initial-scale=1">

<title>Futsal Medan</title>


<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/mdb.min.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top"

style="background:#1f1f14; min-height:70px;">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle

collapsed" data-toggle="collapse" data-target="#bs-example-
navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle
navigation</span>
<span class="icon-bar"></span>
</button>
<a href="#home" class="navbar-brand scroolo"

style="font-family: 'Philosopher'; font-size:30px; margin-
top:5%;">Futsal Medan</a>
</div>
<div class="collapse navbar-collapse" id="bs-

example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="#lapangan" class="scroolo"
id="text">Data Lapangan</a></li>
<li><a href="#konfirmasi" class="scroolo"
id="text">Konfirmasi Pembayaran</a></li>
<li><a href="#about" class="scroolo"
id="text">About</a></li>
<li><a href="login.php" id="text">Admin</a></li>

<li><a href="https://www.instagram.com/"><img
src="img/ig.png" id="putih"></a></li>
<li><a href="https://www.facebook.com/"><img
src="img/fb.png" id="putih"></a></li>
</ul>
</div>
</div>
</nav>
<section id="page-top">

<div id="main-slide" class="carousel slide" data-
ride="carousel">


<ol class="carousel-indicators">
<li data-target="#main-slide" data-slide-
to="0" class="active"></li>
to="1"></li>
to="2"></li>
</ol>



<div class="carousel-inner">
<div class="item active">
<img class="img-responsive"
src="img/ns2.jpg" alt="slider"
style="width:100%;height:700px;">
</div>

<div class="item">
src="img/ns1.jpg" alt="slider"
</div>
<div class="item">
src="img/s3.JPG" alt="slider"
</div>
</div>



<a class="left carousel-control" href="#main-
slide" data-slide="prev">

<span><i class="glyphicon glyphicon-chevron-
left"></i></span>
</a>
<a class="right carousel-control" href="#main-
slide" data-slide="next">
<span><i class="glyphicon glyphicon-chevron-
right"></i></span>
</a>
</div>

</section>
<section id="lapangan" class="latest-news-section"

style="height:auto;background-image:
url(img/background.png);background-repeat: no-
repeat;background-size: cover;color:white;font-family:
'Cormorant Garamond';">
<div class="container">
<div class="row">
<div class="col-sm-12 text-center">
<h2 id="judul">Data Lapangan</h2>
<hr style="width:200px;border-top:2px solid
white;width:600px;margin:auto;margin-top:10px;margin-
bottom:50px;">
</div>
</div>
<div class="row">
<?php
include ('koneksi.php');
$que = "SELECT * FROM `data_lapangan`";

$q = mysql_query($que);
$no = 1;
while ($qq = mysql_fetch_array($q)) {
?>
<div class="col-md-6">
<h2 class="text-center" style="margin-
bottom:30px;"><?php echo $qq['nama'] ?></h2>
<img src="img/<?php echo $qq['foto'] ?>"
style="height:250px;margin:auto;display:block;margin-
bottom:30px;" class="img-thumbnail">
<p class="text-center"><?php echo
$qq['keterangan'] ?></p>
<p class="text-center"><a class="btn btn-
secondary" href="desk-lapangan.php?id=<?php echo $qq['id'];
?>" role="button">View details »</a></p>
</div>
<?php $no++; } ?>
</div>
</div>
</section>


<?php
include('koneksi.php');
if (isset($_POST["bayar"])) {
$kode = $_POST['kode'];
$nama_pengirim = $_POST['nama_pengirim'];
$bank_pengirim = $_POST['bank_pengirim'];
$bank_tujuan = $_POST['bank_tujuan'];
$waktu = $_POST['waktu'];
$tanggal = $_POST['tanggal'];
$nohp = $_POST['nohp'];
$gambar = $_FILES['gambar']['name'];
$file_name = $_FILES['gambar']['name'];
$tmp_name = $_FILES['gambar']['tmp_name'];
move_uploaded_file($tmp_name,"img/".$file_name);
if($kode==""){
echo '<script language="javascript">';
echo 'alert("Gagal...")';
echo '</script>';
}
elseif($nama_pengirim==""){
echo '</script>';
}
elseif($bank_pengirim==""){
echo '</script>';
}
elseif($bank_tujuan==""){
echo '</script>';
}
elseif($waktu==""){
echo '</script>';
}
elseif($nohp==""){

echo '</script>';
}
elseif($tanggal==""){
echo '</script>';
}
else{
$sql= mysql_query("INSERT INTO pembayaran
VALUES('$kode','$nama_pengirim','$bank_pengirim','$bank_tujuan
','$gambar','$tanggal','$waktu','$nohp')");
if($sql){
echo '<script
language="javascript">';
echo 'alert("Terima Kasih Pesanan
Anda Akan Kami Proses")';
echo '</script>';
}
else{
echo '<script
echo '</script>';
}
}
}
?>
<section class="form" id="konfirmasi" style="min-

height:auto;background:#92C591;padding-bottom:50px;font-
family: 'Cormorant Garamond';">
<div class="row">
<div class="col-sm-12">
top:50px;color:white;" id="judul"><b>Konfirmasi
Pembayaran</b></h1>
white;width:600px;margin:auto;margin-top:10px;margin-
bottom:50px;">
</div>
</div>
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<form method="POST" action=""
enctype="multipart/form-data">
<div class="form-group">

<label for="Kode">Kode Pemesanan</label>
<input type="text" class="form-control"
id="exampleInputEmail1" placeholder="Kode Pesanan"
name="kode">
</div>
<label for="Kode">Nama Pengirim</label>
id="exampleInputEmail1" placeholder="Nama Pengirim"
name="nama_pengirim">
</div>
<label for="Kode">Bank Pengirim</label>
id="exampleInputEmail1" placeholder="Bank Pengirim"
name="bank_pengirim">
</div>
<label>Bank Tujuan</label>
<div class="selectContainer">
<select class="form-control"
name="bank_tujuan" style="width:150px;">
<option value="">Pilih</option>
<option value="BNI">BNI</option>
<option value="BCA">BCA</option>
<option value="MANDIRI">MANDIRI</option>
</select>
</div>
</div>
<label for="exampleInputFile">Bukti
Pembayaran</label>
<input type="file" class="form-control-file"
id="exampleInputFile" aria-describedby="fileHelp"
name="gambar">
<small id="fileHelp" class="form-text text-
muted">Bukti pembayaran : Bukti Transfer yang di foto dalam
bentuk .jpg atau .png</small>
</div>
<label for="Alamat">Tanggal Pembayaran
</label>
<input type="date" name="tanggal">
</div>
</div>

<label for="Alamat">Pukul Pembayaran
</label>
<input type="time" name="waktu">
</div>
</div>
<label for="Jenis">No Handphone</label>
id="exampleInputEmail1" placeholder="+62812xxx" name="nohp">
</div>
<input type="submit" class="btn" name="bayar"

value="konfirmasi" style="background-color:#248f24;"></input>
</form>
</div>
</div>
</div>
</section>
<section class="about" id="about" style="min-

height:auto;padding-
bottom:50px;background:#bcd890;color:black;font-family:
<div class="col-sm-12 text-center">
<h2 id="judul" style="color:white;">About</h2>
white;width:300px;margin:auto;margin-top:10px;padding-
bottom:30px;">
</div>
<h3 class="col-sm-12" style="text-align:justify"><span

style="margin-left:50px;">Futsal</span> adalah permainan bola
yang dimainkan oleh dua tim, yang masing-masing beranggotakan
lima orang. Tujuannya adalah memasukkan bola ke gawang lawan,
dengan memanipulasi bola dengan kaki. Selain lima pemain
utama, setiap regu juga diizinkan memiliki pemain cadangan.
Tidak seperti permainan sepak bola dalam ruangan lainnya,
lapangan futsal dibatasi garis, bukan net atau papan. <br><br>
<span style="margin-left:50px;">Futsal</span>
dipopulerkan di Montevideo, Uruguay pada tahun 1930, oleh Juan
Carlos Ceriani. Keunikan futsal mendapat perhatian di seluruh
Amerika Selatan, terutamanya di Brasil. Ketrampilan yang
dikembangkan dalam permainan ini dapat dilihat dalam gaya
terkenal dunia yang diperlihatkan pemain-pemain Brasil di luar
ruangan, pada lapangan berukuran biasa. Pele, bintang terkenal
Brasil, contohnya, mengembangkan bakatnya di futsal. Sementara
Brasil terus menjadi pusat futsal dunia, permainan ini
sekarang dimainkan di bawah perlindungan Fédération

Internationale de Football Association di seluruh dunia, dari
Eropa hingga Amerika Tengah dan Amerika Utara serta Afrika,
Asia, dan Oseania.</h3><br>
<div class="row">
<div class="col-sm-5"
style="background:#92C591;margin-top:50px;">
<p id="contak">Contack Person</p>
<p id="contak"><span
class="glyphicon"></span> +06123152</p>
class="glyphicon">✉</span> futsalmedan@outlock.com</p>
class="glyphicon"></span> Medan City</p>
</div>
<div id="map" style="border:3px white
solid"></div>
</div>
</div>
</div>
</section>
<script>
var locations=[
['Planet Futsal',3.6221339,98.6677327,'lokasi 1'],
['Terminal Futsal',3.5651994,98.6451099,'lokasi 2'],
['The Kop Futsal',3.6187275,98.6779815,'lokasi 3'],
['Tibor Futsal',3.5817605,98.6403391,'lokasi 4'],
['Total Futsal',3.5724966,98.641798,'lokasi 5'],
['QS Futsal',3.5629485,98.6195485,'lokasi 6'],
['Gajah Mada Futsal',3.59762,98.6809003,'lokasi 7'],
['Sir Trafford Futsal',3.5608079,98.5681629,'lokasi 8'],
['Ringroad Futsal',3.5678511,98.6174192,'lokasi 9'],
['Village Futsal',3.56114,98.6468663,'lokasi 10'],
['Delima Futsal',3.5621048,98.6646509,'lokasi 11'],
['Antik Futsal',3.598217,98.6174163,'lokasi 11']
];
var lokasi = {lat:3.5708507,lng:98.8796794};

var tanda = [];
function initMap(){
var map = new
google.maps.Map(document.getElementById('map'),{
zoom : 10,
center : lokasi
});
var baris = locations.length;
for (var i=0;i<baris;i++){

tanda[i] = new google.maps.Marker({

position : {lat : locations[i][1],lng
:locations[i][2]},
map : map,
html : locations[i][0],
id:i,
title : locations[i][3],
});
tanda[i].addListener('click',
function(){
var iw = new google.maps.InfoWindow({
id : this.id,
content :this.html,
position :this.getPosition(),
zoom : map.setZoom(11),
});
iw.open(map);
});
}
}
</script>
<script
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAcsLhfZ
JP07mh8S3QdNKXlitVZepOE9DQ&callback=initMap"async defer>
</script>
<footer style="background:#1f1f14;height:70px;">
<div class="row">
<p class="text-center" style="font-
weight:bold;text-size:40px;padding-top:30px;color:white;">@
CopyRight Futsal Medan 2018</p>
</div>
</div>
</footer>

<script src="js/modernizr.custom.js"></script>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/scrol.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript"
src="js/mdb.min.js"></script>
</body>
</html>
2. Koneksi.php

<?php
mysql_connect("localhost","root","");
mysql_select_db("futsal");
?>
3. desk-lapangan.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Deskripsi Lapangan</title>


<link rel="stylesheet" type="text/css"
href="css/style.css">
</head>
<body style="background-color:#E8F3E8;font-family:
style="background:#1f1f14;">
navigation</span>
</button>

style="font-family: 'Philosopher'">Futsal Medan</a>
</div>

<li><a href="index.php" class="scroolo"
id="text">Kembali</a></li>
</ul>
</div>

</div>
</nav>
<?php
$id = $_GET['id'];
$que = "SELECT * FROM `data_lapangan` WHERE id='$id'";

$qq = mysql_fetch_array($q);
?>
<section>
<div class="container" style="min-height:650px;">
<div class="row">
<div class="col-sm-12 text-center" style="margin-
top:100px;">
<span id="judul" style="font-size:40px;"><b><?php
echo $qq['nama'] ?></b></span>
black;width:500px;margin:auto;margin-top:10px;">
</div>
</div>
<br>
<div class="row">
<div class="col-md-4" >
<a class="thumbnail view zoom image"
style="width:500px;"><img src="img/<?php echo $qq['foto'] ?>">
</a>
</div>
<div class="col-md-4 col-md-offset-2" >
<p style="font-size:25px;text-
align:justify"><?php echo $qq['keterangan'] ?></p>
<p style="font-size:20px;">Harga Sewa Lapangan
Rumput Rp.<?php echo $qq['rumput'] ?>/Jam</p>
<p style="font-size:20px;">Harga Sewa Lapangan
Semen Rp.<?php echo $qq['semen'] ?>/Jam</p><br>
<a href="<?php echo $qq['lokasi'] ?>"><img

src="img/vektor.png" id="icon"></a>
</div>
</div>
<p style="font-size:15px;color:red;margin-top:2%;">*
Untuk melakukan reservasi dikenakan biaya Rp.50000 per Jam
sebagai Jaminan</p>
<div class="row" style="margin-bottom:50px;margin-
top:50px;">
<a href="reservation.php?id=<?php echo $qq['id'];
?>"><button type="button" class="btn btn-info"
style="width:100px;margin:auto;display:block">Reservation</but
ton></a>

</div>
</div>
</section>
<div class="row">
</div>
</div>
</footer>

-->

src="js/popper.min.js"></script>
</body>
</html>
4. konfirmasi.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Konfirmasi Pembayaran</title>


href="css/slide.css">
</head>
<body style="font-family:myFirstFont;">

style="background-color:#1f1f14;">

navigation</span>
</button>
<a href="index.php" class="navbar-brand

scroolo">Futsal Medan</a>
</div>

<li><a href="index.php"
class="scroolo">Home</a></li>
</ul>
</div>
</div>
</nav>
<section class="form" id="form" style="min-

height:800px;margin-top:50px;background:#EBF7E3">
<div class="row">
top:50px;">Konfirmasi Pembayaran</h1>
<hr style="width:400px;">
</div>
</div>
<?php
if (isset($_POST["bayar"])) {
$waktu = $_POST['waktu'];

if($kode==""){
echo '</script>';
}
elseif($nama_pengirim==""){
echo '</script>';
}
elseif($bank_pengirim==""){
echo '</script>';
}
elseif($bank_tujuan==""){
echo '</script>';
}
elseif($waktu==""){
echo '</script>';
}
elseif($nohp==""){
echo '</script>';
}
elseif($email==""){
echo '</script>';
}
elseif($tanggal==""){
echo '</script>';
}
else{

$sql= mysql_query("INSERT INTO pembayaran
VALUES('$kode','$nama_pengirim','$bank_pengirim','$bank_tujuan
','$gambar','$tanggal','$waktu','$nohp')");
if($sql){
echo '<script
echo 'alert("Terima Kasih Pesanan
Anda Akan Kami Proses")';
echo '</script>';
}
else{
echo '<script
echo '</script>';
}
}
}
?>
<div class="row">
<label for="Kode">Kode Pemesanan</label>
id="exampleInputEmail1" placeholder="Kode Pesanan"
name="kode">
</div>
id="exampleInputEmail1" placeholder="Nama Pengirim"
name="nama_pengirim">
</div>
id="exampleInputEmail1" placeholder="Bank Pengirim"
name="bank_pengirim">
</div>
<label>Bank Tujuan</label>
name="bank_tujuan" style="width:150px;">
<option value="BNI">BNI</option>

<option value="BCA">BCA</option>
<option value="MANDIRI">MANDIRI</option>
</select>
</div>
</div>
<label for="exampleInputFile">Bukti
Pembayaran</label>
<input type="file" class="form-control-file"
id="exampleInputFile" aria-describedby="fileHelp"
name="gambar">
<small id="fileHelp" class="form-text text-
muted">Bukti pembayaran : Bukti Transfer yang di foto dalam
bentuk .jpg atau .png</small>
</div>
<label for="Alamat">Tanggal Pembayaran
</label>
<input type="date" name="tanggal">
</div>
</div>
<label for="Alamat">Pukul Pembayaran
</label>
<input type="time" name="waktu">
</div>
</div>
<label for="Jenis">No Handphone</label>
id="exampleInputEmail1" placeholder="+62812xxx" name="nohp">
</div>
<input type="submit" class="btn" name="bayar"

value="konfirmasi" style="background-color:#248f24;"></input>
</form>
</div>
</div>
</div>
</section>
<footer style="background:#1f1f14;">
<div class="row">

weight:bold;text-size:40px;padding-
top:30px;color:white;">CopyRight Futsal Medan 2018</p>
</div>
</div>
<div class="row text-center col-sm-12">

<a href="" style="margin-left:50px;" ><img
src="img/ig.png" style="margin-bottom:20px;" id="putih"></a>
</div>
</footer>

-->
<script src="js/slide.js"></script>
<script src="js/scrool-menu.js"></script>
<script src="js/imgonclick.js"></script>
<script src="slideshow/jquery/jquery.min.js"></script>
<script
src="slideshow/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>
5. reservasi.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Reservation Lapangan</title>


</head>
<body style="background-color:#E8F3E8;font-family:

navigation</span>
</button>

</div>

<li><a href="index.php" class="scroolo"
id="text">Kembali</a></li>
</ul>
</div>
</div>
</nav>
<?php
$id = $_GET['id'];
$que = "SELECT * FROM `data_lapangan` WHERE id='$id'";

$qq = mysql_fetch_array($q)
?>
<section>
<section>
<div class="row">
<h2 class="text-center" style="margin-top:100px;"
id="judul">Reservation</h1>
<hr style="width:300px;border-top:3px
solid;margin:auto;margin-bottom:50px;">
</div>
<div class="row">

<img id="myImg" src="img/<?php echo $qq['foto']
?>" alt="<?php echo $qq['nama'] ?>" class="thumbnail"
style="width:300px;">
</div>
<style type="text/css">
#data{
font-size: 30px;
}
</style>
<?php
if (isset($_POST["pesan"])) {
function acak($panjang){
$karakter=
'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz123456789
';
$string = '';
for ($i = 0; $i < $panjang; $i++) {
$pos = rand(0, strlen($karakter)-1);
$string .= $karakter{$pos};
}
return $string;
}
$kode= acak(5);
$nama_futsal = $_POST['nama_futsal'];
$jenis_lapangan = $_POST['jenis_lapangan'];
$lama = $_POST['lama'];
$pukul = $_POST['pukul'];
$nama_pemesan = $_POST['nama_pemesan'];
$total = $lama*100000;
$sql= mysql_query("INSERT INTO reservasi

VALUES('$kode','$nama_futsal','$jenis_lapangan','$lama','$tang
gal','$pukul','$nama_pemesan','$nohp','$total')");
if($sql){
header("location:notif.php?kode=$kode");
}
else{
echo "gagal";
}
}
?>
<form method="POST" action="">

<h3>Nama Lapangan :<input name="nama_futsal"
value=" <?php echo $qq['nama'] ?>" readonly
style="border:0px;width:70%;background-color:#eeeeee;"></h2>
</div>
<label>Jenis Lapangan</label>
name="jenis_lapangan" style="width:150px;">
<option value="Semen">Semen</option>
<option value="Rumput">Rumput</option>
</select>
</div>
</div>
<label for="jumlah">Lama Bermain</label>
<input type="number" class="form-control"
id="exampleInputEmail1" placeholder="/Jam" name="lama"
style="width:100px;" maxlength="2">
</div>
<label for="nohp">Tanggal Pemesanan</label>
<input type="date" class="form-control"
id="exampleInputEmail1" name="tanggal" style="width:150px;">
</div>
<label>Pukul Bermain</label>
<select class="form-control" name="pukul"
style="width:150px;">
<option value="">--Jam--</option>
<option value="06.00 WIB">06.00
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>

WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
WIB</option>
</select>
</div>
</div>
<label for="nama">Nama Pemesan</label>
id="exampleInputEmail1" placeholder="Nama Penerima"
name="nama_pemesan">
</div>
<label for="nohp">No Handphone</label>
id="exampleInputEmail1" placeholder="No Handphone"
name="nohp">
</div>
<input type="submit" value="Pesan" name="pesan"

class="btn btn-info" style="width:100px;"></input>
</form>
</div>
</div>
</section>
</div>
</section>
<div class="row">

</div>
</div>
</footer>

-->
</body>
</html>
6. notif.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Notifikasi</title>


href="css/slide.css">
</head>
<body style="background-color:#eeeeee;font-
family:myFirstFont;">

style="background:#1f1f14;;font-family: 'Abril Fatface',
cursive;">

navigation</span>
</button>

style="font-family: 'Acme';">Futsal Medan</a>
</div>

<li><a href="index.php"
class="scroolo">Kembali</a></li>
</ul>
</div>
</div>
</nav>
<?php
$kode = $_GET['kode'];
$que = "SELECT * FROM `reservasi` WHERE kode='$kode'";

$qq = mysql_fetch_array($q)
?>
<section style="min-height:1100px;">
<div class="row">
top:100px;">TERIMA KASIH TELAH MEMESAN
</div>
</div>
<br>
<h2>Deskripsi Pesanan Anda :</h2>
<table style="">
<tr >
<th style="font-size:25px;">Kode
Pesanan&nbsp</th>
<td style="font-size:25px;">:</td>
<th style="font-size:25px;">&nbsp<?php echo
$qq['kode'] ?></th>
</tr>
<tr>
<th style="font-size:25px;">Atas
Nama&nbsp</th>

$qq['nama_pemesan'] ?></th>
</tr>
<tr>
<th style="font-size:25px;">Total
Harga&nbsp</th>
<th style="font-size:25px;">&nbspRp. <?php
echo $qq['total'] ?></th>
</tr>
<tr>
<th style="font-size:25px;">No
Handphone&nbsp</th>
$qq['nohp'] ?></th>
</tr>
</table>
<p style="color:red;">*Harap menyimpan kode
pemesanan anda</p>
<br>
<br>
</div>
<h2 style="font-size:20px;">Pembayaran dapat
melalui rekening bank yang telah kami sediakan di bawah ini
:</h2>
<h2 style="font-size:20px;"><b>BNI No Rek
:12344321 <br> Atas Nama : Futsal Medan</b></h2>
<h2 style="font-size:20px;"><b>MANDIRI No Rek
<h2 style="font-size:20px;"><b>BRI No Rek
<br>
<br>
<h2 style="font-size:20px;">Bila Mengalami masalah
dapat menghubungi call center kami : <br>
<b>Nama : 061-734444 </b></h2>
</div>
<div class="row">
<div class="col-md-6 col-md-offset-5">
<a href="konfirmasi.php"><button type="button"
class="btn btn-success" style="margin-top:100px;
width:200px;background-color:#248f24;">Konfirmasi
Pembayaran</button></a>
</div>
</div>
</div>

</div>
</section>
<footer>
<div class="row">
<p class="text-center" style="color:white;text-
size:40px;padding-top:30px;">CopyRight By Nama Perusahaan
2018</p>
</div>
</div>
<div class="row text-center">

<a href="" style="margin-left:0px;"
id="putih"><img src="img/fb.png"></a>
<a href="" id="putih"><img src="img/ig.png"></a>
</div>
</footer>

-->
<script
</body>
</html>
7. login.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Halaman Login</title>

</head>

<body style="background:#77B776;font-family: 'Cormorant
Garamond';">
<?php
if (isset($_POST["login"])) {
$username = $_POST['username'];
$password = $_POST['password'];
$sql=mysql_query("SELECT * FROM àdmin` WHERE username =

'$username' and password = '$password'");
$exe = mysql_num_rows($sql);
if ($exe==1) {
header("location:home_admin.php");
}
else {
echo 'alert("Username atau Password Salah...")';
echo '</script>';
}
}
?>


navigation</span>
</button>

</div>

<li><a href="index.php" id="text">Home</a></li>
</ul>
</div>
</div>

</nav>
<div class="col-md-4 col-md-offset-4 form-login">

<div class="outter-form-login">
<div class="logo-login">
<img src="img/admin.png"
style="margin:auto;display:block;margin-
top:100px;width:100px;">
</div>
<form action="" class="inner-login" method="post">
<h3 class="text-center title-login"><b>Login
Admin</b></h3>
name="username" placeholder="Username">
</div>
<input type="password" class="form-
control" name="password" placeholder="Password">
</div>
<input type="submit" class="btn btn-block btn-

custom-green" value="LOGIN" name="login"/>
</form>
</div>
</div>
<style type="text/css">
</style>
<script src="js/notif.js"></script>
</body>
</html>
8. home_admin.php
<!DOCTYPE html>
<html lang="en" id="home">
<head>
<meta http-equiv="X-UA-Compatible"
content="IE=edge">
initial-scale=1">
<title>Halaman Admin</title>

</head>

<body style="font-family:
'Philosopher';background:#77B776">


collapsed" data-toggle="collapse" data-target="#bs-
example-navbar-collapse-1" aria-expanded="false">
navigation</span>
</button>

</div>
<?php
$que = "SELECT * FROM àdmin`";

$no = 1;
?>
<li><a disable >Hi, Admin</a></li>
<li><a href="login.php" >Logout</a></li>
</ul>
</div>
</div>
</nav>
<section class="admin text-center" style="margin-

top:100px;">
<div class="row">
<div class="col-md-5 col-md-offset-1">
<button type="button" class="btn btn-primary
active btn-lg btn-block" style="background-
color:#1f1f14;border:3px black solid;"
onclick="viewData()">Lihat Data</button>
</div>

<button type="button" class="btn btn-primary
active btn-lg btn-block" style="background-
color:#1f1f14;border:3px black solid;"
onclick="viewInput()">Input Data</button>
</div>
</div>
</div>
</section>
<section class="v_data" id="v_data"

style="display:none;padding-bottom:50px;">
<div class="col-sm-12 text-center"
style="margin-top:50px;">
<span id="judul">Data Lapangan</span>
</div>
<div class="row">
<table style="margin:0 auto;width:80%;border-
collapse:collapse;background:#ecf3eb; font-
family:tahoma; color:#1f1f14;margin-top:50px;">
<tr>
<th style="border:3px solid
white;padding:8px;background-color:
#92C591;color:#1f1f14">Id</th>
#92C591;color:#1f1f14">Nama</th>
#92C591;color:#1f1f14">Foto</th>
#92C591;color:#1f1f14;text-align:center;"
colspan=2>Harga</th>
#92C591;color:#1f1f14">Keterangan</th>
#92C591;color:#1f1f14">Lokasi</th>
colspan=2>Aksi</th>
</tr>
<?php

$que = "SELECT * FROM `data_lapangan`";
$no = 1;
$kalimat=$qq['lokasi'];
$jumlahkarakter=15;
$cetak = substr($kalimat, 0,
$jumlahkarakter);
?>
<tr style="background-color: #92C591;">

<td style="border:3px solid
white;padding:4px 8px;"><?php echo $qq['id'] ?></td>
white;padding:4px 8px;"><?php echo $qq['nama'] ?></td>
white;padding:4px 8px;"><img src="img/<?php echo
$qq['foto'] ?>" style="width:150px;"></td>
white;padding:4px 8px;">Lantai Rp.<?php echo
$qq['semen'] ?></td>
white;padding:4px 8px;">Rumput Rp.<?php echo
$qq['rumput'] ?></td>
white;padding:4px 8px;"><?php echo $qq['keterangan']
?></td>
white;padding:4px 8px;"><?php echo $cetak ?></td>
<td style="text-align:center; border:3px
solid white;padding:4px 8px;"><a
href="proses/delete_lapangan.php?id=<?php echo
$qq['id']; ?>" id="aksi"><img
src="img/delete.png"></a></td>
href="proses/edit_lapangan.php?id=<?php echo $qq['id'];
?>" id="aksi"><img src="img/edit.png"></a></td>
</tr>
<?php $no++; } ?>
</table>
</div>
</div>

<span id="judul">Data Pembayaran</span>
</div>
<div class="row">

<tr>
#92C591;color:#1f1f14">Kode</th>
#92C591;color:#1f1f14">Nama Pengirim</th>
#92C591;color:#1f1f14">Bank Pengirim</th>
#92C591;color:#1f1f14">Bank Tujuan</th>
#92C591;color:#1f1f14">Gambar</th>
#92C591;color:#1f1f14">Tanggal</th>
#92C591;color:#1f1f14">Pukul</th>
#92C591;color:#1f1f14">No Handphone</th>
colspan=2>Aksi</th>
</tr>
<?php
$que = "SELECT * FROM `pembayaran`";

$no = 1;
?>

white;padding:4px 8px;"><?php echo $qq['kode'] ?></td>
white;padding:4px 8px;"><?php echo $qq['nama_pengirim']
?></td>

white;padding:4px 8px;"><?php echo $qq['bank_pengirim']
?></td>
white;padding:4px 8px;"><?php echo $qq['bank_tujuan']
?></td>
white;padding:4px 8px;"><img src="img/<?php echo
$qq['gambar'] ?>" style="width:150px;"></td>
white;padding:4px 8px;"><?php echo $qq['tgl'] ?></td>
white;padding:4px 8px;"><?php echo $qq['pkl'] ?></td>
white;padding:4px 8px;"><?php echo $qq['nohp'] ?></td>
href="proses/delete_pembayaran.php?kode=<?php echo
$qq['kode']; ?>" id="aksi"><img
href="proses/edit_pembayaran.php?kode=<?php echo
src="img/edit.png"></a></td>
</tr>
<?php $no++; } ?>
</table>
</div>
</div>

<span id="judul">Data Reservasi</span>
</div>
<div class="row">
<tr>
#92C591;color:#1f1f14">Kode</th>
#92C591;color:#1f1f14">Nama Futsal</th>
#92C591;color:#1f1f14">Jenis Lapangan</th>

#92C591;color:#1f1f14">Lama Bermain</th>
#92C591;color:#1f1f14">Tanggal</th>
#92C591;color:#1f1f14">Pukul</th>
#92C591;color:#1f1f14">Nama Pemesan</th>
#92C591;color:#1f1f14">No Handphone</th>
#92C591;color:#1f1f14">Total Harga</th>
colspan=2>Aksi</th>
</tr>
<?php
$que = "SELECT * FROM `reservasi`";

$no = 1;
?>

white;padding:4px 8px;"><?php echo $qq['kode'] ?></td>
white;padding:4px 8px;"><?php echo $qq['nama_futsal']
?></td>
white;padding:4px 8px;"><?php echo $qq['jenis_lapangan']
?></td>
white;padding:4px 8px;"><?php echo $qq['lama'] ?>
Jam</td>
white;padding:4px 8px;"><?php echo $qq['tanggal']
?></td>
white;padding:4px 8px;"><?php echo $qq['pukul'] ?></td>

white;padding:4px 8px;"><?php echo $qq['nama_pemesan']
?></td>
white;padding:4px 8px;"><?php echo $qq['nohp'] ?></td>
white;padding:4px 8px;"><?php echo $qq['total'] ?></td>
href="proses/delete_reservasi.php?kode=<?php echo
href="proses/edit_reservasi.php?kode=<?php echo
</tr>
<?php $no++; } ?>
</table>
</div>
</div>

<span id="judul">Data Admin</span>
</div>
<div class="row">
<tr>
#92C591;color:#1f1f14">Nama</th>
#92C591;color:#1f1f14">Username</th>
#92C591;color:#1f1f14">Password</th>
colspan=2>Aksi</th>
</tr>
<?php

$que = "SELECT * FROM àdmin`";
$no = 1;
?>

white;padding:4px 8px;"><?php echo $qq['nama'] ?></td>
white;padding:4px 8px;"><?php echo $qq['username']
?></td>
white;padding:4px 8px;"><?php echo $qq['password']
?></td>
href="proses/delete_admin.php?username=<?php echo
$qq['username']; ?>" id="aksi"><img
href="proses/edit_admin.php?username=<?php echo
$qq['username']; ?>" id="aksi"><img
</tr>
<?php $no++; } ?>
</table>
</div>
</div>
</div>
</section>
<section class="i_data" id="i_data"

style="display:none;padding-bottom:50px;">
<?php
if (isset($_POST["tambah_lapangan"])) {
$nama = $_POST['nama'];
$semen = $_POST['semen'];
$rumput = $_POST['rumput'];
$keterangan = $_POST['keterangan'];
$lokasi = $_POST['lokasi'];

if($nama==""){
echo 'alert("Nama Belum Di isi")';
echo '</script>';
}
elseif($gambar==""){
echo 'alert("Gambar Belum Di isi")';
echo '</script>';
}
else{
$sql= mysql_query("INSERT INTO
data_lapangan
VALUES('$nama','$gambar','$semen','$rumput','$keterangan
','$lokasi','')");
if($sql){
echo '<script
echo 'alert("Berhasil")';
echo '</script>';
echo '<meta http-equiv="refresh"
content="0">';
}
else{
echo '<script
echo 'alert("Gagal")';
echo '</script>';
}
}
}
?>
top:50px;">
<span id="judul" >Tambah Lapangan</span>
</div>
<div class="row">
<label for="Kode">Nama Lapangan</label>

id="exampleInputEmail1" placeholder="Nama Gambar"
name="nama">
</div>
<label for="File">Gambar</label>
<input type="file" name="gambar">
</div>
<label for="Kode">Harga Lapangan
Semen</label>
name="semen">
</div>
Rumput</label>
name="rumput">
</div>
<label for="Kode">Keterangan</label>
name="keterangan">
</div>
<label for="Deskripsi">Lokasi
Map</label>
<textarea class="form-control"
placeholder="Lokasi" style="height:100px;"
name="lokasi"></textarea>
</div>
<input type="submit" class="btn btn-
default" name="tambah_lapangan" value="Tambah">
</form>
</div>
</div>
<?php
if (isset($_POST["tambah_admin"])) {

if($nama==""){
echo 'alert("Nama Belum Di isi")';
echo '</script>';
}
elseif($username==""){
echo 'alert("Username Belum Di isi")';
echo '</script>';
}
else{
$sql= mysql_query("INSERT INTO admin
VALUES('$nama','$username','$password')");
if($sql){
echo '<script
echo '</script>';
echo '<meta http-equiv="refresh"
content="0">';
}
else{
echo '<script
echo '</script>';
}
}
}
?>

<span id="judul" >Tambah Admin</span>
</div>
<div class="row">
enctype="multipart/form-data" style="margin:auto">
id="exampleInputEmail1" placeholder="Nama" name="nama"
style="width:250px;margin:auto;margin-top:50px;">
</div>

id="exampleInputEmail1" placeholder="Username"
name="username" style="width:250px;margin:auto">
</div>
<input type="password" class="form-
control" id="exampleInputEmail1" placeholder="password"
name="password" style="width:250px;margin:auto">
</div>
<input type="submit" class="btn btn-

default" name="tambah_admin" value="Tambah"
style="margin:auto;display:block;">
</form>
</div>
</div>
</div>
</section>
<section class="beranda" id="beranda">

<div class="row">
<h1 class="text-center" style="font-
size:80px;margin-top:10%;">Futsal Medan</h1>
<h2 class="text-center" style="font-
size:50px;margin-top:5%;">HOME ADMIN</h2>
<hr style=" border-top: 3px solid black;" >
</div>
</div>
</div>
</section>
<script src="js/scrol.js"></script>
<script src="js/onclickadmin.js"></script>
<script src="js/bootstrap.js"></script>
</body>
</html>
9. delete_admin.php
<?php
include ('../koneksi.php');
$username = $_GET['username'];
$que = "DELETE FROM àdmin` WHERE username='$username'";

if ($q = mysql_query($que)){
header("location:../home_admin.php");
}
else{
die("delete gagal");
}
?>
10. delete_lapangan.php
<?php
$id = $_GET['id'];
$que = "DELETE FROM `data_lapangan` WHERE id='$id'";
}
else{
}
?>
11. delete_pembayaran.php
<?php
$que = "DELETE FROM `pembayaran` WHERE kode='$kode'";
}
else{
}
?>
12. delete_reservasi.php
<?php
$que = "DELETE FROM `reservasi` WHERE kode='$kode'";
}
else{

}
?>
13. edit_admin.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Edit Admin</title>


<link href="../css/bootstrap.min.css" rel="stylesheet">
href="../css/style.css">
href="../css/slide.css">
<link href="../css/mdb.min.css" rel="stylesheet">
</head>
<body style="background-color:#eeeeee;font-family:


navigation</span>
</button>

</div>

<li><a href="../home_admin.php"
id="text">Back</a></li>
</ul>
</div>

</div>
</nav>
<?php
include('../koneksi.php');
$username = $_GET['username'];
$que = "SELECT * FROM àdmin` where username='$username'

";
?>
<?php
if (isset($_POST["edit"])) {
$sql = mysql_query("UPDATE àdmin` SET nama='$nama',

username='$username',password='$password' WHERE
username='$username'");
if($sql){
echo '</script>';
}
else{
echo '</script>';
}
}
?>
<section>
<div class="row">
top:100px;">
<span id="judul">Edit Reservasi</span>
</div>
</div>

<div class="row">
<label for="Kode">Nama</label>
id="exampleInputEmail1" placeholder="Nama" name="nama"
value="<?php echo $qq['nama'] ?>">
</div>
<label for="Kode">Username</label>
id="exampleInputEmail1" placeholder="Username" name="username"
readonly value="<?php echo $qq['username'] ?>"
</div>
<label for="Kode">Password</label>
<input type="password" class="form-control"
id="exampleInputEmail1" placeholder="Password" name="password"
value="<?php echo $qq['password'] ?>">
</div>
<input type="submit" class="btn btn-default"

name="edit" value="Edit">
</form>
</div>
</div>
</div>
</div>
</section>

-->
<script

</body>
</html>
14. edit_lapangan.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Edit Kuliner</title>


</head>


navigation</span>
</button>

</div>

</ul>
</div>

</div>
</nav>
<?php
$id = $_GET['id'];
$que = "SELECT * FROM `data_lapangan` where id='$id' ";

?>
<?php
$id = $_POST['id'];
$semen = $_POST['semen'];
$rumput = $_POST['rumput'];
$keterangan = $_POST['keterangan'];
$lokasi = $_POST['lokasi'];
move_uploaded_file($tmp_name,"../img/".$file_name);
$sql = mysql_query("UPDATE `data_lapangan` SET

nama='$nama',
foto='$gambar',semen='$semen',rumput='$rumput',keterangan='$ke
terangan',lokasi='$lokasi',id='$id' WHERE id='$id'");
if($sql){
echo '</script>';
}
else{
echo '</script>';
}
}
?>
<section>
<div class="row">

top:100px;">
<span id="judul">Edit Lapangan</span>
</div>
</div>
<div class="row">
<label for="Kode">Id</label>
id="exampleInputEmail1" placeholder="Kode Barang" name="id"
readonly value="<?php echo $qq['id'] ?>"
</div>

<label for="Kode">Nama Lapangan</label>
id="exampleInputEmail1" placeholder="Nama Gambar" name="nama"
value="<?php echo $qq['nama'] ?>">
</div>
<p style="color:red;margin-top:1%;">*File foto
harus dimasukkan</p>
</div>
<label for="Kode">Harga Lapangan Semen</label>
id="exampleInputEmail1" placeholder="Nama Gambar" name="semen"
value="<?php echo $qq['semen'] ?>">
</div>
Rumput</label>
name="rumput" value="<?php echo $qq['rumput'] ?>">
</div>
<label for="Kode">Keterangan</label>

name="keterangan" value="<?php echo $qq['keterangan'] ?>">
</div>
<label for="Deskripsi">Lokasi Map</label>
<textarea class="form-control"
placeholder="Lokasi" style="height:100px;" name="lokasi"><?php
echo $qq['lokasi'] ?></textarea >
</div>

</form>
</div>
</div>
</div>
</div>
</section>

-->
<script
</body>
</html>
15. edit_pembayaran.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Edit Pembayaran</title>


</head>


navigation</span>
</button>

</div>

</ul>
</div>
</div>
</nav>
<?php
$que = "SELECT * FROM `pembayaran` where kode='$kode' ";

?>
<?php

$tgl = $_POST['tgl'];
$pkl = $_POST['pkl'];
move_uploaded_file($tmp_name,"../img/".$file_name);
$sql = mysql_query("UPDATE `pembayaran` SET kode='$kode',

nama_pengirim='$nama_pengirim',bank_pengirim='$bank_pengirim',
bank_tujuan='$bank_tujuan',gambar='$gambar',tgl='$tgl',pkl='$p
kl',nohp='$nohp' WHERE kode='$kode'");
if($sql){
echo '</script>';
}
else{
echo '</script>';
}
}
?>
<section>
<div class="row">
top:100px;">
<span id="judul">Edit Pembayaran</span>
</div>
</div>
<div class="row">
<label for="Kode">Kode</label>

id="exampleInputEmail1" placeholder="Kode Barang" name="kode"
readonly value="<?php echo $qq['kode'] ?>"
</div>

name="nama_pengirim" value="<?php echo $qq['nama_pengirim']
?>">
</div>
name="bank_pengirim" value="<?php echo $qq['bank_pengirim']
?>">
</div>
<label for="Kode">Bank Tujuan</label>
name="bank_tujuan" value="<?php echo $qq['bank_tujuan'] ?>">
</div>
<p style="color:red;margin-top:1%;">*File foto
harus dimasukkan</p>
</div>
<label for="Kode">Tanggal Pengirim</label>
id="exampleInputEmail1" placeholder="Nama Gambar" name="tgl"
value="<?php echo $qq['tgl'] ?>">
</div>
<label for="Kode">Pukul Pengirim</label>
id="exampleInputEmail1" placeholder="Nama Gambar" name="pkl"
value="<?php echo $qq['pkl'] ?>">
</div>

<label for="Kode">No Handphone</label>
id="exampleInputEmail1" placeholder="Nama Gambar" name="nohp"
value="<?php echo $qq['nohp'] ?>">
</div>

</form>
</div>
</div>
</div>
</div>
</section>

-->
<script
</body>
</html>
16. edit_reservasi.php
<!DOCTYPE html>
<html lang="en">
<head>
initial-scale=1">
<title>Edit Reservasi</title>



</head>


navigation</span>
</button>

</div>

</ul>
</div>
</div>
</nav>
<?php
$que = "SELECT * FROM `reservasi` where kode='$kode' ";

?>
<?php

$nama_futsal = $_POST['nama_futsal'];
$jenis_lapangan = $_POST['jenis_lapangan'];
$lama = $_POST['lama'];
$pukul = $_POST['pukul'];
$nama_pemesan = $_POST['nama_pemesan'];
$total = $_POST['total'];
$sql = mysql_query("UPDATE `reservasi` SET kode='$kode',

nama_futsal='$nama_futsal',jenis_lapangan='$jenis_lapangan',la
ma='$lama',tanggal='$tanggal',pukul='$pukul',nama_pemesan='$na
ma_pemesan',nohp='$nohp',total='$total' WHERE kode='$kode'");
if($sql){
echo '</script>';
}
else{
echo '</script>';
}
}
?>
<section>
<div class="row">
top:100px;">
<span id="judul">Edit Reservasi</span>
</div>
</div>
<div class="row">
<label for="Kode">Kode</label>
id="exampleInputEmail1" placeholder="Kode Barang" name="kode"
readonly value="<?php echo $qq['kode'] ?>"
</div>


<label for="Kode">Nama Futsal</label>
id="exampleInputEmail1" placeholder="Nama Futsal"
name="nama_futsal" value="<?php echo $qq['nama_futsal'] ?>">
</div>
<label for="Kode">Jenis Lapangan</label>
id="exampleInputEmail1" placeholder="Jenis Lapangan"
name="jenis_lapangan" value="<?php echo $qq['jenis_lapangan']
?>">
</div>
<label for="Kode">Lama Bermain</label>
id="exampleInputEmail1" placeholder="Lama Bermain" name="lama"
value="<?php echo $qq['lama'] ?>">
</div>
<label for="Kode">Tanggal Bermain</label>
<input type="date" class="form-control"
id="exampleInputEmail1" placeholder="tanggal" name="tanggal"
value="<?php echo $qq['tanggal'] ?>">
</div>
<label for="Kode">Pukul Bermain</label>
id="exampleInputEmail1" placeholder="Pukul" name="pukul"
value="<?php echo $qq['pukul'] ?>">
</div>
<label for="Kode">Nama Pemesan</label>
id="exampleInputEmail1" placeholder="nama_pemesan"
name="nama_pemesan" value="<?php echo $qq['nama_pemesan'] ?>">
</div>
<label for="Kode">No Handphone</label>
id="exampleInputEmail1" placeholder="No Handphone" name="nohp"
value="<?php echo $qq['nohp'] ?>">
</div>
<label for="Kode">Total Harga</label>

id="exampleInputEmail1" placeholder="Total" name="total"
value="<?php echo $qq['total'] ?>">
</div>

</form>
</div>
</div>
</div>
</div>
</section>

-->
<script
</body>
</html>

Futsal Usu 2018

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Futsal Usu 2018

Diunggah oleh

Hak Cipta:

Format Tersedia

SISTEM INFORMASI PENYEWAAN LAPANGAN FUTSAL

LAPORAN TUGAS AKHIR

PROGRAM STUDI D3 TEKNIK INFORMATIKA

UNIVERSITAS SUMATERA UTARA

LAPORAN TUGAS AKHIR

Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh gelar

PROGRAM STUDI TEKNIK INFORMATIKA D3

UNIVERSITAS SUMATERA UTARA

SISTEM INFORMASI PENYEWAAN LAPANGAN FUTSAL

LAPORAN TUGAS AKHIR

Medan, Juli 2018

Keywords: Geographic Information System, Futsal, Medan City, PHP, MySQL

Medan, Juli 2018

BAB 2 LANDASAN TEORI

BAB 3 PERANCANGAN SISTEM

BAB 4 IMPLEMENTASI SISTEM

BAB 5 KESIMPULAN DAN SARAN

UNIVERSITAS SUMATERA UTARA

Nomor Judul Halaman

Nomor Judul Halaman

2.1 Komponen Sistem Informasi 6

UNIVERSITAS SUMATERA UTARA

Nomor Judul Halaman

UNIVERSITAS SUMATERA UTARA

1.1 Latar Belakang Masalah

UNIVERSITAS SUMATERA UTARA

berbeda tetapi pada prinsipnya sama-sama memanfaatkan grafik pemetaan yang

1.2 Rumusan Masalah

1.3 Batasan Masalah

UNIVERSITAS SUMATERA UTARA

1.6 Sistematika Penulisan

UNIVERSITAS SUMATERA UTARA

2.1 Sistem Informasi

UNIVERSITAS SUMATERA UTARA

Beberapa penulis yang mendefinisikan sistem yang menekankan pada elemen

2.1.3 Sistem Informasi

UNIVERSITAS SUMATERA UTARA

2.1.4 Manfaat Sistem Informasi

2.1.5 Pemakai Sistem Informasi

2.1.6 Komponen Sistem Informasi

Hardware Software DATA Procedure People

UNIVERSITAS SUMATERA UTARA

2.2 Geographic Information System (GIS)

2.2.1 Karakteristik SIG

UNIVERSITAS SUMATERA UTARA

5. Mampu mengumpulkan, menyimpan mentransformasikan, menampilkan,

2.2.2 Sumber Kesalahan dalam SIG

2.2.3 Sistem Informasi Geografis Berbasis Web

UNIVERSITAS SUMATERA UTARA

2.4.1 Kelebihan PHP

UNIVERSITAS SUMATERA UTARA

2.4.2 Penulisan PHP

2.4.2.1 Case Sensitivity (Perbedaan Huruf Besar Dan Kecil)

UNIVERSITAS SUMATERA UTARA

2.4.2.2 Penulisan Baris Perintah

2.4.2.3 Karakter Spasi dan Tab

UNIVERSITAS SUMATERA UTARA

UNIVERSITAS SUMATERA UTARA

2.5 CSS (Cascading Style Sheets)

UNIVERSITAS SUMATERA UTARA

2.7 World Wide Web (WWW)

2.8 Basis Data

UNIVERSITAS SUMATERA UTARA