<?php

include("config.php");
session_start();

if(isset($_SESSION["user_login"])){
		header("location: dashboard/account.php");
	}
	
	
	
	
	//if user is registering with referral link, get the ref from the url
	
	if(isset($_GET["ref"])){
		$refID = htmlspecialchars($_GET["ref"]);
	}
	
	
	
	
	
	
	
	
	
	
	
			//Check if site is locked - Effect site lock if pin is not set from "underMaintainance.php"
			//This is code is also pasted on "register-login.php", "index.php", user "dashboard/sidebar.php" and admin "admin/sidebar.php" 
			//to redirect user once site is blocked since sidebars appears in all pages
			
			$stmt=$pdo->prepare("SELECT * FROM maintenance");
			$stmt->execute();
			$value = $stmt->fetch();
			
			if($stmt->rowCount() > 0 && $value["locked"] == "locked"){
				
			if(!isset($_SESSION["site_lock"])){
			echo '<script>location.href="underMaintainance.php"</script>';
			}
			
			//if pass code from Session does not match code from "maintenance" table, bounce back and unset session
			//if eventually admin changed the passcode, and users previous pass Code session is set, it'll bounce them out
			elseif($_SESSION["site_lock"] !== $value["passCode"]){
			
			unset($_SESSION["site_lock"]);
			echo '<script>location.href="underMaintainance.php"</script>';			
			
			}
			}
			
	
	
	
	
	
	
	
	
	
	
	
	
	
?>
	
	



<!doctype html>
<html lang="en" class="no-js">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
	<meta name="description" content="">
	<meta name="author" content="">
	
	
	<title>Register | Login</title>

 <!-- Bootstrap Css -->
    <link href="dashboard/assets/css/bootstrap.min.css" id="bootstrap-stylesheet" rel="stylesheet" type="text/css" />
    <!-- Icons Css -->
    <link href="dashboard/assets/css/icons.min.css" rel="stylesheet" type="text/css" />
    <!-- App Css-->
    <link href="dashboard/assets/css/app.min.css" id="app-stylesheet" rel="stylesheet" type="text/css" />
	
    <link href="css/styles.css" rel="stylesheet">



	<script type="text/javascript" src="dashboard/assets/js/jquery.min.js"></script>
	<script type="text/javascript" src="dashboard/assets/js/bootstrap.min.js"></script>

</head>


<body>


<?php
//include("include/header.php");

?>


<!--SIDE BAR FOR NON LOGIN USERS-->
<style>
body{
/*background:#E6EAEA!important;*/
background-image: radial-gradient(ellipse closest-side, rgba(0, 122, 0, 0),#006600 ), url(img/tdpi.jpg)!important;
background-repeat: repeat!important;
background-size: ;
background-position: ;
font-family: "proxima-nova", "Source Sans Pro", sans-serif!important;
box-sizing:border-box;
margin:0!important;
}

@media(min-width:990px){
.ts-sidebar{
	display:none;
}
}




/*ERROR*/



.error-alert {
animation:1s error-alert;
-webkit-animation:1s error-alert;
}

@keyframes error-alert{
	from{opacity:0;}
	to{opacity:1;}
}
@-webkit-keyframes error-aler{
	from{opacity:0;}
	to{opacity:1;}
}

.error-alert.errors {
  padding: 15px;
  color: white;
  border-radius:5px;
  opacity: 1;
  font-size:16px;
  text-align:center;
  transition: opacity 1s;
  margin-bottom: 10px;
  background-color: #f27373;
  }

.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}




.form{
	margin:auto;
	max-width:1000px;
}

.form-body{
	margin:auto;
	display:flex;
	flex-direction:column;
	max-width:500px;
	background:#fbf9f7db!important;
	border:1px solid #dfd7ca;
	padding:30px;
	min-height:500px;
	border-radius:30px;
	
}
@media(max-width:500px){
	.form-body{
		width:100%!important;
		border-radius:20px!important;
		padding:20px;
		box-shadow:none!important;
	}
		
	}
}
.error{
	color:#a22727;
	margin:2px;
	font-size:15px;
}


.inputmodify{
width: 100%;
height: 50px;
padding: 20px;
font-size: 14px;
line-height: 1.42857143;
outline:none!important;
color:#3e3f3a;
background-color:#ffffff;
background-image: none;
border: 1px solid#dfd7ca;
border-radius: 15px;
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}



/*LOGIN*/


a {
  text-decoration: none;
  color: #1ab188;
  -webkit-transition: .5s ease;
  transition: .5s ease;
}
a:hover {
  color: #179b77;
}

.tab-group {
  list-style: none;
  padding: 0;
  margin: 0 0 15px 0;
}
.tab-group:after {
  content: "";
  display: table;
  clear: both;
}
.tab-group li a {
  display: block;
  text-decoration: none;
  padding: 13px;
  background: rgba(160, 179, 176, 0.25);
  color: #a0b3b0;
  font-size: 18px;
  float: right;
  width: 50%;
  text-align: center;
  cursor: pointer;
  -webkit-transition: .5s ease;
  transition: .5s ease;
}
.tab-group li a:hover {
  background: #1e3d5c;
  color: #ffffff;
}
.tab-group .active a {
  background: #1e3d5c;
  color: #ffffff;
}

