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.

Sign up for GitHub

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

Jump to bottom

Revert "Feat/frontend functionality" #13

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Revert "Feat/frontend functionality" #13

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
17 changes: 16 additions & 1 deletion medguide/templates/possible_disease.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,22 @@
<div class="mt-[31px] rounded-r-[46px] w-fit ml-[33px] border-[#BDC1C6] border-[1px] bg-[#141516]">
<p class="text-[#C4C7C5] text-center p-[5px] font-['Inter'] text-[18px] font-normal leading-normal">{{possible_disease}}</p>
</div>

<div class="mt-[5px] rounded-r-[46px] w-fit ml-[33px] border-[#BDC1C6] border-[1px] bg-[#141516]">
<p class="text-[#C4C7C5] text-center p-[5px] font-['Inter'] text-[18px] font-normal leading-normal">Viral
Meningoencephalitis</p>
</div>
<div class="mt-[5px] rounded-r-[46px] w-fit ml-[33px] border-[#BDC1C6] border-[1px] bg-[#141516]">
<p class="text-[#C4C7C5] text-center p-[5px] font-['Inter'] text-[18px] font-normal leading-normal">Dengue Fever
</p>
</div>
<div class="mt-[5px] rounded-r-[46px] w-fit ml-[33px] border-[#BDC1C6] border-[1px] bg-[#141516]">
<p class="text-[#C4C7C5] text-center p-[5px] font-['Inter'] text-[18px] font-normal leading-normal">Salmonella
Infections</p>
</div>
<div class="mt-[5px] rounded-r-[46px] w-fit ml-[33px] border-[#BDC1C6] border-[1px] bg-[#141516]">
<p class="text-[#C4C7C5] text-center p-[5px] font-['Inter'] text-[18px] font-normal leading-normal">CNS TB & TB
Meningitis</p>
</div>

</div>

Expand Down
163 changes: 89 additions & 74 deletions medguide/templates/tell_symptoms.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,119 +5,134 @@
{% block div %}

<div class="mt-[93px] flex items-center justify-center">
<div class="w-[365.33px] h-[58px] flex items-center justify-center rounded-l-[50px] cursor-pointer border-[1px] border-white bg-gradient-to-r from-[#BAC] to-[#BAC] via-[#E1709B]">
<p class="text-[#222327] font-['Inter'] text-[18px] font-normal leading-normal">Step 1: Tell us about your symptoms</p>
<div
class="w-[365.33px] h-[58px] flex items-center justify-center rounded-l-[50px] cursor-pointer border-[1px] border-white bg-gradient-to-r from-[#BAC] to-[#BAC] via-[#E1709B]">
<p class="text-[#222327] font-['Inter'] text-[18px] font-normal leading-normal">Step 1: Tell us about your
symptoms</p>
</div>
<div class="w-[365.33px] h-[58px] bg-[#17191C] flex items-center justify-center cursor-pointer">
<p class="text-[#FFF] font-['Inter'] text-[18px] font-normal leading-normal">Step 2: Possible Disease</p>
</div>
<div class="w-[365.33px] h-[58px] bg-[#17191C] flex items-center justify-center cursor-pointer rounded-r-[50px] border-l border-l-[#FFF]">
<div
class="w-[365.33px] h-[58px] bg-[#17191C] flex items-center justify-center cursor-pointer rounded-r-[50px] border-l border-l-[#FFF]">
<p class="text-[#FFF] font-['Inter'] text-[18px] font-normal leading-normal">Step 3: Suggestions</p>
</div>
</div>

<form action="/" method="POST" onsubmit="return validateForm()">
<div class="flex items-center justify-center mt-[24px] relative">
<input id="selectedSymptoms" class="selected-symptoms-container pl-[24px]" placeholder=" Please Select Symptoms" name="selectedSymptoms" ></input>

<div class="flex items-center justify-center mt-[24px]">
<div class="w-[1094px] h-[380px] rounded-[28px] border-[#000] bg-[#222327]">
<p class="mt-[20px] ml-[30px] text-[#BAC] font-['Inter' text-[24px] font-semibold leading-normal]">Symptom details</p>
<p class="mt-[20px] ml-[30px] text-[#BAC] font-['Inter' text-[24px] font-semibold leading-normal]">Symptom details
</p>

