Selasa, 26 September 2017

Pembayaran rekening listrik

Hai guys!
Pada pelajaran Algoritma kali ini saya akan mempelajari cara membuat algoritma deskriptif untuk menyelesaikan permasalahan pembayaran rekening listrik.
A.Analisa

  • Input :
    • Harga perWatt
    • Pemakaian AC
    • Pemakaian TV
    • Pemakaian Kulkas
    • Pemakaian Lampu
  • Output :
    • Pembayaran rekening listrik
B. Algoritma
  1. Input harga perWatt
  2. Input pemakaian AC
  3. Input pemakaian TV
  4. Input pemakaian kulkas
  5. Input pemakaian lampu
  6. Hitung total pemakaian perWatt
    = total pemakaian ( AC + TV + kulkas + lampu )
  7. Hitung total pembayaran
    = (total pemakaian * harga perWatt)
  8. Tampilkan jumlah pembayaran
Selanjutnya tampilkan script nya dengan menggunakan notepad++ :
<html>
<head>
<title>Program Rekening Listrik</title>
<script>
function RekeningListrik()
{
var totPemakaian;
var hargaperKwh;
var totPembayaran;
//1. Input total pemakaian
totPemakaian = InputData("txtTotalPemakaian");
//2. Input harga per Kwh
hargaPerKwh = InputData("txtHarga");
//3. Hitung total pembayaran
totPembayaran = TotalPembayaran(totPemakaian,hargaPerKwh);
//4. Tampilkan Total Pembayaran
OutputData(totPembayaran);
}
function TotalPembayaran(totalPemakaian,hargaPerKwh)
{
var totalPembayaran;
totalPembayaran = parseInt(totalPemakaian * hargaPerKwh);
return totalPembayaran;
}
</script>
</head>
<body>
<script>
function OutputData(keluaran)
{
document.getElementById("lblTotalTagihan").innerHTML = keluaran;
}
function InputData(namaKomponen)
{
var data;
data = document.getElementById(namaKomponen).value;
return data;
}
</script>
<div>
<div>
<label>Total Pemakaian</label>
<input type="text" id="txtTotalPemakaian"/>
</div>
<div>
<label>Harga per Kwh</label>
<input type="text" id="txtHarga"/>
</div>
<div>
<label>Total Tagihan</label>
<label id="lblTotalTagihan">0</label>
</div>
<div>
<input type="button" id="btnHitung" value="Hitung" onclick="RekeningListrik()"/>
</div>
</div>
</body>
</html>

Lalu simpan dan hasilnya :

Sabtu, 16 September 2017

Rata-Rata

Hai guys!
kita akan mempelajari cara membuat rata-rata dengan menggunakan notepad++.
buat file dengan notepad++ seperti berikut:

