Marle
/
webAdministracion


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724
							<?php
	
	require_once 'processes/config.php';
	require_once 'processes/dbh.inc.php';
	require_once 'processes/checkLogin.php';
	include_once 'header.php';
	
	// RETRIEVE USER'S NAME AND PICTURE
// 	$query1 = "SELECT * FROM `researcher` WHERE `email` = '" . $_SESSION['dbUserData']['email'] . "';";
// 	$result1 = mysqli_query($connection, $query1);
// 	$dbUserData = mysqli_fetch_assoc($result1);
	$dbUserData = $_SESSION['dbUserData'];
	
// 	var_dump($_SESSION);
// 	exit();
		
	// IF USER NOT IN DATABASE, EXIT
	if(!$dbUserData) {
		exit();
	}
	
?>

	<style>
	.popover-content {
		color: #333;
	}
	</style>
	
	
	<!-- START OF home.php -->
	<body>

    	<header id="main-header">
        	<a id="logo" href=".">
				TANIA
            	<img src="./img/pen_800x800.png" alt="tania logo pen" width="25" height="25">
        	</a>
        	<div id="account">
            	<?php if($_SESSION['dbUserData']['admin'] === '1'): ?>
            	<a class="nav-link" href="./users.php">Manage Researchers</a>
            	<?php endif; ?>
        	    <a class="sign-out" href="./processes/logout.php">Sign Out</a>
        	</div>
    	</header>


    	<section id="welcome">
        	<div id="welcome-text">
        	    <img id="welcome-image" src="<?php echo $dbUserData["picture"]; ?>" alt="User">
        	    <h2 id="welcome-user">Welcome <?php echo explode(" ", $dbUserData['name'])[0]; ?></h2>
        	</div>
    	</section>


    	<main id="experience-main">
    	
        	<div class="experience-lead">
        	    <h2>Manage Your Experiences</h2>
        	</div>
        	
        	<div id="experience-content">

				<!--change to #New when using experience as templates has been implemented-->
            	<div class="grid-box" id="new-experience" onclick="nextModal('#New_2')">
                	<span class="fas fa-plus"></span>
                    <h4>New</h4>
            	</div>

<?php

	// DISPLAY ALL EXPERIENCES THAT ARE NOT PART OF A PROJECT FIRST
	// THEN CREATE A NEW ROW FOR EACH PROJECT WHICH IS 'POPULATED' BY ITS EXPERIENCES

	// CHANGE QUERY DEPENDING ON IF USER IS ADMIN OR NOT
	if($_SESSION['dbUserData']['admin'] === '1') {
		$queryProjectlessExperiences = "SELECT E.id AS eid, E.start_date AS start_date, E.end_date AS end_date, E.title AS ename FROM `experience` AS E WHERE E.id NOT IN (SELECT P.id_experience FROM project_experience AS P);";
		
// 		$queryProjectsWithExperiences = "SELECT E.id AS eid, E.start_date AS start_date, E.end_date AS end_date, E.title AS ename, P.id AS pid, P.name AS pname
// 					FROM experience AS E
// 					JOIN project_experience AS PE
// 					JOIN project AS P
// 					WHERE E.id = PE.id_experience
// 					AND P.id = PE.id_project
// 					ORDER BY P.id, E.start_date";

		$queryProjects = "SELECT * FROM project ORDER BY project.id DESC;";
		$queryCountExperiences = "SELECT COUNT(*) FROM experience;";
		
	} else {
		$queryProjectlessExperiences = "SELECT E.id AS eid, E.start_date AS start_date, E.end_date AS end_date, E.title AS ename FROM `experience` AS E WHERE E.id NOT IN (SELECT P.id_experience FROM project_experience AS P) AND E.id IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "');";
		
// 		$queryProjectsWithExperiences = "SELECT E.id AS eid, E.start_date AS start_date, E.end_date AS end_date, E.title AS ename, P.id AS pid, P.name AS pname
// 					FROM experience AS E
// 					JOIN project_experience AS PE
// 					JOIN project AS P
// 					WHERE E.id = PE.id_experience
// 					AND P.id = PE.id_project
// 					AND E.id IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "')
// 					ORDER BY P.id, E.start_date";
		
		$queryCountExperiences = "SELECT COUNT(*) FROM experience AS E WHERE E.id IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "');";
		
		$queryProjects = "SELECT * FROM project WHERE id IN (SELECT id_project FROM project_experience WHERE id_experience IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "')) ORDER BY project.id DESC;";
	}
	
	$resultProjectlessExperiences = mysqli_query($connection, $queryProjectlessExperiences);	
	while($row = mysqli_fetch_array($resultProjectlessExperiences)):
	
