• Tidak ada hasil yang ditemukan

STRAKOP Sistem Informasi dan SMS Gateway untuk Koperasi

N/A
N/A
Protected

Academic year: 2021

Membagikan "STRAKOP Sistem Informasi dan SMS Gateway untuk Koperasi"

Copied!
46
0
0

Teks penuh

(1)

vi

Sistem Informasi dan SMS

Gateway untuk Koperasi

(2)
(3)
(4)

1

SISTEM

Untuk dapat menerapkan STRAKOP, maka ada beberapa hal yang harus diperhatikan. Sistem ini merupakan aplikasi web yang berjalan pada sebuah browser (perambah). Pada dasarnya aplikasi ini bisa diterapkan pada sebuah jaringan dengan public IP, namun distribusi standar STRAKOP adalah aplikasi yang bersifat portable. Untuk selanjutnya STRAKOP hanya akan disebut dengan istilah aplikasi atau sistem saja.

1.1. KEBUTUHANHARDWARE.

Untuk dapat menjalankan sistem ini secara tunggal, artinya tidak berada pada sebuah jaringan, dibutuhkan sebuah komputer dengan spesifikasi minimum sebagai berikut.

Processor : setara Pentium III 966 Mhz

RAM : 256Mb

Harddsik : 8Gb

Monitor : 15 inch, resolusi 1024x768 pixel. Modem : GSM/CDMA modem untuk SMS

Kebutuhan minimal di atas masih sesuai jika sistem akan diterapkan secara client-server pada sebuah jaringan lokal atau intranet. Jika fasilitas SMS Gateway digunakan, maka dibutuhkan ruang untuk virtual memory sedikitnya 1Gb, disarankan agar virtual memory diatur setidaknya 1.5Gb.

1.2. KEBUTUHANSOFTWARE.

Software pendukung untuk dapat menjalankan sistem ini adalah sistem operasi Windows XP dan sebuah browser. Sistem

(5)

operasi Windows XP adalah minimum yang disarankan, dan untuk browser disarankan menggunakan Google Chrome. Selain Chrome, browser yang lain bisa digunakan namun untuk Internet Explorer (IE) tidak disarankan meskipun masih tetap bisa digunakan.

Jika sistem diterapkan untuk server, maka kebutuhan software seperti di atas, namun untuk client bisa digunakan sistem operasi yang lain. Hal ini karena sistem ini didistribusikan dalam paket yang secara aslinya dirancang untuk berjalan pada sistem operasi Windows. Sehingga server yang menjalankannya harus menggunakan sistem operasi Windows.

1.3. PEMASANGANSISTEM

Karena sistem yang didistribusikan adalah sistem portable, maka cara pemasangannya menjadi sangat mudah. Sistem bisa dijalankan dengan hanya sebuah flashdisk ataupun berada di harddisk. Langkah-langkah pemasangan sistem adalah sebagai berikut.

1. Copy satu folder ‘STRAKOP’ secara utuh berikut seluruh isinya ke flashdisk atau ke harddisk, partisi manapun bisa digunakan. Di buku ini STRAKOP diletakkan di drive C.

2. Buka folder ‘STRAKOP’yang telah berada di flashdisk atau di harddisk, kemudian jalankan Start.exe dengan cara double-click.

(6)

Gambar 1. Start

3. Setelah Start dijalankan, maka akan muncul kotak dialog pemberitahuan bahwa Uniform Server dijalankan dan pada sistem-tray akan muncul icon Uniform Server. Silakan klik OK pada kotak dialog.

(7)

Gambar 3. System-Tray Uniform Server

4. Klik kiri pada icon Uniform Server yang ada maka akan muncul menu untuk Uniform Server.

5. Jalankan Apache Server dan MySQL Server secara bersamaan dengan memilih pilihan menu paling atas, yaitu Start UniServer (Apache MySQL) seperti pada Gambar 5. Jalankan dengan klik kiri.

(8)

Gambar 4. Start UniServer

