
­­­­­­­­­­­­­­­­­­
<!DOCTYPE html>
<html>
<?php $source = $_GET['utm_source']."|".$_GET['utm_campaign']; 
include "tracking.php";
?>
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Funland | Everyone is winner</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<style>
body{
 background-image: url("../login/images/bg.jpg");
 background-color: #cccccc; 
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

.input-kd{
    border: 3px solid #fff;
    border-radius: 23px;
    background-image: linear-gradient(to right,#E6E6E6, #fff);
    box-shadow: 0px 0px 4px 4px #2dbdbb;
}
.error{
    border: 3px solid red !important;
   /* background-image: linear-gradient(to right,red, red) !important; */
}

.label-kd{
color: #fcda00;
}
.fl-right{
    float: right;
}


    
</style>  
  
</head>
<body>
<div class="container">

<div style="height:96px;"></div>

<div style="
    top: 15px;
    left: 201px;
    position: absolute;
">
<img src="../login/images/funland-logo.png" style="height: 35px;" >    
</div>

<div style="
    top: 15px;
    right: 201px;
    position: absolute;
">
<img src="../login/images/hashtag.png" style="height: 57px;" >    
</div>

<div>
<img src="../login/images/every-one-is-winner-funland.png" style="height: 40px;" class="mx-auto d-block">    
</div>
    
<form action="https://funlandksa.com/luckywheel/login/plogin.php" name="wtl123" onSubmit='javascript:document.charset="UTF-8";return validateForm()' accept-charset='UTF-8'; method="post">

<div class="form-group">
    <label for="cname" class="label-kd">Name</label>
    <label for="cname" class="label-kd fl-right">الإسم</label>
    <input type="text" class="form-control input-kd" name="cname" id="cname">
    <div style="text-align:center;"><span id="ecname" style="color:white;"></span></div>
  </div>
  
  <div class="form-group">
    <label for="mobile" class="label-kd">Mobile</label>
    <label for="mobile" class="label-kd fl-right">الجوال</label>
    <input type="tel" class="form-control input-kd" name="mobile" id="mobile">
    <div style="text-align:center;"><span id="emobile" style="color:white;"></span></div>
  </div>
  
  <div class="form-group">
    <label for="email" class="label-kd">Email</label>
    <label for="email" class="label-kd fl-right">البريد الإلكتروني</label>
    <input type="email" class="form-control input-kd" name="email" id="email">
    <div style="text-align:center;"><span id="eemail" style="color:white;"></span></div>
  </div>
  

<input type="hidden" value="<?php echo $source; ?>"  name="source" id="source">
  
  <div class="form-group">
    <label for="city" class="label-kd">City</label>
    <label for="city" class="label-kd fl-right">الـمـدينـة</label>
    <select class="form-control input-kd" name="city" id="city">
    <option value="">---</option>
    <option value="Makkah">مكة</option>
    <option value="Al-Ahsa">الأحساء</option>
        
    </select>
    <div style="text-align:center;"><span id="ecity" style="color:white;"></span></div>
  </div>
  

<div>

<input type="image" name="submit" value="1" src="../login/images/play-win-min.png" style="height: 96px;" class="mx-auto d-block" />    
    
</div> 

</form>

<div>
<img src="../login/images/lucky-wheel.png" style="height: 280px;" class="mx-auto d-block">    
</div>  
 
    
    
</div>    
<div style="height:64px;"></div> 
<div style="height:64px;"></div> 


    
</body>
</html>

<script>
    function validateForm() {
    
   var npattern = /[0-9!@#\$%\^\&*\)\(+=._-]/;
   var emailpattern = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
    var arnuminput = /[٠,١,٢,٣,٤,٥,٦,٧,٨,٩]/;
    var ennuminput = /[0-9]/;
    var mblpattern = /^05/;
    var armblpattern = /^٠٥/;
    var mblpattern2 = /[A-Za-z!@#\$%\^\&*\)\(+=._-]/;
    var mblpattern3 =/[^0-9]/;
    var armblpattern3 =/[^٠,١,٢,٣,٤,٥,٦,٧,٨,٩]/;
    //var npchk = str.match(npattern);

var arabic = /[\u0600-\u065F\u066A-\u06EF\u06FA-\u06FFa-zA-Z]/;
//result = arabic.test(text);
 
var a = document.forms["wtl123"]["cname"].value;
var ay = document.forms["wtl123"]["cname"];
    if (a == null || a == "" || a.trim() == "") {
        document.getElementById("ecname").innerHTML = "مطلوبة";
        ay.classList.add("error");
        return false;
    }
else if (a.match(npattern)){
document.getElementById("ecname").innerHTML = "اسم غير صحيح";
ay.classList.add("error");
return false;
}

else if (a !== null || a !== "" || a.trim() !== ""){
document.getElementById("ecname").innerHTML = "";
ay.classList.remove("error");
}
 

var c = document.forms["wtl123"]["email"].value;
var cy = document.forms["wtl123"]["email"];
if(emailpattern.test(c)){var temp = '1';}else{var temp = '0';}
    if (c == null || c == "" || c.trim() == "") {
        document.getElementById("eemail").innerHTML = "مطلوبة";
        cy.classList.add("error");
        return false;
    }
else if (temp == '0'){
document.getElementById("eemail").innerHTML = "البريد الألكتروني غير صحيح";
cy.classList.add("error");
return false;
}

else if (c !== null || c !== "" || c.trim() !== ""){
document.getElementById("eemail").innerHTML = "";
cy.classList.remove("error");
}
    
    var d = document.forms["wtl123"]["mobile"].value;
    var dy = document.forms["wtl123"]["mobile"];
    if (d == null || d == "" || d.trim() == "") {
        document.getElementById("emobile").innerHTML = "مطلوبة";
        dy.classList.add("error");
        return false;
    }
else if(arabic.test(d)){
    document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
    dy.classList.add("error");
return false;
}
else{
if(d.match(arnuminput)){    
if (!d.match(armblpattern)){
document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
dy.classList.add("error");
return false;
}
else if (d.match(armblpattern3)){
document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
dy.classList.add("error");
return false;
}       
else if (d.length < '10'){
document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
dy.classList.add("error");
return false;
}     
else if (d !== null || d !== "" || d.trim() !== ""){
document.getElementById("emobile").innerHTML = "";
}
}
else if(d.match(ennuminput)){
if (!d.match(mblpattern)){
document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
dy.classList.add("error");
return false;
}
else if (d.match(mblpattern3)){
document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
dy.classList.add("error");
return false;
}       
else if (d.length < '10'){
document.getElementById("emobile").innerHTML = "رقم الجوال غير صحيح";
dy.classList.add("error");
return false;
}     
else if (d !== null || d !== "" || d.trim() !== ""){
document.getElementById("emobile").innerHTML = "";
dy.classList.remove("error");
}    
}
}
   var e = document.forms["wtl123"]["city"].value;
   var ey = document.forms["wtl123"]["city"];
    if (e == null || e == "" || e.trim() == "") {
        document.getElementById("ecity").innerHTML = "مطلوبة";
        ey.classList.add("error");
        return false;
    }
else if (e !== null || e !== "" || e.trim() !== ""){
document.getElementById("ecity").innerHTML = "";
ey.classList.remove("error");
}


}


</script>