?>

            	<div class="grid-box" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
            	
            		<?php if(mb_strlen($row['ename']) == 0): ?>
                	<span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><small>N/A</small></span>
            		<?php elseif(mb_strlen($row['ename']) < 21): ?>
                	<span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><?php echo $row['ename']; ?></span>
                	<?php else: ?>
<!--style="white-space: nowrap;"--><span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><?php echo substr($row['ename'], 0, 30)."<small>...</small>"; ?></span>
                	<?php endif; ?>
                	
                	<div class="box-dates" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
                	    <p style="margin-bottom: 0;">• Starts: <?php echo date("M j, Y", strtotime($row['start_date'])); ?></p>
                	    <p>• Ends: <?php echo date("M j, Y", strtotime($row['end_date'])); ?></p>
                	</div>
                	
                	<?php 
                		$x = (strtotime($row['end_date']) - strtotime('now')) / 604800;
                		if($x <= 0):
                	?>
                	<span class="box-weeks warning">Finished</span>
                 	<?php elseif(0 < $x && $x < 1):?>
                	<span class="box-weeks" style="font-size: 1.2rem">Less than a week remaining</span>
                	<?php else: ?>
                	<span class="box-weeks"><?php echo round($x); ?> week<?php if($x > 0) echo 's'; ?> remaining</span>
                	<?php endif; ?>
                	<span class="box-edit" style="background: none;">
                	    <a><i class="fas fa-pen"></i></a>
                	</span>

            	</div><!--grid-box-->
	
<?php endwhile; ?>

			</div><!--experience-content-->

<?php
	
            	
	$resultProjects = mysqli_query($connection, $queryProjects);
	while($rowP = mysqli_fetch_array($resultProjects)):
	
?>

			<div class="row">
<!-- 				<div > -->
				<h3 class="col-sm-12" style="color: white;">
					<?php echo $rowP['name']; ?>
					<button type="button" class="btn btn-link btn-lg" data-toggle="popover" title="Project Description" data-content="<?php echo $rowP['description']; ?>" data-placement="right">
						<span style="color: #eee;" class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
					</button>
				</h3>
<!-- 				</div> -->
			</div>
				
				
        	<div id="experience-content">
				
<?php

		$queryExperiencesInProject = "SELECT E.id AS eid, E.title AS ename, E.start_date, E.end_date
										FROM experience AS E
										WHERE E.id IN (SELECT id_experience FROM project_experience WHERE id_project = '" . $rowP['id'] . "')
										ORDER BY E.start_date DESC";
		$resultExperiencesInProject = mysqli_query($connection, $queryExperiencesInProject);
		while($row = mysqli_fetch_array($resultExperiencesInProject)):

?>
				
            	<div class="grid-box" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
            	
            		<?php if(mb_strlen($row['ename']) == 0): ?>
                	<span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><small>N/A</small></span>
            		<?php elseif(mb_strlen($row['ename']) < 21): ?>
                	<span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><?php echo $row['ename']; ?></span>
                	<?php else: ?>
<!--style="white-space: nowrap;"--><span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><?php echo substr($row['ename'], 0, 30)."<small>...</small>"; ?></span>
                	<?php endif; ?>
                	
                	<div class="box-dates" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
                	    <p style="margin-bottom: 0;">• Starts: <?php echo date("M j, Y", strtotime($row['start_date'])); ?></p>
                	    <p>• Ends: <?php echo date("M j, Y", strtotime($row['end_date'])); ?></p>
                	</div>
                	
                	<?php 
                		$x = (strtotime($row['end_date']) - strtotime('now')) / 604800;
                		if($x <= 0):
                	?>
                	<span class="box-weeks warning">Finished</span>
                 	<?php elseif(0 < $x && $x < 1):?>
                	<span class="box-weeks" style="font-size: 1.2rem">Less than a week remaining</span>
                	<?php else: ?>
                	<span class="box-weeks"><?php echo round($x); ?> week<?php if($x > 0) echo 's'; ?> remaining</span>
                	<?php endif; ?>
                	<span class="box-edit" style="background: none;">
                	    <a><i class="fas fa-pen"></i></a>
                	</span>

            	</div>