6. Setelah UniServer jalan maka otomatis akan langsung dibuka aplikasi STRAKOP pada browser bawaan. Disarankan mengatur browser bawaan menjadi Chrome. 7. Halaman login otomatis dibuka. Aplikasi STRAKOP siap

digunakan.

Langkah-langkah yang disajikan diatas hanya sebatas pada pemasangan sistem informasi dan transasksi utama, sedangkan untuk SMS Gateway akan dijelaskan pada Bab III.

(9)

Gambar 5. Form Login.

STRAKOP is the acronym Stranas Technology

Research Assistance for Koperasi.

It was developed by Team of Research, Sebelas Maret University. It is prototyping and welcome for modifying and adjustment in order to make it suits for some purposes.

(10)

7

TRANSAKSI

Sistem STRAKOP dirancang untuk digunakan oleh empat jenis pengguna, yaitu pengunjung, anggota, operator atau kasir, dan administrator. Di sini yang dimaksud dengan pengunjung adalah seluruh pengguna umum atau masyarakat umum. Di sini meskipun ada sebutan anggota, namun yang dimaksud adalah seluruh nasabah atau seluruh pengguna jasa koperasi, yang dalam kenyataanya statusnya bisa berupa Anggota atau Non-Anggota.

2.1. BAGIANPENGUNJUNG

Untuk pengunjung, seperti terlihat pad Gambar 5, maka username diisi dengan ‘visitor’dan password diisi dengan ‘akses’. Menu yang bisa diakses oleh pengunjung hanyalah Pendaftaran dan Informasi.

Menu Informasi menyajikan informasi umum tentang koperasi yang bersangkutan. Menu Pendaftaran → Baru jika dipilih maka akan dibuka formulir pendaftaran. Calon pengguna jasa koperasi yang ingin mendaftarkan dirinya bisa menggunakan dan mengisi formulir yang disediakan.

(11)

Gambar 6. Halaman untuk Pengunjung.

(12)

2.2. BAGIANANGGOTA

Setiap anggota atau pengguna jasa koperasi, akan mendapatkan nomor anggota yang terdiri atas 9 digit angka dengan format yymmddnnn, yy adalah tahun pendaftaran, mm adalah bulan pendaftaran, dd adalah tanggal pendaftaran, dan nnn adalah nomor urut pendaftaran. Contohnya nomor anggota 100912001 adalah anggota atau pengguna jasa yang mendaftar pada tahun 2010, bulan 09, tanggal 12 dan 001 sebagai nomor urut pendaftaran pada hari itu. Nomor anggota ini digunakan sebagai username untuk masuk ke sistem dan password standar adalah 1234.

(13)

Gambar 9. Rincian Saldo

Gambar 10. Rincian dan Status Pinjaman

Menu yang disediakan pada bagian anggota adalah Pendaftaran, Lihat Saldo, dan lihat Pinjaman. Menu Pendaftaran bisa digunakan untuk mendaftarkan orang lain, saudara atau tetangganya. Menu Lihat Saldo digunakan untuk melihat Saldo Simpanan dan menu Lihat

(14)

Pinjaman digunakan untuk melihat status 3 pinjaman terakhir.

2.3. BAGIANOPERATOR/KASIR

Operator atau kasir bisa masuk ke sistem dengan username dan password khusus yang diperoleh dari Adminsitrator atau DBA (Database Administrator) sistem. Halaman Kasir memuat seluruh menu yang digunakan untuk melayani transaksi anggota koperasi. Berikut ini rincian dari menu kasir.

Tabel 1. Halaman kasir, Menu Pendafataran

Menu Utama Sub Menu Keterangan

Pendaftaran Baru Pendaftaran baru

pengguna jasa

koperasi, baik sebagai non-anggota maupun calon anggota atau Non >> Calon Perubahan status, dari

non-anggota menjadi calon anggota

Tabel 2. Halaman kasir, Menu SIMPAN

Menu Utama Sub Menu Keterangan

SIMPAN Pokok Simpanan pokok

Wajib Simpanan wajib

Sukarela Simpanan sukarela HUT Koperasi Simpanan Hari Ulang

Tahun Koperasi

