Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

(Issue #226) Medicine Predicition system #752

Merged
merged 3 commits into from
Oct 10, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
148 changes: 148 additions & 0 deletions projects/HealthCare/about.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,148 @@

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> WeCare</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
</head>

<style>

.logo {
width: 50px;
height: 50px;
color: black;
margin-top: 0;
margin-left: 2px;
}

.myimg {
width: 50px;
height: 50px;
border: 2px solid black;
border-radius: 25px;
}
.navbar{
background-color: #006d77;
}



</style>
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg " >
<div class="container-fluid">
<!-- Logo at the top-left corner -->
<div class="logo">
<img src="logo.jpg" alt="logo" class="myimg">
</div>

<a class="navbar-brand" href="#"></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">

<li class="nav-item">
<a class="nav-link" href="home.html" style="color:#edf6f9">Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="index.html" style="color:#edf6f9">Diagnosis</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html" style="color:#edf6f9">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html" style="color:#edf6f9">Contact</a>
</li>

<li class="nav-item">
<a class="nav-link" href="blog.html" style="color:#edf6f9">Blog</a>
</li>
</ul>
<form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit" style="color:#edf6f9">Search</button>
</form>
</div>
</div>
</nav>

<div class="container mt-5">
<h3>About Us</h3>
<p>Welcome to our organization! We are dedicated to improving the well-being of our community through various health initiatives and educational programs. Our mission is to empower individuals with knowledge and support for healthier living.</p>

<hr>

<h4>Our Vision</h4>
<p>We envision a world where every individual has access to quality health education and resources that empower them to live healthier and happier lives. Our goal is to create a community where health and wellness are prioritized and accessible to everyone.</p>

<h4>Our Values</h4>
<ul>
<li><strong>Integrity:</strong> We believe in being honest and transparent in all our actions and communications.</li>
<li><strong>Compassion:</strong> We are dedicated to serving our community with empathy and understanding.</li>
<li><strong>Collaboration:</strong> We work together with local organizations and stakeholders to maximize our impact.</li>
<li><strong>Innovation:</strong> We embrace new ideas and approaches to enhance our programs and services.</li>
</ul>



<hr>

<h4>Community Involvement</h4>
<p>We believe in the power of community and actively engage with local organizations, schools, and healthcare providers to promote health and wellness. Our outreach programs include:</p>
<ul>
<li><strong>Health Workshops:</strong> Regular workshops on nutrition, fitness, and mental well-being.</li>
<li><strong>Free Health Screenings:</strong> Offering community members free health screenings and assessments.</li>
<li><strong>School Programs:</strong> Collaborating with schools to educate children on healthy habits from a young age.</li>
<li><strong>Volunteer Opportunities:</strong> Encouraging community members to get involved through volunteering and support.</li>
</ul>

<hr>

<h4>Contact Us</h4>
<form>
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" required>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" class="form-control" id="email" required>
</div>
<div class="mb-3">
<label for="message" class="form-label">Message</label>
<textarea class="form-control" id="message" rows="3" required></textarea>
</div>
<button type="submit" class="btn btn-primary">Send Message</button>
</form>
</div>

<!-- Optional: Add some custom styles for the timeline -->
<style>
.timeline {
list-style: none;
padding: 0;
}

.timeline li {
margin: 20px 0;
}

.timeline h5 {
margin: 0;
font-weight: bold;
}
</style>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>


</body>

</html>
79 changes: 79 additions & 0 deletions projects/HealthCare/app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
document.getElementById('symptomForm').addEventListener('submit', function(event) {
event.preventDefault();

// Show loading indicator
document.getElementById('loading').classList.remove('hidden');

// Gather selected symptoms
const selectedSymptoms = [];
document.querySelectorAll('.checkbox-group input:checked').forEach(checkbox => {
selectedSymptoms.push(checkbox.value);
});

// Initialize prediction variables
let medicine = 'Unknown';
let diet = 'Unknown';
let precautions = 'Unknown';

// Mock prediction logic based on selected symptoms
if (selectedSymptoms.includes('fever') && selectedSymptoms.includes('headache')) {
medicine = 'Paracetamol';
diet = 'Stay hydrated; drink plenty of fluids.';
precautions = 'Rest well and avoid strenuous activities.';
} else if (selectedSymptoms.includes('cough')) {
medicine = 'Cough Syrup';
diet = 'Avoid cold drinks; prefer warm liquids.';
precautions = 'Cover your mouth while coughing and avoid close contact with others.';
} else if (selectedSymptoms.includes('stomach ache')) {
medicine = 'Antacid';
diet = 'Eat light meals; avoid spicy foods.';
precautions = 'Consult a doctor if symptoms persist.';
} else if (selectedSymptoms.includes('nausea')) {
medicine = 'Anti-nausea medication';
diet = 'Eat bland foods like crackers and toast.';
precautions = 'Avoid strong smells and heavy meals.';
} else {
medicine = 'Consult a doctor for proper medication.';
diet = 'Follow a balanced diet as per health guidelines.';
precautions = 'Seek medical attention for further advice.';
}

// Update results
document.getElementById('medicine').innerText = medicine;
document.getElementById('diet').innerText = diet;
document.getElementById('precautions').innerText = precautions;

// Hide loading indicator and show result
document.getElementById('loading').classList.add('hidden');
document.getElementById('result').classList.remove('hidden');

// Add to history
addToHistory(medicine, diet, precautions);
});

// Reset button functionality
document.getElementById('resetBtn').addEventListener('click', function() {
document.getElementById('symptomForm').reset();
document.getElementById('result').classList.add('hidden');
document.getElementById('history').classList.add('hidden');
});

// Function to add prediction to history
function addToHistory(medicine, diet, precautions) {
const historyList = document.getElementById('historyList');
const listItem = document.createElement('li');
listItem.innerHTML = `<strong>Medicine:</strong> ${medicine}, <strong>Diet:</strong> ${diet}, <strong>Precautions:</strong> ${precautions}`;
historyList.appendChild(listItem);
document.getElementById('history').classList.remove('hidden');
}

// Feedback submission
document.getElementById('submitFeedback').addEventListener('click', function() {
const rating = document.getElementById('rating').value;
alert(`Thank you for your feedback! You rated it: ${rating} stars.`);
});
// Clear history button functionality
document.getElementById("clearHistoryBtn").addEventListener("click", function() {
document.getElementById("historyList").innerHTML = "";
document.getElementById("history").classList.add("hidden");
});
Binary file added projects/HealthCare/bg-image.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
113 changes: 113 additions & 0 deletions projects/HealthCare/blog.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> WeCare</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
</head>

<style>

.logo {
width: 50px;
height: 50px;
color: black;
margin-top: 0;
margin-left: 2px;
}

.myimg {
width: 50px;
height: 50px;
border: 2px solid black;
border-radius: 25px;
}
.navbar{
background-color: #006d77;
}



</style>
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg " >
<div class="container-fluid">
<!-- Logo at the top-left corner -->
<div class="logo">
<img src="logo.jpg" alt="logo" class="myimg">
</div>

<a class="navbar-brand" href="#"></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">

<li class="nav-item">
<a class="nav-link" href="home.html" style="color:#edf6f9">Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="index.html" style="color:#edf6f9">Diagnosis</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html" style="color:#edf6f9">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html" style="color:#edf6f9">Contact</a>
</li>

<li class="nav-item">
<a class="nav-link" href="blog.html" style="color:#edf6f9">Blog</a>
</li>
</ul>
<form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit" style="color:#edf6f9">Search</button>
</form>
</div>
</div>
</nav>

<h2 class="text-center"> Building a Symptom-Based Disease Diagnosis Web App with Flask and Machine Learning</h2>
<p>In the age of technology and information, access to accurate and timely healthcare is more critical than ever. With the increasing importance of remote healthcare solutions, we embarked on a journey to develop a symptom-based disease diagnosis web application. Leveraging Flask for the backend and a Decision Tree Classifier model, we created a user-friendly platform that can help users identify potential illnesses based on their reported symptoms.</p>

<h3>The Problem</h3>
<p>The project began with recognizing a common issue: people often experience symptoms and want quick answers about their health concerns. It can be challenging to differentiate between various diseases, especially when symptoms overlap. Our goal was to provide a convenient solution for users to input their symptoms and receive potential diagnoses.</p>

<h3>The Solution</h3>
<p>We developed a web app that allows users to enter a list of symptoms they are experiencing. The app then uses a pre-trained Decision Tree Classifier model to predict the most likely disease based on the provided symptoms. Here's how it works:</p>

<ol>
<li><b><strong>Symptom Input:</strong></b> Users enter their symptoms through a user-friendly interface. The web app supports a wide range of symptoms, making it versatile for different scenarios.</li>
<li><b><strong>Machine Learning Model:</strong></b> We trained a Decision Tree Classifier using a dataset containing symptoms and corresponding diseases. The model is capable of predicting diseases based on input symptoms.</li>
<li><b><strong>Prediction:</strong></b> The app uses the model to predict the most likely disease, providing users with instant information about potential health concerns.</li>
<li><b><strong>Additional Information: </strong></b> To enhance user experience, the app also provides additional information about the predicted disease. This includes a description of the disease, recommended precautions, medications, dietary advice, and workout tips.</li>

</ol>

<h3>Key Features</h3>
<ul type="circle">
<li><b><strong>User-Friendly Interface:</strong></b> The web app boasts an intuitive and easy-to-navigate interface, ensuring that users can input their symptoms without any hassle.</li>
<li><b><strong>Accurate Predictions:</strong></b> Leveraging machine learning, our model provides accurate disease predictions based on the symptoms provided by the user.</li>
<li><b><strong>Comprehensive Information: </strong></b>In addition to predictions, the app offers comprehensive information about the predicted disease, including descriptions, precautions, medications, diet recommendations, and workout tips.</li>
<li><b><strong>ducational Content:</strong></b> To empower users with knowledge, the app includes informative blog posts about various health topics.</li>
</ul>

<br>

<h3>Conclusion</h3>
<p>Our Symptom-Based Disease Diagnosis Web App brings the power of machine learning and healthcare information to the fingertips of users. It serves as a valuable resource for individuals looking to gain insights into their health conditions quickly and conveniently. By combining technology and healthcare, we aim to make healthcare more accessible and user-centric.

In an era where remote healthcare solutions are gaining prominence, this project represents a significant step forward in providing accessible and reliable healthcare information to the masses. We hope that this project will contribute to better health awareness and ultimately improve the well-being of individuals worldwide.</p>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>


</body>

</html>
Loading
Loading