About Me

Sabtu, 08 September 2012

UPDATE : PHP : Konverter Bilangan Desimal [LENGKAP]

Sebelumnya saya telah berbagi PHP : Konverter Bilangan Desimal [LENGKAP]. Nahh.. sekarang saya akan lebih melengkapinya dengan log in terlebih dahulu..Semoga bermanfaat :)








Langkah Pertama, buatlah new file yang bernama KonversiLengkapWithLogIn.php, dan berikut ini script atau codingnya :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Selamat Datang, Silahkan Log In</title>
<link rel="stylesheet" href="SettingHalamanKonversiLengkapWithLogIn.css"/>
</head>
<body>
<div id="f_megacont">
<div id="f_cont">
<h1 class="tittle">Mohon diisi lengkap untuk memasuki halaman konversi Bilangan</h1>
<form method="post" action="KonversiLengkapWithLoginKonverter.php">
<table align="center">
<tr>
<th>
<label for="f_nama">Nama </label>
<td>:</td>
</th>
<td>
<input type="text" name="f_nama" id="f_nama"  placeholder="Isi nama...." />
</td>
</tr>
<tr>
<th>
<label>Jenis Kelamin</label>
</th>
<td>:</td>
<td>
<input type="radio" name="f_jk" value="L" id="f_lk" />
<label for="f_lk">Laki-laki</label><br/>
<input type="radio" name="f_jk" value="P" id="f_pr" />
<label for="f_pr">Perempuan</label>
</td>
</tr>
<tr>
<th>
<label for="f_age">Umur</label>
</th>
<td>:</td>
<td>
<select name="f_age" id="f_age">
<option value=""  >
------------Pilih------------
</option><br/>
<option value="A"  >
>30 th
</option><br/>
<option value="B" >
<30 th
</option>
</select>
</td>
</tr>
<tr><td colspan="3" class="submit">
<input type="submit" value="Log In" name="submit"/>
</td></tr>
</table>
</form>
</div>
</div>
</body>
</html>

Langkah kedua, buatlah new file yang bernama KonversiLengkapWithLoginKonverter.php, dan berikut ini isi coding/scriptnya :

<?
error_reporting(0);
if(isset($_POST['submit'])&&$_POST['f_jk']!=''&&$_POST['f_nama']!=''&&$_POST['f_age']!=''){
$f_jk = $_POST['f_jk'];
$f_nama = $_POST['f_nama'];
$f_age = $_POST['f_age'];
if($f_jk=="L"){
if($f_age=="A"){
$ff = "Bapak";
}
else {
$ff = "agan";
}
}
else{
if($f_age=="A"){
$ff = "Ibu";
}
else {
$ff = "sist";
}
}
}
else{
echo "<script>alert('Silahkan Melengkapi Data Diri Anda');
document.location.href='KonversiLengkapWithLogIn.php';</script>";
}
$syarat = isset($_POST['f_des'])&&(isset($_POST['f_bin'])||isset($_POST['f_oct'])||isset($_POST['f_hex']))&&!(preg_match('/[^0-9]/',$_REQUEST['f_des']));
if($syarat){
$des = $_REQUEST['f_des'];
$f_oct = $_REQUEST['f_oct'];
$f_hex = $_REQUEST['f_hex'];
$f_bin = $_REQUEST['f_bin'];

//konversi ke biner
if($f_bin == "bin"){
$biner = "";
$hit = $des;
while ($hit > 0) {
if ($hit%2 == 0) {
$biner .= 0;
$hit /= 2;
}
else {
$biner .= 1;
$hit = ($hit/2)-0.5;
}
}
$biner = strrev($biner);
}

//konversi ke hexa
if($f_hex == "hex"){
$hex = "";
$hit = $des;
while($hit>0){
$hasil=$hit%16;
switch($hasil){
case 0: $hex.="0"; break;
case 1: $hex.="1"; break;
case 2: $hex.="2"; break;
case 3: $hex.="3"; break;
case 4: $hex.="4"; break;
case 5: $hex.="5"; break;
case 6: $hex.="6"; break;
case 7: $hex.="7"; break;
case 8: $hex.="8"; break;
case 9: $hex.="9"; break;
case 10: $hex.="A"; break;
case 11: $hex.="B"; break;
case 12: $hex.="C"; break;
case 13: $hex.="D"; break;
case 14: $hex.="E"; break;
case 15: $hex.="F";
default : break;
}
if($hit/16==0){
$sisa=($hit%16);
$hit=$sisa;
}
else{
$sisa=($hit/16);
$hit=$sisa%16;
}
}
$hexa = strrev($hex);
}

//konversi ke octal
if($f_oct == "oct"){
$oct = "";
$hit = $des;
while($hit>0){
$hasil=$hit%8;
switch($hasil){
case 0: $oct.="0"; break;
case 1: $oct.="1"; break;
case 2: $oct.="2"; break;
case 3: $oct.="3"; break;
case 4: $oct.="4"; break;
case 5: $oct.="5"; break;
case 6: $oct.="6"; break;
case 7: $oct.="7"; break;
default : break;
}
if($hit/8==0){
$sisa=($hit%8);
$hit=$sisa;
}
else{
$sisa=($hit/8);
$hit=$sisa%8;
}
}
$octal = strrev($oct);
}
}
else if($_POST['submit']=="Convert"){
echo "<script>alert('data yang anda masukkan kurang lengkap atau salah');</script>";
}