Cek Saldo Lihat saldo simpanan anggota

(15)

Tabel 3. Halaman kasir, menu PINJAM

Menu Utama Sub Menu Keterangan

PINJAM Baru Mencatat peminajman

baru

Angsuran Mencatat angsuran pinjaman

Tabel 4. Halaman kasir, menu UserLog

Menu Utama Sub Menu Keterangan

UserLog View Melihat catatan

kegiatan kasir Tabel 5. Halaman kasir, menu Cari Peminjaman

Menu Utama Sub Menu Keterangan

Cari

peminjaman

- Cari data peminjaman

Formulir untuk transaksi simpan disediakan bagian ralat jenis simpanan jika kasir salah memilih menu. Fasilitas ini juga mempermudah kasir jika ingin berganti-ganti jenis simpanan tanpa perlu memilih menu lagi, cukup diganti nomor anggota dan besar nominal simpan. Nominal simpan ditulis dengan angka tanpa tanda titik sebagai pemisah besaran mata uang, misal Rp 1,350.000,00 cukup ditulis 1350000. Setiap formulir sudah jelas komponen yang harus dimasukkan. Setiap formulir juga disediakan dua tombol, tombol sebelah kiri untuk menyimpan atau mengeksekusi transaksi, sedangkan tombol sebelah kanan adalah tombol Reset untuk mengosongkan formulir.

Untuk menu Cek Saldo, cukup diisi dengan nomor anggota yang ingin dilihat saldonya. Menu untuk

(16)

penarikan mirip dengan menu simpanan, hanya saja pada menu simpanan yang diisikan adalah besar simpanan sedangkan pad amenu penarikan adalah besar penarikan.

Menu UserLog secara otomatis akan menampilkan daftar kegiatan yang dilakukan oleh kasir bersangkutan. Setiap kegiatan kasir akan dicatat agar seluruh transaksi bisa dilakukan penjejakan dan perbandingan.

Menu Cari Peminjaman jika dipilih maka akan dibuka jendela baru untuk melakukan pencarian. Disediakan dua pilihan pencarian, yaitu berdasar nomor anggota dan berdasar nomor pinjaman, tetapi tidak boleh keduanya digunakan bersamaan.

(17)

Gambar 12. Menu Simpanan Pokok

(18)

Gambar 14. Menu Penarikan.

(19)

2.4. BAGIANADMINISTRATOR

Username dan password standar bawaan sistem adalah sama yaitu, admin. Antarmuka untuk administrator dibuat sederhana dengan tujuan untuk memperingan beban sistem. Selain itu, dalam sistem ini, administrator diharapkan sekaligus menjadi seorang DBA dengan memanfaatkan phpMyAdmin yang sudah tersedia pada menu Uniform Server.

Gambar 16. Halaman administrator

Menu SMS Gateway Management digunakan untuk pengaturan SMS Gateway. Untuk lebih jelasnya akan dijelaskan pada Bab II.

(20)

17

STRAKOP memiliki SMS Gateway yang telah terintegrasi. Fasilitas ini digunakan untuk memberi layanan kepada pengguna jasa koperasi dengan berbasis pada Short Message Service (SMS). Pengaturan SMS gateway berada di menu SMS Gateway Management. Untuk saat ini ada dua submenu utama, yaitu submenu Setup Gammu dan submenu SMS Gateway Monitor.

Gambar 17. SMS Gateway Management.

(21)

3.1. SETUPGAMMU

Menu ini digunakan untuk melakukan pemasangan dan pengaturan Gammu sebagai service untuk penerimaan dan pengiriman SMS. Jika menu ini dipilih maka akan dibukakan Gammu 1.25 Easy Installer V1.0 pada jendela baru.

Gambar 18. Gammu 1.25 Easy Installer V1.0

Dalam installer ini sudah diberikan langkah-langkah urut untuk menjalankan SMS Gateway. Langkah 1 sampai dengan 8 digunakan untuk menguji sistem apakah sudah diatur dengan benar. Jika pengaturan sudah benar maka langkah cukup diulang langkah 4, yaitu Membuat Service Gammu, dan langkah 5 yaitu Menjalankan Service Gammu. Selama SMS Gateway aktif maka service tidak boleh dihentikan.

