Download to read offline
![var info = document.getElementById("info");
var infoText = document.getElementById("userInfo");
var warning = document.getElementById("warning");
var alert = document.getElementById("alert");
//console.log(namaLengkap.value);
button.addEventListener('click', function(e){
e.preventDefault();
var action = "";
var match = nisn.value.match(/[^0-9]/g);
var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0-
9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/);
//console.log($.isArray(match));
info.setAttribute("style","display:none;");
warning.setAttribute("style","display:none;");
if(nisn.value == "" || nisn.value == null){
//alert("NISN Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "NISN Tidak Boleh Kosong!";
nisn.focus();
return action = "false";
}else if($.isArray(match) === true){
//alert("NISN Tidak Valid!");
alert.removeAttribute("style");
alert.innerHTML = "NISN Tidak Valid!";
nisn.focus();
return action = "false";
}else if(namaLengkap.value == "" || namaLengkap.value == null){
//alert("Nama Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Nama Tidak Boleh Kosong!";
namaLengkap.focus();
return action = "false";
}else if(sekolahAsal.value == "" || sekolahAsal.value == null){
//alert("Sekolah Asal Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Sekolah Asal Tidak Boleh Kosong!";
sekolahAsal.focus();
return action = "false";
}else if(email.value == "" || email.value == null){
//alert("Email Address Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Email Tidak Valid!";
email.focus();
return action = "false";
}else if($.isArray(emailVer) === false){
//alert("Email Tidak Valid!");
alert.removeAttribute("style");
alert.innerHTML = "Email Tidak Valid!";](https://image.slidesharecdn.com/244737aaxxxx-190415131045/85/WEB-DESIGN-APPLICATION-14-320.jpg)
![<div class="col-md-6 alert alert-danger" id="warning" style="display:none;"></div>
<div class="col-md-6 alert alert-warning" id="alert" style="display:none;"></div>
<div class="col-md-3"></div>
</div>
<div class="col-md-12">
<form action="" method="POST">
<input type="text" class="my-form" name="namaSekolah" id="namaSekolah" placeholder="Nama
Sekolah" />
<input type="text" class="my-form" name="email" id="email" placeholder="Email Address" />
<button type="submit" class="my-button" id="btnDaftar">Daftar</button>
</form>
</div>
</div>
</center>
</div>
<script>
var button = document.getElementById("btnDaftar");
var namaSekolah = document.getElementById("namaSekolah");
var email = document.getElementById("email");
var info = document.getElementById("info");
var infoText = document.getElementById("userInfo");
var warning = document.getElementById("warning");
var alert = document.getElementById("alert");
//console.log(namaLengkap.value);
button.addEventListener('click', function(e){
e.preventDefault();
var action = "";
var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0-
9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/);
//console.log($.isArray(match));
if(namaSekolah.value == "" || namaSekolah.value == null){
//alert("Nama Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Nama Sekolah Tidak Boleh Kosong!";
namaSekolah.focus();
return action = "false";
}else if(email.value == "" || email.value == null){
//alert("Email Address Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Email Tidak Valid!";
email.focus();
return action = "false";
}else if($.isArray(emailVer) === false){](https://image.slidesharecdn.com/244737aaxxxx-190415131045/85/WEB-DESIGN-APPLICATION-17-320.jpg)
![</div>
</div>
</center>
</div>
<script>
var button = document.getElementById("btnLogin");
var email = document.getElementById("email");
var pass = document.getElementById("pass");
var warning = document.getElementById("warning");
var alert = document.getElementById("alert");
button.addEventListener('click', function(e){
e.preventDefault();
var action = "";
var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0-
9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/);
//console.log($.isArray(match));
if(email.value == "" || email.value == null){
//alert("Email Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Email Tidak Boleh Kosong!";
email.focus();
return action = "false";
}else if($.isArray(emailVer) === false){
//alert("Email Tidak Valid!");
alert.removeAttribute("style");
alert.innerHTML = "Email Tidak Valid!";
email.focus();
return action = "false";
}else if(pass.value == "" || pass.value == null){
//alert("Password Tidak Boleh Kosong!");
alert.removeAttribute("style");
alert.innerHTML = "Password Tidak Boleh Kosong!";
pass.focus();
return action = "false";
}
if(action != "false"){
button.setAttribute("disabled","disabled");
email.setAttribute("readonly", "readonly");
pass.setAttribute("readonly","readonly");
button.setAttribute("class","my-button button-loading");
button.innerHTML = "Loading..";
function openForm(){
button.removeAttribute("disabled");](https://image.slidesharecdn.com/244737aaxxxx-190415131045/85/WEB-DESIGN-APPLICATION-20-320.jpg)
![//console.log("Ready!");
}
});
</script>
Listing login Sebagai Peserta
<div class="containertheme-showcase">
<center>
<div class="col-md-12 col-form login">
<div class="col-md-12 col-title-form">
<h1 class="title-form">LOGIN PESERTA</h1>
<h3 class="subtitle-form">Selamat Datang. Login.</h3>
<div class="col-md-3"></div>
<div class="col-md-6 alert alert-danger" id="warning" style="display:none;"></div>
<div class="col-md-6 alert alert-warning" id="alert" style="display:none;"></div>
<div class="col-md-6">{alert}</div>
<div class="col-md-3"></div>
</div>
<div class="col-md-12">
<form action="" method="POST">
<input type="text" class="my-form" name="email" id="email" placeholder="Email Address" />
<input type="password" class="my-form" name="pass" id="pass" placeholder="Password" />
<button type="submit" class="my-button" id="btnLogin">Login</button>
</form>
</div>
</div>
</center>
</div>
<script>
var button = document.getElementById("btnLogin");
var email = document.getElementById("email");
var pass = document.getElementById("pass");
var warning = document.getElementById("warning");
var alert = document.getElementById("alert");
button.addEventListener('click', function(e){
e.preventDefault();
var action = "";
var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0-
9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/);
//console.log($.isArray(match));
if(email.value == "" || email.value == null){](https://image.slidesharecdn.com/244737aaxxxx-190415131045/85/WEB-DESIGN-APPLICATION-22-320.jpg)
![case "PASS":
//console.log("pass!");
//alert("Maaf password anda salah!");
warning.removeAttribute("style");
warning.innerHTML = "<b>Maaf!</b> Password salah!";
openForm();
pass.focus();
break;
case "EMAIL":
//console.log("email!");
//alert("Maaf email belum terdaftar!");
warning.removeAttribute("style");
warning.innerHTML = "<b>Maaf!</b> Email belum terdaftar!";
openForm();
email.focus();
break;
default:
alert("Sorry! But Something Wrong! Please try again!");
location.reload();
break;
}
},
error: function(error){
//console.log("Sorry! But Something Wrong!");
alert("Sorry! But Something Wrong! Please try again!");
//location.reload();
}
});
//console.log("Ready!");
}
});
</script>
Listing Lainnya [LATAR BELAKANG]
<div class="col-md-12 about">
<div class="container">
<div class="col-md-12" id="title">
<h2><b>{judul}</b></h2>
</div>
<div class="col-md-12" id="content">
<p>{isi}</p>
</div>
<div class="col-md-12" id="title-follow">
<h4><b>Follow Us on</b></h4>
</div>
<div class="col-md-12" id="sosmed">
<img src="{base_url}public/images/facebook.png">
<img src="{base_url}public/images/twitter.png">](https://image.slidesharecdn.com/244737aaxxxx-190415131045/85/WEB-DESIGN-APPLICATION-24-320.jpg)
WEB DESIGN APPLICATION
- 1. TUGAS SOTSKILL DESIGN WEB APPLICATION Dosen: Tri Sulistyorini Oleh : ANGGARA RAMADHAN (50417759) DIKKY ANDHIKA RAMADHANI(51417694) ALFHARIZKY FAUZI(50417462) FADHILAH ANGGRIANI (52417034) FAKULTAS TEKNOLOGI INDUSTRI JURUSAN TEKNIK INFORMATIKA UNIVERSITAS GUNADARMA
- 2. 2019 Menu Beranda =Akan mengarahkan ke tampilan utama dari web. Menu beranda yang kami buat untuk memudahkan seleksi penerimaan siswa baru (PPDB) untuk mencari info sekolah favorit yang ingin didaftarkan. Didalam menu beranda terdapat info sekolah dan petunjuk pendaftaran untuk calon peserta didik. Beranda
- 3. Menu petunjuk =Untuk memudahkan calon peserta didik dalam registrasi PPDB dan mendaftar ke sekolah favorit. Pada laman ini kita membuat petunjuk cara mengikuti PPDB ,dengan memberikan petunjuk petunjuk apa sajya yang harus dilakukan oleh peserta PPDB online Petunjuk
- 4. Menu daftar sekolah= Mendaftar ke sekolah yang ingin dituju oleh calon peserta seleksi PPDB Peserta ppdb yang sudah mengikuti petunjuk atau sudah login ke website PSB ONLINE Mendaftar ke sekolah favorit yang ingin dituju. Daftar Sekolah
- 5. Menu Registrasi =Untuk calon peserta didik mendaftarkan diri. Registrasi Peserta
- 6. Sub Menu masukSebagai Peserta = Mengisi data untuk masuk kedalam sekolah favorit dari PSB(Peserta didik baru) Masuk Sebagai Peserta
- 7. Sub Menu masuksebagai sekolah= Mendaftarkan sekolah yang terkait kedalam web PSB Online Masuk Sebagai Sekolah
- 8. Listing Program Listing Beranda <divclass="banner-img"> <div class="containertheme-showcase"> <div class="top-bannercol-md-12"> <h2>Selamat Datang <b><em>Calon Peserta</em></b> Didik Baru</h2> <em>Cari Sekolah Favorit Kamu Sekarang</em> <form action="{base_url}daftar_sekolah/cari" class="form-search" method="GET"> <input type="text" class="search-txt" name="k" placeholder="Masukan Nama Sekolah"> <button type="submit" class="search-submit"><img src="{base_url}public/images/search_asd.png"></button> </form> </div> <div class="bottom-bannercol-md-12"> <div class="col-md-3"></div> <a href="{base_url}daftar_sekolah"> <div class="col-md-3 menu-box red" id="box1"> <h4><b>INFO SEKOLAH</b></h4> <img src="{base_url}public/images/info-sekolah.png"> </div> </a> <a href="{base_url}beranda/petunjuk"> <div class="col-md-3 menu-box yellow" id="box2"> <h4><b>PETUNJUK</b></h4> <img src="{base_url}public/images/direction.png"> </div> </a> <div class="col-md-3"></div> </div> </div> </div> <div class="col-md-12 about"> <div class="container"> <div class="col-md-12" id="title"> <h2><b>PSB ONLINE 2015</b></h2> </div> <div class="col-md-12" id="content"> <p>Lorem Ipsumis simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,remaining essentially unchanged.It was popularised in the 1960s with the release of
- 9. Letraset sheets containingLorem Ipsumpassages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <img src="{base_url}public/images/petunjuk.png"> </div> <div class="col-md-12" id="title-follow"> <h4><b>Follow Us on</b></h4> </div> <div class="col-md-12" id="sosmed"> <img src="{base_url}public/images/facebook.png"> <img src="{base_url}public/images/twitter.png"> </div> </div> </div> <!--<div class="col-md-12 pie-chart"> <div class="container"> <div class="col-md-12" id="title"> <h2>Data Statistik <b>JALUR PSB</b> 2015</h2> </div> <div class="col-md-12" id="content"> <div class="col-md-4" id="chart1"> <div id="chartdiv" style="width: 100%; height: 400px;" ></div> </div> </div> </div> </div>--> <div class="col-md-12 partner"> <div class="container"> <div class="col-md-12" id="title"> <h2><b>Bekerja Sama</b> Dengan</h2> </div> <ul class="list-partner" style="margin:0px; padding:0px;"> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=664&roleid=101"><img src="{base_url}public/images/partner1.jpg"></a></li> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=664&roleid=101"><img src="{base_url}public/images/partner2.jpg"></a></li> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=667&roleid=101"><img src="{base_url}public/images/partner3.jpg"></a></li> <li><a href="http://www.imiawards.org.uk/"><img src="{base_url}public/images/partner4.gif"></a></li> <li><a href="http://www.cisco.com/"><img src="{base_url}public/images/partner5.jpg"></a></li> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=666&roleid=101"><img src="{base_url}public/images/partner6.jpg"></a></li> </ul> </div> </div>
- 10. Listing Petunjuk <div class="col-md-12about"> <div class="container"> <div class="col-md-12" id="title"> <h2><b>PETUNJUK PENDAFTARAN</b></h2> </div> <div class="col-md-12" id="content"> <p>Lorem Ipsumis simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,remaining essentially unchanged.It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsumpassages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <br><br> <img src="{base_url}public/images/petunjuk.png"> </div> <div class="col-md-12" id="title-follow"> <h4><b>Follow Us on</b></h4> </div> <div class="col-md-12" id="sosmed"> <img src="{base_url}public/images/facebook.png"> <img src="{base_url}public/images/twitter.png"> </div> </div> </div> <!--<div class="col-md-12 pie-chart"> <div class="container"> <div class="col-md-12" id="title"> <h2>Data Statistik <b>JALUR PSB</b> 2015</h2> </div> <div class="col-md-12" id="content"> <div class="col-md-4" id="chart1"> <div id="chartdiv" style="width: 100%; height: 400px;" ></div> </div> </div> </div> </div>--> <div class="col-md-12 partner"> <div class="container"> <div class="col-md-12" id="title"> <h2><b>Bekerja Sama</b> Dengan</h2> </div> <div class="col-md-12" id="content"> <ul class="list-partner">
- 11. <li><a href="#"><img src="{base_url}public/images/partner1.jpg"></a></li> <li><a href="#"><img src="{base_url}public/images/partner2.jpg"></a></li> <li><ahref="#"><img src="{base_url}public/images/partner3.jpg"></a></li> <li><a href="#"><img src="{base_url}public/images/partner4.gif"></a></li> <li><a href="#"><img src="{base_url}public/images/partner5.jpg"></a></li> </ul> </div> </div> </div> Untuk Daftar Sekolah <div class="containertheme-showcase p-password"> <center> <div class="col-md-4"> <div class="sidebar"> <div class="sidebar-title">CARI SEKOLAH</div> <form action="{base_url}daftar_sekolah/cari" class="form-search" method="GET" style="margin:20px 0px;"> <input type="text" class="search-txt" name="k" style="width:200px;" placeholder="Nama Sekolah"> <button type="submit" class="search-submit"><img src="{base_url}public/images/search_asd.png"></button> </form> </div> <div class="sidebar"> <div class="sidebar-title">JENJANG SEKOLAH</div> <ul> {js} <li><a href="{base_url}daftar_sekolah/jenjang/{id}">{name}</a></li> {/js} </ul> </div> </div> <div class="col-md-8"> <ol class="breadcrumb my-breadcrumb"> <li><a href="{base_url}beranda">Beranda</a></li> <li class="active">Semua Sekolah</li> </ol> <div class="page-header" style="text-align:left; margin-top:0px;"> <h2 style="margin:0px; color:#4183d7">Semua Sekolah</h2> </div> <div class="col-md-12" style="text-align:left;"> <table class="table table-striped"> <thead> <tr> <th>Nama Sekolah</th> <th>Jenjang Sekolah</th> <th>Akreditasi</th>
- 12. <th>Status</th> <th>Link</th> </tr> </thead> <tbody> {sekolah} <tr id="{id}"> <td>{nama}</td> <td>{jenjang}</td> <td>{akre}</td> <td>{status}</td> <td> <a href="{base_url}daftar_sekolah/detail/{id}"><buttonclass="btn btn- primary">Detail</button></a><br /> </td> </tr> {/sekolah} </tbody> </table> </div> </div> </center> </div> <script> $('.btnDel').on('click', function(){ var no = $(this).attr('data-id'); //console.log(no); $("#"+no).hide(); //e.preventDefault(); //console.log(fileid); $.ajax({ type: 'POST', data: { id: no }, url: "{base_url}AjaxProcess/tambahKompetensi", success:function(data){ console.log(data.Stat); if(data.Stat == "SUCCESSED"){ openForm(); clearValue(); success.removeAttribute("style"); successRes.innerHTML = " <strong>Berhasil!</strong> Kompetensi berhasil ditambahkan."; }else{ alert("Woops! Terjadi kesalahan, silahkan mencoba ulang."); //location.reload(); } },
- 13. error: function(error){ console.log("Woops!Something Wrong!"); //location.reload(); } }) }); </script> ListingRegistrasi Peserta <div class="containertheme-showcase"> <center> <div class="col-md-12 col-form"> <div class="col-md-12 col-title-form"> <h1 class="title-form">REGISTRASI PESERTA</h1> <h3 class="subtitle-form">Selamat Datang. Daftar.</h3> <div class="col-md-3"></div> <div class="col-md-6 alert alert-info" id="info" style="display:none;"> <div id="userInfo"></div> <div id="linkInfo"><a href="{base_url}login/peserta"><b>Login Now!</b></a></div> </div> <div class="col-md-6 alert alert-danger" id="warning" style="display:none;"></div> <div class="col-md-6 alert alert-warning" id="alert" style="display:none;"></div> <div class="col-md-3"></div> </div> <div class="col-md-12"> <form action="" method="POST"> <input type="text" class="my-form" name="nisn" id="nisn" placeholder="Nomor Induk Siswa Nasional (NISN)" /> <input type="text" class="my-form" name="namaLengkap" id="namaLengkap" placeholder="Nama Lengkap" /> <input type="text" class="my-form" name="sekolahAsal" id="sekolahAsal" placeholder="Sekolah Asal" /> <input type="text" class="my-form" name="email" id="email" placeholder="Email Address" /> <button type="submit" class="my-button" id="btnDaftar">Daftar</button> </form> </div> </div> </center> </div> <script> var button = document.getElementById("btnDaftar"); var nisn = document.getElementById("nisn"); var namaLengkap = document.getElementById("namaLengkap"); var sekolahAsal = document.getElementById("sekolahAsal"); var email = document.getElementById("email");
- 14. var info =document.getElementById("info"); var infoText = document.getElementById("userInfo"); var warning = document.getElementById("warning"); var alert = document.getElementById("alert"); //console.log(namaLengkap.value); button.addEventListener('click', function(e){ e.preventDefault(); var action = ""; var match = nisn.value.match(/[^0-9]/g); var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0- 9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/); //console.log($.isArray(match)); info.setAttribute("style","display:none;"); warning.setAttribute("style","display:none;"); if(nisn.value == "" || nisn.value == null){ //alert("NISN Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "NISN Tidak Boleh Kosong!"; nisn.focus(); return action = "false"; }else if($.isArray(match) === true){ //alert("NISN Tidak Valid!"); alert.removeAttribute("style"); alert.innerHTML = "NISN Tidak Valid!"; nisn.focus(); return action = "false"; }else if(namaLengkap.value == "" || namaLengkap.value == null){ //alert("Nama Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Nama Tidak Boleh Kosong!"; namaLengkap.focus(); return action = "false"; }else if(sekolahAsal.value == "" || sekolahAsal.value == null){ //alert("Sekolah Asal Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Sekolah Asal Tidak Boleh Kosong!"; sekolahAsal.focus(); return action = "false"; }else if(email.value == "" || email.value == null){ //alert("Email Address Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Valid!"; email.focus(); return action = "false"; }else if($.isArray(emailVer) === false){ //alert("Email Tidak Valid!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Valid!";
- 15. email.focus(); return action ="false"; } if(action != "false"){ button.setAttribute("disabled","disabled"); nisn.setAttribute("readonly","readonly"); namaLengkap.setAttribute("readonly", "readonly"); sekolahAsal.setAttribute("readonly","readonly"); email.setAttribute("readonly", "readonly"); button.setAttribute("class","my-button button-loading"); button.innerHTML = "Loading.."; var ns = nisn.value; var na = namaLengkap.value; var se = sekolahAsal.value; var em = email.value; function openForm(){ button.removeAttribute("disabled"); button.setAttribute("class","my-button"); button.innerHTML = "Daftar"; nisn.removeAttribute("readonly"); namaLengkap.removeAttribute("readonly"); sekolahAsal.removeAttribute("readonly"); email.removeAttribute("readonly"); } function clearValue(){ nisn.setAttribute("value",""); namaLengkap.setAttribute("value",""); email.setAttribute("value", ""); sekolahAsal.setAttribute("value",""); } $.ajax({ type: "POST", dataType:"JSON", data: { nisn: nisn.value, nama: namaLengkap.value, sekolah: sekolahAsal.value, email: email.value }, url: "{base_url}AjaxProcess/daftarPeserta", success:function(data){ //console.log("Ready!"); //console.log(data.result.error); var status =data.stat; var error = data.result.error; if(status != "FAILED" && (error == "" || error == null)){ openForm();
- 16. clearValue(); info.setAttribute("style","display:block;"); warning.setAttribute("style","display:none;"); infoText.innerHTML = "<b>Berhasil</b>Silahkan login!<br />Password Anda : <b>"+ data.result.pass +"</b>"; }else if(error == "NISN"){ //alert("Maaf NISN sudah terdaftar!"); info.setAttribute("style","display:none;"); warning.setAttribute("style","display:block;"); warning.innerHTML = "<b>Maaf!</b> NISN Sudah Terdaftar!"; openForm(); nisn.focus(); }else if(error == "Email"){ //alert("Maaf Email sudah terdaftar!"); info.setAttribute("style","display:none;"); warning.setAttribute("style","display:block;"); warning.innerHTML = "<b>Maaf!</b> Email Sudah Terdaftar!"; openForm(); clearValue(); email.focus(); }else{ alert("Sorry! But Something Wrong! Please try again!"); location.reload(); } }, error: function(error){ //console.log("Sorry! But Something Wrong!"); alert("Sorry! But Something Wrong! Please try again!"); location.reload(); } }); //console.log("OK!"); } }); </script> Listing Registasi Sebagai Sekolah <div class="containertheme-showcase p-regis-sekolah"> <center> <div class="col-md-12 col-form"> <div class="col-md-12 col-title-form"> <h1 class="title-form">REGISTRASI SEKOLAH</h1> <h3 class="subtitle-form">Selamat Datang. Daftar.</h3> <div class="col-md-3"></div> <div class="col-md-6 alert alert-info" id="info" style="display:none;"> <div id="userInfo"></div> <div id="linkInfo"><a href="{base_url}login/sekolah"><b>Login Now!</b></a></div> </div>
- 17. <div class="col-md-6 alertalert-danger" id="warning" style="display:none;"></div> <div class="col-md-6 alert alert-warning" id="alert" style="display:none;"></div> <div class="col-md-3"></div> </div> <div class="col-md-12"> <form action="" method="POST"> <input type="text" class="my-form" name="namaSekolah" id="namaSekolah" placeholder="Nama Sekolah" /> <input type="text" class="my-form" name="email" id="email" placeholder="Email Address" /> <button type="submit" class="my-button" id="btnDaftar">Daftar</button> </form> </div> </div> </center> </div> <script> var button = document.getElementById("btnDaftar"); var namaSekolah = document.getElementById("namaSekolah"); var email = document.getElementById("email"); var info = document.getElementById("info"); var infoText = document.getElementById("userInfo"); var warning = document.getElementById("warning"); var alert = document.getElementById("alert"); //console.log(namaLengkap.value); button.addEventListener('click', function(e){ e.preventDefault(); var action = ""; var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0- 9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/); //console.log($.isArray(match)); if(namaSekolah.value == "" || namaSekolah.value == null){ //alert("Nama Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Nama Sekolah Tidak Boleh Kosong!"; namaSekolah.focus(); return action = "false"; }else if(email.value == "" || email.value == null){ //alert("Email Address Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Valid!"; email.focus(); return action = "false"; }else if($.isArray(emailVer) === false){
- 18. //alert("Email Tidak Valid!"); alert.removeAttribute("style"); alert.innerHTML= "Email Tidak Valid!"; email.focus(); return action = "false"; } if(action != "false"){ button.setAttribute("disabled","disabled"); namaSekolah.setAttribute("readonly", "readonly"); email.setAttribute("readonly", "readonly"); button.setAttribute("class","my-button button-loading"); button.innerHTML = "Loading.."; function openForm(){ button.removeAttribute("disabled"); button.setAttribute("class","my-button"); button.innerHTML = "Daftar"; namaSekolah.removeAttribute("readonly"); email.removeAttribute("readonly"); } function clearValue(){ namaSekolah.setAttribute("value", ""); email.setAttribute("value", ""); } $.ajax({ type: "POST", dataType:"JSON", data: { nama: namaSekolah.value, email: email.value }, url: "{base_url}AjaxProcess/daftarSekolah", success:function(data){ //console.log("Ready!"); //console.log(data.result.error); var status =data.stat; var error = data.result.error; if(status != "FAILED" && (error == "" || error == null)){ info.setAttribute("style","display:block;"); warning.setAttribute("style","display:none;"); infoText.innerHTML = "<b>Berhasil</b> Silahkan login!<br />Password Anda : <b>"+ data.result.pass +"</b>"; openForm(); clearValue(); }else if(error == "SEKOLAH"){ //alert("Maaf NISN sudah terdaftar!"); info.setAttribute("style","display:none;"); warning.setAttribute("style","display:block;"); warning.innerHTML = "<b>Maaf!</b> Nama Sekolah Sudah Terdaftar!";
- 19. openForm(); namaSekolah.focus(); }else if(error =="Email"){ //alert("Maaf Email sudah terdaftar!"); info.setAttribute("style","display:none;"); warning.setAttribute("style","display:block;"); warning.innerHTML = "<b>Maaf!</b> Email Sudah Terdaftar!"; openForm(); clearValue(); email.focus(); }else{ alert("Sorry! But Something Wrong! Please try again!"); location.reload(); } }, error: function(error){ //console.log("Sorry! But Something Wrong!"); alert('Sorry! But Something Wrong! Please try again!'); location.reload(); } }); //console.log("OK!"); } }); </script> Listing Login Sebagai Sekolah <div class="containertheme-showcase"> <center> <div class="col-md-12 col-form login"> <div class="col-md-12 col-title-form"> <h1 class="title-form">LOGIN SEKOLAH</h1> <h3 class="subtitle-form">Selamat Datang. Login.</h3> <div class="col-md-3"></div> <div class="col-md-6 alert alert-danger" id="warning" style="display:none;"></div> <div class="col-md-6 alert alert-warning" id="alert" style="display:none;"></div> <div class="col-md-6">{alert}</div> <div class="col-md-3"></div> </div> <div class="col-md-12"> <form action="" method="POST"> <input type="text" class="my-form" name="email" id="email" placeholder="Email Address" /> <input type="password" class="my-form" name="pass" id="pass" placeholder="Password" /> <button type="submit" class="my-button" id="btnLogin">Login</button> </form>
- 20. </div> </div> </center> </div> <script> var button =document.getElementById("btnLogin"); var email = document.getElementById("email"); var pass = document.getElementById("pass"); var warning = document.getElementById("warning"); var alert = document.getElementById("alert"); button.addEventListener('click', function(e){ e.preventDefault(); var action = ""; var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0- 9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/); //console.log($.isArray(match)); if(email.value == "" || email.value == null){ //alert("Email Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Boleh Kosong!"; email.focus(); return action = "false"; }else if($.isArray(emailVer) === false){ //alert("Email Tidak Valid!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Valid!"; email.focus(); return action = "false"; }else if(pass.value == "" || pass.value == null){ //alert("Password Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Password Tidak Boleh Kosong!"; pass.focus(); return action = "false"; } if(action != "false"){ button.setAttribute("disabled","disabled"); email.setAttribute("readonly", "readonly"); pass.setAttribute("readonly","readonly"); button.setAttribute("class","my-button button-loading"); button.innerHTML = "Loading.."; function openForm(){ button.removeAttribute("disabled");
- 21. email.removeAttribute("readonly"); pass.removeAttribute("readonly"); button.setAttribute("class","my-button"); button.innerHTML = "Login"; } $.ajax({ type:"POST", dataType:"JSON", data: { email: email.value, pass:pass.value }, url: "{base_url}AjaxProcess/loginSekolah", success:function(data){ //console.log("Ready!"); //console.log(data); var status =data.stat; switch(status){ case "YES": //console.log("Berhasil!"); location.href = "{base_url}Sekolah/dashboard"; break; case "PASS": //console.log("pass!"); //alert("Maaf password anda salah!"); warning.removeAttribute("style"); warning.innerHTML = "<b>Maaf!</b> Password salah!"; openForm(); pass.focus(); break; case "EMAIL": //console.log("email!"); //alert("Maaf email belum terdaftar!"); warning.removeAttribute("style"); warning.innerHTML = "<b>Maaf!</b> Email belum terdaftar!"; openForm(); email.focus(); break; default: alert("Sorry! But Something Wrong! Please try again!"); location.reload(); break; } }, error: function(error){ //console.log("Sorry! But Something Wrong!"); alert("Sorry! But Something Wrong! Please try again!"); //location.reload(); } });
- 22. //console.log("Ready!"); } }); </script> Listing login SebagaiPeserta <div class="containertheme-showcase"> <center> <div class="col-md-12 col-form login"> <div class="col-md-12 col-title-form"> <h1 class="title-form">LOGIN PESERTA</h1> <h3 class="subtitle-form">Selamat Datang. Login.</h3> <div class="col-md-3"></div> <div class="col-md-6 alert alert-danger" id="warning" style="display:none;"></div> <div class="col-md-6 alert alert-warning" id="alert" style="display:none;"></div> <div class="col-md-6">{alert}</div> <div class="col-md-3"></div> </div> <div class="col-md-12"> <form action="" method="POST"> <input type="text" class="my-form" name="email" id="email" placeholder="Email Address" /> <input type="password" class="my-form" name="pass" id="pass" placeholder="Password" /> <button type="submit" class="my-button" id="btnLogin">Login</button> </form> </div> </div> </center> </div> <script> var button = document.getElementById("btnLogin"); var email = document.getElementById("email"); var pass = document.getElementById("pass"); var warning = document.getElementById("warning"); var alert = document.getElementById("alert"); button.addEventListener('click', function(e){ e.preventDefault(); var action = ""; var emailVer = email.value.match(/^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([[0- 9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/); //console.log($.isArray(match)); if(email.value == "" || email.value == null){
- 23. //alert("Email Tidak BolehKosong!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Boleh Kosong!"; email.focus(); return action = "false"; }else if($.isArray(emailVer) === false){ //alert("Email Tidak Valid!"); alert.removeAttribute("style"); alert.innerHTML = "Email Tidak Valid!"; email.focus(); return action = "false"; }else if(pass.value == "" || pass.value == null){ //alert("Password Tidak Boleh Kosong!"); alert.removeAttribute("style"); alert.innerHTML = "Password Tidak Boleh Kosong!"; pass.focus(); return action = "false"; } if(action != "false"){ button.setAttribute("disabled","disabled"); email.setAttribute("readonly", "readonly"); pass.setAttribute("readonly","readonly"); button.setAttribute("class","my-button button-loading"); button.innerHTML = "Loading.."; function openForm(){ button.removeAttribute("disabled"); email.removeAttribute("readonly"); pass.removeAttribute("readonly"); button.setAttribute("class","my-button"); button.innerHTML = "Login"; } $.ajax({ type: "POST", dataType:"JSON", data: { email: email.value, pass:pass.value }, url: "{base_url}AjaxProcess/loginPeserta", success:function(data){ //console.log("Ready!"); //console.log(data); var status =data.stat; switch(status){ case "YES": //console.log("Berhasil!"); location.href = "{base_url}Peserta/dashboard"; break;
- 24. case "PASS": //console.log("pass!"); //alert("Maaf passwordanda salah!"); warning.removeAttribute("style"); warning.innerHTML = "<b>Maaf!</b> Password salah!"; openForm(); pass.focus(); break; case "EMAIL": //console.log("email!"); //alert("Maaf email belum terdaftar!"); warning.removeAttribute("style"); warning.innerHTML = "<b>Maaf!</b> Email belum terdaftar!"; openForm(); email.focus(); break; default: alert("Sorry! But Something Wrong! Please try again!"); location.reload(); break; } }, error: function(error){ //console.log("Sorry! But Something Wrong!"); alert("Sorry! But Something Wrong! Please try again!"); //location.reload(); } }); //console.log("Ready!"); } }); </script> Listing Lainnya [LATAR BELAKANG] <div class="col-md-12 about"> <div class="container"> <div class="col-md-12" id="title"> <h2><b>{judul}</b></h2> </div> <div class="col-md-12" id="content"> <p>{isi}</p> </div> <div class="col-md-12" id="title-follow"> <h4><b>Follow Us on</b></h4> </div> <div class="col-md-12" id="sosmed"> <img src="{base_url}public/images/facebook.png"> <img src="{base_url}public/images/twitter.png">
- 25. </div> </div> </div> <!--<div class="col-md-12 pie-chart"> <divclass="container"> <div class="col-md-12" id="title"> <h2>Data Statistik <b>JALUR PSB</b> 2015</h2> </div> <div class="col-md-12" id="content"> <div class="col-md-4" id="chart1"> <div id="chartdiv" style="width: 100%; height: 400px;" ></div> </div> </div> </div> </div>--> <div class="col-md-12 partner"> <div class="container"> <div class="col-md-12" id="title"> <h2><b>Bekerja Sama</b> Dengan</h2> </div> <ul class="list-partner" style="margin:0px; padding:0px;"> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=664&roleid=101"><img src="{base_url}public/images/partner1.jpg"></a></li> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=664&roleid=101"><img src="{base_url}public/images/partner2.jpg"></a></li> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=667&roleid=101"><img src="{base_url}public/images/partner3.jpg"></a></li> <li><a href="http://www.imiawards.org.uk/"><img src="{base_url}public/images/partner4.gif"></a></li> <li><a href="http://www.cisco.com/"><img src="{base_url}public/images/partner5.jpg"></a></li> <li><a href="http://www.certiport.com/Portal/desktopdefault.aspx?tabid=666&roleid=101"><img src="{base_url}public/images/partner6.jpg"></a></li> </ul> </div> </div> Lainnya(Latar Belakang)
- 26. Menu lainnya (LatarBelakang) = dasar dasar pembuatan PSB online