Koversi Desimal ke Biner, Oktal, dan Hexa dengan PHP with Login ~ My Life for My Live

Malem gan, udah hampir tengah malem nich. Ane mau share sebuah postingan sebagai penghantar tidur ane hehehe.... :D . Kalo sebelumnya ane usah pernah share konversi bilangan yang pake menu di PHP : Koverter Bilangan Desimal dengan Menu Pilihan [Lengkap], sekarang ini ane tambahin pakai login plus biar lebih cantik ane kasih desain juga gan :D. Di sini yang ane maksud login yaitu, sebelum kita melakukan konversi bilangan kita akan dibawa menuju halaman yang berisi form isian Nama, Jenis Kelamin, dan Umur. Inputan jenis kelamin akan digunakan untuk menentukan panggilan. Umur juga digunakan untuk menentukan panggilan. Untuk laki-laki yang berusia <30 th panggilannya agan , untuk cewek sist , sedang diatas 30 th Bapak atau Ibu.Daripada bingung-bingung mending langsung lihat demonya :

View Demo
Udah lihat kan demonya ??? Lanjut ke tahap pembuatan :

Pertama buat folder baru untuk menyimpang file kerja anda, misalnya konverter desimal .
Kemudian buat file index.php halaman ini yang akan digunakan sebagai halaman login. Berikut coding untuk file index.php :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>f Projects | Selamat datang di Halaman login</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<div id="f_megacont">
<div id="f_cont">
<h2 class="salam">Assalamu'alaikum Wr. Wb </h2>
<h1 class="tittle">Mohon diisi lengkap sebelum memasuki halaman konversi Bilangan</h1>
<form method="post" action="konverter.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="Masook dah !" name="submit"/>
</td></tr>
</table>
</form>
</div>
</div>
</body>
</html>

Penjelasan singkat untuk file index.php. File index.php ini yang akan mengirimkan data inputan nama, jenis kelamin, dan umur ke file konversi.php dengan methode post (yakni pengiriman data yang nilainya tidak bisa dilihat di browser) saat data di submit. Ini dapat diatur pada tag form seperti pada tag form diatas : <form method="post" action="konverter.php"> attribute method untuk mengatur methode pengiriman data, dat atribute action untuk mengatur alamat tujuan pengiriman data.

Langkah selanjutnya yaitu pembuatan file konverter.php . Halaman ini yang akan menerima data nama, jenis kelamin dan umur dari halaman index.php halaman ini juga berisi inputan konversi bilangan. Berikut codingnya :

<? 
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('anda belom login atau data yang anda masukkan kurang lengkap');
document.location.href='index.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>f Projects | Konversi bilangan</title>
<link rel="stylesheet" href="style.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="isi 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="index.php" type="submit">Back</a>
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>

Untuk halaman konverter.php pada dasarnya dilakukan pnegiriman data bilangan desimal dan tujuan konversi ke file ini sendiri. Jadi data yang dikirim akan ditangkap oleh dirinya sendiri. Ini di settting pada action dari form yang diisi dengan <? echo $_SERVER['PHP_SELF']; ?> .
Selanjutnya yang kita butuhkan yaitu file css untuk mengatur design project kita, berikut adalah isi dari file style.css :

body{
margin:0;
}
#f_megacont{
background:-moz-repeating-linear-gradient(-45deg, blue , white, blue 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 screenshot hasilnya :

Berikut tampilan awal yaitu form login untuk input nama, jenis kelamin, dan umur.
Jika data belum terisi dengan benar atau user belum login maka muncul alert pemberitahuan berikut :
Jika user telah login dengan data yang valid, maka pada halaman konversi tertulis "SELAMAT DATANG agan/sist/Bapak/Ibu nama" seperti berrikut :
Jika user melakukan konversi sebelum mengisi lengkap form maka akan ditampilkan pesan berikut :
Jika semua berhasil maka :D