(22)

SMS Gateway ini membutuhkan sebuah modem yang terpasang pada komputer yang dijadikan sebagai server aplikasi STRAKOP. Untuk mengetahui nomor port yang digunakan, bisa dilihat dari System Properties yang ada di sistem operasi Windows.

System Properties bisa dipanggil dengan hot-key ‘Win + PauseBreak’atau lewat Control Panel → System. Setelah dibuka System Properties, pilih tab Hardware dan klik tombol Device Manager. Setelah dibuka Device Manager, klik kiri pada Port. Di bagin Port disajikan beberapa device yang terpasang dengan nomor port yang digunakan. Silakan cari modem yang telah digunakan dan catat nomor port-nya. Dalam buku ini digunakan modem Wavecom Fastrack dan terpasang pada port COM3.

Dalam installer ini cukup langkah pertama yang harus disesuaikan, yaitu pada setting Gammurc. Isikan dengan port yang sesuai dan jenis koneksi yang digunakan. Detail tentang koneksi bisa didownload langsung dari sistem dengan klik pada submenu Lihat Jenis Connection yang berada pada bagian paling bawah.

(23)

Gambar 20. Device Manager

(24)

Langkah selanjutnya tinggal diikuti dan tidak perlu ada yang diganti, keculai kalau berbeda dengan nilai sebelumnya. Penting untung diingat bahwa pada langkah ke tiga, Setting Konfigurasi SMSDRC, nama database tidak boleh diganti, biarkan tetap ‘kopstranas’.

3.2. SMS GATEWAYMONITOR

Menu ini digunakan untuk SMS traffic monitoring, baik SMS yang diterima maupun SMS yang dikirimkan. Sistem secara otomatis akan memilah-milah SMS berdasar action dan isinya. Sistem secara otomatis bisa mengenali SMS dengan kode tertentu untuk selanjutnya akan memilih respon yang sesuai.

(25)

Fasilitas yang bisa digunakan oleh pengguna SMS Gateway antara lain adalah informasi dengan mengetik ‘INFO’, meminta menu penggunaan dengan mengetik ‘MENU’dan melakukan transfer dengan mengetik SMS dengan format ‘T nomor_anggota_pengirim password nomor_anggota_penerima nominal_transfer’, seluruh bagian dipisahkan dengan spasi. Seluruh SMS dari pengguna dikirim nomor SMS center yang terpasang pada modem.

PENTING!!!

Saat menjalankan Gammu 1.25 Easy Installer V1.0, pastikan modem telah terpasang dan dikenali sistem. Lakukan

instalasi modem dan drivernya dengan benar. Informasi mengenai istalasi modem silakan bisa diperoleh dari vendor produsen modem yang Anda gunakan.

(26)

23 index.php <?php echo "<script> var target=\"main/login/log.html\" window.location=target </script>

Jika Anda membaca ini artinya browser yg Anda gunakan mencegah agar tidak langsung redirect.<br>

Untuk masuk silakan klik di <a

href=\"main/login/log.html\">sini</a>"; ?>

Directory main

a.php //halaman utama sistem

<?php

//checking user session session_start(); if(empty($_SESSION['username'])){ header("Location:login/log.html"); }elseif(isset($_SESSION['jenisUser'])){ $juser=$_SESSION['jenisUser']; if (isset($_SESSION['username'])){ $username=$_SESSION['username']; } switch ($juser){ case '0':header("Location:admin/admin.php");break; //case '1':include '../daftar/upgradeanggota.php';break; } } ?>

(27)

<html> <head>

<title>Strako</title>

<script type="text/javascript" src="js/selectmenu.js"></script> <script type="text/javascript" src="js/animatedcollapse.js"></script>

