<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {
  font-family: Arial, Helvetica, sans-serif;
}

.navbar {
  overflow: hidden;
  background-color: #007bff;
}

.navbar a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 16px;  
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: royalblue;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #007bff;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

.dropdown:hover .dropdown-content {
  display: block;
}
</style>
</head>
<body>
	<div class="navbar">
	  <a href="#home">Home</a>
	  <a href="#news">News</a>
	  <div class="dropdown">
		<button class="dropbtn">Master<i class="fa fa-caret-down"></i></button>
		<div class="dropdown-content">
			<a style="font-size:20px;" href="../customer/index.php">Customer Master</a>
			<a style="font-size:20px;" href="../supplier/index.php">Supplier Master</a>
			<a style="font-size:20px;" href="../segment/index.php">Segment Master</a>
			<a style="font-size:20px;" href="../product/index.php">Product Master</a>
			<a style="font-size:20px;" href="../custdiscount/index.php">Customer Discount Master</a>
			<a style="font-size:20px;" href="../suppdiscount/index.php">Supplier Discount Master</a>
		</div>
	  </div> 
	  <div class="dropdown">
		<button class="dropbtn">Transaction<i class="fa fa-caret-down"></i></button>
		<div class="dropdown-content">
			<a style="font-size:20px;" href="../pruchase/index.php">Purchase</a>
			<a style="font-size:20px;" href="../invoice/index.php">Sales</a>
			<a style="font-size:20px;" href="../noofrows/index.php">Edit Number of Rows to Show</a>
			<a style="font-size:20px;" href="../invoice/phpinfo.php">PHP Information</a>
		</div>
	  </div>
	  <h1 style="color:white; font-size:18px; margin-left : 160px; width: 500px" class="text-primary" id="demo2" align="right"></h1>
	</div>
</body>
</html>
<?php
	$date = new DateTime();
	$current_timestamp = $date->getTimestamp();
?>
<script>
	flag_time = true;
	timer = '';
	setInterval(function(){phpJavascriptClock();},1000);
	
	function phpJavascriptClock()
	{
		if ( flag_time ) {
		timer = <?php echo $current_timestamp;?>*1000;
		}
		var d = new Date(timer);
		months = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec');		
		month_array = new Array('January', 'Febuary', 'March', 'April', 'May', 'June', 'July', 'Augest', 'September', 'October', 'November', 'December');		
		day_array = new Array( 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');		
		currentYear = d.getFullYear();
		month = d.getMonth();
		var currentMonth = months[month];
		var currentMonth1 = month_array[month];
		var currentDate = d.getDate();
		currentDate = currentDate < 10 ? '0'+currentDate : currentDate;
		
		var day = d.getDay();
		current_day = day_array[day];
		var hours = d.getHours();
		var minutes = d.getMinutes();
		var seconds = d.getSeconds();
		
		var ampm = hours >= 12 ? 'PM' : 'AM';
		hours = hours % 12;
		hours = hours ? hours : 12; // the hour ’0′ should be ’12′
		minutes = minutes < 10 ? '0'+minutes : minutes;
		seconds = seconds < 10 ? '0'+seconds : seconds;
		var strTime = hours + ':' + minutes+ ':' + seconds + ' ' + ampm;
		timer = timer + 1000;
		document.getElementById("demo2").innerHTML='Date : ' + currentDate+'-' +(month+1)+'-' +currentYear + ' Time : ' + strTime ;
		flag_time = false;
	}
</script>