<div class="ml-[40px] mt-[47px]">
<div class="inline-flex items-start">
<div class="inline-flex items-center">
<div>
<p class="text-[#C4C7C5] ml-[6px] font-['Inter'] text-[20px] font-normal leading-normal">Age of the patient *</p>
<select id="ageSelect" name="age" class="w-[213px] h-[41px] pl-[24px] text-[#C4C7C5] rounded-[48px] cursor-pointer border-[1px] bg-[#131314E6]" style="border: 1px solid #BDC1C6; background-color: #131314E6;">
<p class=" text-[#C4C7C5] ml-[6px] font-['Inter'] text-[20px] font-normal leading-normal">Age of the patient
*</p>
<select id="ageSelect" name="age"
class="w-[213px] h-[41px] pt-[11px] pl-[24px] text-[#C4C7C5] rounded-[48px] cursor-pointer border-[1px] bg-[#131314E6]"
style="border: 1px solid #BDC1C6; background-color: #131314E6;">
<option value="Please Select" selected>Please Select</option>
<option value="under 18">under 18</option>
<option value="18 -50">18 - 50</option>
<option value="above 50">above 50</option>
</select>
</div>
</div>
<div>
<p class="text-[#C4C7C5] ml-[85px] font-['Inter'] text-[20px] font-normal leading-normal">Select your Gender *</p>
<select id="sexSelect" name="sex" class="w-[213px] h-[41px] ml-[78px] pl-[24px] text-[#C4C7C5] rounded-[48px] cursor-pointer border-[1px] bg-[#131314E6]" style="border: 1px solid #BDC1C6; background-color: #131314E6;">
<p class=" text-[#C4C7C5] ml-[85px] font-['Inter'] text-[20px] font-normal leading-normal">Select your
Gender</p>
<select id="sexSelect" name="sex"
class="w-[213px] h-[41px] ml-[78px] pt-[11px] pl-[24px] text-[#C4C7C5] rounded-[48px] cursor-pointer border-[1px] bg-[#131314E6]"
style="border: 1px solid #BDC1C6; background-color: #131314E6;">
<option value="Please Select" selected>Please Select</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</div>
<div>
<p class="text-[#C4C7C5] ml-[90px] font-['Inter'] text-[20px] font-normal leading-normal">Enter abnormal clinical features</p>
<select class="w-[364px] h-[20px] overflow-y-scroll mt-12 ml-[84px] pt-[11px] pl-[24px] text-[#C4C7C5] rounded-[48px] cursor-pointer border-[1px] bg-[#131314E6]" style="border: 1px solid #BDC1C6; background-color: #131314E6; height: auto" id="symptomInput" autocomplete="off" name="symptom" multiple>
{% for symptom in symptoms_list %}
<option value="{{symptom}}">{{symptom}}</option>
{% endfor %}
</select>
<div >
<p class=" text-[#C4C7C5] ml-[90px] font-['Inter'] text-[20px] font-normal leading-normal">Enter abnormal
clinical features</p>


<div class="relative inline-block ml-[90px] bg-[#131314E6] w-fit text-[#C4C7C5] " >
<div class=" py-2 px-4 text-[#C4C7C5] rounded-[29px] border border-[#BDC1C6] cursor-pointer" id="selectedOption">Enter your symptom e.g. chest pain </div>
<div class="absolute overflow-y-scroll overflow-x-hidden h-[300px] w-[220px] left-0 mt-2 py-2 bg-[#131314E6] border border-gray-300 shadow-lg hidden" id="dropdownOptions">
{% for symptom in symptoms_list %}
<div class="block px-4 py-2 cursor-pointer w-full" data-value="{{ symptom }}">{{ symptom }}</div>
{% endfor %}

</div>
</div>
<input type="hidden" name="symptom" id="selectedSymptom">
</div>
</div>
</div>

</div>

</div>

<div class="flex items-center justify-center mt-[30px]">
<button class="w-[146px] h-[54px] rounded-[28px] border-[1px] border-[#FFF] bg-[#17191C]">
<Button class="w-[146px] h-[54px] rounded-[28px] border-[1px] border-[#FFF] bg-[#17191C]">
<p class="text-[#FFF] font-['Inter'] text-[20px] font-medium leading-normal">Clear</p>
</button>
<button type="submit" class="w-[146px] h-[54px] ml-[54px] rounded-[28px] border-[1px] border-[#FFF] bg-[#BAC]">
</Button>
<Button type="submit" class="w-[146px] h-[54px] ml-[54px] rounded-[28px] border-[1px] border-[#FFF] bg-[#BAC]">
<p class="font-['Inter'] text-[20px] font-medium leading-normal">Next</p>
</button>
</Button>
</div>
</form>

<style>
.selected-symptoms-container {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
position: absolute;
top: 8.2rem;
left: 48.5rem;
width: 400px;
height: 41px;
padding: 10px;
border-radius: 25px;
background-color: #131314E6;
color: white;
z-index: 1;
border: 1px solid white;
}