<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/bottomdock.js"></script> <script type="text/javascript" src="js/ajaxform.js"></script> <script> setInterval("Simpan();",3000); setInterval("Pinjam();",2000); setInterval("Tarik();",1000); setInterval("Angsur();",3000); setInterval("waktu();",1000); $(function(){ Simpan=function(){ $("#bottomBarRefresh-left").load('autorefresh/isi.php?q=s'); } Pinjam=function(){ $("#bottomBarRefresh-center2").load('autorefresh/isi.php?q=p'); } Tarik=function(){ $("#bottomBarRefresh-center1").load('autorefresh/isi.php?q=tr'); } Angsur=function(){ $("#bottomBarRefresh-right").load('autorefresh/isi.php?q=ang'); } waktu=function(){ $("#bottomBar-rightcontent").load('autorefresh/isi.php?q=t'); }

(28)

}); </script> <script type="text/javascript"> animatedcollapse.addDiv('Anggota', 'fade=1,speed=400,group=Menu') animatedcollapse.addDiv('Simpan', 'fade=1,speed=400,group=Menu,persist=1,hide=1') animatedcollapse.addDiv('Pinjam', 'fade=0,speed=400,group=Menu,hide=1') animatedcollapse.addDiv('Cari', 'fade=0,speed=400,group=Menu,hide=1') animatedcollapse.addDiv('UserLog', 'fade=0,speed=400,group=Menu,hide=1')

animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted

//$: Access to jQuery

//divobj: DOM reference to DIV being expanded/ collapsed. Use "divobj.id" to get its ID

//state: "block" or "none", depending on state }

animatedcollapse.init() </script>

<link href="css/myStyle.css" rel="stylesheet" type="text/css"> </head>

<body> <?php

include 'config/config.php'; $sql="SELECT * FROM setup"; $result = mysql_query($sql); $i=0;

while($row = mysql_fetch_array($result)){ $setup[$i]=$row[2];

(29)

} ?>

<div id="topBar" class="fixed-position"> <div id="topBar-content">

<div id="topBar-namaKop">

Koperasi <?php echo $setup[0];?> </div>

<div id="topBar-alamatKop"> <?php echo $setup[1];?><br>

Akta Pendirian: <?php echo $setup[2];?> </div>

</div> </div> <?php

$tahun=date(y);

$sqlB="SELECT * FROM bunga WHERE Tahun=$tahun"; $resultB = mysql_query($sqlB); $i=0; while($rowB = mysql_fetch_array($resultB)){ $kdBunga[$i]=$rowB[0]; $besar[$i]=$rowB[1]; $i=$i+1; } ?>

<div id="bottomBarRefresh" class="fixed-position"> <div> <div id="bottomBarRefresh-left"> SIMPAN: </div> <div id="bottomBarRefresh-center1"> PENARIKAN: </div> </div> <div id="bottomBarRefresh-center2"> PINJAM:

(30)

</div>

<div id="bottomBarRefresh-right"> ANGSURAN:

</div> </div>

<div id="bottomBar" class="fixed-position"> <div id="bottomBar-leftcontent">

<?php echo 'BUNGA:: Sim '.$besar[0].'% | Pin '.$besar[1].'%';?> </div> <div id="bottomBar-rightcontent"> Time </div> <div id="bottomBar-footer">

Program ini dikembangkan oleh Tim Peneliti UNS Surakarta, 2010 </div> </div> <?php ?> <div id="wrapper"> <div id="leftpanel"> <div id="menuPlace"> <?php switch($juser){

case '3':include 'user/operator.php';break;

case '999':include 'user/anggota.php';break; case '-555':include 'user/visitor.php';break; } ?> </div> <div id="userLog">

(31)

</div> </div> </div> <div id="container"> <div id="logPlace"> <?php if (isset($_SESSION['username'])){ echo 'User: <strong>'.$_SESSION['username'].'</strong> [<a href="login/secure.php?logout">Logout</a>]'; }else{

echo 'User: [<a

href="login/index.html">Login</a>]'; }

?> </div>

<div id="active">

<div id="activeContainer" align="center"> </div> </div> </div> </div> </body> </html>

(32)

3.3. SUBDIRECTORY CSS

myStyle.css

