<!DOCTYPE html>
<html>
<head>
	<title>Add Assignment</title>

	<!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8" />
    <meta name="description" content="Assignment Submission">
    <meta name="author" content="Abhishek Joshi, Shabarish Ramaswamy, Aakriti Sharma, Shlok Naik">

    <!-- Chrome, Firefox OS and Opera -->
    <meta name="theme-color" content="#000">
    <!-- Windows Phone -->
    <meta name="msapplication-navbutton-color" content="#000">
    <!-- iOS Safari -->
    <meta name="apple-mobile-web-app-status-bar-style" content="#000">

    <!-- //Meta tag Keywords -->
    
    <!-- Bootstrap -->
    <!-- CSS only -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">

    <!-- JS, Popper.js, and jQuery -->
    <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>

    <!-- CSS -->
    <link rel="stylesheet" href="/css/style.css">

    <!-- FontAwesome -->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.14.0/css/all.css" integrity="sha384-HzLeBuhoNPvSl5KYnjx0BT+WB0QEEqLprO+NBkkk5gbc67FTaL7XIGa2w1L0Xbgc" crossorigin="anonymous">

    <script>
        function check() {
            let val = new Date(
                document.getElementById('date').value
            ).getTime();
            if (val < new Date().getTime()) {
                alert('Due Date should be in future!');
                document.getElementById('date').value = ''
                return false;
            } else {
                document.getElementById('hide').value = val;
                return true;
            }
        }
    </script>


    
</head>
<body>

	<div class="bg-dark text-white">
		<div class="container">
			<div class="row pt-3">
				<div class="col-md-6 col-12">

					<p><%= email %></p>
				</div>

				<div class="col-md-6 col-12">
					<p class="text-md-right"><%= name1 %></p>
				</div>
				<div class="col-12 mb-3">
					<div class="text-right">
						<a href="/logout" class="btn btn-danger">Logout</a>
					</div>
				</div>
			</div>
		</div>
	</div>


	<div class="container">
		
			
      
      <div class="row">
	<div class="col-2">
    <h2><%= name %> <small><%= code %></small></h2>
        </div></div>

        <form action="/add/<%= code %>">
            <div class="form-group">
              <label for="exampleInputEmail1">Due Date</label>
              <input type="datetime-local" class="form-control" id="date" name="date" onchange="check()" required>
            </div>
            <input type="hidden" name="hide" id="hide" />
            <div class="form-group">
                <label for="exampleInputEmail1">Title</label>
                <input type="text" class="form-control" id="title" name="title" required>
            </div>
            <div class="form-group">
                <label for="exampleInputEmail1">Description</label>
                <input type="text" class="form-control" id="description" name="description" required>
            </div>
        </form>
        <form action="/add/<%= code %>/upload/<%= no %>" enctype="multipart/form-data" method="POST" id="doc-upl">
            <div class="form-group">
                <label for="userPDF">Add file (Optional)</label>
                <input type="file" class="form-control-file" id="userPDF" name="userPDF" accept=".pdf">
              </div>
              <input class="btn btn-primary" type="submit" name="" id="">
        </form>

        <script>
            document.getElementById('doc-upl').addEventListener('submit',(e)=>{
                e.preventDefault()

                if(!check())
                {
                    return false;
                }

                let ser={}
                ser['hide']=document.getElementById('hide').value
                ser['title']=document.getElementById('title').value
                ser['description']=document.getElementById('description').value
                
                $.ajax({
					url: '/add/<%= code %>',
					type: 'POST',
					data: ser,
					success: function (res) {
						if (res.message == 'Done') {
                            if(document.getElementById('userPDF').files.length > 0)
							{
                                document.getElementById('doc-upl').submit()
                            }
                            else{
                                location.replace('/classroom/<%= code %>')
                            }
						} else {
							alert('Error')
						}
					},
					error: function (res) {
						document.getElementById('incorrect').style.display =
							'block';
						document
							.getElementById('login-sub')
							.removeAttribute('disabled');
					}
				});
            })
        </script>
          
        
        
   </div>
	

            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
      
</body>
</html>