<?php


include_once 'includes/functions.php';




//include authenticator
include_once 'includes/auth.php';



?>

<!DOCTYPE html>
<html>
  <head>
    <title>NIGER STATE COLLEGE OF EDUCATION MINNA:::CMS</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="images/favicon.png" type="image/x-icon" />
    <!-- Bootstrap -->
    
    <!-- call bootstap styles -->
    <link href="bootstrap-3.3.4/css/bootstrap.min.css" rel="stylesheet">
    
    <!-- call custom admin styles -->
	<link href="login/css/signin.css" rel="stylesheet">
	<link href="login/css/docs.css" rel="stylesheet" >
    
    
    
    
     <!-- call full slider CSS here -->
	<link href="full-slider/css/full-slider.css" rel="stylesheet">
    
    
     <!-- call jquery file for ajax login -->
    <script src="login/js/jquery.js" type="text/javascript" language="javascript"></script>
    
     <!-- for full slider index -->
	<script type="text/javascript" src="full-slider/js/jquery-1.10.2.js"></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()
//    {
	  $(function()
	  {
		  
		
		//hide all the loaders
		$("#error_alert").hide();
		
		
        $("#login_form").submit(function(e)
		{
			
			
			
			//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("login/php/ajax_login.php",{ username:$('#username').val(),password:$('#password').val(),rand: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('Login successful. Redirecting.....').addClass('messageboxok').fadeTo(900,1,function()
				  { 
					 //redirect to secure page
					 window.location='gateway.php';
				  });
				  
				});
			  }
			  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('Oops! Passed credentials does not match with the one on system...').addClass('messageboxerror').fadeTo(900,1);
				  
				  $(this).html('Oops! Passed credentials does not match with the one on system...').addClass('messageboxerror').fadeTo(900,1);
				  
				  //$("#error_alert").fadeIn(900,1);

				});		
			  }
					
			});
			return false; //not to post the  form physically
		
		e.preventDefault();
		});
		//now call the ajax also focus move from 
		$("#password").blur(function()
		{
			$("#login_form").trigger('submit');
		});
		
		 
    });
    </script>
    
    
    
     <!-- front full slider index page slider -->
     <style type="text/css">
		/* red bg caption position */
		.blue_float_position
		{
			background-image:url(images/bluebgsm.png);
			box-shadow: 0 0 10px #000;
			position:absolute; 
			top:70px; left:60%; 
			max-width:500px; 
			max-height:150px;
			font-size:78px;
			
			
		}
		
		
		.black_float_position
		{
			background-image:url(images/blackbgsm.png);
			box-shadow: 0 0 10px #000;
			position:absolute; top:225px; 
			left:60%; 
			max-width:421px; 
			max-height:100px;  
			
			
		}

	
	</style>
    
    
    <style type="text/css">
	
	.messagebox{
		position:absolute;
		width:100px;
		margin-left:30px;
		border:1px solid #c93;
		background:#ffc;
		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;
	}
	
	</style>

    
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
  