body {

background-color:#F4F7FB;

font: 73% "Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif;

}

/******** TOP DOCKING **************/ #topBar {

background-color:#D8E7FE;

border-bottom: 8px solid #4A81DE ; top: 0px ;

font-family: verdana, arial ; text-align: center; color:#567EDC; height: 68px ; position: fixed ; width: 100% ; z-index: 1000 ; } #topBar-content{ margin: 2px 2px 2px 2px ;

/*border:1px solid; border-color:gray;*/ } #topBar-namaKop { padding: 0px 10px 0px 10px; font-size: 25px ; font-weight:bold; } #topBar-alamatKop { text-align:center; font-size: 12px ; font-weight:normal;

(33)

margin: 4px 20px 1px 20px ; }

/*************** BOTTOM DOCKING ***************/ #bottomBarRefresh {

/*border-top: 1px solid #567EDC ;*/ bottom: 46px ;

font-family: verdana, arial ; font-weight:bold; height: 90px ; position: fixed ; width: 100% ; z-index: 1000 ; } #bottomBarRefresh table th{ font-size:10px; text-align:left; font-weight:bold; } #bottomBarRefresh table td{ font-size:10px; } #bottomBarRefresh-left{ float:left; width:22%; height: 80px ; background-color: #D8E7FE; margin: 2px 0 3px 0 ; border:2px solid #ffffff; /*padding: 10px 10px 10px 10px;*/ } #bottomBarRefresh-center1{ float:left;

(34)

width:22%; height: 80px; background-color: #D8E7FE; margin: 2px 0px 3px 5px ; border:2px solid #ffffff; } #bottomBarRefresh-center2{ float:left; width:30%; height: 80px; background-color: #D8E7FE; margin: 2px 0px 3px 5px ; border:2px solid #ffffff; } #bottomBarRefresh-right{ float:right; width:22%; height: 80px; background-color: #D8E7FE; margin: 2px 12px 3px 0px ; border:2px solid #ffffff; /*padding: 10px 10px 10px 10px;*/ } #bottomBar { background-color: #D8E7FE; border-top: 1px solid #567EDC ; bottom: 0px ;

font-family: tahoma, verdana, arial ; font-size: 20px ;

font-weight:bold; height: 45px ; position: fixed ; width: 100% ;

(35)

z-index: 1000 ; } #bottomBar-leftcontent { float:left; margin: 2px 1px 3px 20px ; /*padding: 10px 10px 10px 10px;*/ } #bottomBar-rightcontent { float:right; margin: 2px 20px 3px 20px ; /*padding: 10px 10px 10px 10px;*/ } #bottomBar-footer { clear:right; text-align:right; font-size: 10px ; font-weight:normal; color: #ffffff ; margin: 4px 20px 0 20px ; background: #567EDC ; } div#wrapper{

/*border:1px solid; border-color:gray;*/ margin:80px 0 0 0; text-align:left;

/* background: #E4DCB2 url(../images/bgd.jpg) repeat;*/ }

div#container{ float:right; width:84%; margin-top: 0px;

border:1px solid #4A81DE; }

(36)

div#logPlace{ padding:5px 10px 3px; font-size:15px; text-align:right; } div#active{

background: #ffffff url(../images/logo.jpg) no-repeat center; min-height:250px; margin: 0 8px 8px 8px; } div#activeContainer{ background-color: #ffffff; margin: 0 8px 8px 8px; } div#leftpanel{ float:left; width:15%;margin:0; } div#menuPlace{ font-size:17px; font-weight:bold;

font-family: arial, tahoma, verdana; border-left:1px dotted #567EDC; }

div#userLog{ margin-top:10px;

font-family: tahoma, verdana, arial; }

div#trans{

(37)

padding:5px 0 5px 10px; background-color: #ffffff; color:#567EDC; font-weight:bold; } .mainMenu a{ display: block;

