File: /home/aashishs/survey.aashishshah.com.np/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Mental Health Self-Assessment</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f9;
font-size: 16px;
}
#container {
margin: 10px auto;
padding: 20px;
max-width: 1200px;
width: 95%;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
h1, h2, h3 {
text-align: center;
font-size: 1.5rem;
}
h3 {
font-size: 1.2rem;
}
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
font-size: 0.9rem;
}
th, td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
}
th {
background-color: #f4f4f9;
font-weight: bold;
}
.statement-cell {
width: 60%;
}
.option-cell {
text-align: center;
width: 10%;
}
.submit-button {
display: block;
width: 100%;
padding: 12px;
font-size: 1.1rem;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
margin-top: 20px;
-webkit-appearance: none;
}
.submit-button:hover {
background-color: #0056b3;
}
.page {
display: none;
}
.page.active {
display: block;
}
label {
display: block;
margin-bottom: 8px;
font-size: 1rem;
}
input[type="text"], input[type="number"], input[type="tel"], input[type="email"], select, textarea {
width: 100%;
padding: 10px;
margin-bottom: 15px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
font-size: 16px;
-webkit-appearance: none;
}
#intro-page, #consent-page, #personal-details {
padding: 15px;
}
#consent-text {
text-align: justify;
margin-bottom: 20px;
font-size: 0.9rem;
}
@media (min-width: 768px){
#consent-text {
font-size: 1rem;
}
}
@media (min-width: 1024px){
#consent-text {
font-size: 1.1rem;
}
}
#consent-contact {
margin-bottom: 20px;
}
input[type="radio"] {
width: 20px;
height: 20px;
}
@media screen and (max-width: 768px){
body {
font-size: 16px;
}
h2 {
font-size: 1.3rem;
}
h3 {
font-size: 1.1rem;
}
#container {
margin: 0;
padding: 10px;
border-radius: 0;
}
.statement-cell {
width: 40%;
}
.option-cell {
width: 15%;
padding: 4px;
}
th, td {
padding: 6px 4px;
}
input[type="radio"] {
width: 18px;
height: 18px;
margin: 0 auto;
}
}
@media screen and (max-width: 480px){
table {
font-size: 0.8rem;
}
.statement-cell {
width: 35%;
}
th, td {
padding: 5px 2px;
}
input[type="radio"] {
width: 16px;
height: 16px;
}
}
.results-container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
background-color: #fff;
text-align: center;
}
.score-section {
margin-bottom: 20px;
padding: 10px;
border-radius: 8px;
background-color: #e9f5ff;
text-align: center;
}
.score-section h3 {
margin: 0;
font-size: 1.2rem;
}
.score-section p {
margin: 5px 0 0;
font-size: 1rem;
}
.completion-message {
text-align: center;
font-size: 1rem;
color: #555;
}
.coping-subpoints {
text-align: center;
margin-top: 10px;
}
.coping-subpoints p {
margin: 5px 0;
font-size: 1rem;
}
.progress-container {
width: 100%;
background-color: #e0e0e0;
border-radius: 5px;
overflow: hidden;
margin-bottom: 20px;
}
.progress-bar {
height: 20px;
width: 0;
background-color: #007bff;
border-radius: 5px;
transition: width 0.3s ease;
}
</style>
</head>
<body>
<div id="container">
<div class="progress-container">
<div class="progress-bar" id="progress-bar"></div>
</div>
<div id="intro-page" class="page active">
<h2>Mental Health and Spirituality Level Self-Report Questionnaire</h2>
<p id="currentDate"></p>
<p>
This questionnaire is a part of a research study that aims to investigate the inter-relation between mental health , level of connectedness with people, environment and/or sprituality amongst university students.
</p>
<p>Please fill the answers carefully to the best of your understanding as it will impact your personalized scores.
</p>
<button type="button" id="start-now" class="submit-button">Start Now</button>
</div>
<div id="consent-page" class="page">
<h2>Informed Consent</h2>
<div id="consent-text">
<p>Please note the following before providing your consent to participate in this survey:</p>
<ul>
<li>Participation involves completing an online survey of approximately 7-10 minutes.</li>
<li>The survey is anonymous, and no personal identifiers will be used for research.</li>
<li>Your participation is entirely voluntary, and you can choose to withdraw at any time without penalty or loss of benefits.</li>
<li>All responses will be kept confidential and anonymous. Data will be securely stored and accessible only to the researcher and supervisor.</li>
<li>All data collected will be fully anonymized to protect participant confidentiality. No personally identifiable information will be recorded, and data will not be shared with any third-party entities.</li>
</ul>
<h3>Risks and Benefits</h3>
<p><strong>Risks:</strong> While the survey involves questions on mental health, which may cause emotional discomfort, there are no significant risks to participating in this study.</p>
<p><strong>Benefits:</strong> While you will not receive direct benefits, your participation will contribute to valuable insights into the mental health impacts of positive coping mechanisms on mental health. Participants will also get a detailed mental health and resilience score for their personal reference at the end of the survey.
</p>
<div id="consent-contact">
If you have any doubts or require clarification, please do not hesitate to contact the facilitator.<br />
Ms. Sanna Masood<br />
Email ID: 23jibs-smasood@jgu.edu.in<br />
Contact number: +91-9469434177
</div>
</div>
<form id="consentForm" method="post">
<label><input type="radio" name="consent" value="agree" required /> Agree</label><br />
<label><input type="radio" name="consent" value="disagree" required /> Disagree</label><br /><br />
<button type="button" id="consent-submit" class="submit-button">Submit</button>
</form>
</div>
<form id="personalDetailsForm" class="page">
<h2>Personal Details</h2>
<label for="gender">2. Gender:</label>
<select id="gender" name="gender" required>
<option value="">Select</option>
<option value="male">Male</option>
<option value="female">Female</option>
<option value="non-binary">Non-binary</option>
<option value="prefer_not_to_say">Prefer not to say</option>
</select>
<label for="age">3. Age:</label>
<input type="number" id="age" name="age" required />
<label for="email">4. Email ID:</label>
<input type="email" id="email" name="email" required />
<label for="university">5. Your University Name:</label>
<input type="text" id="university" name="university" required />
<label for="location">.6 Location of the University:</label>
<input type="text" id="location" name="location" required />
<label for="course">7. Course Enrolled In:</label>
<select id="course" name="course" required>
<option value="">Select</option>
<option value="bachelors">Bachelors</option>
<option value="masters">Masters</option>
<option value="phd">PhD</option>
<option value="others">Others</option>
</select>
<label for="belief">8. Belief system - religious / spiritual identity:</label>
<select id="belief" name="belief" required>
<option value="">Select</option>
<option value="highly_religious">Highly Religious</option>
<option value="religious">Religious</option>
<option value="moderately_religious">Moderately Religious</option>
<option value="atheist">Atheist</option>
<option value="spiritual_non_religious">Spiritual but non-religious</option>
<option value="spiritual">Spiritual</option>
</select>
<label for="ideology">9. Briefly tell us about your belief ideology:</label>
<textarea id="ideology" name="ideology" rows="4" required></textarea>
<button type="button" id="next1" class="submit-button">Next</button>
</form>
<form id="questionnaireForm" class="page">
<h3>Sadness Levels - How do you relate to the statements given below (over the past three months)</h3>
<table>
<thead>
<tr>
<th class="statement-cell">Statement</th>
<th class="option-cell">Never</th>
<th class="option-cell">Sometimes</th>
<th class="option-cell">Often</th>
<th class="option-cell">Mostly</th>
</tr>
</thead>
<tbody>
<tr>
<td class="statement-cell">I couldn't seem to experience any positive feeling</td>
<td class="option-cell"><input type="radio" name="sadness_q1" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q1" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q1" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q1" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I found it difficult to work up the initiative to do things.</td>
<td class="option-cell"><input type="radio" name="sadness_q2" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q2" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q2" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q2" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt that I had nothing to look forward to.</td>
<td class="option-cell"><input type="radio" name="sadness_q3" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q3" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q3" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q3" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt down-hearted and blue</td>
<td class="option-cell"><input type="radio" name="sadness_q4" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q4" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q4" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q4" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I was unable to become enthusiastic about anything.</td>
<td class="option-cell"><input type="radio" name="sadness_q5" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q5" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q5" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q5" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt I wasn't worth much as a person.</td>
<td class="option-cell"><input type="radio" name="sadness_q6" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q6" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q6" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q6" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt that life was meaningless</td>
<td class="option-cell"><input type="radio" name="sadness_q7" value="0" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q7" value="1" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q7" value="2" required /></td>
<td class="option-cell"><input type="radio" name="sadness_q7" value="3" required /></td>
</tr>
</tbody>
</table>
<h3>Anxiety Levels - How do you relate to the statements given below (over the past three months)</h3>
<table>
<thead>
<tr>
<th class="statement-cell">Statement</th>
<th class="option-cell">Never</th>
<th class="option-cell">Sometimes</th>
<th class="option-cell">Often</th>
<th class="option-cell">Mostly</th>
</tr>
</thead>
<tbody>
<tr>
<td class="statement-cell">I was aware of the dryness of my mouth.</td>
<td class="option-cell"><input type="radio" name="anxiety_q1" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q1" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q1" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q1" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I experienced breathing difficulty (e.g., excessively rapid breathing, breathlessness in the absence of physical exertion).</td>
<td class="option-cell"><input type="radio" name="anxiety_q2" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q2" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q2" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q2" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I experienced trembling (e.g., in the hands).</td>
<td class="option-cell"><input type="radio" name="anxiety_q3" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q3" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q3" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q3" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I was worried about situations in which I might panic and make a fool of myself.</td>
<td class="option-cell"><input type="radio" name="anxiety_q4" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q4" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q4" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q4" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt I was close to panic.</td>
<td class="option-cell"><input type="radio" name="anxiety_q5" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q5" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q5" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q5" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I was aware of the action of my heart in the absence of physical exertion (e.g., sense of heart rate increase, heart missing a beat).</td>
<td class="option-cell"><input type="radio" name="anxiety_q6" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q6" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q6" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q6" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt scared without any good reason.</td>
<td class="option-cell"><input type="radio" name="anxiety_q7" value="0" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q7" value="1" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q7" value="2" required /></td>
<td class="option-cell"><input type="radio" name="anxiety_q7" value="3" required /></td>
</tr>
</tbody>
</table>
<h3>Stress Levels - How strongly do you relate to the statements given below (in the past one month)</h3>
<table>
<thead>
<tr>
<th class="statement-cell">Statement</th>
<th class="option-cell">Never</th>
<th class="option-cell">Sometimes</th>
<th class="option-cell">Often</th>
<th class="option-cell">Mostly</th>
</tr>
</thead>
<tbody>
<tr>
<td class="statement-cell">I found it hard to finish my tasks.</td>
<td class="option-cell"><input type="radio" name="stress_q1" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q1" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q1" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q1" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I tended to over-react to situations.</td>
<td class="option-cell"><input type="radio" name="stress_q2" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q2" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q2" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q2" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt that I was feeling very nervous.</td>
<td class="option-cell"><input type="radio" name="stress_q3" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q3" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q3" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q3" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I found myself getting agitated.</td>
<td class="option-cell"><input type="radio" name="stress_q4" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q4" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q4" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q4" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I found it difficult to relax.</td>
<td class="option-cell"><input type="radio" name="stress_q5" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q5" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q5" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q5" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I was intolerant of anything that kept me from getting on with what I was doing.</td>
<td class="option-cell"><input type="radio" name="stress_q6" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q6" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q6" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q6" value="3" required /></td>
</tr>
<tr>
<td class="statement-cell">I felt that I was rather touchy.</td>
<td class="option-cell"><input type="radio" name="stress_q7" value="0" required /></td>
<td class="option-cell"><input type="radio" name="stress_q7" value="1" required /></td>
<td class="option-cell"><input type="radio" name="stress_q7" value="2" required /></td>
<td class="option-cell"><input type="radio" name="stress_q7" value="3" required /></td>
</tr>
</tbody>
</table>
<h3>Coping Mechanisms - How do you deal with your stress?</h3>
<table>
<thead>
<tr>
<th class="statement-cell">Statement</th>
<th class="option-cell">Rarely</th>
<th class="option-cell">Sometimes</th>
<th class="option-cell">Often</th>
<th class="option-cell">Mostly</th>
</tr>
</thead>
<tbody>
<tr>
<td class="statement-cell">I've been turning to work or other activities to take my mind off things.</td>
<td class="option-cell"><input type="radio" name="coping_q1" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q1" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q1" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q1" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been giving up the attempt to cope.</td>
<td class="option-cell"><input type="radio" name="coping_q2" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q2" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q2" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q2" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been saying to myself 'this isn't real.'</td>
<td class="option-cell"><input type="radio" name="coping_q3" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q3" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q3" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q3" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been using alcohol or other drugs to make myself feel better.</td>
<td class="option-cell"><input type="radio" name="coping_q4" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q4" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q4" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q4" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been looking for something good in what is happening.</td>
<td class="option-cell"><input type="radio" name="coping_q5" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q5" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q5" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q5" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been taking action to try to make the situation better.</td>
<td class="option-cell"><input type="radio" name="coping_q6" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q6" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q6" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q6" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been concentrating my efforts on doing something about the situation I'm in.</td>
<td class="option-cell"><input type="radio" name="coping_q7" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q7" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q7" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q7" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been getting help and advice from other people.</td>
<td class="option-cell"><input type="radio" name="coping_q8" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q8" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q8" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q8" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been getting emotional support from others.</td>
<td class="option-cell"><input type="radio" name="coping_q9" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q9" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q9" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q9" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been trying to find comfort in my religion or spiritual beliefs.</td>
<td class="option-cell"><input type="radio" name="coping_q10" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q10" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q10" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q10" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been learning to live with it.</td>
<td class="option-cell"><input type="radio" name="coping_q11" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q11" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q11" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q11" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been making jokes about the situation.</td>
<td class="option-cell"><input type="radio" name="coping_q12" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q12" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q12" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q12" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been trying to see it in a different light, to make it seem more positive.</td>
<td class="option-cell"><input type="radio" name="coping_q13" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q13" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q13" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q13" value="4" required /></td>
</tr>
<tr>
<td class="statement-cell">I've been criticizing myself.</td>
<td class="option-cell"><input type="radio" name="coping_q14" value="1" required /></td>
<td class="option-cell"><input type="radio" name="coping_q14" value="2" required /></td>
<td class="option-cell"><input type="radio" name="coping_q14" value="3" required /></td>
<td class="option-cell"><input type="radio" name="coping_q14" value="4" required /></td>
</tr>
</tbody>
</table>
<h3>Connection with others, environment, and universe</h3>
<table>
<thead>
<tr>
<th class="statement-cell">Statement</th>
<th class="option-cell">Rarely</th>
<th class="option-cell">Sometimes</th>
<th class="option-cell">Often</th>
<th class="option-cell">Mostly</th>
<th class="option-cell">Always</th>
</tr>
</thead>
<tbody>
<tr>
<td class="statement-cell">I feel a deep sense of connection with a higher power or the universe.</td>
<td class="option-cell"><input type="radio" name="connection_q1" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q1" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q1" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q1" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q1" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">I often feel a sense of harmony or oneness with the world or the people around me.</td>
<td class="option-cell"><input type="radio" name="connection_q2" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q2" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q2" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q2" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q2" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">I engage in practices that nurture me (e.g., prayer, meditation, reflection).</td>
<td class="option-cell"><input type="radio" name="connection_q3" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q3" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q3" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q3" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q3" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">My spiritual practices help me feel calm and at peace.</td>
<td class="option-cell"><input type="radio" name="connection_q4" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q4" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q4" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q4" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q4" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">I experience moments of transcendence or profound insight.</td>
<td class="option-cell"><input type="radio" name="connection_q5" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q5" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q5" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q5" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q5" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">I find comfort and strength in my spiritual beliefs during difficult times.</td>
<td class="option-cell"><input type="radio" name="connection_q6" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q6" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q6" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q6" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q6" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">My beliefs or values inspire me to contribute positively to the lives of others or society.</td>
<td class="option-cell"><input type="radio" name="connection_q7" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q7" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q7" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q7" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q7" value="5" required /></td>
</tr>
<tr>
<td class="statement-cell">I strive to live in alignment with principles that reflect my deepest sense of what is meaningful.</td>
<td class="option-cell"><input type="radio" name="connection_q8" value="1" required /></td>
<td class="option-cell"><input type="radio" name="connection_q8" value="2" required /></td>
<td class="option-cell"><input type="radio" name="connection_q8" value="3" required /></td>
<td class="option-cell"><input type="radio" name="connection_q8" value="4" required /></td>
<td class="option-cell"><input type="radio" name="connection_q8" value="5" required /></td>
</tr>
</tbody>
</table>
<button type="button" id="next3" class="submit-button">Next</button>
</form>
<div id="results" class="page">
<div class="results-container">
<h2>Results</h2>
<div class="score-section">
<h3>SADNESS SCORE <span id="sadness-score-display"></span> (<span id="sadness-level"></span>)</h3>
</div>
<div class="score-section">
<h3>ANXIETY SCORE <span id="anxiety-score-display"></span> (<span id="anxiety-level"></span>)</h3>
</div>
<div class="score-section">
<h3>STRESS SCORE <span id="stress-score-display"></span> (<span id="stress-level"></span>)</h3>
</div>
<div class="score-section">
<h3>CONNECTEDNESS / SPIRITUALITY SCORE <span id="spirituality-score-display"></span> (<span id="spirituality-level"></span>)</h3>
</div>
<div class="score-section">
<h3>Your Coping Mechanism</h3>
<div class="coping-subpoints">
<p>Problem-Focused Coping: <span id="problem-focused-display"></span>%</p>
<p>Emotion-Focused Coping: <span id="emotion-focused-display"></span>%</p>
<p>Avoidant Coping: <span id="avoidant-display"></span>%</p>
</div>
</div>
<p class="completion-message">
Thank you for completing the assessment.<br /><br />
Disclaimer: Please note this is not a medical diagnosis. If you are struggling with any mental health concern please contact your nearest mental healthcare provider or your university/college counselor.
</p>
</div>
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function () {
const pages = document.querySelectorAll(".page");
let currentPage = 0;
document.getElementById("currentDate").textContent = new Date().toLocaleDateString();
function showPage(pageIndex) {
pages.forEach((page, index) => {
page.classList.toggle("active", index === pageIndex);
});
currentPage = pageIndex;
updateProgressBar();
window.scrollTo(0, 0);
}
function updateProgressBar() {
const progressBar = document.getElementById("progress-bar");
const totalPages = pages.length;
const progressPercentage = ((currentPage + 1) / totalPages) * 100;
progressBar.style.width = progressPercentage + "%";
}
const startNowBtn = document.getElementById("start-now");
if (startNowBtn) {
startNowBtn.addEventListener("click", () => {
showPage(1);
});
}
const consentSubmitBtn = document.getElementById("consent-submit");
if (consentSubmitBtn) {
consentSubmitBtn.addEventListener("click", () => {
if (document.querySelector('input[name="consent"]:checked')) {
if (document.querySelector('input[name="consent"]:checked').value === "agree") {
showPage(2);
} else {
alert("You must agree to proceed with the survey.");
}
} else {
alert("Please select an option.");
}
});
}
const next1Btn = document.getElementById("next1");
if (next1Btn) {
next1Btn.addEventListener("click", () => {
const personalDetailsForm = document.getElementById("personalDetailsForm");
if (personalDetailsForm.checkValidity()) {
showPage(3);
} else {
alert("Please fill in all required fields.");
}
});
}
const next3Btn = document.getElementById("next3");
if (next3Btn) {
next3Btn.addEventListener("click", () => {
const requiredRadios = document.querySelectorAll("#questionnaireForm input[required]");
let allFilled = true;
const radioGroups = {};
requiredRadios.forEach((radio) => {
if (!radioGroups[radio.name]) {
radioGroups[radio.name] = [];
}
radioGroups[radio.name].push(radio);
});
for (const name in radioGroups) {
const isChecked = Array.from(radioGroups[name]).some((radio) => radio.checked);
if (!isChecked) {
allFilled = false;
break;
}
}
if (allFilled) {
const scores = calculateScores();
displayResults(scores);
submitForm(scores);
} else {
alert("Please answer all required questions.");
}
});
}
function calculateScores() {
let depressionRaw = 0;
let anxietyRaw = 0;
let stressRaw = 0;
let problemFocusedRaw = 0;
let emotionFocusedRaw = 0;
let avoidantRaw = 0;
let spiritualityRaw = 0;
for (let i = 1; i <= 7; i++) {
const depressionValue = document.querySelector(`input[name="sadness_q${i}"]:checked`);
const anxietyValue = document.querySelector(`input[name="anxiety_q${i}"]:checked`);
const stressValue = document.querySelector(`input[name="stress_q${i}"]:checked`);
if (depressionValue) {
depressionRaw += parseInt(depressionValue.value);
}
if (anxietyValue) {
anxietyRaw += parseInt(anxietyValue.value);
}
if (stressValue) {
stressRaw += parseInt(stressValue.value);
}
}
for (let i = 1; i <= 4; i++) {
const selectedValue = document.querySelector(`input[name="coping_q${i}"]:checked`);
if (selectedValue) {
avoidantRaw += parseInt(selectedValue.value);
}
}
for (let i = 5; i <= 8; i++) {
const selectedValue = document.querySelector(`input[name="coping_q${i}"]:checked`);
if (selectedValue) {
problemFocusedRaw += parseInt(selectedValue.value);
}
}
for (let i = 9; i <= 14; i++) {
const selectedValue = document.querySelector(`input[name="coping_q${i}"]:checked`);
if (selectedValue) {
emotionFocusedRaw += parseInt(selectedValue.value);
}
}
for (let i = 1; i <= 8; i++) {
const selectedValue = document.querySelector(`input[name="connection_q${i}"]:checked`);
if (selectedValue) {
spiritualityRaw += parseInt(selectedValue.value);
}
}
const depressionFinal = depressionRaw * 2;
const anxietyFinal = anxietyRaw * 2;
const stressFinal = stressRaw * 2;
const problemFocusedPercentage = (problemFocusedRaw / 16) * 100;
const emotionFocusedPercentage = (emotionFocusedRaw / 24) * 100;
const avoidantPercentage = (avoidantRaw / 16) * 100;
const spiritualityFinal = spiritualityRaw;
const totalCoping = problemFocusedPercentage + emotionFocusedPercentage + avoidantPercentage;
const problemFocusedAdjusted = (problemFocusedPercentage / totalCoping) * 100;
const emotionFocusedAdjusted = (emotionFocusedPercentage / totalCoping) * 100;
const avoidantAdjusted = (avoidantPercentage / totalCoping) * 100;
const depressionLevel = getDepressionLevel(depressionFinal);
const anxietyLevel = getAnxietyLevel(anxietyFinal);
const stressLevel = getStressLevel(stressFinal);
const spiritualityLevel = getSpiritualityLevel(spiritualityFinal);
return {
depressionFinal,
depressionLevel,
anxietyFinal,
anxietyLevel,
stressFinal,
stressLevel,
problemFocusedAdjusted,
emotionFocusedAdjusted,
avoidantAdjusted,
spiritualityFinal,
spiritualityLevel,
};
}
function getDepressionLevel(score) {
if (score < 10) return "Normal";
if (score < 14) return "Mild";
if (score < 21) return "Moderate";
if (score < 28) return "Severe";
return "Extremely Severe";
}
function getAnxietyLevel(score) {
if (score < 8) return "Normal";
if (score < 10) return "Mild";
if (score < 15) return "Moderate";
if (score < 20) return "Severe";
return "Extremely Severe";
}
function getStressLevel(score) {
if (score < 15) return "Normal";
if (score < 19) return "Mild";
if (score < 26) return "Moderate";
if (score < 34) return "Severe";
return "Extremely Severe";
}
function getSpiritualityLevel(score) {
if (score < 20) return "Low";
if (score < 30) return "Medium";
if (score < 40) return "High";
return "Very High";
}
function displayResults(scores) {
document.getElementById("sadness-score-display").textContent = scores.depressionFinal;
document.getElementById("anxiety-score-display").textContent = scores.anxietyFinal;
document.getElementById("stress-score-display").textContent = scores.stressFinal;
document.getElementById("spirituality-score-display").textContent = scores.spiritualityFinal;
document.getElementById("problem-focused-display").textContent = scores.problemFocusedAdjusted.toFixed(2);
document.getElementById("emotion-focused-display").textContent = scores.emotionFocusedAdjusted.toFixed(2);
document.getElementById("avoidant-display").textContent = scores.avoidantAdjusted.toFixed(2);
document.getElementById("sadness-level").textContent = scores.depressionLevel;
document.getElementById("anxiety-level").textContent = scores.anxietyLevel;
document.getElementById("stress-level").textContent = scores.stressLevel;
document.getElementById("spirituality-level").textContent = scores.spiritualityLevel;
showPage(4); // Show the results page
}
function submitForm(scores) {
const xhr = new XMLHttpRequest();
xhr.open("POST", "submit_form.php", true);
// Create a FormData object from both forms
const personalDetailsForm = document.getElementById("personalDetailsForm");
const questionnaireForm = document.getElementById("questionnaireForm");
const formData = new FormData();
// Append personal details
Array.from(personalDetailsForm.elements).forEach(element => {
if (element.name) {
formData.append(element.name, element.value);
}
});
// Append questionnaire responses
Array.from(questionnaireForm.elements).forEach(element => {
if (element.type === "radio" && element.checked) {
formData.append(element.name, element.value);
} else if (element.type !== "radio") {
formData.append(element.name, element.value);
}
});
// Append calculated scores to the FormData
formData.append("sadness_score", scores.depressionFinal);
formData.append("anxiety_score", scores.anxietyFinal);
formData.append("stress_score", scores.stressFinal);
formData.append("spirituality_score", scores.spiritualityFinal);
formData.append("problem_focused", scores.problemFocusedAdjusted);
formData.append("emotion_focused", scores.emotionFocusedAdjusted);
formData.append("avoidant", scores.avoidantAdjusted);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.responseText);
}
};
// Send the FormData object
xhr.send(formData);
}
});
</script>
</body>
</html>