Bez popisu

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732
  1. <?php
  2. require_once 'processes/config.php';
  3. require_once 'processes/dbh.inc.php';
  4. require_once 'processes/checkLogin.php';
  5. include_once 'header.php';
  6. // RETRIEVE USER'S NAME AND PICTURE
  7. // $query1 = "SELECT * FROM `researcher` WHERE `email` = '" . $_SESSION['dbUserData']['email'] . "';";
  8. // $result1 = mysqli_query($connection, $query1);
  9. // $dbUserData = mysqli_fetch_assoc($result1);
  10. $dbUserData = $_SESSION['dbUserData'];
  11. // var_dump($_SESSION);
  12. // exit();
  13. // IF USER NOT IN DATABASE, EXIT
  14. if(!$dbUserData) {
  15. exit();
  16. }
  17. ?>
  18. <style>
  19. .popover-content {
  20. color: #333;
  21. }
  22. </style>
  23. <!-- START OF home.php -->
  24. <body>
  25. <header id="main-header">
  26. <a id="logo" href=".">
  27. TANIA
  28. <img src="./img/pen_800x800.png" alt="tania logo pen" width="25" height="25">
  29. </a>
  30. <div id="account">
  31. <?php if($_SESSION['dbUserData']['admin'] === '1'): ?>
  32. <a class="nav-link" href="./users.php">Manage Researchers</a>
  33. <?php endif; ?>
  34. <a class="sign-out" href="./processes/logout.php">Sign Out</a>
  35. </div>
  36. </header>
  37. <section id="welcome">
  38. <div id="welcome-text">
  39. <img id="welcome-image" src="<?php echo $dbUserData["picture"]; ?>" alt="User">
  40. <h2 id="welcome-user">Welcome <?php echo explode(" ", $dbUserData['name'])[0]; ?></h2>
  41. </div>
  42. </section>
  43. <main id="experience-main">
  44. <div class="experience-lead">
  45. <h2>Manage Your Experiences</h2>
  46. </div>
  47. <div id="experience-content">
  48. <!--change to #New when using experience as templates has been implemented-->
  49. <div class="grid-box" id="new-experience" onclick="nextModal('#New_2')">
  50. <span class="fas fa-plus"></span>
  51. <h4>New</h4>
  52. </div>
  53. <?php
  54. // DISPLAY ALL EXPERIENCES THAT ARE NOT PART OF A PROJECT FIRST
  55. // THEN CREATE A NEW ROW FOR EACH PROJECT WHICH IS 'POPULATED' BY ITS EXPERIENCES
  56. // CHANGE QUERY DEPENDING ON IF USER IS ADMIN OR NOT
  57. if($_SESSION['dbUserData']['admin'] === '1') {
  58. $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);";
  59. // $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
  60. // FROM experience AS E
  61. // JOIN project_experience AS PE
  62. // JOIN project AS P
  63. // WHERE E.id = PE.id_experience
  64. // AND P.id = PE.id_project
  65. // ORDER BY P.id, E.start_date";
  66. $queryProjects = "SELECT * FROM project ORDER BY project.id DESC;";
  67. $queryCountExperiences = "SELECT COUNT(*) FROM experience;";
  68. } else {
  69. $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'] . "');";
  70. // $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
  71. // FROM experience AS E
  72. // JOIN project_experience AS PE
  73. // JOIN project AS P
  74. // WHERE E.id = PE.id_experience
  75. // AND P.id = PE.id_project
  76. // AND E.id IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "')
  77. // ORDER BY P.id, E.start_date";
  78. $queryCountExperiences = "SELECT COUNT(*) FROM experience AS E WHERE E.id IN (SELECT id_experience FROM researcher_experience WHERE id_researcher = '" . $_SESSION['dbUserData']['id_researcher'] . "');";
  79. $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;";
  80. }
  81. $resultProjectlessExperiences = mysqli_query($connection, $queryProjectlessExperiences);
  82. while($row = mysqli_fetch_array($resultProjectlessExperiences)):
  83. ?>
  84. <div class="grid-box" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
  85. <?php if(mb_strlen($row['ename']) == 0): ?>
  86. <span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><small>N/A</small></span>
  87. <?php elseif(mb_strlen($row['ename']) < 21): ?>
  88. <span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><?php echo $row['ename']; ?></span>
  89. <?php else: ?>
  90. <!--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>
  91. <?php endif; ?>
  92. <div class="box-dates" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
  93. <p style="margin-bottom: 0;">• Starts: <?php echo date("M j, Y", strtotime($row['start_date'])); ?></p>
  94. <p>• Ends: <?php echo date("M j, Y", strtotime($row['end_date'])); ?></p>
  95. </div>
  96. <?php
  97. $x = (strtotime($row['end_date']) - strtotime('now')) / 604800;
  98. if($x <= 0):
  99. ?>
  100. <span class="box-weeks warning">Finished</span>
  101. <?php elseif(0 < $x && $x < 1):?>
  102. <span class="box-weeks" style="font-size: 1.2rem">Less than a week remaining</span>
  103. <?php else: ?>
  104. <span class="box-weeks"><?php echo round($x); ?> week<?php if($x > 0) echo 's'; ?> remaining</span>
  105. <?php endif; ?>
  106. <span class="box-edit" style="background: none;">
  107. <a><i class="fas fa-pen"></i></a>
  108. </span>
  109. </div><!--grid-box-->
  110. <?php endwhile; ?>
  111. </div><!--experience-content-->
  112. <?php
  113. $resultProjects = mysqli_query($connection, $queryProjects);
  114. while($rowP = mysqli_fetch_array($resultProjects)):
  115. ?>
  116. <div class="row">
  117. <!-- <div > -->
  118. <h3 class="col-sm-12" style="color: white;">
  119. <?php echo $rowP['name']; ?>
  120. <button type="button" class="btn btn-link btn-lg" data-toggle="popover" title="Project Description" data-content="<?php echo $rowP['description']; ?>" data-placement="right">
  121. <span style="color: #eee;" class="glyphicon glyphicon-question-sign" aria-hidden="true"></span><!--glyphicon-align-left-->
  122. </button>
  123. </h3>
  124. <!-- </div> -->
  125. </div>
  126. <div id="experience-content">
  127. <?php
  128. $queryExperiencesInProject = "SELECT E.id AS eid, E.title AS ename, E.start_date, E.end_date
  129. FROM experience AS E
  130. JOIN project_experience AS PE
  131. WHERE E.id = PE.id_experience
  132. AND PE.id_project = '" . $rowP['id'] . "' ORDER BY E.start_date DESC, E.id";
  133. //WHERE E.id IN (SELECT id_experience FROM project_experience WHERE id_project = '" . $rowP['id'] . "')
  134. $resultExperiencesInProject = mysqli_query($connection, $queryExperiencesInProject);
  135. while($row = mysqli_fetch_array($resultExperiencesInProject)):
  136. ?>
  137. <div class="grid-box" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
  138. <?php if(mb_strlen($row['ename']) == 0): ?>
  139. <span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><small>N/A</small></span>
  140. <?php elseif(mb_strlen($row['ename']) < 21): ?>
  141. <span class="box-title" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'"><?php echo $row['ename']; ?></span>
  142. <?php else: ?>
  143. <!--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>
  144. <?php endif; ?>
  145. <div class="box-dates" onclick="location='viewExperience.php?view=<?php echo $row['eid']; ?>'">
  146. <p style="margin-bottom: 0;">• Starts: <?php echo date("M j, Y", strtotime($row['start_date'])); ?></p>
  147. <p>• Ends: <?php echo date("M j, Y", strtotime($row['end_date'])); ?></p>
  148. </div>
  149. <?php
  150. $x = (strtotime($row['end_date']) - strtotime('now')) / 604800;
  151. if($x <= 0):
  152. ?>
  153. <span class="box-weeks warning">Finished</span>
  154. <?php elseif(0 < $x && $x < 1):?>
  155. <span class="box-weeks" style="font-size: 1.2rem">Less than a week remaining</span>
  156. <?php else: ?>
  157. <span class="box-weeks"><?php echo round($x); ?> week<?php if($x > 0) echo 's'; ?> remaining</span>
  158. <?php endif; ?>
  159. <span class="box-edit" style="background: none;">
  160. <a><i class="fas fa-pen"></i></a>
  161. </span>
  162. </div>
  163. <?php endwhile; ?>
  164. </div><!--experience-content-->
  165. <?php endwhile; ?>
  166. <br><br>
  167. </main>
  168. <?php if(mysqli_query($connection, $queryCountExperiences)->num_rows === 0): // USER DOESN'T HAVE EXPERIENCES YET (PROMPT MODAL) ?>
  169. <script> setTimeout(() => $('#FirstTime').modal('show'), 1000); </script>
  170. <?php endif; ?>
  171. <!-- POPUP FOR FIRST TIME -->
  172. <div class='modal fade' id='FirstTime' tabindex='-1' role='dialog' aria-labelledby='FirstTimeLabel' aria-hidden='true'>
  173. <div class='modal-dialog modal-sm' role='document'>
  174. <div class='modal-content'>
  175. <div class='modal-body'>
  176. <!-- CLOSE BUTTON -->
  177. <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
  178. <div class="row text-center">
  179. <h3>You don't have any experiences yet!</h3>
  180. <h5>Press below to create a new one!</h5>
  181. <button type="button" class='btn btn-default' data-dismiss='modal' onclick="nextModal('#New_2')">New</button>
  182. </div>
  183. </div><!--modal-body-->
  184. </div><!--modal-content-->
  185. </div><!--modal-dialog-->
  186. </div><!--modal-->
  187. <!--
  188. <!~~ POPUP FOR NEW EXPERIENCE 1 ~~>
  189. <div class='modal fade' id='New' tabindex='-1' role='dialog' aria-labelledby='NewLabel' aria-hidden='true'>
  190. <div class='modal-dialog modal-sm' role='document'>
  191. <div class='modal-content'>
  192. <div class='modal-body'>
  193. <!~~ CLOSE BUTTON ~~>
  194. <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
  195. <h4 class='text-center'>Want to add another experience?</h4>
  196. <!~~ CHOOSE: BRAND NEW EXPERIENCE OR USE A TEMPLATE~~>
  197. <div class='row text-center'>
  198. <div class='btn-group'>
  199. <button type="button" class='btn btn-default' data-dismiss="modal" onclick="nextModal('#New_2')">Brand New</button>
  200. <a href='#' class='btn btn-default'>Use Template</a>
  201. </div>
  202. </div>
  203. <br>
  204. </div><!~~modal-body~~>
  205. </div><!~~modal-content~~>
  206. </div><!~~modal-dialog~~>
  207. </div><!~~modal~~>
  208. -->
  209. <form id="newExperience"><!--method='POST' action='processes/insertExperience.php'-->
  210. <!-- POPUP FOR NEW EXPERIENCE 2 -->
  211. <div class='modal fade' id='New_2' tabindex='-1' role='dialog' aria-labelledby='NewLabel_2' aria-hidden='true'>
  212. <div class='modal-dialog modal-lg' role='document'>
  213. <div class='modal-content'>
  214. <div class='modal-body'>
  215. <!-- CLOSE BUTTON -->
  216. <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
  217. <div class='row'>
  218. <div class='col-sm-10'>
  219. <h2>Brand New Experience <small>(Basic Info)</small></h2>
  220. <!-- <h3><small>Start creating a new experience by first adding its basic info.</small></h3> -->
  221. </div>
  222. </div><!--row-->
  223. <hr><br>
  224. <div class="form-horizontal">
  225. <!-- TITLE -->
  226. <div class='form-group'>
  227. <label class='control-label col-sm-2' for='e_title'>Title:</label>
  228. <div class='col-sm-9'>
  229. <input type='text' class='form-control text-center' id='e_title' name='title' placeholder='Title' maxlength="60" required>
  230. </div>
  231. </div>
  232. <!-- DESCRIPTION -->
  233. <div class='form-group'>
  234. <label class='control-label col-sm-2' for='e_description'>Description:</label>
  235. <div class='col-sm-9'>
  236. <textarea class='form-control text-center' id='e_description' name='description' rows='1' style='resize:vertical;' placeholder='Description' maxlength="100" required></textarea>
  237. </div>
  238. </div>
  239. <!-- TYPE -->
  240. <div class='form-group'>
  241. <label class='control-label col-sm-2' for='e_description'>Type:</label>
  242. <div class='col-sm-9'>
  243. <select class="form-control text-center" style="text-align-last: center;" id='e_type' name='type' required>
  244. <option selected value="Course-Based Research Experience">Course-Based Research Experience</option>
  245. <option value="Undergraduate Research Experience">Undergraduate Research Experience</option>
  246. <?php if($_SESSION['dbUserData']['admin'] === '1'): ?>
  247. <option value="Test">Test</option>
  248. <?php endif; ?>
  249. </select>
  250. </div>
  251. </div>
  252. <!-- DURATION -->
  253. <!-- <div class='form-group'> -->
  254. <!-- <label class='control-label col-sm-2' for='e_description'>Duration:</label> -->
  255. <!-- <div class='col-sm-9'> -->
  256. <!-- <input type='number' class='form-control text-center' id='e_duration' name='duration' placeholder='Duration' min="0" required readonly> -->
  257. <!-- </div> -->
  258. <!-- </div> -->
  259. <!-- START DATE -->
  260. <div class='form-group'>
  261. <label class='control-label col-sm-2' for='e_start'>Start Date:</label>
  262. <div class='col-sm-9'>
  263. <input type='date' class='form-control text-center' id='e_start' name='start' placeholder="YYYY-MM-DD" required>
  264. </div>
  265. </div>
  266. <!-- END DATE -->
  267. <div class='form-group'>
  268. <label class='control-label col-sm-2' for='e_end'>End Date:</label>
  269. <div class='col-sm-9'>
  270. <input type='date' class='form-control text-center' id='e_end' name='end' placeholder="YYYY-MM-DD" required>
  271. </div>
  272. </div>
  273. <!-- INSTITUTION -->
  274. <div class='form-group'>
  275. <label class='control-label col-sm-2' for='e_institution'>Institution:</label>
  276. <div class='col-sm-9'>
  277. <select class="form-control" id='e_institution' name='institution' style='width:100%; text-align-last: center;' required>
  278. <option disabled selected value>Institution</option>
  279. <?php
  280. $query = "SELECT * FROM `institution`;";
  281. $result = mysqli_query($connection, $query);
  282. while($row = mysqli_fetch_assoc($result)):
  283. ?>
  284. <option value='<?php echo $row['id']; ?>'><?php echo $row['name']; ?></option>
  285. <?php endwhile; ?>
  286. </select>
  287. </div>
  288. </div>
  289. <br><hr style="width: 80%"><br><br>
  290. <!-- EXPIRY TIME -->
  291. <div class='form-group'>
  292. <label class='control-label col-sm-3' for='e_description'>Expiry Time:</label>
  293. <div class='col-sm-7 input-groupd'>
  294. <select class="form-control" style="text-align-last: center;" id="expiry_time" name="expiry_time" required>
  295. <option selected value="30">30 min</option>
  296. <option value="60">1 hour</option>
  297. <option value="120">2 hours</option>
  298. <option value="180">3 hours</option>
  299. <!-- <option value="240">4 hours</option> -->
  300. <!-- <option value="300">5 hours</option> -->
  301. <option value="360">6 hours</option>
  302. <option value="720">12 hours</option>
  303. <option value="1080">18 hours</option>
  304. <option value="1440">1 day</option>
  305. </select>
  306. </div>
  307. </div>
  308. </div>
  309. <br>
  310. <!--. Each Moment will need to have a <strong>predetermined expiry time</strong>; -->
  311. <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>
  312. <br>
  313. <!-- ERROR ALERT FOR USER -->
  314. <!-- <div id="error-newExperience" class="row" style="display: none;"> -->
  315. <!-- <div class="col-sm-12"> -->
  316. <!-- <div class="alert alert-danger mb-1" role="alert"> -->
  317. <!-- <h4 class="error-lead">Error!</h4> -->
  318. <!-- <p class="error-description"></p> -->
  319. <!-- </div> -->
  320. <!-- </div> -->
  321. <!-- </div> -->
  322. </div><!--modal-body-->
  323. <!-- SUBMIT OR CANCEL -->
  324. <div class='modal-footer'>
  325. <button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>
  326. <button id="toProjectModal" type='button' class='btn btn-primary' data-dismiss='modal' onclick="nextModal('#New_3')" disabled>Next</button>
  327. </div>
  328. </div><!--modal-content-->
  329. </div><!--modal-dialog-->
  330. </div><!--modal-->
  331. <!-- POPUP FOR NEW EXPERIENCE 3 -->
  332. <div class='modal fade' id='New_3' tabindex='-1' role='dialog' aria-labelledby='NewLabel_3' aria-hidden='true'>
  333. <div class='modal-dialog modal-lg' role='document'>
  334. <div class='modal-content'>
  335. <div class='modal-body'>
  336. <!-- CLOSE BUTTON -->
  337. <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
  338. <div class='row'>
  339. <div class='col-sm-10'>
  340. <h2>Brand New Experience <small>(Additional Info)</small></h2>
  341. </div>
  342. </div><!--row-->
  343. <hr>
  344. <div class="row">
  345. <div class="col-sm-12 col-sm-offset-1">
  346. <h4>Is this experience part of a project or standalone?</h4>
  347. </div>
  348. </div>
  349. <!-- TYPE OF EXPERIENCE (STANDALONE - PROJECT) -->
  350. <div class="form-horizontal">
  351. <div class='form-group'>
  352. <div class='col-sm-6 col-sm-offset-3'>
  353. <select class="form-control text-center" style="text-align-last: center;" id='typeOfExperience' name='typeOfExperience' required onchange="standaloneOrNot(event)">
  354. <option selected value="Standalone">Standalone Experience</option>
  355. <option value="Part of a Project">Part of a Project</option>
  356. </select>
  357. </div>
  358. </div>
  359. </div>
  360. <div id="standalone" style="display: none;">
  361. <div class="row">
  362. <div class="col-sm-12 col-sm-offset-1">
  363. <h4>Does the project already exist, or would you like a new one?</h4>
  364. </div>
  365. </div>
  366. <div class="form-horizontal">
  367. <!-- IS THE PROJECT EXISTING OR NEW? -->
  368. <div class='form-group'>
  369. <div class='col-sm-9 col-sm-offset-2'>
  370. <select class="form-control text-center" style="text-align-last: center;" id='typeOfProject' name='typeOfProject' onchange="existingOrNot(event)">
  371. <option selected value="New">New Project</option>
  372. <option value="Existing">Existing Project</option>
  373. </select>
  374. </div>
  375. </div>
  376. <div id="newProject">
  377. <!-- PROJECT NAME -->
  378. <div class='form-group'>
  379. <label class='control-label col-sm-2 col-sm-offset-2' for='projectName'>Name:</label>
  380. <div class='col-sm-7'>
  381. <input type='text' class='form-control text-center' id='projectName' name='projectName' placeholder="Project Name">
  382. </div>
  383. </div>
  384. <!-- PROJECT DESCRIPTION -->
  385. <div class='form-group'>
  386. <label class='control-label col-sm-2 col-sm-offset-2' for='projectDescription'>Description:</label>
  387. <div class='col-sm-7'>
  388. <textarea class='form-control text-center' id='projectDescription' rows="2" name='projectDescription' placeholder="Project Description"></textarea>
  389. </div>
  390. </div>
  391. </div>
  392. <div id="existingProject" style="display: none;">
  393. <?php
  394. // CHANGE QUERY DEPENDING ON IF USER IS ADMIN OR NOT
  395. if($_SESSION['dbUserData']['admin'] === '1') {
  396. $queryProjects = "SELECT * FROM project;";
  397. } else {
  398. $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'] . "'));";
  399. }
  400. $resultProjects = mysqli_query($connection, $queryProjects);
  401. if($resultProjects->num_rows > 0):
  402. ?>
  403. <!-- CHOOSE EXISTING PROJECT -->
  404. <div class='form-group'>
  405. <label class='control-label col-sm-2 col-sm-offset-2' for='projectID'>Project:</label>
  406. <div class='col-sm-7'>
  407. <select class="form-control text-center" style="text-align-last: center;" id='projectID' name='projectID'>
  408. <?php while($rowProjects = mysqli_fetch_assoc($resultProjects)): ?>
  409. <option selected value="<?php echo $rowProjects['id']; ?>"><?php echo $rowProjects['name']; ?></option>
  410. <?php endwhile; ?>
  411. </select>
  412. </div>
  413. </div>
  414. <?php else: ?>
  415. <div class="row">
  416. <div class="col-sm-9 col-sm-offset-3">
  417. <h4><small>Uh oh! It seems you don't have a project to choose from...</small></h4>
  418. </div>
  419. </div>
  420. <?php endif; ?>
  421. </div>
  422. </div><!--form-horizontal-->
  423. </div>
  424. <br>
  425. <!-- TIPS FOR USER -->
  426. <div class="row">
  427. <div class="col-sm-10 col-sm-offset-1">
  428. <div class="alert alert-info alert-dismissable mb-1" role="alert">
  429. <button type="button" class="close" data-dismiss="alert" aria-label="Close">
  430. <span aria-hidden="true">&times;</span>
  431. </button>
  432. <h4 class="error-lead">Tips</h4>
  433. <p>If you're not sure what to choose, select "<strong>Standalone</strong>".</p>
  434. </div>
  435. </div>
  436. </div>
  437. <br>
  438. <!-- ERROR ALERT FOR USER -->
  439. <div id="error-newExperience" class="row" style="display: none;">
  440. <div class="col-sm-12">
  441. <div class="alert alert-danger mb-1" role="alert">
  442. <h4 class="error-lead">Error!</h4>
  443. <p class="error-description"></p>
  444. </div>
  445. </div>
  446. </div>
  447. </div><!--modal-body-->
  448. <!-- SUBMIT OR CANCEL -->
  449. <div class='modal-footer'>
  450. <button type='button' class='btn btn-default' data-dismiss='modal' onclick="nextModal('#New_2')">Previous</button>
  451. <button type='submit' class='btn btn-primary' name='newExperience'>Create</button>
  452. </div>
  453. </div><!--modal-content-->
  454. </div><!--modal-dialog-->
  455. </div><!--modal-->
  456. </form><!--form-->
  457. <script>
  458. let button = document.getElementById('toProjectModal');
  459. let title = document.getElementById('e_title');
  460. let description = document.getElementById('e_description');
  461. // let type = document.getElementById('e_type');
  462. let start = document.getElementById('e_start');
  463. let end = document.getElementById('e_end');
  464. let institution = document.getElementById('e_institution');
  465. // let expiryTime = document.getElementById('expiry_time');
  466. title.addEventListener('change', experienceFirstModal);
  467. description.addEventListener('change', experienceFirstModal);
  468. // type.addEventListener('change', experienceFirstModal);
  469. start.addEventListener('change', experienceFirstModal);
  470. end.addEventListener('change', experienceFirstModal);
  471. institution.addEventListener('change', experienceFirstModal);
  472. // expiryTime.addEventListener('change', experienceFirstModal);
  473. function experienceFirstModal() {
  474. let validity = true;
  475. validity &= title.checkValidity();
  476. validity &= description.checkValidity();
  477. // validity &= type.checkValidity();
  478. validity &= start.checkValidity();
  479. validity &= end.checkValidity();
  480. validity &= institution.checkValidity();
  481. // validity &= expiryTime.checkValidity();
  482. button.disabled = !validity;
  483. }
  484. function standaloneOrNot(e) {
  485. let standalonePart = document.getElementById('standalone');
  486. let selection = e.currentTarget.value;
  487. standalonePart.style.display = (selection !== 'Standalone' ? 'block' : 'none');
  488. }
  489. function existingOrNot(e) {
  490. let existingPart = document.getElementById('existingProject');
  491. let newPart = document.getElementById('newProject');
  492. let selection = e.currentTarget.value;
  493. if(selection === 'New') {
  494. existingPart.style.display = 'none';
  495. newPart.style.display = 'block';
  496. } else {
  497. existingPart.style.display = 'block';
  498. newPart.style.display = 'none';
  499. }
  500. }
  501. </script>
  502. <script src="js/home.js"></script>
  503. <script src="js/handleSubmit.js"></script>
  504. <script>
  505. // Enable popovers
  506. $(function () {
  507. $('[data-toggle="popover"]').popover();
  508. });
  509. ["newExperience"].forEach(function(formName) {
  510. var form = document.getElementById(formName);
  511. if(form) {
  512. form.addEventListener('submit', function(e) {
  513. handleSubmit(e, formName);
  514. });
  515. }
  516. });
  517. window.onload = function() {
  518. // Start Date
  519. setStartDateRange();
  520. // End Date
  521. startDate.addEventListener('change', setEndDateRange);
  522. // Duration
  523. // startDate.addEventListener('change', setDuration);
  524. // endDate.addEventListener('change', setDuration);
  525. }
  526. </script>
  527. <!-- END OF home.php -->
  528. <?php include_once 'footer.php'; ?>