<?php endwhile; ?>

			</div><!--experience-content-->
		
<?php endwhile; ?>
			
			
			<br><br>

		</main>


<?php if(mysqli_query($connection, $queryCountExperiences)->num_rows === 0): // USER DOESN'T HAVE EXPERIENCES YET (PROMPT MODAL) ?>
		<script> setTimeout(() => $('#FirstTime').modal('show'), 1000); </script>
<?php endif; ?>


		<!-- POPUP FOR FIRST TIME -->
		<div class='modal fade' id='FirstTime' tabindex='-1' role='dialog' aria-labelledby='FirstTimeLabel' aria-hidden='true'>
			<div class='modal-dialog modal-sm' role='document'>
 				<div class='modal-content'>
 					<div class='modal-body'>
 						
 						
 						<!-- CLOSE BUTTON -->
 						<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
						
						<div class="row text-center">
							<h3>You don't have any experiences yet!</h3>
						
							<h5>Press below to create a new one!</h5>
						
							<button type="button" class='btn btn-default' data-dismiss='modal' onclick="nextModal('#New_2')">New</button>
						</div>
 								
       		
     		 		</div><!--modal-body-->
    			</div><!--modal-content-->
  			</div><!--modal-dialog-->
		</div><!--modal-->


<!--
		<!~~ POPUP FOR NEW EXPERIENCE 1 ~~>
		<div class='modal fade' id='New' tabindex='-1' role='dialog' aria-labelledby='NewLabel' aria-hidden='true'>
			<div class='modal-dialog modal-sm' role='document'>
 				<div class='modal-content'>
 					<div class='modal-body'>
 						
 						
 						<!~~ CLOSE BUTTON ~~>
 						<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
						
						<h4 class='text-center'>Want to add another experience?</h4>
						
						<!~~ CHOOSE: BRAND NEW EXPERIENCE OR USE A TEMPLATE~~>
						<div class='row text-center'>
							<div class='btn-group'>
								<button type="button" class='btn btn-default' data-dismiss="modal" onclick="nextModal('#New_2')">Brand New</button>
								<a href='#' class='btn btn-default'>Use Template</a>
							</div>
						</div>
						<br>
 						
 						
      				</div><!~~modal-body~~>
    			</div><!~~modal-content~~>
  			</div><!~~modal-dialog~~>
		</div><!~~modal~~>
-->

		
<form id="newExperience"><!--method='POST' action='processes/insertExperience.php'-->
		<!-- POPUP FOR NEW EXPERIENCE 2 -->
		<div class='modal fade' id='New_2' tabindex='-1' role='dialog' aria-labelledby='NewLabel_2' aria-hidden='true'>
			<div class='modal-dialog modal-lg' role='document'>
 				<div class='modal-content'>
 				
 					<div class='modal-body'>
 						
 						
 						<!-- CLOSE BUTTON -->
 						<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
						
						<div class='row'>
							<div class='col-sm-10'>
								<h2>Brand New Experience <small>(Basic Info)</small></h2>
<!-- 								<h3><small>Start creating a new experience by first adding its basic info.</small></h3> -->
							</div>
						</div><!--row--> 						

						<hr><br>

	
						<div class="form-horizontal">
	
							<!-- TITLE -->
							<div class='form-group'>
								<label class='control-label col-sm-2' for='e_title'>Title:</label>
								<div class='col-sm-9'>
									<input type='text' class='form-control text-center' id='e_title' name='title' placeholder='Title' maxlength="60" required>
								</div>
							</div>
				
							<!-- DESCRIPTION -->
							<div class='form-group'>
								<label class='control-label col-sm-2' for='e_description'>Description:</label>
								<div class='col-sm-9'>
									<textarea class='form-control text-center' id='e_description' name='description' rows='1' style='resize:vertical;' placeholder='Description' maxlength="100" required></textarea>
								</div>
							</div>
				
							<!-- TYPE -->
							<div class='form-group'>
								<label class='control-label col-sm-2' for='e_description'>Type:</label>
								<div class='col-sm-9'>
									<select class="form-control text-center" style="text-align-last: center;" id='e_type' name='type' required>
										<option selected value="Course-Based Research Experience">Course-Based Research Experience</option>
										<option value="Undergraduate Research Experience">Undergraduate Research Experience</option>
									</select>
								</div>
							</div>
				
							<!-- DURATION -->