.tab-content > div:last-child {
  display: none;
}


label {
  position: absolute;
  -webkit-transform: translateY(17px);
          transform: translateY(17px);
  left: 19px;
  font-weight:normal;
  color:#868181!important;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
  -webkit-backface-visibility: hidden;
  pointer-events: none;
  font-size: 14px;
}


label.active {
  -webkit-transform: translateY(56px);
   transform: translateY(56px);
  left: 2px;
  font-size: 14px;  padding-bottom:10px!important;
}

label.highlight {
  color: #888;
  font-weight:;

}


input, textarea {
  border-radius: 15px;
  -webkit-transition: border-color .25s ease, box-shadow .25s ease;
  transition: border-color .25s ease, box-shadow .25s ease;
}

.field-wrap {
  position: relative;
  margin-bottom: 25px;
}

.top-row:after {
  content: "";
  display: table;
  clear: both;
}
.top-row > div {
  float: left;
  width: 48%;
  margin-right: 4%;
}
.top-row > div:last-child {
  margin: 0;
}


.forgot {
  margin-top: -20px;
  text-align: right;
}

</style>



<p><br>


<div class="form-body" style='/*background:radial-gradient(#354b73, #021731)!important*/'>
      
      <ul class="tab-group">
		<center><img src="img/logo.png" width="130px" style="opacity:1;margin-top:-15px"></center><br>
	  
        <li class="tab"><a href="#signup" style="border-top-right-radius:10px;border-bottom-right-radius:10px;">Sign Up</a></li>
        <li class="tab active" id='tablog'><a href="#login" style="border-top-left-radius:10px;border-bottom-left-radius:10px;">Log In</a></li>
      </ul>
      
      <div class="tab-content" style="border:none;">
	  

		<!--LOGIN -->
		
    <div id="login"> 
		

		
  <center>
 <h2 style='color:#767e80' id="wlcm">Welcome Back!</h2>
  </center>    
  <br> 
  
				
		<div id="result"></div>
		<div id="errs"></div>
		
		
	

  <form method="post" id="loginform" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
          
            <div class="field-wrap">
            <label>
               &nbsp;&nbsp; <i class="fa fa-user"></i>&nbsp;&nbsp;Email or Username
            </label>
			<input class="inputmodify" type="text" name="email" id="email" autocomplete="off" autofocus value="<?php if(isset($_POST["email"])){echo $_POST["email"];}?>">
          </div>
          
          <div class="field-wrap">
            <label>
              &nbsp;&nbsp; <i class="fa fa-key"></i>&nbsp;&nbsp;Password
            </label>
			<input class="inputmodify" type="password" id="password" name="password" value="<?php if(isset($_POST["password"])){echo $_POST["password"];}?>" >
          </div>
          
        
		
          <button type="submit" name="login" id="login" class="btnss" style='width:100%; text-transform:capitalize; font-weight:normal;letter-spacing:1px'>
		  <span id="log">Log In</span>  
		<!-- animation in style.css only show when success on login-->
		  
		  <span id="roll" class="display-none">Loading <i class="fa fa-spinner fa-pulse"></i></span>
		  </button>
          
          </form>

	<center>
	 <a href="index.html"><div style="color:#496981; margin-top:30px;"><i class="fa fa-home"></i> &nbsp; Back Home</div></a>
	 </center>


        </div>
		
		
		
		
		
		
		
		
		
		
		
		
		<div id="signup">   
         	  
			  
	<form class="form" id="reg-form">
	<center>
	<h2 style='color:#767e80'>Sign Up For Free</h2>
	</center>    <br>   
		  
	<!--REGISTER -->
		  		
		<div id="registered"></div>
		<div id="regErr"></div>

          <div class="top-row">
              <input type="hidden" name="ref" id="ref" value="<?php if(!empty($_GET["ref"])){echo $_GET["ref"];} ?> ">
            <div class="field-wrap">
              <label>
                Full Name
              </label>
			<input class="inputmodify" type="text" autofocus name="fullName" id="fullName" value="<?php if(isset($_POST["fullName"])){echo $_POST["fullName"];}?>">
            </div>
        
		
            <div class="field-wrap">
              <label>
                Username
              </label>
              <input class="inputmodify" type="text" name="username"  id="username" value="<?php if(isset($_POST["username"])){echo $_POST["username"];}?>">
            </div>
          </div>
		  

          <div class="field-wrap">
          <label>
            Email
          </label>
		<input class="inputmodify" type="text" name="email" id="regemail" value="<?php if(isset($_POST["email"])){echo $_POST["email"];}?>">
          </div>
        
          <div class="field-wrap">
            <label>
              Set Password
            </label>
			<input class="inputmodify" type="password" id="pass" name="password">
			</div>

          
          <button type="submit" id="register" class="btnss" style="width:100%; height:50px; border-radius:10px; outline:none; text-transform:capitalize; font-weight:normal; letter-spacing:1px; background-color:#006600; color:white;">
   <span id="regbtn-txt">Get Started</span>
   <span id="regbtn-txt2" style="display:none;">Processing <i class="fa fa-spinner fa-pulse"></i></span>
