<?php 
    include('session.php');

    if(isset($_POST['add_usertype_btn'])){ 
        $dept_off = mysqli_real_escape_string($db,$_POST['dept_off']);
        $usertype = mysqli_real_escape_string($db,$_POST['usertype']);

        $sql = "INSERT INTO usertype (`Department/Office`, `Usertype`, `Status`)
        VALUES ('$dept_off', '$usertype', 'Inactive')";
        if (mysqli_query($db, $sql)) {
            echo '<script>alert("Usertype was added successfully!");</script>';
            
        } else {
            $error = "Invalid";
            echo "Error: " . $sql . "<br>" . mysqli_error($db);
        }
    }

?>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
      <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>ADMIN - Barangay Poblacion 1</title>
	<link rel="icon" type="image/png" href="images/brgy_logo.png"/>
	<!-- BOOTSTRAP STYLES-->
    <link href="assets/css/bootstrap.css" rel="stylesheet" />
     <!-- FONTAWESOME STYLES-->
    <link href="assets/css/font-awesome.css" rel="stylesheet" />
     <!-- MORRIS CHART STYLES-->
    <link href="assets/js/morris/morris-0.4.3.min.css" rel="stylesheet" />
        <!-- CUSTOM STYLES-->
    <link href="assets/css/custom.css" rel="stylesheet" />
     <!-- GOOGLE FONTS-->
   <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />

   <style>
    .container {
    position: relative;
    width: 100%;
    }

    .responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: none;
    }
    </style>

<style>
/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 10000000; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
</style>
</head>
<body style="font-family: Arial;">
    <div id="wrapper">
        <nav class="navbar navbar-default navbar-cls-top " role="navigation" style="margin-bottom: 0">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse" >
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="admin.php" style="background-color: orange;">ADMIN</a> 
            </div>
  <div style="color: white;