border: 1px solid #567EDC ; background-color:#D8E7FE; text-decoration: none; margin: 0 0 2px; color:#567EDC; } .menu a{ font-size:15px; font-weight:normal; display: block; background-color:#F4F7FB; text-decoration: none; } .menu { margin: 0 0 0; padding: 0; list-style: none; } .menu ul{ margin: 2px 0; list-style: none; } .menu li { padding: 0;

(38)

margin: 2px 0 0 15px; background-color:#F4F7FB; } .big1 input{ font-size:30px; } .big2 input{ font-size:50px; } .big { font-size:20px; } log.css body { background-color: #F4F7FB;

font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; } div#judul{ width:600px; height:40px; margin:0 auto; padding:20px 0 5px 10px; text-align:center; font-weight : bold; font-size:20px; color:#567EDC; } .sub{ margin-top:5px; font-size:14px;

(39)

} div#login{ width:300px; background : #D8E7FE; margin:0 auto; margin-top:50px; padding:5px 0 5px 10px; border: 5px solid #ffffff; text-align:left; color:#686455; } div#reg{ width:450px; background : #E4DCB2; margin:0 auto; margin-top:50px; padding:5px 0 5px 10px; border: 5px solid #9C9473; text-align:left; color:#686455; } .title { margin-bottom: 15px; } .buttondiv { margin-top: 10px; } .messagebox{ position:absolute; width:100px; margin-left:30px; border:1px solid #c93; background:#ffc;

(40)

