Skip to content

Commit

Permalink
lab10 added
Browse files Browse the repository at this point in the history
  • Loading branch information
@ata-turhan
ata-turhan committed Apr 16, 2024
1 parent fae2cc3 commit 4ff3956
Show file tree
Hide file tree
Showing 15 changed files with 399 additions and 0 deletions.
2 changes: 2 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,8 @@ <h2>Labs</h2>
<li><a href="lab3/index.html">Lab 3</a></li>
<li>Lab 4 (<a href="lab4/Webform1.html">form1</a>, <a href="lab4/Webform2.html">form2</a>)</li>
<li><a href="https://github.com/invictus-21/invictus-21.github.io/blob/main/lab5">Lab 5</a></li>
<li><a href="lab10/index.html">Lab 10</a></li>

</ol>
</section>

Expand Down
35 changes: 35 additions & 0 deletions lab10/css/main-styles.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
/* main-styles.css */
/* author: O. Kalu */
/* since: 2020-05-03 */

body {
margin-bottom: 30px;
}
footer {
position: fixed;
bottom: 0;
width: 100%;
height: 30px;
background-color: #f5f5f5;
line-height: 30px;
}
#divBannerImage {
width: 100%;
height: 176px;
margin-bottom: 1em;
text-align: center;
/* background-image: url("../images/hcmc-photo2.jpg"); */
}
#divAboutUs {
border-right: 0px solid #b5b5b5;
margin-right: 0em;
}
#divAddress {
text-align: left;
margin-left: 0em;
}
#spnSlogan {
font-family: cursive;
font-style: italic;
font-size: medium;
}
Binary file added lab10/images/hcmc-photo.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/images/hcmc-photo2.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/images/hcmc_header-img-1900x351.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
94 changes: 94 additions & 0 deletions lab10/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HolyCross Medical Center - Home</title>

<link href="https://stackpath.bootstrapcdn.com/bootswatch/4.4.1/united/bootstrap.min.css" rel="stylesheet" integrity="sha384-bzjLLgZOhgXbSvSc5A9LWWo/mSIYf7U7nFbmYIB2Lgmuiw3vKGJuu+abKoaTx4W6" crossorigin="anonymous">
<link rel="stylesheet" href="css/main-styles.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js" integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.js" integrity="sha256-66f6uQTQkvHF8jpniLWJjnteEfmQaC/tATFew/nTBA8=" crossorigin="anonymous"></script>
</head>
<body>
<header>
<!-- Start Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<a style="padding-right: 2em;" class="navbar-brand" href="index.html">HolyCross Medical Center</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01"
aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarColor01">
<ul class="navbar-nav mr-auto">
<li class="nav-item active" style="border-left: white 1px solid; padding-left: 2em; padding-right: 2em;">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item" style="border-left: white 1px solid; padding-left: 2em; padding-right: 2em;">
<a class="nav-link" href="patients.html">Patients</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<span style="color: #ffffff; margin-right: 0em;" >Welcome, Guest</span>
</form>
</div>
</nav>
<!-- End Navbar -->
</header>

<!-- Start main-content -->
<main>
<div style="padding-top: 1em;" class="container">
<!-- main content here -->
<h3>
Welcome to HolyCross<br>
<span id="spnSlogan">We care. God heals.</span>
</h3>
<hr>
<div id="divBannerImage">
<img style="width: 100%;height: 176px;" src="images/hcmc-photo2.jpg" alt="Photo of HolyCross Medical Center">
</div>
<div class="row">
<div id="divAboutUs" class="col-md-8">
<section>
<h5>About Us</h5>
<article>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ipsum, odit vero expedita quam veniam sed dignissimos, consectetur libero autem sequi reiciendis maiores ullam est aliquid exercitationem praesentium!</p>
<p>Ex deserunt necessitatibus nobis voluptate quos quibusdam velit, beatae quis maiores earum libero in voluptatum possimus.</p>
</article>
</section>
</div>
<div id="divAddress" class="col-md-4">
<section>
<h5>Our Address and Contact Information</h5>
<article>
<p>
1234 HolyCross Avenue<br>
Great Medical City<br>
IA, 52556-0001
</p>
<p>
Telephone: (641) 000-0001<br>
Facsimile: (123) 456-7890<br>
Email: <a href="mailto:info@hcmc.org">info@hcmc.org</a>
</p>
</article>
</section>
</div>
</div>

</div>
</main>
<!-- End main-content -->

<!-- Start footer -->
<footer>
<div>
<span style="margin-left: 1em;">Ata Turhan ::: CS472-WAP</span>
<span style="float: right;margin-right: 1em;">HCMC &copy; October 2023</span>
</div>
</footer>
</body>
</html>
177 changes: 177 additions & 0 deletions lab10/patients.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,177 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HolyCross Medical Center - Patients</title>

<link href="https://stackpath.bootstrapcdn.com/bootswatch/4.4.1/united/bootstrap.min.css" rel="stylesheet" integrity="sha384-bzjLLgZOhgXbSvSc5A9LWWo/mSIYf7U7nFbmYIB2Lgmuiw3vKGJuu+abKoaTx4W6" crossorigin="anonymous">
<link rel="stylesheet" href="css/main-styles.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js" integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.js" integrity="sha256-66f6uQTQkvHF8jpniLWJjnteEfmQaC/tATFew/nTBA8=" crossorigin="anonymous"></script>

<script src="script/script.js"></script>
</head>
<body>
<header>
<!-- Start Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<a style="padding-right: 2em;" class="navbar-brand" href="index.html">HolyCross Medical Center</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01"
aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarColor01">
<ul class="navbar-nav mr-auto">
<li class="nav-item" style="border-left: white 1px solid; padding-left: 2em; padding-right: 2em;">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item active" style="border-left: white 1px solid; padding-left: 2em; padding-right: 2em;">
<a class="nav-link" href="patients.html">Patients</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<span style="color: #ffffff; margin-right: 0em;" >Welcome, Guest</span>
</form>
</div>
</nav>
<!-- End Navbar -->
</header>