<!-- 							<div class='form-group'> -->
<!-- 								<label class='control-label col-sm-2' for='e_description'>Duration:</label> -->
<!-- 								<div class='col-sm-9'> -->
<!-- 									<input type='number' class='form-control text-center' id='e_duration' name='duration' placeholder='Duration' min="0" required readonly> -->
<!-- 								</div> -->
<!-- 							</div> -->
				
							<!-- START DATE -->
							<div class='form-group'>
								<label class='control-label col-sm-2' for='e_start'>Start Date:</label>
								<div class='col-sm-9'>
									<input type='date' class='form-control text-center' id='e_start' name='start' placeholder="YYYY-MM-DD" required>
								</div>
							</div>
				
							<!-- END DATE -->
							<div class='form-group'>
								<label class='control-label col-sm-2' for='e_end'>End Date:</label>
								<div class='col-sm-9'>
									<input type='date' class='form-control text-center' id='e_end' name='end' placeholder="YYYY-MM-DD" required>
								</div>
							</div>
				
							<!-- INSTITUTION -->
							<div class='form-group'>
								<label class='control-label col-sm-2' for='e_institution'>Institution:</label>
								<div class='col-sm-9'>
									<select class="form-control" id='e_institution' name='institution' style='width:100%; text-align-last: center;' required>
										<option disabled selected value>Institution</option>
										<?php
											$query = "SELECT * FROM `institution`;";
											$result = mysqli_query($connection, $query);
											while($row = mysqli_fetch_assoc($result)):
										?>
										<option value='<?php echo $row['id']; ?>'><?php echo $row['name']; ?></option>
										<?php endwhile; ?>
									</select>
								</div>
							</div>


							<br><hr style="width: 80%"><br><br>

							
							<!-- EXPIRY TIME -->
							<div class='form-group'>
								<label class='control-label col-sm-3' for='e_description'>Expiry Time:</label>
								<div class='col-sm-7 input-groupd'>
									<select class="form-control" style="text-align-last: center;" id="expiry_time" name="expiry_time" required>
										<option selected value="30">30 min</option>
										<option value="60">1 hour</option>
										<option value="120">2 hours</option>
										<option value="180">3 hours</option>
<!-- 										<option value="240">4 hours</option> -->
<!-- 										<option value="300">5 hours</option> -->
										<option value="360">6 hours</option>
										<option value="720">12 hours</option>
										<option value="1080">18 hours</option>
										<option value="1440">1 day</option>
										
									</select>
								</div>
							</div>
							
						</div>
						
						<br>
						
						<!--. Each Moment will need to have a <strong>predetermined expiry time</strong>; -->
						<p class='alert alert-warning text-justify' style="width: 80%; margin: 0 auto;">We require that you specify a <strong>Moment Expiry Time</strong>. That is, the amount of time you, the researcher, will allot your subjects to answer a given Moment. The <strong>minimum</strong> we allow is 30 min, while the <strong>maximum</strong> is a whole day. Please keep in mind you should provide your subjects </strong>enough time</strong> so that they are allowed to answer properly, but do not allocate <strong>excessive time</strong>, as your subjects' answers may vary greatly with time.</p>

						<br>
			
			
		<!-- ERROR ALERT FOR USER -->			