</button>

<script>
   document.getElementById('register').addEventListener('click', function() {
      document.getElementById('regbtn-txt').style.display = 'none';
      document.getElementById('regbtn-txt2').style.display = 'inline';
   });
</script>

          
          </form>
		  
	<center>
	 <a href="index.html"><div style="color:#496981; margin-top:30px;"><i class="fa fa-home"></i> &nbsp; Back Home</div></a>
	 </center>

        </div>

		
	</div><!-- tab-content -->
	</div> <!-- /form -->



<script>
var close = document.getElementsByClassName("closebtn");
var i;
for (i = 0; i < close.length; i++) {
  close[i].onclick = function(){
    var div = this.parentElement;
    div.style.opacity = "0";
    setTimeout(function(){ div.style.display = "none"; }, 600);
  }
}
</script>








<!-- LOGIN REGISTER Twick -->

<script>

//Login Scripts

	$(document).ready(function(){
	
	//hide Error div when its clicked
	$('div#errs').click(function(){
		$('div.error-alert').fadeOut("slow");
	});
	
	
	
	$('button#login').click(function(e){
		e.preventDefault();
	
	var email = $('input#email').val();
	if(email ==''){
		
	$('div#errs').html('<div class="error-alert errors"><span class="closebtn">&times;</span><strong>Email or Username Required</strong></div>');
	
	$('input#email').focus();
	return false;
	}
	
	var password = $('input#password').val();
	if(password ==''){
	$('div#errs').html('<div class="error-alert errors"><span class="closebtn">&times;</span><strong>Enter your password</strong></div>');
	$('input#password').focus();
	return false;
	}
		
	$.ajax({
	
	type: 'POST',
	url: 'login-script.php',
	data: $('#loginform').serialize(),
	beforeSend: function(){
		$('span#roll').removeClass("display-none");
		$('span#log').hide();
	},
	complete: function(){
		$('span#roll').addClass("display-none");
		$('span#log').show();
	},
	success: function(data){
		$('#result').html(data);
	}
		
	});
	});

	});
	
	
	
	
	
	
	

//Register Scripts

	$(document).ready(function(){
	$('span#regbtn-txt2').hide();
		
	$('button#register').click(function(e){
		e.preventDefault();
		
	
	//hide Error div when its clicked
	$('div#regErr').click(function(){
		$('div.error-alert').fadeOut("slow");
	});
	
	var fullName = $('input#fullName').val();
	if(fullName ==''){
	$('#regErr').html('<div class="error-alert errors" id="nameError"><span class="closebtn">&times;</span><strong>Name is required</strong></div>');
	$('input#fullName').focus();
	return false;
	}
	
	var username = $('input#username').val();
	if(username ==''){
	$('#regErr').html('<div class="error-alert errors" id="nameError"><span class="closebtn">&times;</span><strong>Username is required</strong></div>');
	$('input#username').focus();
	return false;
	}
	
	var email = $('input#regemail').val();
	if(email ==''){
	$('#regErr').html('<div class="error-alert errors" id="nameError"><span class="closebtn">&times;</span><strong>Email is required</strong></div>');
	$('input#regemail').focus();
	return false;
	}
	
	var pass = $('input#pass').val();
	if(pass ==''){
	$('#regErr').html('<div class="error-alert errors" id="nameError"><span class="closebtn">&times;</span><strong>Enter Password</strong></div>');
	$('input#pass').focus();
	return false;
	}
		
	$.ajax({
	type: 'POST',
	url: 'signup-script.php',
	data: $('#reg-form').serialize(),
	beforeSend: function(){
		$('span#regbtn-txt2').show();
		$('span#regbtn-txt').hide();
	},
	success: function(data){
		var data = $('#registered').html(data);	
		$('span#regbtn-txt2').hide();
		$('span#regbtn-txt').show();
	}	
		
	});
	});

	});





$('.form-body').find('input, textarea').on('keyup blur focus', function (e) {
  
  var $this = $(this),
      label = $this.prev('label');

      if (e.type === 'keyup') {
            if ($this.val() === '') {
          label.removeClass('active highlight');
        } else {
          label.addClass('active highlight');
        }
    } else if (e.type === 'blur') {
        if( $this.val() === '' ) {
            label.removeClass('active highlight'); 
            } else {
            label.removeClass('highlight');   
            }   
    } else if (e.type === 'focus') {
      
      if( $this.val() === '' ) {
            label.removeClass('highlight'); 
            } 
      else if( $this.val() !== '' ) {
            label.addClass('highlight');
            }
    }

});

$('.tab a').on('click', function (e) {
  
  e.preventDefault();
  
  $(this).parent().addClass('active');
  $(this).parent().siblings().removeClass('active');
  
  target = $(this).attr('href');

  $('.tab-content > div').not(target).hide();
  
  $(target).fadeIn(600);
  
});
</script>








<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/649b88c194cf5d49dc6039bd/1h3vosdlg';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
</script>
<!--End of Tawk.to Script-->


</body>

</html>





