Sistem Informasi Nama Jalan di Kota Medan Berbasis Web

(1)

LISTING PROGRAM

kemanakita.php

<html>

<head>

<title>Kemana Kita ?</title>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li> </ul>

<p> Sistem Informasi Nama Jalan di Kota Medan </p> <marquee>

Welcome to KemanaKita ! Mau Kemana Kita ? Apa Carik ? </marquee>

</div>

<div class="event"> <?php

include "koneksi.php"; ?>

<?php

error_reporting('0');

$query_ambil_event = mysql_query("SELECT * FROM event"); //query ambil data berita.

while ($data_event = mysql_fetch_array($query_ambil_event)) { //perulangan untuk menampilkan berita

?>

<?php

if (is_file("gambar/".$data_event['foto']) == TRUE) {

(2)

<img src="gambar/<?php echo $data_event['foto']; ?>"

style="width: 100px; height: 75px; margin: 0 10px 10px 0; display: inline; float: left">

<?php } ?>

<a href="detail_event.php?id=<?php echo $data_event['id_event']; ?>">Continue Reading</a>

<?php }

//penutup perulangan while ?>

</div> </div>

<h2>Kenapa bingung Mau Kemana ?</h2>

<p>Enggak ada lagi deh kata bingung mau kemana dan.. bingung jalannya darimana, karena KemanaKita menawarkan kamu

berbagai jalanan di Medan yang sering dicari orang.. kedengerannya asing, padahal sering dilewati. What are you waiting for ? Check them all !</p>

<div class="jam"> <p><b> <?php

echo "Date : ";

echo gmdate("d-m-y | H:i", time()+60*60*7);

echo " WIB"; ?>

</b></p>

</div> </div>

(3)

</div>

</body>

</html>

home.php

<html>

<head>

<title>Kemana Kita ? | Home</title> <link rel="stylesheet" href="desain.css" /> </head>

<body>

</div>

<?php

(4)

<?php

?>

<img src="gambar/<?php echo $data_event['foto']; ?>"

<?php } ?>

<?php }

</div> </div>

<div class="jam"> <p><b> <?php

echo "Date : ";

echo gmdate("d-m-y | H:i", time()+60*60*7);

echo " WIB"; ?>

</b></p> </div>

(5)

</div> </div>

</body>

</html>

menu.php

<html>

<head>

<title>Kemana Kita ? | Menu</title> <link rel="stylesheet" href="desain.css" /> </head>

<body>

</div>

<p><b>Find out what are you looking for in Medan HERE !</b></p>

</div>

<div id="info-event"> <div class="event"> <?php

(6)

<?php

$query_ambil_jalan = mysql_query("SELECT * FROM jalan"); //query ambil data berita.

while ($data_jalan = mysql_fetch_array($query_ambil_jalan)) { //perulangan untuk menampilkan jalan

?>

<?php

if (is_file("gambar/".$data_jalan['foto']) == TRUE) {

?>

<img src="gambar/<?php echo $data_jalan['foto']; ?>"

<?php } ?>

<a href="detail_jalan.php?id=<?php echo $data_jalan['id_jalan']; ?>">Continue Reading</a>

<?php }

</div> </div>

</div>

</body>

</html>

detail_event.php

(7)

<head>

<title>Event Medan</title>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li> </ul><br><br>

</div>

<?php

$query_ambil_event = mysql_query("SELECT * FROM event WHERE id_event = '".$_GET['id']."'"); //query ambil data event.

$data_event = mysql_fetch_array($query_ambil_event); ?>

<h5 style="margin-bottom: 0px"> <?php

echo $data_event['judul']; ?></h5>

<small>Ditulis oleh : <?php echo $data_event['penulis']; ?>, pada : <?php echo $data_event['tanggal']; ?></small>

<p> <?php

if (is_file("gambar/".$data_event['foto']) == TRUE) { ?>

<img src="gambar/<?php echo $data_event['foto']; ?>" style="width: 300px; height: 275px; margin: 0 10px 10px 0; display: inline; float: left">

(8)

} ?>

