Documente Academic
Documente Profesional
Documente Cultură
Berikut ini merupakan bari kode (script) dengan bahasa pemrograman berbasis web yaitu HTML, PHP, dan Javascript. Kode baris ini disusun berdasarkan struktur pemrograman dalam pembentukan aplikasi ini sesuai dengan bab 3 pelaksanaan kerja praktik. Berikut adalah bari kode tersebut sesuai dengan nama file masing-masing. 1. petadinamis.php
<?php include "koneksi.php"; ?> <html> <head> <!-- <script type="text/javascript" src="jquery1.6.2.min.js"></script> --> <script type="text/javascript" src="jquery-1.7.2.js"></script> <meta name="viewport" content="initial-scale=1.0, userscalable=no" /> <title>Peta Dinamis</title> <style type="text/css"> <!-.style125 { font-family:Arial, Helvetica, sans-serif; font-size: small; } --> </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCeCAhmBV 1aJRpEyTpQzwZV-NS_zIfGdSE&sensor=false&language=id"></script> <script type="text/javascript"> //Mendeklarasikan Array untuk menampung marker dan balloon yang ada sehiingga mempermudah saat memanggilnya kembali var markers=new Array(); var infowindows=new Array(); function initialize(){
var myLatLng = new google.maps.LatLng(-5.422011, 105.258143); var myOptions = { zoom: 15, center:myLatLng, mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true } map = new google.maps.Map( document.getElementById('canvas'),myOptions); <?php include "koridor.js"; ?> <?php //Mengambil data dari database dan melakukan looping untuk menampilkan marker sesuai kordinat pada database $sql="select * from tempat_pemberhentian order by nama"; $query=mysql_query($sql) or die(mysql_error()); while($data=mysql_fetch_array($query)){ ?> var marker= new google.maps.Marker({ position:new google.maps.LatLng(<?php echo $data['lat']; ?>, <?php echo $data['lon']; ?>), map:map, title:"Saya disini" }); marker.setIcon({ url: "icon/bus.png" }); markers.push(marker); google.maps.event.addListener(marker, 'click', function() { var infowindow= new google.maps.InfoWindow({ content:"<strong><?php echo $data['nama']; ?></strong><p><a href='?hal=informasi&menu=user&kode=<?php echo $data['id_tp']; ?>'>Info Selengkapnya</a><br>Lihat Dibawah Peta", size: new google.maps.Size(1,1),
position:new google.maps.LatLng(<?php echo $data['lat']; ?>, <?php echo $data['lon']; ?>) }); infowindow.open(map); infowindows.push(infowindow); }); <?php } ?> $('#cari').change(function(){ var i=$('#cari').val(); var koodinat=markers[i].getPosition(); map.panTo(koodinat); updatedata(); }); } </script> </head> <body onLoad="initialize()"> <div class="style125" id="canvas" style="width: 678; height: 414"></div> </body> </html>
2.
koneksi.php
<?php $koneksi=mysql_connect("localhost","root",""); if($koneksi){ mysql_select_db("tblsql"); } ?>
3.
index.php
<?php include "koneksi.php";
$sql="select id_koridor,nama,panjang,halte,plang,via_jalan,bus,foto from koridor where id_koridor='$kode'"; $kueri=mysql_query($sql) or die("Gaggal Query"); list($id_koridor,$nama,$panjang,$halte,$plang,$via_jalan,$bu s,$foto)=mysql_fetch_array($kueri); ?> <html> <head> <title>Jalur Trans Bandar Lampung</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/JavaScript"> <!-function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; }
function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> </script> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="initialize()"> <!-- ImageReady Slices (WebTBL - New.psd) --> <table id="Table_01" width="1366" height="1092" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="14" background="images/webtbl_01.jpg" width="196" height="1091"></td> <td colspan="9" background="images/webtbl_02.jpg" width="952" height="126"></td> <td colspan="2" rowspan="13" background="images/webtbl_03.jpg" width="218" height="1008"></td> </tr> <tr> <td colspan="2" background="images/webtbl_04.jpg" width="409" height="44"></td> <td><a href="index.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image34','','images/webtbl2_05.jpg' ,1)"> <img src="images/webtbl_05.jpg" name="Image34" width="77" height="44" border="0"></a></td> <td><a href="dokumen/UserGuideTBL.pdf" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image35','','images/webtbl2_06.jpg' ,1)" target="_blank"> <img src="images/webtbl_06.jpg" name="Image35" width="155" height="44" border="0"></a></td>
<td colspan="3"><a href="dokumen/JalurTBL.pdf" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image36','','images/webtbl2_07.jpg' ,1)" target="_blank"> <img src="images/webtbl_07.jpg" name="Image36" width="162" height="44" border="0"></a></td> <td colspan="2"><a href="admin/login.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image37','','images/webtbl2_08.jpg' ,1)" target="_blank"> <img src="images/webtbl_08.jpg" name="Image37" width="149" height="44" border="0"></a></td> </tr> <tr> <td rowspan="10" background="images/webtbl_09.jpg" width="39" height="541"></td> <td colspan="8" background="images/webtbl_10.jpg" width="913" height="64"><table width="900" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="340"> </td> <td width="570"> <select id="cari" name="cari"> <option>[Koridor yang dilewati] - [Tempat pemberhentian]</option> <?php $sql="select * from tempat_pemberhentian order by nama"; $query=mysql_query($sql) or die(mysql_error()); $n=0; while($data=mysql_fetch_array($query)){ ?> <option value="<?php echo $n; ?>">Koridor <?php echo $data['no_koridor']; ?> - <?php echo $data['nama']; ?></option> <?php $n++; }
?> </select> </td> </tr> </table></td> </tr> <tr> <td colspan="4" rowspan="8" width="678" height="414"><?php include "petadinamis.php"; ?></td> <td rowspan="8" background="images/webtbl_12.jpg" width="36" height="414"></td> <td colspan="3" background="images/webtbl_13.jpg" width="199" height="22"></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image38','','images/webtbl_14.jpg',1)"> <img src="images/webtbl_14.jpg" name="Image38" width="177" height="56" border="0"></a></td> <td rowspan="7" background="images/webtbl_15.jpg" width="22" height="392"></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=2" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image39','','images/webtbl_16.jpg',1)"> <img src="images/webtbl_16.jpg" name="Image39" width="177" height="56" border="0"></a></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=3"
onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image40','','images/webtbl_17.jpg',1)"> <img src="images/webtbl_17.jpg" name="Image40" width="177" height="57" border="0"></a></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=4" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image41','','images/webtbl_18.jpg',1)"> <img src="images/webtbl_18.jpg" name="Image41" width="177" height="56" border="0"></a></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=5" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image42','','images/webtbl_19.jpg',1)"> <img src="images/webtbl_19.jpg" name="Image42" width="177" height="55" border="0"></a></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=6" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image43','','images/webtbl_20.jpg',1)"> <img src="images/webtbl_20.jpg" name="Image43" width="177" height="56" border="0"></a></td> </tr> <tr> <td colspan="2"><a href="?hal=informasijalur&menu=user&kode=7" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image44','','images/webtbl_21.jpg',1)">
<img src="images/webtbl_21.jpg" name="Image44" width="177" height="56" border="0"></a></td> </tr> <tr> <td colspan="8" background="images/webtbl_22.jpg" width="913" height="63"></td> </tr> <tr> <td colspan="9" background="images/webtbl_23.jpg" width="952" height="297"> <?php extract($_GET); if($hal==informasijalur) { include "informasijalur.php"; } else if($hal==informasi) { include "informasi.php"; } else { include "home.php"; } ?> </td> </tr> <tr> <td colspan="10" background="images/webtbl_24.jpg" width="953" height="83"></td> <td background="images/webtbl_25.jpg" width="217" height="83"></td> </tr> <tr> <td> <img src="images/spacer.gif" width="196" height="1" alt=""></td> <td>
<img src="images/spacer.gif" width="39" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="370" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="77" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="155" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="76" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="36" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="50" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="127" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="22" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="217" height="1" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> </body> </html>
4.
home.php
<html> <head> <title>Home</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- ImageReady Slices (WebTBL-.psd) --> <table id="Table_01" width="952" height="297" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="3" background="images/home_01.jpg" width="952" height="105"></td> <td rowspan="3" background="images/home_02.jpg" width="1" height="297"></td> </tr> <tr> <td rowspan="2" background="images/home_03.jpg" width="389" height="192"></td> <td background="images/home_04.jpg" width="495" height="136"><table width="490" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="222" valign="top" style="fontfamily:Arial, Helvetica, sans-serif; font-size:12px;" align="justify"><img align="middle" src="images/peta.png"></td> <td width="261" style="font-family:Arial, Helvetica, sans-serif; font-size:11px;" align="justify"> Selamat Datang, <br> Jalur Trans Bandar Lampung membantu Anda mendapatkan informasi jalur dan tempat pemberhentian berdasarkan tujuan Anda. Saat ini Jalur Trans Bandar Lampung memiliki 7 kordior yang hampir meliputi seluruh wilayah kota Bandar Lampung
dan telah didukung dengan adanya halte-halte transit sehingga memudahkan penumpang mencapai tempat tujuan. </td> </tr> </table></td> <td rowspan="2" background="images/home_05.jpg" width="67" height="192"></td> </tr> <tr> <td background="images/home_06.jpg" width="495" height="56"></td> </tr> </table> <!-- End ImageReady Slices --> </body> </html> berpindah jalur untuk
5.
informasijalur.php
<?php include "koneksi.php"; $sql="select id_koridor,nama,panjang,halte,plang,via_jalan,bus,foto from koridor where id_koridor='$kode'"; $kueri=mysql_query($sql) or die("Gaggal Query"); list($id_koridor,$nama,$panjang,$halte,$plang,$via_jalan,$bus, $foto)=mysql_fetch_array($kueri); ?> <html> <head> <title>Informasi Koridor</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-body { font-family:Arial, Helvetica, sans-serif; } --> </style></head>
</head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- ImageReady Slices (informasi.psd) --> <table id="Table_01" width="952" height="297" border="0" cellpadding="0" cellspacing="0" style="font:Arial, Helvetica, sans-serif; font-size:12px;"> <tr> <td colspan="3" rowspan="2"> <img src="images/informasi_01.jpg" width="373" height="48" alt=""></td> <td colspan="2" background="images/informasi_02.jpg" width="580" height="27" align="right" style="fontfamily:Arial, Helvetica, sans-serif; font-size:18px; color:#134D8D"> Koridor <?php echo $id_koridor ?> <?php echo $nama ?> </td> <td> <img src="images/spacer.gif" width="1" height="27" alt=""></td> </tr> <tr> <td rowspan="3" background="images/informasi_03.jpg" width="579" height="270"><table width="550" border="0" cellspacing="2" cellpadding="2"> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">No Koridor </td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $id_koridor ?></td> </tr> </table></td> </tr>
<tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Nama</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $nama ?></td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Panjang</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $panjang ?> KM </td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Jumlah Halte </td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td>
<td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $halte ?> Titik Pemberhentian </td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Jumlah Plang </td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $plang ?> Titik Pemberhentian</td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Via Jalan </td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $via_jalan ?></td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr>
<td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Jumlah Bus </td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $bus ?> Buah</td> </tr> </table></td> </tr> </table></td> <td rowspan="3"> <img src="images/informasi_04.jpg" width="1" height="270" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="21" alt=""></td> </tr> <tr> <td rowspan="2"> <img src="images/informasi_05.jpg" width="44" height="249" alt=""></td> <td background="images/informasi_06.jpg" width="282" height="212"><img src="admin/<?php echo $foto ?>" width="282" height="212px" /></td> <td rowspan="2"> <img src="images/informasi_07.jpg" width="47" height="249" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="212" alt=""></td> </tr> <tr> <td> <img src="images/informasi_08.jpg" width="282" height="37" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="37" alt=""></td> </tr>
6.
informasi.php
<?php include "koneksi.php"; $sql="select id_tp,nama,jenis,lat,lon,wilayah,jalan,koridor,foto from tempat_pemberhentian where id_tp='$kode'"; $kueri=mysql_query($sql) or die("Gaggal Query"); list($id_tp,$nama,$jenis,$lat,$lon,$wilayah,$jalan,$koridor,$f oto)=mysql_fetch_array($kueri); ?> <html> <head> <title>Titik Pemberhentian</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-body { font-family:Arial, Helvetica, sans-serif; } --> </style></head> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- ImageReady Slices (informasi.psd) --> <table id="Table_01" width="952" height="297" border="0" cellpadding="0" cellspacing="0" style="font:Arial, Helvetica, sans-serif; font-size:12px;"> <tr> <td colspan="3" rowspan="2"> <img src="images/informasi_01.jpg" width="373" height="48" alt=""></td>
<td colspan="2" background="images/informasi_02.jpg" width="580" height="27" align="right" style="fontfamily:Arial, Helvetica, sans-serif; font-size:18px; color:#134D8D"> <?php echo $nama ?> </td> <td> <img src="images/spacer.gif" width="1" height="27" alt=""></td> </tr> <tr> <td rowspan="3" background="images/informasi_03.jpg" width="579" height="270"><table width="550" border="0" cellspacing="2" cellpadding="2"> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Nama</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $nama ?></td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Alamat</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;">Jalan <?php echo $jalan ?>, <?php echo $wilayah ?></td>
</tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Latitude</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $lat ?></td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Longitude</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $lon ?></td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Koridor</td>
<td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">:</td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $koridor ?></td> </tr> </table></td> </tr> <tr> <td style="border-bottom:1px solid #A0B2B6;"><table width="530" border="0" cellspacing="1" cellpadding="1"> <tr> <td width="80" style="font:Arial, Helvetica, sans-serif; font-size:12px;">Jenis</td> <td width="5" style="font:Arial, Helvetica, sans-serif; font-size:12px;">: </td> <td style="font:Arial, Helvetica, sans-serif; font-size:12px;"><?php echo $jenis ?></td> </tr> </table></td> </tr> </table></td> <td rowspan="3"> <img src="images/informasi_04.jpg" width="1" height="270" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="21" alt=""></td> </tr> <tr> <td rowspan="2"> <img src="images/informasi_05.jpg" width="44" height="249" alt=""></td> <td background="images/informasi_06.jpg" width="282" height="212"><img src="admin/<?php echo $foto ?>" width="282" height="212px" /></td> <td rowspan="2"> <img src="images/informasi_07.jpg" width="47" height="249" alt=""></td>
<td> <img src="images/spacer.gif" width="1" height="212" alt=""></td> </tr> <tr> <td> <img src="images/informasi_08.jpg" width="282" height="37" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="37" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> </body> </html>
7.
login.php
<html> <head> <title>Login Administrator</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-p, h1, form, button{border:0; margin:0; padding:0;} body { background-image: url(img/warna.jpg); background-repeat: repeat-x; background-color: #E2F5E2; } --> </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <p> <!-- ImageReady Slices (Login.psd) --> </p>
<p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <form id="form1" name="form1" method="post" action="aksilogin.php"> <table width="495" height="289" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01"> <tr> <td colspan="4"> <img src="img/login_01.png" width="495" height="95" alt=""></td> </tr> <tr> <td> <img src="img/login_02.png" width="132" height="140" alt=""></td> <td colspan="2" background="img/login_03.png" width="341" height="140"><table width="200" height="70" border="0" cellpadding="0" cellspacing="0"> <tr> <td><input type="text" name="username" id="username" /></td> </tr> <tr> <td> </td> </tr> <tr> <td><input type="password" name="password" id="password" /></td> </tr> </table></td> <td rowspan="2">
<img src="img/login_04.png" width="22" height="193" alt=""></td> </tr> <tr> <td colspan="2" background="img/login_05.png" width="254" height="53"> <table width="200" border="0" align="center" cellpadding="0" cellspacing="0"> <?php if($_GET['pesan']!=""){ ?> <tr> <td style="font-family:Arial, Helvetica, sansserif; font-size:12px;"><?php echo $_GET['pesan']; ?></td> </tr> <?php } </table> </td> <td background="img/login_06.png" width="219" height="53"><table width="197" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="70"><input type="submit" name="login" id="login" value="Login" /></td> <td width="127"><input name="reset" type="reset" id="reset" value="Reset"></td> </tr> </table></td> </tr> <tr> <td> <img src="img/spacer.gif" width="132" height="1" alt=""></td> <td> <img src="img/spacer.gif" width="122" height="1" alt=""></td> <td> <img src="img/spacer.gif" width="219" height="1" alt=""></td> <td> ?>
<img src="img/spacer.gif" width="22" height="1" alt=""></td> </tr> </table> </form> <!-- End ImageReady Slices --> </body> </html>
8.
aksilogin.php
<?php //Memulai sesi session_start();
//Perintah SQL untuk mengambil data dari tabel admin dnegan mencocokan username // dan password yang dienkripsi $sql="select nama, username, password from admin where username='$usename' and password=PASSWORD('$password')"; $query=mysql_query($sql)or die(mysql_error()); $data=mysql_fetch_array($query);
//Apabila data tidak kosong maka set nilai-nilai sesi if($data['nama']!=""){ $_SESSION['nama']=$data['nama'];
$_SESSION['username']=$data['username']; $_SESSION['password']=$data['password'];
//Kemudian ditampilkan file tampil siswa header("location:tampil.php"); }else{ //Jika data kosong maka ditampilkan kembali login.php dengna mengirimkan variabel pesan header("location:login.php?pesan=Maaf, kombinasi username dan password tidak cocok"); } ?>
9.
logout.php
<?php session_start();
// perintah untuk menghapus session dengan variabel tertentu session_unregister('nama'); session_unregister('username'); session_unregister('password');
10. ceksession.php
<?php session_start();
11. tampil.php
<?php include "ceksession.php" ?> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Database Rute TBL</title> <style type="text/css"> <!-.style3 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; } .style5 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; } .style6 {font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: bold; }
a.yh:link, a.yh:visited{ font-size:15px; color:#000000; font-weight:normal; text-decoration:none; } a.yh:hover{ font-size:15px; color:#FF3300; font-weight:normal; } --> </style> </head>
<body> <table width="1000" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td style="font-family:Arial, Helvetica, sans-serif; fontsize:20px; color:#006699;" align="center">DATABASE TEMPAT PEMBERHENTIAN TRANS BANDAR LAMPUNG</td> </tr> <tr>
<td> </td> </tr> <tr> <td class="style6"><a href="tambah.php" class="yh">Tambah Data</a> - <a href="logout.php" class="yh">Logout</a></td> </tr> <tr> <td> </td> </tr> <tr> <td><table width="1200" border="0" align="center" cellpadding="2" cellspacing="2"> <tr> <td width="30" bgcolor="#FFFF66" class="style5" align="center">ID</td> <td width="100" bgcolor="#FFFF66" class="style5" align="center">Nama</td> <td width="90" bgcolor="#FFFF66" class="style5" align="center">Jenis</td> <td width="70" bgcolor="#FFFF66" class="style5" align="center">Latitude</td> <td width="70" bgcolor="#FFFF66" class="style5" align="center">Longitude</td> <td width="70" bgcolor="#FFFF66" class="style5" align="center">Tanggal</td> <td width="100" bgcolor="#FFFF66" class="style5" align="center">Wilayah</td> <td width="100" bgcolor="#FFFF66" class="style5" align="center">Jalan</td>
<td width="70" bgcolor="#FFFF66" class="style5" align="center">No Koridor</td> <td width="200" bgcolor="#FFFF66" class="style5" align="center">Koridor</td> <td width="200" bgcolor="#FFFF66" class="style5" align="center">Foto</td> <td width="102" bgcolor="#FFFF66" class="style5" align="center">Edit</td> </tr> <?php // memanggil file koneksi untuk melakukan koneksi ke database include "koneksi.php";
// set perintah SQL untuk menampilkan data dan eksekusi SQL tersebut $sql=mysql_query("SELECT * FROM tempat_pemberhentian ORDER BY id_tp");
// menampung hasil dari eksekusi SQL dan menampilkannya selama data masih ada while($data=mysql_fetch_array($sql)){ $n++; ?> <tr> <td width="30" bgcolor="#E1E1E1" class="style3" align="center"><?php echo $data['id_tp']; ?></td> <td width="100" bgcolor="#E1E1E1" class="style3"><?php echo $data['nama']; ?></td>
<td width="90" bgcolor="#E1E1E1" class="style3"><?php echo $data['jenis']; ?></td> <td width="70" bgcolor="#E1E1E1" class="style3"><?php echo $data['lat']; ?></td> <td width="70" bgcolor="#E1E1E1" class="style3"><?php echo $data['lon']; ?></td> <td width="70" bgcolor="#E1E1E1" class="style3"><?php echo $data['tgl']; ?></td> <td width="100" bgcolor="#E1E1E1" class="style3"><?php echo $data['wilayah']; ?></td> <td width="100" bgcolor="#E1E1E1" class="style3"><?php echo $data['jalan']; ?></td> <td width="70" bgcolor="#E1E1E1" class="style3"><?php echo $data['no_koridor']; ?></td> <td width="200" bgcolor="#E1E1E1" class="style3"><?php echo $data['koridor']; ?></td> <td width="200" bgcolor="#E1E1E1" class="style3"><?php echo $data['foto']; ?></td> <td width="102" bgcolor="#E1E1E1" class="style3" align="center"><a href="ubah.php?id_tp=<?php echo $data['id_tp']; ?>" class="mn">Ubah</a> - <a href="hapus.php?id_tp=<?php echo $data['id_tp']; ?>" class="mn">Hapus</a> </td> </tr> <?php } ?> </table></td> </tr> </table>
</body> </html>
12. tambah.php
<!DOCTYPE html> <html> <head> <title>Tambah Data</title> <style type="text/css"> <!-.style1 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight:bold; } .style2 {font-family: Arial, Helvetica, sans-serif; font-size: 17px; color:#006699; } --> </style> <link type="text/css" href="dev/themes/smoothness/jquery.ui.all.css" rel="stylesheet"/> <script type="text/javascript" src="jquery-1.7.2.js"></script> <script type="text/javascript" src="dev/ui/jquery.ui.core.js"></script> <script type="text/javascript" src="dev/ui/jquery.ui.datepicker.js"></script> <script type="text/javascript" src="dev/ui/i18n/jquery.ui.datepicker-id.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#tanggal').datepicker({
dateFormat: "dd-mm-yy", changeMonth: true, changeYear: true }); }); </script> </head>
<body> <form method="post" action="aksi.php" enctype="multipart/formdata"> <table width="500" border="0" cellspacing="2" cellpadding="2"> <tr> <td colspan="2" class="style2">Tambah Data Tempat Pemberhentian Trans Bandar Lampung<br> <br></td> </tr> <tr> <td width="100" bgcolor="#FFFF66" class="style1"> ID</td> <td width="386" bgcolor="#E1E1E1"><input type="text" name="id_tp" id="id_tp" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Nama</td> <td bgcolor="#E1E1E1"><input type="text" name="nama" id="nama" /></td> </tr> <tr>
<td bgcolor="#FFFF66" class="style1"> Jenis</td> <td bgcolor="#E1E1E1"><input type="text" name="jenis" id="jenis" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Latitude</td> <td bgcolor="#E1E1E1"><input type="text" name="lat" id="lat" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Longitude</td> <td bgcolor="#E1E1E1"><input type="text" name="lon" id="lon" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Tanggal</td> <td bgcolor="#E1E1E1"><input type="text" name="tanggal" id="tanggal" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Wilayah</td> <td bgcolor="#E1E1E1"><input type="text" name="wilayah" id="wilayah" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Jalan</td> <td bgcolor="#E1E1E1"><input name="jalan" type="text" id="jalan" size="30" /></td> </tr>
<tr> <td bgcolor="#FFFF66" class="style1"> No Koridor</td> <td bgcolor="#E1E1E1"><input type="text" name="no_koridor" id="no_koridor" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Koridor</td> <td bgcolor="#E1E1E1"><input type="text" name="koridor" id="koridor" size="50" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Foto</td> <td bgcolor="#E1E1E1"><input type="file" name="foto" id="foto" size="30" /></td> </tr> <tr> <td> </td> <td><input type="submit" name="Simpan" id="Simpan" value="Simpan" /></td> </tr> </table> </form> </body> </html>
13. ubah.php
<!DOCTYPE html> <html>
<head><title>Ubah Data</title> <style type="text/css"> <!-.style1 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight:bold; } .style2 {font-family: Arial, Helvetica, sans-serif; font-size: 17px; color:#006699; } --> </style> <link type="text/css" href="dev/themes/smoothness/ui.all.css" rel="stylesheet"/> <script type="text/javascript" src="dev/jquery1.3.2.js"></script> <script type="text/javascript" src="dev/ui/ui.datepicker.js"></script> <script type="text/javascript" src="dev/ui/i18n/ui.datepickerid.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#tanggal').datepicker({ dateFormat: "dd-mm-yy", changeMonth: true, changeYear: true }); }); </script> </head>
<body> <?php
include "koneksi.php"; // perintah SQL untuk menampilkan data siswa sesuai dengan id/nim yang di-klik $sql=mysql_query("SELECT * FROM tempat_pemberhentian WHERE id_tp='$_GET[id_tp]'"); $data=mysql_fetch_array($sql); ?> <form method="post" action="aksi.php" enctype="multipart/formdata"> <table width="700" border="0" cellspacing="2" cellpadding="2"> <tr> <td colspan="2" class="style2">Ubah Data Tempat Pemberhentian Trans Bandar Lampung <br> <br></td> </tr> <tr> <td width="100" bgcolor="#FFFF66" class="style1"> ID</td> <td width="586" bgcolor="#E1E1E1"><input type="text" name="id_tp" id="id_tp" value="<?php echo $data['id_tp']; ?>" readonly="readonly" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Nama</td> <td bgcolor="#E1E1E1"><input type="text" name="nama" id="nama" value="<?php echo $data['nama']; ?>" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Jenis</td>
<td bgcolor="#E1E1E1"><input type="text" name="jenis" id="jenis" value="<?php echo $data['jenis']; ?>" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Latitude</td> <td bgcolor="#E1E1E1"><input type="text" name="lat" id="lat" value="<?php echo $data['lat']; ?>" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Longitude</td> <td bgcolor="#E1E1E1"><input type="text" name="lon" id="lon" value="<?php echo $data['lon']; ?>" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Tanggal</td> <td bgcolor="#E1E1E1"> <?php // mengubah format tanggal di MySQL ke format Bahasa Indonesia $tgl=$data['tgl']; $tgl_ind=substr($tgl,8,2)."-".substr($tgl,5,2)."".substr($tgl,0,4); ?> <input type="text" name="tanggal" id="tanggal" value="<?php echo $tgl_ind; ?>" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Wilayah</td>
<td bgcolor="#E1E1E1"><input name="wilayah" type="text" id="wilayah" value="<?php echo $data['wilayah']; ?>" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Jalan</td> <td bgcolor="#E1E1E1"><input name="jalan" type="text" id="jalan" value="<?php echo $data['jalan']; ?>" size="30" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> No Koridor</td> <td bgcolor="#E1E1E1"><input name="no_koridor" type="text" id="no_koridor" value="<?php echo $data['no_koridor']; ?>"/></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Koridor</td> <td bgcolor="#E1E1E1"><input name="koridor" type="text" id="koridor" value="<?php echo $data['koridor']; ?>" size="50" /></td> </tr> <tr> <td bgcolor="#FFFF66" class="style1"> Foto <input type="hidden" name="fotoh" id="fotoh" value="<?php echo $data['foto']; ?>" /></td> <td bgcolor="#E1E1E1"><img src="<?php echo $data['foto']; ?>" width="282px" height="212px" /> <input name="foto" type="file" id="foto" size="30" /></td>
</tr> <tr> <td> </td> <td><input type="submit" name="Ubah" id="Ubah" value="Ubah" /></td> </tr> </table> </form> </body> </html>
14. hapus.php
<?php // memanggil file koneksi untuk melakukan koneksi ke database include "koneksi.php";
// perinta SQL untuk mengambil data foto yang sesuai dengan nim/id $sqlhapusfoto=mysql_query("select foto from tempat_pemberhentian where id_tp='$_GET[id_tp]'"); $datahapusfoto=mysql_fetch_array($sqlhapusfoto);
// Apabila foto tidak kosong, maka lakukan penghapusan foto if($datahapusfoto['foto']!=""){ unlink($datahapusfoto['foto']); }
15. aksi.php
<?php // Untuk mengecek apakah ini proses simpan? if($_POST['Simpan']=='Simpan'){ //mengambil variabel yang dikirim oleh formulir $id_tp=$_POST['id_tp']; $nama=$_POST['nama']; $jenis=$_POST['jenis']; $lat=$_POST['lat']; $lon=$_POST['lon']; $wilayah=$_POST['wilayah']; $jalan=$_POST['jalan']; $no_koridor=$_POST['no_koridor']; $koridor=$_POST['koridor'];
//melakukan konversi tanggal kebahasa Inggris $tanggal=$_POST['tanggal']; $thn=substr($tanggal,6,4); $bln=substr($tanggal,3,2); $tgl=substr($tanggal,0,2); $tanggal=$thn."-".$bln."-".$tgl;
//mengecek apakah foto kosong atau tidak //jika tidak maka aka diupload dan disimpan yrlnya kedalam database, if($foto!=""){ //melakukan upload foto
move_uploaded_file($_FILES['foto']['tmp_name'],"images/".$fo to);
include "koneksi.php"; $sql="insert into tempat_pemberhentian set id_tp='$id_tp', nama='$nama', tgl='$tanggal', jenis='$jenis', lat='$lat', lon='$lon', wilayah='$wilayah', jalan='$jalan', no_koridor='$no_koridor', koridor='$koridor', foto='images/$foto'"; $query=mysql_query($sql) or die(mysql_error());
}else{ $sql="insert into tempat_pemberhentian set id_tp='$id_tp', nama='$nama', tgl='$tanggal', jenis='$jenis', lat='$lat', lon='$lon', wilayah='$wilayah', jalan='$jalan', no_koridor='$no_koridor', koridor='$koridor'"; $query=mysql_query($sql) or die(mysql_error()); }
header("location:tampil.php"); }
// Untuk mengecek apakah ini proses ubah? else if($_POST['Ubah']=='Ubah'){ //mengambil variabel yang dikirim oleh formulir $id_tp=$_POST['id_tp']; $fotoh=$_POST['fotoh']; $id_tp=$_POST['id_tp']; $nama=$_POST['nama']; $jenis=$_POST['jenis']; $lat=$_POST['lat']; $lon=$_POST['lon']; $wilayah=$_POST['wilayah']; $jalan=$_POST['jalan']; $no_koridor=$_POST['no_koridor']; $koridor=$_POST['koridor'];
//melakukan konversi tanggal kebahasa Inggris $tanggal=$_POST['tanggal']; $thn=substr($tanggal,6,4); $bln=substr($tanggal,3,2); $tgl=substr($tanggal,0,2); $tanggal=$thn."-".$bln."-".$tgl;
//jika tidak maka aka diupload dan disimpan yrlnya kedalam database, if($foto!=""){ //melakukan upload foto if($fotoh!=""){ unlink($fotoh); }
move_uploaded_file($_FILES['foto']['tmp_name'],"images/".$fo to); include "koneksi.php"; $sql="update tempat_pemberhentian set nama='$nama', tgl='$tanggal', jenis='$jenis', lat='$lat', lon='$lon', wilayah='$wilayah', jalan='$jalan', no_koridor='$no_koridor', koridor='$koridor', foto='images/$foto' where id_tp='$id_tp'"; $query=mysql_query($sql) or die(mysql_error()); }else{ $sql="update tempat_pemberhentian set nama='$nama', tgl='$tanggal', jenis='$jenis', lat='$lat', lon='$lon', wilayah='$wilayah', jalan='$jalan', no_koridor='$no_koridor', koridor='$koridor' where id_tp='$id_tp'"; $query=mysql_query($sql) or die(mysql_error()); } // kembali ke halaman tampil header("location:tampil.php"); } ?>