</head>
<body>
	<header class="navbar navbar-inverse bs-docs-nav" role="banner">
			<div class="container" style="height:60px;">
				<div class="navbar-header">
					<a class="navbar-brand" href="#"><img src="images/admin_logo.png"/></a>
				</div>
				<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
					<ul class="nav navbar-nav navbar-right">
						<li><a href="#">Help</a></li>
					</ul>
				</nav>
			</div>
	</header>



	<div class="container">
			<div class="row">
            
            <div style="height: 50px; display: block;"> .</div>
            <div class="col-lg-12"><!-- feedback message on different kinds of logout -->
            
            	<?php  if(isset($_REQUEST['msg'])){$msg = $_REQUEST['msg'];} ?>
                
                <?php 
					if($msg == 'ce')
					{
				?> <div class="alert alert-danger">
			 			<button class="close" data-dismiss="alert" type="button">
			 				X

    		 			</button>
						<img src="login/img/info.png" />  Oops! Cookie has expired....
                    </div>
                    
                 <?php
					}//end of if cookie expired
				 ?>
                 
                 <?php 
					if($msg == 'se')
					{
				 ?> <div class="alert alert-danger">
			 			<button class="close" data-dismiss="alert" type="button">
			 				X

    		 			</button>
						<img src="login/img/info.png" />  Oops! Your Session has expired, Please login again.....
                    </div>
                    
                 <?php
					}//end of if session expired
				 ?>
                 
                 <?php 
					if($msg == 'lgt')
					{
				 ?> <div class="alert alert-info">
			 			<button class="close" data-dismiss="alert" type="button">
			 				X

    		 			</button>
						<img src="login/img/info.png" />  You have been successfully logged out......
                    </div>
                    
                 <?php
					}//end of if log out
				 ?>
                 
                 
                 
                 
            
            </div><!-- /col lg 12 -->
            
            
				<div class="col-lg-8"> 
				
					
                    <div id="myCarousel" class="carousel slide">
                      <!-- Indicators -->
                      <ol class="carousel-indicators">
                          <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                          <li data-target="#myCarousel" data-slide-to="1"></li>
                          <li data-target="#myCarousel" data-slide-to="2"></li>
                         
                      </ol>
              
                      <!-- Wrapper for slides -->
                      <div class="carousel-inner" >
                          <div class="item active">
                              <!--<div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=Slide One');"></div>-->
                              <img src="full-slider/img/admin_login_slider/slider1.png" height="800" width="1500"   />
                              <div class="carousel-caption blue_float_position">
                                 <!-- <h3>Sldier 1</h3>-->
                              </div>
                              <div class="carousel-caption black_float_position">
                                 <!-- <p>Slider 1 write up</p>-->
                              </div>
                              
                          </div>
                          <div class="item" >
                              <!-- <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=Slide Two');"></div>-->
                              
                              <img src="full-slider/img/admin_login_slider/slider2.png" height="800" width="1500" />
                              <div class="carousel-caption blue_float_position">
                                  <!--<h3>Slider 2</h3>-->
                              </div>
                              <div class="carousel-caption black_float_position">
                                  <!--<p>Slider 2 write up </p>-->
                              </div>
                          </div>
                          <div class="item">
                              <!-- <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=Slide Three');"></div>-->
                              <img src="full-slider/img/admin_login_slider/slider3.png" height="800" width="1500" />
                              <div class="carousel-caption blue_float_position">
                                 <!-- <h3>Slider 3</h3>-->
                              </div>
                              <div class="carousel-caption black_float_position">
                                  <!--<p>Slider 3 write up</p>-->
                              </div>
                          </div>
                            
                      </div>
              
                      <!-- Controls -->
                      <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                          <span class="icon-prev"></span>
                      </a>
                      <a class="right carousel-control" href="#myCarousel" data-slide="next">
                          <span class="icon-next"></span>
                      </a>
                  </div>

                 <h1> Login Panel</h1>
					<p>Use valid username and password to gain access to the administartor backend
                    <a href="../"> Goto the app home page </a></p>
                    
                    
				</div>
                
                 
                <!-- Notification -->
                <div class="col-lg-4 well alert-success">
                
               	<!--  <div id="msgbox" style="display:none;"></div>-->
                
                <div>
                	
                    
                    <span id="msgbox" style="display:none"></span>

	                <div class="alert alert-danger" id="error_alert">
			 			<button class="close" data-dismiss="alert" type="button">
			 				X

    		 			</button>
						<img src="login/img/error_icon.png" />  Oops! Invalid credentials..
                    </div>
                
                </div>
                
                 
                  <form id="login_form" name="log_in" class="form-signin form-horizontal" role="form"  method="post">
					<h2 class="form-signin-heading">Please login</h2> <hr/>
					<input class="form-control" type="text" name="username" id="username" autofocus required placeholder="Username" value="">
					<input class="form-control" type="password" name="password" id="password" required placeholder="Password" value="">
					
                    
                    
                    <div class="form-actions">

                        <button class="btn btn-success glyphicon glyphicon-lock"  name="act" value="Log-in" type="submit">
                    
                            Login
                    
                        </button>
                        <button class="btn btn-danger glyphicon glyphicon-remove" type="reset">
                    
                            Reset
                    
                        </button>
                        <input id="token" type="hidden" value="6666" name="token"></input>
                    
                    </div>
					
                    
                   
                       
                    
				</form>
                </div>				
			</div>
		</div>
<!-- continer for the copied templates ends ---->


     
     
     
    <!-- JS boostrap -->
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="bootstrap-3.3.4/js/bootstrap.min.js"></script>
    
    <script src="bootstrap-3.3.4/js/bootstrap.js"></script>
    
        
     <!-- Script to Activate the Carousel full slider -->
    <script>
    $('.carousel').carousel({
        interval: 5000 //changes the speed
    })
    </script>  
    
  </body>
</html>