<!-- 	<div id="error-newExperience" class="row" style="display: none;"> -->
<!-- 		<div class="col-sm-12"> -->
<!-- 			<div class="alert alert-danger mb-1" role="alert"> -->
<!-- 				<h4 class="error-lead">Error!</h4> -->
<!-- 				<p class="error-description"></p> -->
<!-- 			</div> -->
<!-- 		</div> -->
<!-- 	</div> -->
			
			
      				</div><!--modal-body-->
      				
      				<!-- SUBMIT OR CANCEL -->
     				<div class='modal-footer'>
       					<button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>
        				<button id="toProjectModal" type='button' class='btn btn-primary' data-dismiss='modal' onclick="nextModal('#New_3')" disabled>Next</button>
      				</div>
      				
    			</div><!--modal-content-->
  			</div><!--modal-dialog-->
		</div><!--modal-->
		
		
		<!-- POPUP FOR NEW EXPERIENCE 3 -->
		<div class='modal fade' id='New_3' tabindex='-1' role='dialog' aria-labelledby='NewLabel_3' aria-hidden='true'>
			<div class='modal-dialog modal-lg' role='document'>
 				<div class='modal-content'>
 				
 					<div class='modal-body'>
 						
 						
 						<!-- CLOSE BUTTON -->
 						<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
						
						<div class='row'>
							<div class='col-sm-10'>
								<h2>Brand New Experience <small>(Additional Info)</small></h2>
							</div>
						</div><!--row--> 						

						<hr>
						
						
						<div class="row">
							<div class="col-sm-12 col-sm-offset-1">
								<h4>Is this experience part of a project or standalone?</h4>
							</div>
						</div>
	
	
						<!-- TYPE OF EXPERIENCE (STANDALONE - PROJECT) -->
						<div class="form-horizontal">
							<div class='form-group'>
								<div class='col-sm-6 col-sm-offset-3'>
									<select class="form-control text-center" style="text-align-last: center;" id='typeOfExperience' name='typeOfExperience' required onchange="standaloneOrNot(event)">
										<option selected value="Standalone">Standalone Experience</option>
										<option value="Part of a Project">Part of a Project</option>
									</select>
								</div>
							</div>
						</div>
				
				
<div id="standalone" style="display: none;">
			
			
						<div class="row">
							<div class="col-sm-12 col-sm-offset-1">
								<h4>Does the project already exist, or would you like a new one?</h4>
							</div>
						</div>
			
						
						<div class="form-horizontal">
				
							<!-- IS THE PROJECT EXISTING OR NEW? -->
							<div class='form-group'>
								<div class='col-sm-9 col-sm-offset-2'>
									<select class="form-control text-center" style="text-align-last: center;" id='typeOfProject' name='typeOfProject' onchange="existingOrNot(event)">
										<option selected value="New">New Project</option>
										<option value="Existing">Existing Project</option>
									</select>
								</div>
							</div>
				
<div id="newProject">
							<!-- PROJECT NAME -->
							<div class='form-group'>
								<label class='control-label col-sm-2 col-sm-offset-2' for='projectName'>Name:</label>
								<div class='col-sm-7'>
									<input type='text' class='form-control text-center' id='projectName' name='projectName' placeholder="Project Name">
								</div>
							</div>

							<!-- PROJECT DESCRIPTION -->
							<div class='form-group'>
								<label class='control-label col-sm-2 col-sm-offset-2' for='projectDescription'>Description:</label>
								<div class='col-sm-7'>
									<textarea class='form-control text-center' id='projectDescription' rows="2" name='projectDescription' placeholder="Project Description"></textarea>
								</div>
							</div>
							
</div>

<div id="existingProject" style="display: none;">
							<?php 
							
								// CHANGE QUERY DEPENDING ON IF USER IS ADMIN OR NOT
								if($_SESSION['dbUserData']['admin'] === '1') {
									$queryProjects = "SELECT * FROM project;";
								} else {
									$queryProjects = "SELECT * FROM project WHERE id IN (SELECT id_project FROM project_experience WHERE id_experience IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "'));";
								}
								
								$resultProjects = mysqli_query($connection, $queryProjects);
								
								if($resultProjects->num_rows > 0):
							?>
							<!-- CHOOSE EXISTING PROJECT -->
							<div class='form-group'>
								<label class='control-label col-sm-2 col-sm-offset-2' for='projectID'>Project:</label>
								<div class='col-sm-7'>
									<select class="form-control text-center" style="text-align-last: center;" id='projectID' name='projectID'>
										<?php while($rowProjects = mysqli_fetch_assoc($resultProjects)): ?>
										<option selected value="<?php echo $rowProjects['id']; ?>"><?php echo $rowProjects['name']; ?></option>
										<?php endwhile; ?>
									</select>
								</div>
							</div>
							<?php else: ?>
							<div class="row">
								<div class="col-sm-9 col-sm-offset-3">
									<h4><small>Uh oh! It seems you don't have a project to choose from...</small></h4>
								</div>
							</div>
							<?php endif; ?>