<html>
    <head>
        <title>Penjumlahan 2 Variabel</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <style>
                .box {
                    width: 40%;
                    border-radius: 5px;
                    border: 1px solid #9b9b9b;
                    padding: 20px 0px 20px 0px;
                    margin-left: 30%;
                }
                .h2{
                    font-family: calibri;
                    font-weight: lighter;
                    letter-spacing: 3px;
                }
                #bil1{
                    padding: 5px;
                }
           
                #bil2{
                    padding: 5px;
                }
                #hasil{
                    color: #ff0b0b;
                }
                .tbl1{
                    font-family: calibri;
                }
                .btn{
                    padding: 10px;
                    border-radius: 5px;
                    cursor: pointer;
                    border: 0px;
                    color: #fff;
                    background: #3b7fff;
                }
            </style>
      
        <script>
            function Hitung(dat1,dat2,dat3,dat4,dat5,dat6){
                var total,totalrat;
                total = dat1+dat2+dat3+dat4+dat5+dat6;
              
                totalrat = total / 6;
                return totalrat;
            }
        </script>
    </head>
    <body>
        <div class="box">
            <center>
                <h2 class="h2">Aplikasi Rata-Rata Nilai Mahasiswa</h2>
              
        <table class="tbl1">
            <tr>
                <td><label>ALPRO</label></td>
                <td>=</td>
                <td><input type="text" id="alpro" placeholder="Masukan bilangan 1"></td>
            </tr>
            <tr>
                <td><label>Basis Data</label></td>
                <td>=</td>
                <td><input type="text" id="bd" placeholder="Masukan bilangan 1"></td>
            </tr>
            <tr>
                <td><label>Program Paket Niaga</label></td>
                <td>=</td>
                <td><input type="text" id="ppn" placeholder="Masukan bilangan 1"></td>
            </tr>
            <tr>
                <td><label>PTI</label></td>
                <td>=</td>
                <td><input type="text" id="pti" placeholder="Masukan bilangan 1"></td>
            </tr>
            <tr>
                <td><label>Matematika</label></td>
                <td>=</td>
                <td><input type="text" id="mtk" placeholder="Masukan bilangan 1"></td>
            </tr>
            <tr>
                <td><label>Bahasa Inggris</label></td>
                <td>=</td>
                <td><input type="text" id="bing" placeholder="Masukan bilangan 1"></td>
            </tr>
            <tr>
                <td><label>Rata-Rata</label></td>
                <td>=</td>
                <td><label id="rata_rata"></label></td>
            </tr>
        </table>
  <br>
  <input type="button" id="btn" value="Rata-Rata" class="btn" onClick="Ratarata()">
            </center>
        </div>
      <script>
          function InputData(Bilangan){
            var data;
              data = parseFloat(document.getElementById(Bilangan).value);
            return data;
          }
        
          function Output(data){
              document.getElementById("rata_rata").innerHTML = data;
          }
        
          function Ratarata(){
            //Deklarasi Variable
            var dat1,dat2,dat3,dat4,dat5,dat6,ratarata;
            //Input
            dat1  = InputData("alpro");
            dat2  = InputData("bd");
            dat3  = InputData("ppn");
            dat4  = InputData("pti");
            dat5  = InputData("mtk");
            dat6  = InputData("bing");
            //Proses
            ratarata = Hitung(dat1,dat2,dat3,dat4,dat5,dat6);
            //OutPut
            Output(ratarata);
          }
        
      </script>
    </body>
</html>

Simpan lalu buka dengan browser dan hasilnya:

Selasa, 05 September 2017

Pembagian 2 Bilangan


Membuat pembagian 2 bilangan dengan menggunakan Notepad++
<html>
<head>
<tittle>Pembagian 2 Variabel</tittle>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script>
function pembagian(a,b)
{
var hasil;
hasil=parseFloat(a)/parseFloat(b)
return hasil;
}
</script>
<style>
.box {
width:40%;
border-radius:5px;
border:1px solid #9b9b9b;
padding:20px 0px 20px 0px;
margin-left:30%;
}
.h2{
font-family:calibri;
font-weight:lighter;
letter-spacing:3px;
}
#bil1{
padding:5px;
}
#bil2{
padding:5px;
}
#hasil{
color:#ff0b0b
}
</style>
</head>
<body>
<div class="box">
<center>
<h2 class="h2">Aplikasi pembagian 2 bilangan</h2>
<div class="box1">
<label>Bil 1</label>
<input tyle="text" id="bil1" placeholder="Masukan bilangan 1">
</div>
<br>
<div class="box2">
<label>Bil 2</label>
<input type="text" id="bil2" placeholder="Masukan bilangan 2">
</div>
<div class="box3">
<label>Hasil</label>
<label id="hasil"></label>

</div>
<br>
<input type="button" id="btn" value="pembagian" class="btn"
onClick="bagi()">
</center>
</div>
<script>
function bagi(){
//input
var a = document.getElementById("bil1").value;
var b = document.getElementById("bil2").value;
//proses
var hasil=pembagian(a,b);
//output
document.getElementById("hasil").innerHTML=hasil;

}
</script>
</body>
</html>

simpan lalu untuk melihat hasilnya masuk ke file yang dibuat tadi dengan menggunakan browser lalu hasilnya