select {
overflow: hidden;
}

/* Add this style to enable scrolling */
select::-webkit-scrollbar {
width: 0px;
}

select::-webkit-scrollbar-thumb {
background-color: #BDC1C6; /* Adjust the color as needed */
border-radius: 6px; /* Adjust the radius as needed */
}
</style>

<script>
document.getElementById('symptomInput').addEventListener('change', function() {
var selectedSymptomsInput = document.getElementById('selectedSymptoms');
var selectedOptions = this.selectedOptions;

if (selectedOptions.length > 9) {
alert("You can select a maximum of 9 options.");
this.options[selectedOptions.length - 1].selected = false;
return;
}
dropdownOptions.addEventListener('click', function(e) {
if (e.target && e.target.nodeName == "DIV") {
var selectedValues = Array.from(this.querySelectorAll('.selected')).map(div => div.dataset.value);
var clickedValue = e.target.dataset.value;

var selectedSymptomsArray = [];
if (selectedValues.includes(clickedValue)) {
e.target.classList.remove('selected');
} else {
e.target.classList.add('selected');
}

for (var i = 0; i < selectedOptions.length; i++) {
var symptom = selectedOptions[i].value;
selectedSymptomsArray.push(symptom);
}
selectedValues = Array.from(this.querySelectorAll('.selected')).map(div => div.dataset.value);
selectedOption.innerHTML = selectedValues.join(', ');

// Update the value of the input
selectedSymptomsInput.value = selectedSymptomsArray.join(', ');
if (selectedValues.length === dropdownOptions.querySelectorAll('div').length) {
dropdownOptions.classList.add('hidden');
}
}
});

document.addEventListener('click', function(e) {
if (!e.target.matches('#selectedOption')) {
if (!dropdownOptions.classList.contains('hidden')) {
dropdownOptions.classList.add('hidden');
}
}
});

document.addEventListener('DOMContentLoaded', function() {

var selectedOption = document.getElementById('selectedOption');
var dropdownOptions = document.getElementById('dropdownOptions');

selectedOption.addEventListener('click', function() {
dropdownOptions.classList.toggle('hidden');

let symptomDiv = document.getElementById('selectedOption');
let hiddenInput = document.getElementById('selectedSymptom');

symptomDiv.addEventListener('click', function() {
let selectedSymptom = symptomDiv.innerText;
hiddenInput.value = selectedSymptom;
});

console.log('Form submitted');
console.log('Hidden Input Value:', hiddenInput.value);
});
});
</script>

{% endblock %}

{% endblock %}
3 changes: 0 additions & 3 deletions medguide/templates/temp.txt
View file
Open in desktop

This file was deleted.

37 changes: 18 additions & 19 deletions medguide/views.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,23 +15,23 @@ def index():
if request.method == 'POST':
age = request.form.get('age')
sex = request.form.get('sex')
symptom = request.form.getlist('symptom')
symptom = request.form.get('symptom')


# print(f'Selected Symptom: {symptom}')
df = pd.read_csv('notebook/data/disease_with_132_features.csv')
df_drop_target = df.drop(['prognosis'],axis =1)
numerical_columns = np.array(df_drop_target.columns)

if symptom is not None and isinstance(symptom, (list, tuple)):
input_values = {
value : [2] for value in symptom
}
else:
input_values = {}


default_input_values_list = {}
input_values = {
"itching" : [1],
"skin_rash" : [1],
"nodal_skin_eruptions" : [0],
"inflammatory_nails" : [1],
"chills" : [0],
"yellow_crust_ooze": [0],
"blister": [1]
}

default_input_values = {feature :[0] for feature in numerical_columns}

Expand Down Expand Up @@ -59,17 +59,16 @@ def index():
pred = final_model.predict(data_scaled)
diseases = get_diseases()

index = np.where(pred[0] > 0.1)[0][0]
index = np.where(pred[0] > 0.5)[0][0]

# return f"{diseases[index][10:]}"
# return f"{input_values}"
return f"{symptom}"
# return ','.join(symptom)
# return input_values
return render_template(
'possible_disease.html',
title="Possible disease",
possible_disease = diseases[index][10:]
)
# return render_template(
# 'possible_disease.html',
# title="Possible disease",
# possible_disease = diseases[index]
# )


return render_template('tell_symptoms.html', title="tell symptoms", symptoms_list = symptoms)
Expand Down Expand Up @@ -103,6 +102,6 @@ def get_symptoms():

symptoms = np.array([column for column in train_df.columns])

return np.sort(symptoms)
return symptoms


Loading