</div>


						</div><!--form-horizontal-->
						
</div>
						
						<br>
						
						<!-- TIPS FOR USER -->
						<div class="row">
							<div class="col-sm-10 col-sm-offset-1">
								<div class="alert alert-info alert-dismissable mb-1" role="alert">
									<button type="button" class="close" data-dismiss="alert" aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="error-lead">Tips</h4>
									<p>If you're not sure what to choose, select "<strong>Standalone</strong>".</p>
								</div>
							</div>
						</div>
						
						
						<br>
			
			
		<!-- ERROR ALERT FOR USER -->			
	<div id="error-newExperience" class="row" style="display: none;">
		<div class="col-sm-12">
			<div class="alert alert-danger mb-1" role="alert">
				<h4 class="error-lead">Error!</h4>
				<p class="error-description"></p>
			</div>
		</div>
	</div>
			
			
      				</div><!--modal-body-->
      				
      				<!-- SUBMIT OR CANCEL -->
     				<div class='modal-footer'>
       					<button type='button' class='btn btn-default' data-dismiss='modal' onclick="nextModal('#New_2')">Previous</button>
        				<button type='submit' class='btn btn-primary' name='newExperience'>Create</button>
      				</div>
      				
    			</div><!--modal-content-->
  			</div><!--modal-dialog-->
		</div><!--modal-->
</form><!--form-->

		<script>
		
			let button = document.getElementById('toProjectModal');
			let title = document.getElementById('e_title');
			let description = document.getElementById('e_description');
// 			let type = document.getElementById('e_type');
			let start = document.getElementById('e_start');
			let end = document.getElementById('e_end');
			let institution = document.getElementById('e_institution');
// 			let expiryTime = document.getElementById('expiry_time');

			title.addEventListener('change', experienceFirstModal);
			description.addEventListener('change', experienceFirstModal);
// 			type.addEventListener('change', experienceFirstModal);
			start.addEventListener('change', experienceFirstModal);
			end.addEventListener('change', experienceFirstModal);
			institution.addEventListener('change', experienceFirstModal);
// 			expiryTime.addEventListener('change', experienceFirstModal);
			
			function experienceFirstModal() {
				
				let validity = true;
				validity &= title.checkValidity();
				validity &= description.checkValidity();
// 				validity &= type.checkValidity();
				validity &= start.checkValidity();
				validity &= end.checkValidity();
				validity &= institution.checkValidity();
// 				validity &= expiryTime.checkValidity();
								
				button.disabled = !validity;
			
			}
			
			
			function standaloneOrNot(e) {

				let standalonePart = document.getElementById('standalone');
				let selection = e.currentTarget.value;
				standalonePart.style.display = (selection !== 'Standalone' ? 'block' : 'none');
			
			}
			
			
			function existingOrNot(e) {
			
				let existingPart = document.getElementById('existingProject');
				let newPart = document.getElementById('newProject');
				let selection = e.currentTarget.value;
				
				if(selection === 'New') {
					existingPart.style.display = 'none';
					newPart.style.display = 'block';
				} else {
					existingPart.style.display = 'block';
					newPart.style.display = 'none';
				}
				
				
			}
		
		</script>


		<script src="js/home.js"></script>
		<script src="js/handleSubmit.js"></script>


<script>

// Enable popovers
$(function () {
  $('[data-toggle="popover"]').popover();
});

		
		["newExperience"].forEach(function(formName) {
			
			var form = document.getElementById(formName);
			
			if(form) {
				form.addEventListener('submit', function(e) {
					handleSubmit(e, formName);
				});
			}
			
		});


		window.onload = function() {

			// Start Date
			setStartDateRange();
	
			// End Date
			startDate.addEventListener('change', setEndDateRange);
	
			// Duration
// 			startDate.addEventListener('change', setDuration);
// 			endDate.addEventListener('change', setDuration);
			
		}		

		</script>

		<!-- END OF home.php -->


<?php include_once 'footer.php'; ?>