?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Rizha Indriantama | Konversi bilangan</title>
<link rel="stylesheet" href="SettingHalamanKonversiLengkapWithLogIn.css"/>
</head>
<body>
<div id="f_megacont"  style="padding-top:50px;padding-bottom:70px">
<div id="f_cont">
<h2 class="salam">SELAMAT DATANG <? echo $ff." ".$f_nama." !"; ?></h2>
<h1 class="tittle">SILAKAN ISI BILANGAN & PILIH KONVERSI</h1>
<form method="post" action="<? echo $_SERVER['PHP_SELF']; ?>">
<table align="center">
<tr>
<td><label for="f_des">Inputkan bilangan desimal</label></td>
<td>:</td>
<td>
<input type="text" name="f_des" id="f_des" value="<?php echo $des ?>" placeholder="Bilangan Desimal..." />
</td>
</tr>
<tr>
<td>Pilih konversi</td>
<td>:</td>
<td>
<input type="checkbox" id="f_bin" name="f_bin" value="bin"
<?php ($f_bin=="bin") ? print 'checked=""': print ''; ?>/>
<label for="f_bin">Desimal to Biner</label><br/>
<input type="checkbox" id="f_oct" name="f_oct" value="oct"
<?php ($f_oct=="oct") ? print 'checked=""': print ''; ?>/>
<label for="f_oct">Desimal to Octal</label><br/>
<input type="checkbox" id="f_hex" name="f_hex" value="hex"
<?php ($f_hex=="hex") ? print 'checked=""': print ''; ?>/>
<label for="f_hex">Desimal to Hexa</label><br/>
</td>
</tr>
<tr>
<td colspan="3">
<input type="hidden" name="f_jk" value="<? echo $f_jk ?>"/>
<input type="hidden" name="f_nama" value="<? echo $f_nama ?>"/>
<input type="hidden" name="f_age" value="<? echo $f_age ?>"/>
<input type="submit" name="submit" value="Convert"/>
</td>
</tr>
<tr>
<td colspan="3">
<?
if($syarat){
?>
Angka desimal <? echo $des; ?> dikonversikan ke :
<ul>
<?
if(isset($_POST['f_bin'])){
echo "<li>Biner = $biner</li>";
}
?>
<?
if(isset($_POST['f_oct'])){
echo "<li>Octal = $octal</li>";
}
?>
<?
if(isset($_POST['f_hex'])){
echo "<li>Hexa = $hexa</li>";
}
?>
</ul>
<? } ?>
<br/>
<a href="KonversiLengkapWithLogIn.php" type="submit">Back</a>
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>

Langkah ketiga, kita mencoba untuk mengatur tampilannya, yaitu dengan cara membuat file baru tipe css dengan nama SettingHalamanKonversiLengkapWithLogIn.css dan berikut isi script atau codingnya :

/*
    Document   : SettingHalamanKonversiLengkapWithLogIn
    Created on : Sep 9, 2012, 12:25:31 PM
    Author     : Indri
    Description:
        Purpose of the stylesheet follows.
*/

/*
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

root {
    display: block;
}

body{
margin:0;
}
#f_megacont{
background:-moz-repeating-linear-gradient(-45deg, red , white, red 4px);
height: 100%;
margin: 0;
}
#f_cont{
background: rgba(255,255,255,.8);
background: -moz-linear-gradient(top center,rgba(200,200,200,.8) 70%,rgba(255,255,255,1));
position: relative;
text-align: center;
padding:40px;
width: 70%;
margin:auto;
top:10%;
border-radius: 20px;
border: #000 double 4px;
box-shadow: 0 0 10px #333;
}
.f_message{
color: red;
font-size: 20px;
text-shadow: 0 0 3px #fff;
text-align: left;
}
.salam {
color: blueviolet;
text-shadow: 0 0 3px #fff;
font-weight: bold;
}
.tittle{
color: #06f;
text-shadow: 0 0 1px #000;
}
table{
font-size: 120%;
font-weight: bold;
}
table td,table th{
padding:5px;
vertical-align:top;
text-align:left;
}
table td.submit{
text-align: center;
}
th label{
color:orangered;
}
[type="text"],select{
width: 200px;
border-top-left-radius: 8px;
font-size: 18px;
padding:1px 0 1px 8px;
}
[type="text"]:focus,select:focus{
box-shadow: 0  0 5px red;
color: blue;
}
[type="submit"]{
border-radius: 15px;
padding:5px;
cursor: pointer;
font-size: 120%;
color: #fff;
border: solid 2px #000;
background: #999;
}
[type="submit"]:focus{
box-shadow: 2px 3px 5px #000;
text-shadow: 0  0 3px #000;
}

BERIKUT HASIL YANG DITAMPILKAN :

Tampilan Awal


Contoh Pengisian Data


Contoh Konversi Decimal Ke Biner


Contoh Konversi Decimal Ke Octal


Contoh Konversi Decimal Ke Hexa


Contoh Konversi Decimal Ke Biner, Octal, dan Hexa

Tidak ada komentar:

Posting Komentar