padding: 15px 50px 5px 50px;
float: right;
font-size: 16px;"> 


        <!-- LOGOUT -->
        <?php echo $_SESSION['login_user']; ?> &nbsp; <a id="myBtn" class="btn btn-danger square-btn-adjust">Logout</a> </div>
        
        <!-- The Modal -->
        <div id="myModal" class="modal">

        <!-- Modal content -->
        <div class="modal-content" style="border-radius: 20px; height: 235px; width: 300px;">
        <span class="close">&times;</span>
        <h3>Logout</h3>
        <h4>Are you sure you want to logout?</h4>
        <br><br><br>
        <a onclick="document.getElementById('myModal').style.display='none'" class="logout" style="cursor: pointer; width: 100px; float:right; width: 70px; padding: 10px; color:white; margin-top:-20px; text-align: center; background-color: gray; border-radius: 5px; width: 100px;">No</a>
        <a href="logout.php" id="myBtn" class="logout"  style="cursor: pointer; width: 70px; padding: 10px; color:white; text-align: center; float:right; margin-top:-20px; margin-right: 5px; background-color: #4c9be1; border-radius: 5px; width: 100px;">Yes</a>

        </div>
        </div>
        </nav>   
           <!-- /. NAV TOP  -->
                <nav class="navbar-default navbar-side" role="navigation" style="height: 280%;">
            <div class="sidebar-collapse">
                <ul class="nav" id="main-menu">
				<li class="text-center">
                <img src="images/brgy_logo.png" class="user-image img-responsive"/>
					</li>
				
					
                    <li>
                        <a href="admin.php" ><i class="fa fa-dashboard fa-3x" ></i> Dashboard</a>
                    </li>
                    <!-- <li>-->
                    <!--    <a  href="messages.php" style="height: 80px; padding-top:35px;"><img src="images/message_white.jpg" width="50px" height="50px" style="margin-left: -5px; margin-top: -17px; float: left;"><i class="fa fa-3x"></i> Messages</a>-->
                    <!--</li>-->
                    <li>
                        <a  href="complaints.php" style="height: 80px; padding-top:35px;"><img src="images/task_gray.png" width="61px" height="50px" style="margin-left: -11px; margin-top: -18px; float: left;"/><i class="fa fa-3x"></i> Complaints</a>
                    </li>
                    <li>
                        <a href="file_request.php" style="height: 80px; padding-top:35px;"><img src="images/task_gray.png" width="61px" height="50px" style="margin-left: -11px; margin-top: -18px; float: left;"/><i class="fa fa-3x"></i> File Request</a>
                    </li>
                    <li>
                        <a href="announcements-admin.php" style="height: 80px; padding-top:35px;"><img src="images/announcement.png" width="61px" height="50px" style="margin-left: -11px; margin-top: -18px; float: left;"/> &nbsp &nbspAnnouncements</a>
                    </li> 
                    <!-- <li>
                        <a href="tasks.php" style="height: 80px; padding-top:35px;"><img src="images/task_gray.png" width="61px" height="50px" style="margin-left: -11px; margin-top: -18px; float: left;"/><i class="fa fa-3x"></i> Tasks</a>
                    </li>
                    <li>
                        <a  href="notifications.php" style="height: 80px; padding-top:35px;"><img src="images/notification_white.png" width="50px" height="50px" style="margin-left: -9px; margin-top: -18px; float: left;"/><i class="fa fa-3x"></i> Notifications</a>
                    </li>  
                    <li>
                        <a href="assignments.php" style="height: 80px; padding-top:35px;"><img src="images/requirement_white.png" width="50px" height="50px" style="margin-left: -9px; margin-top: -15px; float: left;"/><i class="fa fa-3x"></i> Requirements</a>
                    </li>   -->
                    <li>
                        <a href="accounts.php" style="height: 80px; padding-top:35px;"><img src="images/accounts_white1.png" width="60px" height="63px" style="margin-left: -10px; margin-top: -20px; float: left;"/><i class="fa fa-3x"></i> Accounts</a>
                    </li>     
                    <li>
                        <a href="vmc-su.php"><i class="fa fa-sitemap fa-3x"></i> &nbsp VMC</a>
                    </li>    
                    <li>
                        <a class="active-menu" href="register-faculty.php" style="height: 80px; padding-top:35px;"><img src="images/accounts_white1.png" width="60px" height="63px" style="margin-left: -10px; margin-top: -20px; float: left;"/><i class="fa fa-3x"></i> Registration</a>
                    </li>           
                      <!-- <li>
                        <a  href="evaluations.php" style="height: 80px; padding-top:35px;"><img src="images/comments_white.png" width="50px" height="56px" style="margin-left: -5px; margin-top: -18px; float: left;"/><i class="fa fa-3x"></i> Evaluations</a>
                    </li>    -->
                      <!-- <li>
                        <a  href="register.php" style="height: 80px; padding-top:35px;"><img src="images/register_user.png" width="50px" height="56px" style="margin-left: -5px; margin-top: -18px; float: left;"/><i class="fa fa-3x"></i> Register Member</a>
                    </li> -->
                </ul>
               
            </div>
            
        </nav> 
        <!-- /. NAV SIDE  -->
        <div id="page-wrapper" style="min-height: 30px;" >
            <div id="page-inner" style="min-height: 30px; padding: 30px;">
                <div class="row" style="min-height: 30px;">
                    <div class="col-md-12"> 
                    <p style="color: white; background-color: gray; padding: 18px; margin-top: -0.1px; font-family: Arial; font-weight: bold; font-size: 27px;"><img src="images/accounts_white1.png" style="width: 40px; height: 40px; margin-top: -5px;">&nbsp Registration</p>
                    <div class="container" style="min-height: 400px; width: 100%;">
                    <iframe frameborder="0" scrolling="no" onload="resizeIframe(this)" class="responsive-iframe" src="user-registration.php" title="announcements" style="width: 100%; height: 100%; background-color: #ebebeb; border-style: solid; border-radius: 5px; border-color: #ebebeb; padding: 5px;"></iframe>
                    </div>
                       
                    </div>
                </div>
                 <!-- /. ROW  -->
               
    </div>
             <!-- /. PAGE INNER  -->
            </div>
         <!-- /. PAGE WRAPPER  -->
        </div>
     <!-- /. WRAPPER  -->
    <!-- SCRIPTS -AT THE BOTOM TO REDUCE THE LOAD TIME-->
    <!-- JQUERY SCRIPTS -->
    <script>
    function resizeIframe(obj) {
        obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
    }
    </script>
    <script src="assets/js/jquery-1.10.2.js"></script>
      <!-- BOOTSTRAP SCRIPTS -->
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- METISMENU SCRIPTS -->
    <script src="assets/js/jquery.metisMenu.js"></script>
      <!-- CUSTOM SCRIPTS -->
    <script src="assets/js/custom.js"></script>

    <script>
    // Get the modal
    var modal = document.getElementById("myModal");

    // Get the button that opens the modal
    var btn = document.getElementById("myBtn");

    // Get the <span> element that closes the modal
    var span = document.getElementsByClassName("close")[0];

    // When the user clicks the button, open the modal 
    btn.onclick = function() {
    modal.style.display = "block";
    }

    // When the user clicks on <span> (x), close the modal
    span.onclick = function() {
    modal.style.display = "none";
    }

    // When the user clicks anywhere outside of the modal, close it
    window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
    }
    </script>

</body>
</html>