<!-- Start main-content -->
<main>
<div style="padding-top: 1em;" class="container">
<!-- main content here -->
<h3>
Patients Registration
</h3>
<hr>
<form id="form">
<fieldset>
<legend></legend>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="patientIdNumber">*Patient ID No:</label>
<input pattern="(P|EP)-\d{3}-\d{6}" class="form-control" type="text" name="patientIdNumber" id="patientIdNumber" placeholder="EP-XXX-XXXXXX" required autofocus>
<small class="form-text text-muted">Enter the Patient ID Number, in the specified format</small>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="form-group">
<label for="firstName">*First Name:</label>
<input class="form-control" type="text" name="firstName" id="firstName" placeholder="Enter First Name" required>
<small class="form-text text-muted">Enter the Patient's First Name</small>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="middleInitials">Middle Initial(s):</label>
<input class="form-control" type="text" name="middleInitials" id="middleInitials" placeholder="Enter Middle Initial(s)">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="lastName">*Last Name:</label>
<input class="form-control" type="text" name="lastName" id="lastName" placeholder="Enter Last Name" required>
<small class="form-text text-muted">Enter the Patient's Last Name</small>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="form-group">
<label for="dateOfBirth">*Date of birth:</label>
<input class="form-control" type="date" name="dateOfBirth" id="dateOfBirth" required>
<small class="form-text text-muted">Enter the Patient's Date of birth</small>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="ddlDepartment">*Department:</label>
<select required class="form-control" id="ddlDepartment" name="ddlDepartment">
<option value="">Select...</option>
<option value="Cardiology">Cardiology</option>
<option value="Ear, Nose and Throat">Ear, Nose and Throat</option>
<option value="Primary Care">Primary Care</option>
<option value="[Unassigned]">[Unassigned]</option>
</select>
<small class="form-text text-muted">Select the department providing care</small>
</div>
</div>
<div class="col-md-4">
<label>*Is this an Out-patient?</label><br>
<div class="form-group">
<div class="custom-control custom-radio custom-control-inline">
<input required type="radio" name="radioIsOutPatient" id="radioIsOutPatientYes" class="custom-control-input" value="Yes">
<label for="radioIsOutPatientYes" class="custom-control-label">Yes</label>
</div>
<div class="custom-control custom-radio custom-control-inline">
<input required type="radio" name="radioIsOutPatient" id="radioIsOutPatientNo" class="custom-control-input" value="No">
<label for="radioIsOutPatientNo" class="custom-control-label">No</label>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-3">
<!-- <input style="vertical-align: middle;" type="checkbox" name="chkElderlyPatients" id="chkElderlyPatients" value="showElderlyPatients">
<label style="vertical-align: baseline;" for="chkElderlyPatients">Elderly Patients only</label> -->
</div>
<div class="col-md-3">
<!-- <input style="vertical-align: middle;" type="checkbox" name="chkShowOutPatients" id="chkShowOutPatients" value="showOutPatients">
<label style="vertical-align: baseline;" for="chkShowOutPatients">Out-Patients only</label> -->
</div>
<div style="text-align: right;" class="col-md-6">
<button style="padding: .5em 4em;" id="btnReset" type="reset" class="btn btn-secondary btn-inline">Reset</button>
<button style="margin-left: 1em; padding: .5em 4em;" id="btnRegisterPatient" type="submit" class="btn btn-primary btn-inline">Register Patient</button>
</div>
</div>
</fieldset>
</form>
<div class="row">
<div class="col-md-3">
<input style="vertical-align: middle;" type="checkbox" name="chkElderlyPatients" id="chkElderlyPatients" value="showElderlyPatients">
<label style="vertical-align: baseline;" for="chkElderlyPatients">Show Elderly Patients only</label>
</div>
<div class="col-md-3">
<input style="vertical-align: middle;" type="checkbox" name="chkShowOutPatients" id="chkShowOutPatients" value="showOutPatients">
<label style="vertical-align: baseline;" for="chkShowOutPatients">Show Out-Patients only</label>
</div>
<div style="text-align: right;" class="col-md-6">
&nbsp;
</div>
</div>
<div style="margin-top: 1em;" id="divPatientsList" style="font-size: 1em">
<table class="table table-striped">
<thead>
<tr>
<th scope="col">Patient ID No</th>
<th scope="col">First Name</th>
<th scope="col">Middle Initial(s)</th>
<th scope="col">Last Name</th>
<th scope="col">Date of birth</th>
<th scope="col">Department</th>
<th scope="col">Out-patient?</th>
</tr>
</thead>
<tbody id="tbodyPatientsList"></tbody>
</table>
</div>
</div>
</main>
<!-- End main-content -->

<!-- Start footer -->
<footer>
<div>
<span style="margin-left: 1em;">Ata Turhan ::: CS472-WAP</span>
<span style="float: right;margin-right: 1em;">HCMC &copy; October 2023</span>
</div>
</footer>
</body>
</html>
Binary file added lab10/screenshots/PatientsRegistrationForm-and-data-table-page.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/screenshots/PatientsRegistrationForm-and-data-table-page2.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/screenshots/PatientsRegistrationForm-and-data-table-page3.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/screenshots/PatientsRegistrationForm-page1.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/screenshots/PatientsRegistrationForm-page2.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/screenshots/PatientsRegistrationForm-page3.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added lab10/screenshots/homepage.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 4ff3956

Please sign in to comment.