BAB IV IMPLEMENTASI SISTEM
4.4. Pembuatan Antar Muka ( User Interface )
4.4.1. Halaman Pengunjung
Implementasi halaman pengunjung dibagi menjadi 16 yaitu, halaman beranda, galeri foto, buku tamu, berita dan halaman budaya dayak. Halaman budaya dayak terdiri dari 2 sub menu yaitu dayak bahau dan dayak benuaq, dimana masing – masing keduanya terbagi lagi ke dalam 6 sub menu yaitu kerajinan, sistem teknologi, sistem pengetahuan, organisasi sosial, lagu, tarian.
4.4.1.1 Halaman Beranda Pengunjung
Gambar 4.2 Halaman beranda pengunjung
4.4.1.2 Halaman Kerajinan Pengunjung
Gambar 4.3 Halaman kerajinan pengunjung
Pada halaman ini ditampilkan nama kerajinan, uraian kerajinan, dan foto kerajinan. Untuk budaya Dayak Bahau dan Dayak Benuaq masing – masing memiliki halaman kerajinan yang berbeda namun desain tampilannya sama
dengan data yang berbeda. Listing program untuk menampilkan halaman ini adalah
Listing Program 4.2 kerajinan.php
4.4.1.3Halaman Sistem Teknologi Pengunjung
Gambar 4.4 Halaman sistem teknologi pengunjung Pada halaman ini ditampilkan nama sistem teknologi, uraian sistem teknologi, dan foto sistem teknologi. Untuk budaya Dayak Bahau dan Dayak Benuaq masing – masing memiliki halaman sistem teknologi yang berbeda namun desain tampilannya sama dan dengan data yang berbeda. Listing program untuk menampilkan halaman ini adalah
<?php $kode = $_GET["id"]; if($kode=="kerajinanbahau") { $id="1"; } elseif($kode=="kerajinanbenuaq"){ $id="2"; } ?> <?php $query_data = query_select_kerajinan2($id); while($data=mysql_fetch_array($query_data)) { ?> <h1><?php echo $data['bkNama']; ?></h1> <?php echo $data['kerajinanUraian']; ?><br>
<img src="<?php echo $data['fotoLink']; ?>"/><br>  <?php
} ?>
Listing Program 4.3 sistek.php
4.4.1.4Halaman Sistem Pengetahuan Pengunjung
Gambar 4.5 Halaman sistem pengetahuan pengunjung Pada halaman ini ditampilkan nama sistem pengetahuan, uraian sistem pengetahuan, dan foto sistem pengetahuan. Untuk budaya Dayak Bahau dan Dayak Benuaq masing – masing memiliki halaman sistem pengetahuan yang berbeda namun desain tampilannya sama dan dengan data yang berbeda. Listing program untuk menampilkan halaman ini adalah
<?php $kode = $_GET["id"]; if($kode=="sistekbahau") { $id="1"; } elseif($kode=="sistekbenuaq"){ $id="2"; } ?> <?php $query_data = query_select_sistek2($id); while($data=mysql_fetch_array($query_data)) { ?> <h1><?php echo $data['sistekNama']; ?></h1> <?php echo $data['sistekUraian']; ?><br>
<img src="<?php echo $data['fotoLink']; ?>"/><br>  <?php
Listing Program 4.4 sispeng.php
4.4.1.5Halaman Organisasi Sosial Pengunjung
Gambar 4.6 Halaman organisasi sosial pengunjung
Pada halaman ini ditampilkan nama organisasi sosial, uraian organisasi sosial, dan foto organisasi sosial. Untuk budaya Dayak Bahau dan Dayak Benuaq masing – masing memiliki halaman organisasi sosial yang berbeda namun desain tampilannya sama dan dengan data yang berbeda. Listing program untuk menampilkan halaman ini adalah
<?php $kode = $_GET["id"]; if($kode=="sispengbahau") { $id="1"; } elseif($kode=="sispengbenuaq"){ $id="2";}?> <?php $query_data = query_select_sispeng2($id); while($data=mysql_fetch_array($query_data)) { ?> <h1><?php echo $data['sispengNama']; ?></h1> <?php echo $data['sispengUraian']; ?><br>
<img src="<?php echo $data['fotoLink']; ?>"/><br> <?php}?>
<?php $kode = $_GET["id"]; if($kode=="orgsosbahau") { $id="1"; } elseif($kode=="orgsosbenuaq"){ $id="2"; } ?> <?php $query_data = query_select_orgsos2($id); while($data=mysql_fetch_array($query_data)) { ?> <h1><?php echo $data['orgsosNama']; ?></h1> <?php echo $data['orgsosUraian']; ?><br>
Listing Program 4.5 orgsos.php
4.4.1.6Halaman Lagu Pengunjung
Gambar 4.7 Halaman lagu pengunjung
Pada halaman ini ditampilkan judul lagu, daftar lagu, dan mp3 player untuk memutar lagu. Untuk budaya Dayak Bahau dan Dayak Benuaq masing –
masing memiliki halaman lagu yang berbeda namun desain tampilannya sama dan dengan data yang berbeda. Listing program untuk menampilkan halaman ini adalah
<?php $kode = $_GET["id"]; if($kode=="lagubahau") { $id="1"; ?> <h1>Lagu Bahau</h1>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="153"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab #version=6,0,40,0">
<param name="id" value="xspf_player" /> <param name="align" value="middle" />
<param name="allowScriptAccess" value="sameDomain" /> <param name="quality" value="high" />
<param name="bgcolor" value="#b0b0b" /> <param name="src"
value="http://localhost/bdydayak/galerilagu/lagubahau/xspf_player_slim.swf?au toload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubahau/playl ist.php" /><embed id="xspf_player" type="application/x-shockwave-flash" width="400" height="22"
src="http://localhost/bdydayak/galerilagu/lagubahau/xspf_player_slim. swf?autoload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubahau /playlist.php" bgcolor="#e6e6e6" quality="high"
allowscriptaccess="sameDomain" align="middle"></embed></object> <?php } elseif($kode=="lagubenuaq"){ $id="2"; ?> <h1>Lagu Benuaq</h1>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="153"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab #version=6,0,40,0">
<param name="id" value="xspf_player" /> <param name="align" value="middle" />
<param name="allowScriptAccess" value="sameDomain" /> <param name="quality" value="high" />
<param name="bgcolor" value="#b0b0b" /> <param name="src"
value="http://localhost/bdydayak/galerilagu/lagubenuaq/xspf_player_slim.swf?a utoload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubenuaq/pla ylist.php" /><embed id="xspf_player" type="application/x-shockwave-flash" width="400" height="22"
src="http://localhost/bdydayak/galerilagu/lagubenuaq/xspf_player_slim. swf?autoload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubenua q/playlist.php" bgcolor="#e6e6e6" quality="high"
allowscriptaccess="sameDomain" align="middle"></embed></object> <?php } $query_data = query_select_lagu($id); $i=0; while($data=mysql_fetch_array($query_data)) { $datalagu[$i][0] = $data['laguId']; $datalagu[$i][1] = $data['laguJudul']; $datalagu[$i][2] = $data['laguUraian']; $datalagu[$i][3] = $data['budayaId']; $datalagu[$i][4] = $data['laguLink']; $i++; } ?> <?php if($kode=="lagubahau") {
echo "<h1>Daftar Lagu Bahau</h1>"; } else {
echo "<h1>Daftar Lagu Benuaq</h1>";}
for($inc = 0; $inc < $i; $inc++) { ?>
<h4><?php echo $datalagu[$inc][1]; ?></h4> <h5><?php echo $datalagu[$inc][4]; ?></h5> <?php}?>
Listing Program 4.6 lagu.php
4.4.1.7Halaman Tarian Pengunjung
Gambar 4.8 Halaman tarian pengunjung
Pada halaman ini ditampilkan nama tarian, uraian tarian, dan video player untuk memutar video. Untuk budaya Dayak Bahau dan Dayak Benuaq masing –
masing memiliki halaman tarian yang berbeda namun desain tampilannya sama dan dengan data yang berbeda. Listing program untuk menampilkan halaman ini adalah
Listing Program 4.7 tarian.php <?php $kode = $_GET["id"]; if($kode=="lagubahau") { $id="1"; ?> <h1>Lagu Bahau</h1>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="153"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab #version=6,0,40,0">
<param name="id" value="xspf_player" /> <param name="align" value="middle" />
<param name="allowScriptAccess" value="sameDomain" /> <param name="quality" value="high" />
<param name="bgcolor" value="#b0b0b" /> <param name="src"
value="http://localhost/bdydayak/galerilagu/lagubahau/xspf_player_slim.swf?au toload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubahau/playl ist.php" /><embed id="xspf_player" type="application/x-shockwave-flash" width="400" height="22"
src="http://localhost/bdydayak/galerilagu/lagubahau/xspf_player_slim. swf?autoload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubahau /playlist.php" bgcolor="#e6e6e6" quality="high"
allowscriptaccess="sameDomain" align="middle"></embed></object> <?php } elseif($kode=="lagubenuaq"){ $id="2"; ?> <h1>Lagu Benuaq</h1>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="153"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab #version=6,0,40,0">
<param name="id" value="xspf_player" /> <param name="align" value="middle" />
<param name="allowScriptAccess" value="sameDomain" /> <param name="quality" value="high" />
<param name="bgcolor" value="#b0b0b" /> <param name="src"
value="http://localhost/bdydayak/galerilagu/lagubenuaq/xspf_player_slim.swf?a utoload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubenuaq/pla ylist.php" /><embed id="xspf_player" type="application/x-shockwave-flash" width="400" height="22"
src="http://localhost/bdydayak/galerilagu/lagubenuaq/xspf_player_slim. swf?autoload=true&playlist_url=http://localhost/bdydayak/galerilagu/lagubenua q/playlist.php" bgcolor="#e6e6e6" quality="high"
allowscriptaccess="sameDomain" align="middle"></embed></object> <?php } $query_data = query_select_lagu($id); $i=0; while($data=mysql_fetch_array($query_data)) { $datalagu[$i][0] = $data['laguId']; $datalagu[$i][1] = $data['laguJudul']; $datalagu[$i][2] = $data['laguUraian']; $datalagu[$i][3] = $data['budayaId']; $datalagu[$i][4] = $data['laguLink']; $i++; } ?> <?php if($kode=="lagubahau") {
echo "<h1>Daftar Lagu Bahau</h1>"; } else {
echo "<h1>Daftar Lagu Benuaq</h1>";}
for($inc = 0; $inc < $i; $inc++) { ?>
<h4><?php echo $datalagu[$inc][1]; ?></h4> <h5><?php echo $datalagu[$inc][4]; ?></h5> <?php}?>
4.4.1.8 Halaman Galeri Foto Pengunjung
Gambar 4.9 Halaman galeri foto pengunjung
Pada halaman ini ditampilkan judul foto dan foto. Listing program untuk menampilkan halaman ini adalah
Listing Program 4.8 galerifotouser.php
4.4.1.9Halaman Buku Tamu Pengunjung
<table width="100%" bgcolor="000000" border="2"> <tr><td>Judul Foto</td> <td>Foto</td> </tr> <?php $query_data = query_select_foto2($id); while($data=mysql_fetch_array($query_data)) { ?><tr><td><?php echo $data['fotoJudul']; ?></td>
<td><img src="<?php echo $data['fotoLink']; ?>"/></td> </tr>
<?php } ?> </table>
Gambar 4.10 Halaman buku tamu pengunjung
Pada halaman ini ditampilkan nama, email dan komentar tamu. Listing program untuk menampilkan halaman ini adalah
Listing Program 4.9 bukutamupengunjung.php