<?php echo $data_event['isi']; ?></p> <hr>

</div> </div>

</div>

</div> </div>

</body>

</html>

detail_jalan.php

<html>

<head>

<title>Jalan di Medan</title>

<body>

(9)

<li><a href="about.php">About</a></li> </ul>

</div>

<?php

$query_ambil_jalan = mysql_query("SELECT * FROM jalan WHERE id_jalan = '".$_GET['id']."'"); //query ambil data jalan.

$data_jalan = mysql_fetch_array($query_ambil_jalan); ?>

<h5 style="margin-bottom: 0px"> <?php

echo $data_jalan['judul']; ?></h5>

<small>Ditulis oleh : <?php echo $data_jalan['penulis']; ?>, pada : <?php echo $data_event['tanggal']; ?></small>

<p> <?php

if (is_file("gambar/".$data_jalan['foto']) == TRUE) { ?>

<img src="gambar/<?php echo $data_jalan['foto']; ?>" style="width: 300px; height: 275px; margin: 0 10px 10px 0; display: inline; float: left">

<?php } ?>

<?php echo $data_jalan['isi']; ?></p> <hr>

</div> </div>

(10)

</div>

</div> </div>

</body>

</html>

koneksi.php

<?php

mysql_connect("localhost", "root", ""); mysql_select_db("tugasakhir");

?>

about.php

<html>

<head>

<title>Kemana Kita ? | About</title> <link rel="stylesheet" href="desain.css" /> </head>

<body>

</div>

(11)

<p><b>Tentang MauKemana.php</b></p> </div>

<h2>Apa itu MauKemana.php ?</h2>

<p><br>Enggak ada lagi deh kata bingung mau kemana dan.. bingung jalannya darimana, karena KemanaKita menawarkan kamu berbagai jalanan di Medan yang sering dicari orang.. kedengerannya asing, padahal sering dilewati<br><br> Disini kamu bisa mencari nama jalan yang pengen kamu tau, bisa juga mendapatkan info-info seputar event di Medan yang wajib kamu tau ! Mohon maaf kalau info dan nama jalan yang saya update masih sedikit ya :)</p>

</div>

</div> </div>

</body>

</html>

desain.css

*{

margin:0; padding:0;

font-family:"comic sans ms", sans-serif; }

body{

background-color:#FFFFCC; }

#wrapper{ width : 780px; margin: 0 auto; overflow: hidden; }

#header{

background-color: #996600; height : 175px;

(12)

overflow : hidden;

border-radius:10px 40px 30px 55px; }

#header ul { float: left; list-style: none; margin: 0px; padding: 0px; }

#header li { float: left;

margin-top:30px; }

#header li a { float: left; width: 170px; height: 30px;

padding: 0px 5px 0px 5px; text-align: center;

margin: 5px 0px 0px 5px; text-decoration: none; border-radius: 5px;

background-color: #CCCC66; border: 2px solid #993300;

}

#header img{ width:135px; margin-left:30px; margin-top: 10px; }

#menu-utama{ margin-top:3px; list-style:none; }

#menu-utama li{ float:left;

padding:8px 20px;

border-right:1px solid #555555; }

#menu-utama li a{ color : #ffffff;

text-decoration:none; }

(13)

}

#header form input{ border:none; height:20px; }

#info-event{ width:470px; float:left; }