padding:3px; } .messageboxok{ position:absolute; width:auto; margin-left:30px; border:1px solid #349534; background:#C9FFCA; padding:3px; font-weight:bold; color:#008000; } .messageboxerror{ position:absolute; width:auto; margin-left:30px; border:1px solid #CC0000; background:#F7CBCA; padding:3px; font-weight:bold; color:#CC0000; } 3.4. SUBDIRECTORY LOGIN log.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Login :: Strakop</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

(41)

<script src="../js/jquery.js" type="text/javascript" language="javascript"></script>

<script language="javascript"> // Developed by Roshan Bhattarai

// Visit http://roshanbh.com.np for this script and more. // This notice MUST stay intact for legal use

$(document).ready(function() {

$("#login_form").submit(function() {

//remove all the class add the messagebox classes and start fading

$("#msgbox").removeClass().addClass('messagebox').text( 'Validating....').fadeIn(1000);

//check the username exists or not from ajax $.post("ajax_login.php",{

user_name:$('#username').val(),password:$('#password').val(),ra nd:Math.random() } ,function(data)

{

if(data=='yes') //if correct login detail {

$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox

{

//add message and change the class of the box and start fading

$(this).html('Logging

in...').addClass('messageboxok').fadeTo(900,1, function()

{

//redirect to secure page document.location='../a.php'; });

(42)

}); } else {

$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox

{

//add message and change the class of the box and start fading

$(this).html('Maaf username dan password tidak sesuai..').addClass('messageboxerror').fadeTo(900,1);

}); }

});

return false; //not to post the form physically });

//now call the ajax also focus move from $("#password").blur(function() { $("#login_form").trigger('submit'); }); }); </script>

<link href="../css/log.css" rel="stylesheet" type="text/css"> </head>

<body>

<div id="judul">Strakop<div class="sub">Perangkat Lunak Koperasi<br><br>Login Form</div></div>

<div id="login">

<form method="post" action="" id="login_form"> <div align="center">

<div class="title" > Silakan Anda masukkan username dan password</div>

(43)

User Name : <input name="username" type="text" id="username" value="" maxlength="20" />

</div>

<div style="margin-top:5px" > Password &nbsp; :

<input name="password" type="password" id="password" value="" maxlength="20" />

</div>

<div class="buttondiv">

<input name="Submit" type="submit" id="submit" value="Login" style="margin-left:-10px; height:23px" /> <span id="msgbox" style="display:none"></span>

</div>

Untuk pengunjung online silakan masukkan user User Name : <em>visitor</em> dan Password <em>akses</em><br>

</div> </form> </div> </body> </html> ajax_login.php <?php session_start();

// Developed by Roshan Bhattarai

// Visit http://roshanbh.com.np for this script and more. // This notice MUST stay intact for legal use

//Connect to database from here include '../config/config.php'; //get the posted values

(44)

$user_name=htmlspecialchars($_POST['user_name'],ENT_QU OTES);

$pass=$_POST['password'];

//now validating the username and password from user tabel $sql="SELECT kdUser,loginName,loginPass FROM user WHERE loginName='".$user_name."'";

$result=mysql_query($sql); $row=mysql_fetch_array($result); //if username exists

if(mysql_num_rows($result)>0){ //compare the password

if(strcmp($row['loginPass'],$pass)==0){ echo "yes";

//now set the session from here if needed $_SESSION['username']=$user_name; $_SESSION['jenisUser']=$row['kdUser']; //set cookies setcookie("user", $user_name); }else{ echo "no"; } }else{

//try to acces member tabel

$sql="SELECT kdAnggota, pass FROM anggota WHERE kdAnggota='".$user_name."'";

$result=mysql_query($sql); $row=mysql_fetch_array($result); //if member exist

if(mysql_num_rows($result)>0){ //compare the password //compare the password

if(strcmp($row['pass'],$pass)==0){ echo "yes";

(45)

$_SESSION['username']=$user_name; $_SESSION['jenisUser']=999; //set cookies setcookie("user", $user_name); }else{ echo "no"; } }else{

//try detect serious visitor

if(($user_name=='visitor')AND($pass=='akses')){ echo "yes";

//now set the session from here if needed $_SESSION['username']=$user_name; $_SESSION['jenisUser']=-555; //set cookies setcookie("user", $user_name); }else{ echo "no"; } } } ?> secure.php <?php session_start();

// Developed by Roshan Bhattarai

// Visit http://roshanbh.com.np for this script and more. // This notice MUST stay intact for legal use

// if session is not set redirect the user if(empty($_SESSION['user']))

header("Location:log.html");

//if logout then destroy the session and redirect the user if(isset($_GET['logout']))

(46)

session_destroy();

header("Location:../login/log.html"); }

echo "<a href='secure.php?logout'><b>Logout<b></a>"; echo "<div align='center'>You Are inside secured Page</a>"; ?> 3.5. SUBDIRECTORY CONFIG config.php <?php $host = 'localhost'; $user = 'root'; $pass = 'root'; $db = 'kopstranas'; $connect = mysql_connect($host,$user,$pass); if (!$connect) {

die('Tidak bisa tersambung ke database server: ' . mysql_error());

}

$db_select = mysql_select_db($db) or die("Database tidak ada");

Gambar

Gambar 1. Start
Gambar 3. System-Tray Uniform Server
Gambar 4. Start UniServer
Gambar 5. Form Login.
+7

Referensi

Dokumen terkait

Penulis panjr1tkan puji dan syukur kehadirat Allah SWT atas karunia dan rahmat yang telah dilimpahkan-Nya, sehingga penulis dapat menyelesaikan tesis yang berjudul

Infeksi post natal babi oleh virus hog cholera dengan virulensi yang rendah akan menghasilkan penyakit dengan gejala yang ringan atau infeksi yang bersifat subklinis.. Namun

Persentase produk cacat pada pencetakan garment tergolong kecil karena sebelum dilakukan proses pencetakan, pihak percetakan akan melakukan dua kali konfirmasi,

Varietas dan Jenis pupuk K berpengaruh nyata terhadap ke 5 parameter pengamatan tersebut.Pupuk MKP menunjukkan pertumbuhan perakaran yang lebih baik, hal ini karena pada pupuk

Beberapa upaya dan saran dilakukan untuk menurunkan tegangan maksimum von mises yaitu dengan cara menambahkan pelat penguat ( reinforcement ) pada bagian atas

Puji syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa atas kasih dan karuniaNya penulis penulis dapat menyelesaikan tugas akhir dengan judul “GAMBARAN KELELAHAN KERJA PADA

[r]

Strategi pembelian material impor yang dapat dilakukan untuk menghindari terjadinya perubahan nilai tukar mata uang asing terhadap rupiah adalah dengan selalu