.event{

background:#ffffff; padding:10px; margin-bottom:20px; overflow:hidden; }

.event img{ float:left;

margin-right:10px; width:200px; height:165px; }

.event b{

color:#616060;

background:#DDDDDD; padding:3px;

font-size:12px; font-weight:bold; margin-right:10px; }

.event p{

margin:10px 0; }

.event a{ display:block; text-align:right; color:#636363; }

.judul{ width: 75%; height: 50px;

background-color: #FFCC99; text-align:center;

(14)

.jam{

width: 93%; height: 40px;

font:normal 15px comic; border-radius: 10px; border: 2px solid #999900; margin-bottom:20px; margin-top:35px; }

.tentang{ width: 85%; height: 380px; float: left;

border-radius: 10px; border: 3px solid #996600; margin-top:20px;

margin-bottom:20px; }

#sidebar{ width:270px; float:right; }

#sidebar h2{ font-size:18px; margin:10px 0; }

#sidebar p{ line-height:20px; color : #636363; }

#footer{ clear:both; margin:20px 0; text-align:center;

background-color: #FFFF99; padding:5px;

(15)

Listing Program Halaman Admin

home.php

<html>

<head>

<title>Kemana Kita ? | Home</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li> <li><a href="menu_input.php">Input Data</a></li>

</ul>

</div>

<?php

?>

<?php

?>

(16)

<?php } ?>

<a href="hapus_event.php?id=<?php echo $data_event['id_event']; ?>" onClick="return confirm('Anda

yakin..?')">Hapus</a>

<?php }

</div> </div>

</div>

</div> </div>

</body>

(17)

menu.php

<html>

<head>

<title>Kemana Kita ? | Menu</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

</ul> </div>

<p><b>Find out what are you looking for in Medan HERE !</b></p>

</div>

<div id="info-event"> <div class="event"> <?php

<?php

$query_ambil_jalan = mysql_query("SELECT * FROM jalan"); //query ambil data berita.

while ($data_jalan = mysql_fetch_array($query_ambil_jalan)) { //perulangan untuk menampilkan jalan

?>

<?php

if (is_file("gambar/".$data_jalan['foto']) == TRUE) {

?>

(18)

<?php } ?>

<p><?php echo substr($data_jalan['isi'], 0, 300); ?> ... </p> <a href="detail_jalan.php?id=<?php echo $data_jalan['id_jalan']; ?>">Continue Reading</a>

<a href="hapus_jalan.php?id=<?php echo $data_jalan['id_jalan']; ?>" onClick="return confirm('Anda yakin..?')">Hapus</a>

<?php }

</div> </div>

</div>

</body>

</html>

menu_input.php

<html>

<head>

<title>Kemana Kita ? | Menu Input</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

(19)

</ul> </div>

<p><b><a href="input_event.php">Input Event</b></p>

</div>

<p><b><a href="input_jalan.php">Input Data Jalan</a></b></p>

</div>

</div> </div>

</body>

</html>

input_event.php

<html>

<head>

<title>Kemana Kita ? | Input Event</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

</ul>

(20)

<body>

<p><b>Input Event</b></p> </div>

<br>

<tr>

<td width="200">Judul</td>

</tr> <tr>

<td>Pengirim</td>

</tr> <tr>

<td>File Gambar</td>

</tr> <tr>

<td>Tentang Event</td>

</tr>

<tr>

<td>  <input type="submit" name="Input"

value="Input"> 

</td> </tr>

</table>

(21)

</FORM>

</div> </div>

</body>

</html>

input_jalan.php

<html>

<head>

<title>Kemana Kita ? | Input Jalan</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

</ul>

</div>

<body>

<p><b>Input Data Jalan</b></p> </div>

(22)

<tr>

<td width="200">Judul</td>

</tr> <tr>

<td>Pengirim</td>

</tr> <tr>

<td>File Gambar</td>

</tr> <tr>

<td>Deskripsi</td>

</tr>

<tr>

<td>  <input type="submit" name="Input"

value="Input"> 

</td> </tr>

</table>

</div> </div>

</body>

(23)

proses_event.php

<?php

include "koneksi.php";

//get variabel yg dikirimkan dari form

$id_event=$_POST['id_event']; $judul=$_POST['judul']; $penulis=$_POST['penulis']; $isi=$_POST['isi'];

$lokasi_file= $_FILES['foto']['tmp_name']; $tipe_file=$_FILES['foto']['type'];

$nama_file=$_FILES['foto']['name']; $direktori="../gambar/$nama_file";

if (!empty($lokasi_file)) {

if (move_uploaded_file($lokasi_file,$direktori)) {

$query_tambah = mysql_query("INSERT INTO event VALUES ('', '$judul', '$penulis', '$isi', NOW(), '$nama_file')");

header("Location: index.php"); } else {

$query_tambah = mysql_query("INSERT INTO event VALUES ('', '$judul', '$penulis', '$isi', NOW(), '-')");

header("Location: index.php"); }

} else {

$query_tambah = mysql_query("INSERT INTO event VALUES ('', '$judul', '$penulis', '$isi', NOW(), '-')");

header("Location: index.php");

} ?>

proses_jalan.php

<?php

//get variabel yg dikirimkan dari form

(24)

$judul=$_POST['judul']; $penulis=$_POST['penulis']; $isi=$_POST['isi'];

$lokasi_file= $_FILES['foto']['tmp_name']; $tipe_file=$_FILES['foto']['type'];

$nama_file=$_FILES['foto']['name']; $direktori="../gambar/$nama_file";

if (!empty($lokasi_file)) {

if (move_uploaded_file($lokasi_file,$direktori)) {

$query_tambah = mysql_query("INSERT INTO jalan VALUES ('', '$judul', '$penulis', '$isi', NOW(), '$nama_file')");

header("Location: menu.php"); } else {

$query_tambah = mysql_query("INSERT INTO jalan VALUES ('', '$judul', '$penulis', '$isi', NOW(), '-')");

header("Location: menu.php"); }

} else {

$query_tambah = mysql_query("INSERT INTO jalan VALUES ('', '$judul', '$penulis', '$isi', NOW(), '-')");

header("Location: menu.php");

} ?>

hapus_event.php

<?php

$query_hapus = mysql_query("DELETE FROM event WHERE id_event = '".$_GET['id']."'");

header("Location: index.php");

?>

(25)

hapus_jalan.php

<?php

$query_hapus = mysql_query("DELETE FROM jalan WHERE id_jalan = '".$_GET['id']."'");

header("Location: menu.php");

?>

style.css

*{

margin:0; padding:0;

font-family:"comic sans ms", sans-serif; }

body{

background-color:#FFFFCC; }

#wrapper{ width : 780px; margin: 0 auto; overflow: hidden; }

#header{

background-color: #996600; height : 130px;

width : 100%; padding:5px; margin : 20px 0; overflow : hidden; }

# header ul { float: left; list-style: none; margin: 0px; padding: 0px; }

#header li { float: left; }

(26)

width: 170px;

padding: 0px 5px 0px 5px; text-align: center;

margin: 5px 0px 0px 5px; text-decoration: none; border-radius: 5px;

background-color: #CCCC66; border: 2px solid #993300;

}

#header img{ width:130px; }

#menu-utama{ margin-top:3px; list-style:none; }

#menu-utama li{ float:left;

padding:8px 20px;

border-right:1px solid #555555; }

#menu-utama li a{ color : #ffffff;

text-decoration:none; }

#header form{ float:right; margin-top:7px; margin-right: 10px; }

#header form input{ border:none; height:20px; }

#info-event{ width:470px; float:left; }

.event{

background:#ffffff; padding:10px; margin-bottom:20px; overflow:hidden; }

.event img{ float:left;

(27)

width:200px; height:165px; }

.event b{

color:#616060;

background:#DDDDDD; padding:3px;

font-size:12px; font-weight:bold; margin-right:10px; }

.event p{

margin:10px 0; }

.event a{ display:block; text-align:right; color:#636363; }

.judul{ width: 75%; height: 50px;

font:normal 20px comic; border-radius: 10px; border: 3px solid #999900; margin-top:30px;

.tentang{ width: 85%; height: 380px; float: left;

border-radius: 10px; border: 3px solid #996600; margin-top:20px;

#sidebar{ width:270px; float:right; }

(28)

}

#sidebar p{ line-height:20px; color : #636363; }

#footer{ clear:both; margin:20px 0; text-align:center;

background-color: #FFFF99; padding:5px;

color:#555555; }

Dokumentasi Jalan di Medan

(29)

(30)

(31)

(32)

(33)