Hugging Face's logo

Spaces:
senthazalravi
/
diabcarenew
Running

App Files Community
diabcarenew / index.html
senthazalravi's picture
senthazalravi
Add 2 files
198dfb8 verified
raw
history blame contribute delete
75.2 kB
 <!DOCTYPE html>
<html lang="ta">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>நீரிழிவு முன்னறிவிப்பு அமைப்பு | Diabetes Prediction System</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Tamil:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Devanagari:wght@400;700&display=swap');
body {
font-family: 'Noto Sans Tamil', sans-serif;
background-color: #f0fdf4;
}
.hindi-font {
font-family: 'Noto Sans Devanagari', sans-serif;
}
.language-flag {
width: 24px;
height: 16px;
display: inline-block;
margin-right: 8px;
background-size: cover;
border-radius: 2px;
}
.tamil { background-image: url('https://flagcdn.com/w20/in.png'); }
.english { background-image: url('https://flagcdn.com/w20/gb.png'); }
.chinese { background-image: url('https://flagcdn.com/w20/cn.png'); }
.arabic { background-image: url('https://flagcdn.com/w20/sa.png'); }
.hindi { background-image: url('https://flagcdn.com/w20/in.png'); }
.swedish { background-image: url('https://flagcdn.com/w20/se.png'); }
.result-card {
background: linear-gradient(135deg, #4ade80 0%, #22d3ee 100%);
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}
.form-section {
transition: all 0.3s ease;
}
.form-section:not(.active) {
display: none;
}
</style>
</head>
<body class="min-h-screen">
<div class="container mx-auto px-4 py-8 max-w-4xl">
<!-- Language Selector -->
<div class="flex justify-end mb-6">
<div class="relative">
<button id="languageBtn" class="flex items-center px-4 py-2 bg-white rounded-lg shadow-md hover:bg-gray-50 transition">
<span class="language-flag tamil"></span>
<span id="currentLanguage" data-lang="ta">தமிழ்</span>
<i class="fas fa-chevron-down ml-2 text-sm"></i>
</button>
<div id="languageDropdown" class="absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg z-10 hidden">
<div class="py-1">
<a href="#" data-lang="ta" class="language-option block px-4 py-2 text-sm hover:bg-gray-100">
<span class="language-flag tamil"></span> தமிழ்
</a>
<a href="#" data-lang="en" class="language-option block px-4 py-2 text-sm hover:bg-gray-100">
<span class="language-flag english"></span> English
</a>
<a href="#" data-lang="zh" class="language-option block px-4 py-2 text-sm hover:bg-gray-100">
<span class="language-flag chinese"></span> 中文
</a>
<a href="#" data-lang="ar" class="language-option block px-4 py-2 text-sm hover:bg-gray-100">
<span class="language-flag arabic"></span> العربية
</a>
<a href="#" data-lang="hi" class="language-option block px-4 py-2 text-sm hover:bg-gray-100 hindi-font">
<span class="language-flag hindi"></span> हिन्दी
</a>
<a href="#" data-lang="sv" class="language-option block px-4 py-2 text-sm hover:bg-gray-100">
<span class="language-flag swedish"></span> Svenska
</a>
</div>
</div>
</div>
</div>
<!-- Header -->
<div class="text-center mb-10">
<h1 id="appTitle" class="text-3xl font-bold text-gray-800 mb-2">நீரிழிவு முன்னறிவிப்பு அமைப்பு</h1>
<p id="appSubtitle" class="text-gray-600">உங்கள் நீரிழிவு ஆபத்து அளவை அறிய பின்வரும் தகவல்களை நிரப்பவும்</p>
</div>
<!-- Progress Bar -->
<div class="mb-8">
<div class="flex justify-between mb-2">
<span id="progressText" class="text-sm font-medium">1/3 படிகள்</span>
<span id="progressPercent" class="text-sm font-medium">33%</span>
</div>
<div class="w-full bg-gray-200 rounded-full h-2.5">
<div id="progressBar" class="bg-green-500 h-2.5 rounded-full" style="width: 33%"></div>
</div>
</div>
<!-- Form Sections -->
<form id="diabetesForm" class="bg-white rounded-xl shadow-lg p-6 mb-8">
<!-- Section 1: Basic Info -->
<div id="section1" class="form-section active">
<h2 class="text-xl font-semibold mb-4 text-gray-800 border-b pb-2" id="section1Title">அடிப்படை தகவல்கள்</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label for="name" class="block mb-2 text-sm font-medium text-gray-700" id="nameLabel">பெயர்</label>
<input type="text" id="name" name="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
</div>
<div>
<label for="age" class="block mb-2 text-sm font-medium text-gray-700" id="ageLabel">வயது</label>
<input type="number" id="age" name="age" min="1" max="120" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
</div>
<div>
<label for="gender" class="block mb-2 text-sm font-medium text-gray-700" id="genderLabel">பாலினம்</label>
<select id="gender" name="gender" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
<option value="" selected disabled id="selectGender">தேர்ந்தெடுக்கவும்</option>
<option value="male" id="maleOption">ஆண்</option>
<option value="female" id="femaleOption">பெண்</option>
<option value="other" id="otherOption">மற்றவை</option>
</select>
</div>
<div>
<label for="weight" class="block mb-2 text-sm font-medium text-gray-700" id="weightLabel">உடல் எடை (கிலோ)</label>
<input type="number" id="weight" name="weight" min="30" max="200" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
</div>
<div>
<label for="height" class="block mb-2 text-sm font-medium text-gray-700" id="heightLabel">உயரம் (செ.மீ)</label>
<input type="number" id="height" name="height" min="100" max="250" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
</div>
<div>
<label for="cuisine" class="block mb-2 text-sm font-medium text-gray-700" id="cuisineLabel">விருப்பமான உணவு வகை</label>
<select id="cuisine" name="cuisine" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500">
<option value="" selected disabled id="selectCuisine">தேர்ந்தெடுக்கவும்</option>
<option value="indian" id="indianOption">இந்திய உணவு</option>
<option value="western" id="westernOption">மேற்கத்திய உணவு</option>
<option value="chinese" id="chineseOption">சீன உணவு</option>
<option value="mixed" id="mixedOption">கலப்பு உணவு</option>
</select>
</div>
</div>
<div class="flex justify-between mt-8">
<div></div>
<button type="button" id="next1" class="px-6 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition flex items-center">
<span id="next1Text">அடுத்தது</span>
<i class="fas fa-arrow-right ml-2"></i>
</button>
</div>
</div>
<!-- Section 2: Dietary Habits -->
<div id="section2" class="form-section">
<h2 class="text-xl font-semibold mb-4 text-gray-800 border-b pb-2" id="section2Title">உணவு பழக்கவழக்கங்கள்</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="breakfastLabel">காலை உணவு</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="breakfast-heavy" name="breakfast" value="heavy" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="breakfast-heavy" class="ml-2 block text-sm text-gray-700" id="heavyBreakfast">கனமான (இட்லி, தோசை, பூரி)</label>
</div>
<div class="flex items-center">
<input type="radio" id="breakfast-light" name="breakfast" value="light" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="breakfast-light" class="ml-2 block text-sm text-gray-700" id="lightBreakfast">இலகுவான (தானியங்கள், பழம்)</label>
</div>
<div class="flex items-center">
<input type="radio" id="breakfast-skip" name="breakfast" value="skip" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="breakfast-skip" class="ml-2 block text-sm text-gray-700" id="skipBreakfast">தவிர்க்கிறேன்</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="lunchLabel">மதிய உணவு</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="lunch-rice" name="lunch" value="rice" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="lunch-rice" class="ml-2 block text-sm text-gray-700" id="riceLunch">அரிசி உணவு</label>
</div>
<div class="flex items-center">
<input type="radio" id="lunch-wheat" name="lunch" value="wheat" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="lunch-wheat" class="ml-2 block text-sm text-gray-700" id="wheatLunch">கோதுமை உணவு (சப்பாத்தி, ரொட்டி)</label>
</div>
<div class="flex items-center">
<input type="radio" id="lunch-light" name="lunch" value="light" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="lunch-light" class="ml-2 block text-sm text-gray-700" id="lightLunch">இலகுவான உணவு</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="dinnerLabel">இரவு உணவு</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="dinner-heavy" name="dinner" value="heavy" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="dinner-heavy" class="ml-2 block text-sm text-gray-700" id="heavyDinner">கனமான உணவு</label>
</div>
<div class="flex items-center">
<input type="radio" id="dinner-light" name="dinner" value="light" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="dinner-light" class="ml-2 block text-sm text-gray-700" id="lightDinner">இலகுவான உணவு</label>
</div>
<div class="flex items-center">
<input type="radio" id="dinner-early" name="dinner" value="early" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="dinner-early" class="ml-2 block text-sm text-gray-700" id="earlyDinner">ஆரம்பத்தில் (மாலை 7 மணிக்கு முன்)</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="fastingLabel">நோன்பு பழக்கம்</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="fasting-yes" name="fasting" value="yes" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="fasting-yes" class="ml-2 block text-sm text-gray-700" id="yesFasting">உண்டு (வாரத்தில் சில நாட்கள்)</label>
</div>
<div class="flex items-center">
<input type="radio" id="fasting-no" name="fasting" value="no" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="fasting-no" class="ml-2 block text-sm text-gray-700" id="noFasting">இல்லை</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="snackingLabel">சிற்றுண்டி பழக்கம்</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="snacking-often" name="snacking" value="often" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="snacking-often" class="ml-2 block text-sm text-gray-700" id="oftenSnacking">அடிக்கடி (நாள்தோறும்)</label>
</div>
<div class="flex items-center">
<input type="radio" id="snacking-sometimes" name="snacking" value="sometimes" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="snacking-sometimes" class="ml-2 block text-sm text-gray-700" id="sometimesSnacking">சில நேரங்களில்</label>
</div>
<div class="flex items-center">
<input type="radio" id="snacking-rarely" name="snacking" value="rarely" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="snacking-rarely" class="ml-2 block text-sm text-gray-700" id="rarelySnacking">அரிதாக</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="sweetsLabel">இனிப்பு உணவு பழக்கம்</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="sweets-daily" name="sweets" value="daily" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="sweets-daily" class="ml-2 block text-sm text-gray-700" id="dailySweets">தினமும்</label>
</div>
<div class="flex items-center">
<input type="radio" id="sweets-weekly" name="sweets" value="weekly" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="sweets-weekly" class="ml-2 block text-sm text-gray-700" id="weeklySweets">வாரத்தில் சில முறை</label>
</div>
<div class="flex items-center">
<input type="radio" id="sweets-rarely" name="sweets" value="rarely" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="sweets-rarely" class="ml-2 block text-sm text-gray-700" id="rarelySweets">அரிதாக</label>
</div>
</div>
</div>
</div>
<div class="flex justify-between mt-8">
<button type="button" id="prev2" class="px-6 py-2 bg-gray-200 text-gray-700 rounded-lg hover:bg-gray-300 transition flex items-center">
<i class="fas fa-arrow-left mr-2"></i>
<span id="prev2Text">முந்தைய</span>
</button>
<button type="button" id="next2" class="px-6 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition flex items-center">
<span id="next2Text">அடுத்தது</span>
<i class="fas fa-arrow-right ml-2"></i>
</button>
</div>
</div>
<!-- Section 3: Physical Activity -->
<div id="section3" class="form-section">
<h2 class="text-xl font-semibold mb-4 text-gray-800 border-b pb-2" id="section3Title">உடல் செயல்பாடு</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="walkingLabel">நடைப்பயணம்</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="walking-daily" name="walking" value="daily" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="walking-daily" class="ml-2 block text-sm text-gray-700" id="dailyWalking">தினமும் (30 நிமிடங்களுக்கு மேல்)</label>
</div>
<div class="flex items-center">
<input type="radio" id="walking-weekly" name="walking" value="weekly" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="walking-weekly" class="ml-2 block text-sm text-gray-700" id="weeklyWalking">வாரத்தில் சில முறை</label>
</div>
<div class="flex items-center">
<input type="radio" id="walking-rarely" name="walking" value="rarely" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="walking-rarely" class="ml-2 block text-sm text-gray-700" id="rarelyWalking">அரிதாக</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="exerciseLabel">உடற்பயிற்சி / ஜிம்</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="exercise-daily" name="exercise" value="daily" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="exercise-daily" class="ml-2 block text-sm text-gray-700" id="dailyExercise">தினமும்</label>
</div>
<div class="flex items-center">
<input type="radio" id="exercise-weekly" name="exercise" value="weekly" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="exercise-weekly" class="ml-2 block text-sm text-gray-700" id="weeklyExercise">வாரத்தில் 3-4 முறை</label>
</div>
<div class="flex items-center">
<input type="radio" id="exercise-monthly" name="exercise" value="monthly" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="exercise-monthly" class="ml-2 block text-sm text-gray-700" id="monthlyExercise">மாதத்தில் சில முறை</label>
</div>
<div class="flex items-center">
<input type="radio" id="exercise-rarely" name="exercise" value="rarely" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="exercise-rarely" class="ml-2 block text-sm text-gray-700" id="rarelyExercise">அரிதாக</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="familyLabel">குடும்பத்தில் நீரிழிவு வரலாறு</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="family-yes" name="family" value="yes" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="family-yes" class="ml-2 block text-sm text-gray-700" id="yesFamily">உண்டு (பெற்றோர் அல்லது உடன்பிறப்பு)</label>
</div>
<div class="flex items-center">
<input type="radio" id="family-no" name="family" value="no" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="family-no" class="ml-2 block text-sm text-gray-700" id="noFamily">இல்லை</label>
</div>
</div>
</div>
<div>
<label class="block mb-2 text-sm font-medium text-gray-700" id="stressLabel">மன அழுத்த நிலை</label>
<div class="space-y-2">
<div class="flex items-center">
<input type="radio" id="stress-high" name="stress" value="high" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="stress-high" class="ml-2 block text-sm text-gray-700" id="highStress">அதிகம்</label>
</div>
<div class="flex items-center">
<input type="radio" id="stress-moderate" name="stress" value="moderate" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="stress-moderate" class="ml-2 block text-sm text-gray-700" id="moderateStress">மிதமான</label>
</div>
<div class="flex items-center">
<input type="radio" id="stress-low" name="stress" value="low" class="h-4 w-4 text-green-600 focus:ring-green-500">
<label for="stress-low" class="ml-2 block text-sm text-gray-700" id="lowStress">குறைவு</label>
</div>
</div>
</div>
</div>
<div class="flex justify-between mt-8">
<button type="button" id="prev3" class="px-6 py-2 bg-gray-200 text-gray-700 rounded-lg hover:bg-gray-300 transition flex items-center">
<i class="fas fa-arrow-left mr-2"></i>
<span id="prev3Text">முந்தைய</span>
</button>
<button type="submit" id="submitBtn" class="px-6 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition flex items-center">
<span id="submitText">முடிவுகளைப் பெறுங்கள்</span>
<i class="fas fa-chart-line ml-2"></i>
</button>
</div>
</div>
</form>
<!-- Results Section (Initially Hidden) -->
<div id="resultsSection" class="hidden">
<div class="result-card rounded-xl p-6 mb-6 text-white">
<div class="flex items-center mb-4">
<i class="fas fa-chart-pie text-3xl mr-4"></i>
<div>
<h2 id="resultTitle" class="text-2xl font-bold">உங்கள் நீரிழிவு ஆபத்து மதிப்பீடு</h2>
<p id="resultSubtitle" class="text-white text-opacity-80">பின்வரும் முடிவுகள் உங்கள் வழங்கிய தகவல்களின் அடிப்படையில் உள்ளன</p>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
<div class="bg-white bg-opacity-20 rounded-lg p-4">
<div class="text-sm font-medium mb-1" id="riskLabel">ஆபத்து நிலை</div>
<div id="riskLevel" class="text-2xl font-bold">மிதமான</div>
</div>
<div class="bg-white bg-opacity-20 rounded-lg p-4">
<div class="text-sm font-medium mb-1" id="scoreLabel">மதிப்பெண்</div>
<div id="riskScore" class="text-2xl font-bold">45/100</div>
</div>
<div class="bg-white bg-opacity-20 rounded-lg p-4">
<div class="text-sm font-medium mb-1" id="probabilityLabel">நிகழ்தகவு</div>
<div id="riskProbability" class="text-2xl font-bold">25%</div>
</div>
</div>
<div class="mb-6">
<div class="flex justify-between mb-2">
<span id="recommendationTitle" class="font-medium">பரிந்துரைகள்:</span>
</div>
<ul id="recommendations" class="list-disc pl-5 space-y-2">
<li id="rec1">உங்கள் உணவில் இனிப்பு மற்றும் கார்போஹைட்ரேட் உட்கொள்ளலைக் குறைக்கவும்</li>
<li id="rec2">வாரத்தில் குறைந்தது 150 நிமிடங்கள் மிதமான உடற்பயிற்சி செய்யவும்</li>
<li id="rec3">உங்கள் உடல் எடையை கண்காணிக்கவும் மற்றும் பராமரிக்கவும்</li>
</ul>
</div>
<div class="flex justify-between items-center">
<button id="downloadBtn" class="px-4 py-2 bg-white text-green-600 rounded-lg hover:bg-gray-100 transition flex items-center">
<i class="fas fa-download mr-2"></i>
<span id="downloadText">முடிவுகளைப் பதிவிறக்கவும்</span>
</button>
<button id="restartBtn" class="px-4 py-2 bg-white bg-opacity-20 hover:bg-opacity-30 rounded-lg transition flex items-center">
<i class="fas fa-redo mr-2"></i>
<span id="restartText">மீண்டும் தொடங்கவும்</span>
</button>
</div>
</div>
</div>
</div>
<script>
// Language translations
const translations = {
ta: {
appTitle: "நீரிழிவு முன்னறிவிப்பு அமைப்பு",
appSubtitle: "உங்கள் நீரிழிவு ஆபத்து அளவை அறிய பின்வரும் தகவல்களை நிரப்பவும்",
section1Title: "அடிப்படை தகவல்கள்",
nameLabel: "பெயர்",
ageLabel: "வயது",
genderLabel: "பாலினம்",
selectGender: "தேர்ந்தெடுக்கவும்",
maleOption: "ஆண்",
femaleOption: "பெண்",
otherOption: "மற்றவை",
weightLabel: "உடல் எடை (கிலோ)",
heightLabel: "உயரம் (செ.மீ)",
cuisineLabel: "விருப்பமான உணவு வகை",
selectCuisine: "தேர்ந்தெடுக்கவும்",
indianOption: "இந்திய உணவு",
westernOption: "மேற்கத்திய உணவு",
chineseOption: "சீன உணவு",
mixedOption: "கலப்பு உணவு",
next1Text: "அடுத்தது",
section2Title: "உணவு பழக்கவழக்கங்கள்",
breakfastLabel: "காலை உணவு",
heavyBreakfast: "கனமான (இட்லி, தோசை, பூரி)",
lightBreakfast: "இலகுவான (தானியங்கள், பழம்)",
skipBreakfast: "தவிர்க்கிறேன்",
lunchLabel: "மதிய உணவு",
riceLunch: "அரிசி உணவு",
wheatLunch: "கோதுமை உணவு (சப்பாத்தி, ரொட்டி)",
lightLunch: "இலகுவான உணவு",
dinnerLabel: "இரவு உணவு",
heavyDinner: "கனமான உணவு",
lightDinner: "இலகுவான உணவு",
earlyDinner: "ஆரம்பத்தில் (மாலை 7 மணிக்கு முன்)",
fastingLabel: "நோன்பு பழக்கம்",
yesFasting: "உண்டு (வாரத்தில் சில நாட்கள்)",
noFasting: "இல்லை",
snackingLabel: "சிற்றுண்டி பழக்கம்",
oftenSnacking: "அடிக்கடி (நாள்தோறும்)",
sometimesSnacking: "சில நேரங்களில்",
rarelySnacking: "அரிதாக",
sweetsLabel: "இனிப்பு உணவு பழக்கம்",
dailySweets: "தினமும்",
weeklySweets: "வாரத்தில் சில முறை",
rarelySweets: "அரிதாக",
prev2Text: "முந்தைய",
next2Text: "அடுத்தது",
section3Title: "உடல் செயல்பாடு",
walkingLabel: "நடைப்பயணம்",
dailyWalking: "தினமும் (30 நிமிடங்களுக்கு மேல்)",
weeklyWalking: "வாரத்தில் சில முறை",
rarelyWalking: "அரிதாக",
exerciseLabel: "உடற்பயிற்சி / ஜிம்",
dailyExercise: "தினமும்",
weeklyExercise: "வாரத்தில் 3-4 முறை",
monthlyExercise: "மாதத்தில் சில முறை",
rarelyExercise: "அரிதாக",
familyLabel: "குடும்பத்தில் நீரிழிவு வரலாறு",
yesFamily: "உண்டு (பெற்றோர் அல்லது உடன்பிறப்பு)",
noFamily: "இல்லை",
stressLabel: "மன அழுத்த நிலை",
highStress: "அதிகம்",
moderateStress: "மிதமான",
lowStress: "குறைவு",
prev3Text: "முந்தைய",
submitText: "முடிவுகளைப் பெறுங்கள்",
progressText: "1/3 படிகள்",
resultTitle: "உங்கள் நீரிழிவு ஆபத்து மதிப்பீடு",
resultSubtitle: "பின்வரும் முடிவுகள் உங்கள் வழங்கிய தகவல்களின் அடிப்படையில் உள்ளன",
riskLabel: "ஆபத்து நிலை",
scoreLabel: "மதிப்பெண்",
probabilityLabel: "நிகழ்தகவு",
recommendationTitle: "பரிந்துரைகள்:",
rec1: "உங்கள் உணவில் இனிப்பு மற்றும் கார்போஹைட்ரேட் உட்கொள்ளலைக் குறைக்கவும்",
rec2: "வாரத்தில் குறைந்தது 150 நிமிடங்கள் மிதமான உடற்பயிற்சி செய்யவும்",
rec3: "உங்கள் உடல் எடையை கண்காணிக்கவும் மற்றும் பராமரிக்கவும்",
downloadText: "முடிவுகளைப் பதிவிறக்கவும்",
restartText: "மீண்டும் தொடங்கவும்"
},
en: {
appTitle: "Diabetes Prediction System",
appSubtitle: "Fill in the following information to assess your diabetes risk",
section1Title: "Basic Information",
nameLabel: "Name",
ageLabel: "Age",
genderLabel: "Gender",
selectGender: "Select",
maleOption: "Male",
femaleOption: "Female",
otherOption: "Other",
weightLabel: "Weight (kg)",
heightLabel: "Height (cm)",
cuisineLabel: "Preferred Cuisine Type",
selectCuisine: "Select",
indianOption: "Indian Food",
westernOption: "Western Food",
chineseOption: "Chinese Food",
mixedOption: "Mixed Food",
next1Text: "Next",
section2Title: "Dietary Habits",
breakfastLabel: "Breakfast",
heavyBreakfast: "Heavy (Idli, Dosa, Puri)",
lightBreakfast: "Light (Cereals, Fruits)",
skipBreakfast: "Skip Breakfast",
lunchLabel: "Lunch",
riceLunch: "Rice Meal",
wheatLunch: "Wheat Meal (Chapati, Roti)",
lightLunch: "Light Meal",
dinnerLabel: "Dinner",
heavyDinner: "Heavy Meal",
lightDinner: "Light Meal",
earlyDinner: "Early (Before 7 PM)",
fastingLabel: "Fasting Habit",
yesFasting: "Yes (Few days a week)",
noFasting: "No",
snackingLabel: "Snacking Habit",
oftenSnacking: "Often (Daily)",
sometimesSnacking: "Sometimes",
rarelySnacking: "Rarely",
sweetsLabel: "Sweet Consumption",
dailySweets: "Daily",
weeklySweets: "Few times a week",
rarelySweets: "Rarely",
prev2Text: "Previous",
next2Text: "Next",
section3Title: "Physical Activity",
walkingLabel: "Walking",
dailyWalking: "Daily (More than 30 mins)",
weeklyWalking: "Few times a week",
rarelyWalking: "Rarely",
exerciseLabel: "Exercise / Gym",
dailyExercise: "Daily",
weeklyExercise: "3-4 times a week",
monthlyExercise: "Few times a month",
rarelyExercise: "Rarely",
familyLabel: "Family History of Diabetes",
yesFamily: "Yes (Parent or Sibling)",
noFamily: "No",
stressLabel: "Stress Level",
highStress: "High",
moderateStress: "Moderate",
lowStress: "Low",
prev3Text: "Previous",
submitText: "Get Results",
progressText: "1/3 Steps",
resultTitle: "Your Diabetes Risk Assessment",
resultSubtitle: "The following results are based on the information you provided",
riskLabel: "Risk Level",
scoreLabel: "Score",
probabilityLabel: "Probability",
recommendationTitle: "Recommendations:",
rec1: "Reduce sugar and carbohydrate intake in your diet",
rec2: "Do at least 150 minutes of moderate exercise per week",
rec3: "Monitor and maintain your body weight",
downloadText: "Download Results",
restartText: "Start Again"
},
zh: {
appTitle: "糖尿病预测系统",
appSubtitle: "填写以下信息以评估您的糖尿病风险",
section1Title: "基本信息",
nameLabel: "姓名",
ageLabel: "年龄",
genderLabel: "性别",
selectGender: "选择",
maleOption: "男",
femaleOption: "女",
otherOption: "其他",
weightLabel: "体重 (公斤)",
heightLabel: "身高 (厘米)",
cuisineLabel: "偏好的饮食类型",
selectCuisine: "选择",
indianOption: "印度菜",
westernOption: "西餐",
chineseOption: "中餐",
mixedOption: "混合餐",
next1Text: "下一步",
section2Title: "饮食习惯",
breakfastLabel: "早餐",
heavyBreakfast: "丰盛 (印度薄饼, 多萨饼, 普里)",
lightBreakfast: "清淡 (谷物, 水果)",
skipBreakfast: "不吃早餐",
lunchLabel: "午餐",
riceLunch: "米饭餐",
wheatLunch: "面食 (印度烤饼, 罗提)",
lightLunch: "清淡餐",
dinnerLabel: "晚餐",
heavyDinner: "丰盛餐",
lightDinner: "清淡餐",
earlyDinner: "早吃 (晚上7点前)",
fastingLabel: "禁食习惯",
yesFasting: "有 (每周几天)",
noFasting: "没有",
snackingLabel: "零食习惯",
oftenSnacking: "经常 (每天)",
sometimesSnacking: "有时",
rarelySnacking: "很少",
sweetsLabel: "甜食消费",
dailySweets: "每天",
weeklySweets: "每周几次",
rarelySweets: "很少",
prev2Text: "上一步",
next2Text: "下一步",
section3Title: "身体活动",
walkingLabel: "步行",
dailyWalking: "每天 (超过30分钟)",
weeklyWalking: "每周几次",
rarelyWalking: "很少",
exerciseLabel: "锻炼 / 健身房",
dailyExercise: "每天",
weeklyExercise: "每周3-4次",
monthlyExercise: "每月几次",
rarelyExercise: "很少",
familyLabel: "糖尿病家族史",
yesFamily: "有 (父母或兄弟姐妹)",
noFamily: "没有",
stressLabel: "压力水平",
highStress: "高",
moderateStress: "中等",
lowStress: "低",
prev3Text: "上一步",
submitText: "获取结果",
progressText: "1/3 步骤",
resultTitle: "您的糖尿病风险评估",
resultSubtitle: "以下结果基于您提供的信息",
riskLabel: "风险等级",
scoreLabel: "分数",
probabilityLabel: "概率",
recommendationTitle: "建议:",
rec1: "减少饮食中的糖和碳水化合物摄入",
rec2: "每周至少进行150分钟中等强度锻炼",
rec3: "监测并保持您的体重",
downloadText: "下载结果",
restartText: "重新开始"
},
ar: {
appTitle: "نظام التنبؤ بمرض السكري",
appSubtitle: "املأ المعلومات التالية لتقييم خطر الإصابة بمرض السكري",
section1Title: "المعلومات الأساسية",
nameLabel: "الاسم",
ageLabel: "العمر",
genderLabel: "الجنس",
selectGender: "اختر",
maleOption: "ذكر",
femaleOption: "أنثى",
otherOption: "آخر",
weightLabel: "الوزن (كجم)",
heightLabel: "الطول (سم)",
cuisineLabel: "نوع المطبخ المفضل",
selectCuisine: "اختر",
indianOption: "طعام هندي",
westernOption: "طعام غربي",
chineseOption: "طعام صيني",
mixedOption: "طعام مختلط",
next1Text: "التالي",
section2Title: "العادات الغذائية",
breakfastLabel: "الإفطار",
heavyBreakfast: "ثقيل (إدلي، دوسا، بوري)",
lightBreakfast: "خفيف (حبوب، فواكه)",
skipBreakfast: "تخطي الإفطار",
lunchLabel: "الغداء",
riceLunch: "وجبة أرز",
wheatLunch: "وجبة قمح (تشاباتي، روتي)",
lightLunch: "وجبة خفيفة",
dinnerLabel: "العشاء",
heavyDinner: "وجبة ثقيلة",
lightDinner: "وجبة خفيفة",
earlyDinner: "مبكر (قبل الساعة 7 مساءً)",
fastingLabel: "عادة الصيام",
yesFasting: "نعم (بضعة أيام في الأسبوع)",
noFasting: "لا",
snackingLabel: "عادة تناول الوجبات الخفيفة",
oftenSnacking: "غالبًا (يوميًا)",
sometimesSnacking: "أحيانًا",
rarelySnacking: "نادرًا",
sweetsLabel: "استهلاك الحلويات",
dailySweets: "يوميًا",
weeklySweets: "بضعة مرات في الأسبوع",
rarelySweets: "نادرًا",
prev2Text: "السابق",
next2Text: "التالي",
section3Title: "النشاط البدني",
walkingLabel: "المشي",
dailyWalking: "يوميًا (أكثر من 30 دقيقة)",
weeklyWalking: "بضعة مرات في الأسبوع",
rarelyWalking: "نادرًا",
exerciseLabel: "التمرين / الجيم",
dailyExercise: "يوميًا",
weeklyExercise: "3-4 مرات في الأسبوع",
monthlyExercise: "بضعة مرات في الشهر",
rarelyExercise: "نادرًا",
familyLabel: "تاريخ عائلي لمرض السكري",
yesFamily: "نعم (أحد الوالدين أو الأشقاء)",
noFamily: "لا",
stressLabel: "مستوى التوتر",
highStress: "مرتفع",
moderateStress: "متوسط",
lowStress: "منخفض",
prev3Text: "السابق",
submitText: "الحصول على النتائج",
progressText: "1/3 خطوات",
resultTitle: "تقييم خطر الإصابة بمرض السكري",
resultSubtitle: "النتائج التالية تستند إلى المعلومات التي قدمتها",
riskLabel: "مستوى الخطر",
scoreLabel: "النتيجة",
probabilityLabel: "الاحتمالية",
recommendationTitle: "التوصيات:",
rec1: "قلل من تناول السكر والكربوهيدرات في نظامك الغذائي",
rec2: "مارس التمارين المعتدلة لمدة 150 دقيقة على الأقل أسبوعيًا",
rec3: "راقب وزنك وحافظ عليه",
downloadText: "تنزيل النتائج",
restartText: "ابدأ من جديد"
},
hi: {
appTitle: "मधुमेह भविष्यवाणी प्रणाली",
appSubtitle: "अपने मधुमेह जोखिम का आकलन करने के लिए निम्नलिखित जानकारी भरें",
section1Title: "मूल जानकारी",
nameLabel: "नाम",
ageLabel: "आयु",
genderLabel: "लिंग",
selectGender: "चुनें",
maleOption: "पुरुष",
femaleOption: "महिला",
otherOption: "अन्य",
weightLabel: "वजन (किलो)",
heightLabel: "ऊंचाई (सेमी)",
cuisineLabel: "पसंदीदा भोजन प्रकार",
selectCuisine: "चुनें",
indianOption: "भारतीय भोजन",
westernOption: "पश्चिमी भोजन",
chineseOption: "चीनी भोजन",
mixedOption: "मिश्रित भोजन",
next1Text: "अगला",
section2Title: "आहार संबंधी आदतें",
breakfastLabel: "नाश्ता",
heavyBreakfast: "भारी (इडली, डोसा, पूरी)",
lightBreakfast: "हल्का (अनाज, फल)",
skipBreakfast: "नाश्ता छोड़ें",
lunchLabel: "दोपहर का भोजन",
riceLunch: "चावल का भोजन",
wheatLunch: "गेहूं का भोजन (चपाती, रोटी)",
lightLunch: "हल्का भोजन",
dinnerLabel: "रात का खाना",
heavyDinner: "भारी भोजन",
lightDinner: "हल्का भोजन",
earlyDinner: "जल्दी (शाम 7 बजे से पहले)",
fastingLabel: "उपवास की आदत",
yesFasting: "हाँ (सप्ताह में कुछ दिन)",
noFasting: "नहीं",
snackingLabel: "स्नैकिंग की आदत",
oftenSnacking: "अक्सर (रोज)",
sometimesSnacking: "कभी-कभी",
rarelySnacking: "शायद ही कभी",
sweetsLabel: "मिठाई की खपत",
dailySweets: "रोज",
weeklySweets: "सप्ताह में कुछ बार",
rarelySweets: "शायद ही कभी",
prev2Text: "पिछला",
next2Text: "अगला",
section3Title: "शारीरिक गतिविधि",
walkingLabel: "चलना",
dailyWalking: "रोज (30 मिनट से अधिक)",
weeklyWalking: "सप्ताह में कुछ बार",
rarelyWalking: "शायद ही कभी",
exerciseLabel: "व्यायाम / जिम",
dailyExercise: "रोज",
weeklyExercise: "सप्ताह में 3-4 बार",
monthlyExercise: "महीने में कुछ बार",
rarelyExercise: "शायद ही कभी",
familyLabel: "मधुमेह का पारिवारिक इतिहास",
yesFamily: "हाँ (माता-पिता या भाई-बहन)",
noFamily: "नहीं",
stressLabel: "तनाव का स्तर",
highStress: "उच्च",
moderateStress: "मध्यम",
lowStress: "कम",
prev3Text: "पिछला",
submitText: "परिणाम प्राप्त करें",
progressText: "1/3 चरण",
resultTitle: "आपका मधुमेह जोखिम मूल्यांकन",
resultSubtitle: "निम्नलिखित परिणाम आपके द्वारा प्रदान की गई जानकारी पर आधारित हैं",
riskLabel: "जोखिम स्तर",
scoreLabel: "स्कोर",
probabilityLabel: "संभावना",
recommendationTitle: "सिफारिशें:",
rec1: "अपने आहार में चीनी और कार्बोहाइड्रेट का सेवन कम करें",
rec2: "प्रति सप्ताह कम से कम 150 मिनट मध्यम व्यायाम करें",
rec3: "अपने शरीर के वजन की निगरानी और रखरखाव करें",
downloadText: "परिणाम डाउनलोड करें",
restartText: "फिर से शुरू करें"
},
sv: {
appTitle: "Diabetes Prediktionssystem",
appSubtitle: "Fyll i följande information för att bedöma din risk för diabetes",
section1Title: "Grundläggande information",
nameLabel: "Namn",
ageLabel: "Ålder",
genderLabel: "Kön",
selectGender: "Välj",
maleOption: "Man",
femaleOption: "Kvinna",
otherOption: "Annat",
weightLabel: "Vikt (kg)",
heightLabel: "Längd (cm)",
cuisineLabel: "Föredragen mattyp",
selectCuisine: "Välj",
indianOption: "Indisk mat",
westernOption: "Västerländsk mat",
chineseOption: "Kinesisk mat",
mixedOption: "Blandad mat",
next1Text: "Nästa",
section2Title: "Matvanor",
breakfastLabel: "Frukost",
heavyBreakfast: "Tung (Idli, Dosa, Puri)",
lightBreakfast: "Lätt (Flingor, Frukt)",
skipBreakfast: "Hoppa över frukost",
lunchLabel: "Lunch",
riceLunch: "Rismåltid",
wheatLunch: "Vetemåltid (Chapati, Roti)",
lightLunch: "Lätt måltid",
dinnerLabel: "Middag",
heavyDinner: "Tung måltid",
lightDinner: "Lätt måltid",
earlyDinner: "Tidig (före kl. 19)",
fastingLabel: "Fastvanor",
yesFasting: "Ja (några dagar i veckan)",
noFasting: "Nej",
snackingLabel: "Mellanmål vanor",
oftenSnacking: "Ofta (Dagligen)",
sometimesSnacking: "Ibland",
rarelySnacking: "Sällan",
sweetsLabel: "Sötsaker konsumtion",
dailySweets: "Dagligen",
weeklySweets: "Några gånger i veckan",
rarelySweets: "Sällan",
prev2Text: "Föregående",
next2Text: "Nästa",
section3Title: "Fysisk aktivitet",
walkingLabel: "Promenad",
dailyWalking: "Dagligen (Mer än 30 min)",
weeklyWalking: "Några gånger i veckan",
rarelyWalking: "Sällan",
exerciseLabel: "Träning / Gym",
dailyExercise: "Dagligen",
weeklyExercise: "3-4 gånger i veckan",
monthlyExercise: "Några gånger i månaden",
rarelyExercise: "Sällan",
familyLabel: "Familjehistoria av diabetes",
yesFamily: "Ja (Förälder eller syskon)",
noFamily: "Nej",
stressLabel: "Stressnivå",
highStress: "Hög",
moderateStress: "Måttlig",
lowStress: "Låg",
prev3Text: "Föregående",
submitText: "Få resultat",
progressText: "1/3 Steg",
resultTitle: "Din diabetesriskbedömning",
resultSubtitle: "Följande resultat baseras på informationen du har angett",
riskLabel: "Risknivå",
scoreLabel: "Poäng",
probabilityLabel: "Sannolikhet",
recommendationTitle: "Rekommendationer:",
rec1: "Minska intaget av socker och kolhydrater i din kost",
rec2: "Gör minst 150 minuter måttlig träning per vecka",
rec3: "Övervaka och upprätthåll din kroppsvikt",
downloadText: "Ladda ner resultat",
restartText: "Börja om"
}
};
// Current language
let currentLang = 'ta';
// Form navigation
let currentSection = 1;
const totalSections = 3;
// DOM elements
const languageBtn = document.getElementById('languageBtn');
const languageDropdown = document.getElementById('languageDropdown');
const currentLanguage = document.getElementById('currentLanguage');
const languageOptions = document.querySelectorAll('.language-option');
const progressText = document.getElementById('progressText');
const progressPercent = document.getElementById('progressPercent');
const progressBar = document.getElementById('progressBar');
const formSections = document.querySelectorAll('.form-section');
const next1Btn = document.getElementById('next1');
const next2Btn = document.getElementById('next2');
const prev2Btn = document.getElementById('prev2');
const prev3Btn = document.getElementById('prev3');
const submitBtn = document.getElementById('submitBtn');
const diabetesForm = document.getElementById('diabetesForm');
const resultsSection = document.getElementById('resultsSection');
const restartBtn = document.getElementById('restartBtn');
const downloadBtn = document.getElementById('downloadBtn');
// Event listeners
languageBtn.addEventListener('click', toggleLanguageDropdown);
languageOptions.forEach(option => option.addEventListener('click', changeLanguage));
next1Btn.addEventListener('click', () => navigateToSection(2));
next2Btn.addEventListener('click', () => navigateToSection(3));
prev2Btn.addEventListener('click', () => navigateToSection(1));
prev3Btn.addEventListener('click', () => navigateToSection(2));
diabetesForm.addEventListener('submit', handleFormSubmit);
restartBtn.addEventListener('click', restartForm);
downloadBtn.addEventListener('click', downloadResults);
// Functions
function toggleLanguageDropdown() {
languageDropdown.classList.toggle('hidden');
}
function changeLanguage(e) {
e.preventDefault();
const lang = this.getAttribute('data-lang');
currentLang = lang;
currentLanguage.textContent = this.textContent.trim();
currentLanguage.setAttribute('data-lang', lang);
languageDropdown.classList.add('hidden');
updateTranslations();
}
function updateTranslations() {
const translation = translations[currentLang];
// Update all elements with translations
document.getElementById('appTitle').textContent = translation.appTitle;
document.getElementById('appSubtitle').textContent = translation.appSubtitle;
document.getElementById('section1Title').textContent = translation.section1Title;
document.getElementById('nameLabel').textContent = translation.nameLabel;
document.getElementById('ageLabel').textContent = translation.ageLabel;
document.getElementById('genderLabel').textContent = translation.genderLabel;
document.getElementById('selectGender').textContent = translation.selectGender;
document.getElementById('maleOption').textContent = translation.maleOption;
document.getElementById('femaleOption').textContent = translation.femaleOption;
document.getElementById('otherOption').textContent = translation.otherOption;
document.getElementById('weightLabel').textContent = translation.weightLabel;
document.getElementById('heightLabel').textContent = translation.heightLabel;
document.getElementById('cuisineLabel').textContent = translation.cuisineLabel;
document.getElementById('selectCuisine').textContent = translation.selectCuisine;
document.getElementById('indianOption').textContent = translation.indianOption;
document.getElementById('westernOption').textContent = translation.westernOption;
document.getElementById('chineseOption').textContent = translation.chineseOption;
document.getElementById('mixedOption').textContent = translation.mixedOption;
document.getElementById('next1Text').textContent = translation.next1Text;
document.getElementById('section2Title').textContent = translation.section2Title;
document.getElementById('breakfastLabel').textContent = translation.breakfastLabel;
document.getElementById('heavyBreakfast').textContent = translation.heavyBreakfast;
document.getElementById('lightBreakfast').textContent = translation.lightBreakfast;
document.getElementById('skipBreakfast').textContent = translation.skipBreakfast;
document.getElementById('lunchLabel').textContent = translation.lunchLabel;
document.getElementById('riceLunch').textContent = translation.riceLunch;
document.getElementById('wheatLunch').textContent = translation.wheatLunch;
document.getElementById('lightLunch').textContent = translation.lightLunch;
document.getElementById('dinnerLabel').textContent = translation.dinnerLabel;
document.getElementById('heavyDinner').textContent = translation.heavyDinner;
document.getElementById('lightDinner').textContent = translation.lightDinner;
document.getElementById('earlyDinner').textContent = translation.earlyDinner;
document.getElementById('fastingLabel').textContent = translation.fastingLabel;
document.getElementById('yesFasting').textContent = translation.yesFasting;
document.getElementById('noFasting').textContent = translation.noFasting;
document.getElementById('snackingLabel').textContent = translation.snackingLabel;
document.getElementById('oftenSnacking').textContent = translation.oftenSnacking;
document.getElementById('sometimesSnacking').textContent = translation.sometimesSnacking;
document.getElementById('rarelySnacking').textContent = translation.rarelySnacking;
document.getElementById('sweetsLabel').textContent = translation.sweetsLabel;
document.getElementById('dailySweets').textContent = translation.dailySweets;
document.getElementById('weeklySweets').textContent = translation.weeklySweets;
document.getElementById('rarelySweets').textContent = translation.rarelySweets;
document.getElementById('prev2Text').textContent = translation.prev2Text;
document.getElementById('next2Text').textContent = translation.next2Text;
document.getElementById('section3Title').textContent = translation.section3Title;
document.getElementById('walkingLabel').textContent = translation.walkingLabel;
document.getElementById('dailyWalking').textContent = translation.dailyWalking;
document.getElementById('weeklyWalking').textContent = translation.weeklyWalking;
document.getElementById('rarelyWalking').textContent = translation.rarelyWalking;
document.getElementById('exerciseLabel').textContent = translation.exerciseLabel;
document.getElementById('dailyExercise').textContent = translation.dailyExercise;
document.getElementById('weeklyExercise').textContent = translation.weeklyExercise;
document.getElementById('monthlyExercise').textContent = translation.monthlyExercise;
document.getElementById('rarelyExercise').textContent = translation.rarelyExercise;
document.getElementById('familyLabel').textContent = translation.familyLabel;
document.getElementById('yesFamily').textContent = translation.yesFamily;
document.getElementById('noFamily').textContent = translation.noFamily;
document.getElementById('stressLabel').textContent = translation.stressLabel;
document.getElementById('highStress').textContent = translation.highStress;
document.getElementById('moderateStress').textContent = translation.moderateStress;
document.getElementById('lowStress').textContent = translation.lowStress;
document.getElementById('prev3Text').textContent = translation.prev3Text;
document.getElementById('submitText').textContent = translation.submitText;
document.getElementById('progressText').textContent = `${currentSection}/${totalSections} ${currentLang === 'en' ? 'Steps' : currentLang === 'zh' ? '步骤' : currentLang === 'ar' ? 'خطوات' : currentLang === 'hi' ? 'चरण' : currentLang === 'sv' ? 'Steg' : 'படிகள்'}`;
document.getElementById('resultTitle').textContent = translation.resultTitle;
document.getElementById('resultSubtitle').textContent = translation.resultSubtitle;
document.getElementById('riskLabel').textContent = translation.riskLabel;
document.getElementById('scoreLabel').textContent = translation.scoreLabel;
document.getElementById('probabilityLabel').textContent = translation.probabilityLabel;
document.getElementById('recommendationTitle').textContent = translation.recommendationTitle;
document.getElementById('rec1').textContent = translation.rec1;
document.getElementById('rec2').textContent = translation.rec2;
document.getElementById('rec3').textContent = translation.rec3;
document.getElementById('downloadText').textContent = translation.downloadText;
document.getElementById('restartText').textContent = translation.restartText;
}
function navigateToSection(sectionNum) {
// Hide current section
document.getElementById(`section${currentSection}`).classList.remove('active');
// Update current section
currentSection = sectionNum;
// Show new section
document.getElementById(`section${currentSection}`).classList.add('active');
// Update progress
updateProgress();
}
function updateProgress() {
const progressPercentage = Math.round((currentSection / totalSections) * 100);
progressBar.style.width = `${progressPercentage}%`;
progressPercent.textContent = `${progressPercentage}%`;
const translation = translations[currentLang];
progressText.textContent = `${currentSection}/${totalSections} ${currentLang === 'en' ? 'Steps' : currentLang === 'zh' ? '步骤' : currentLang === 'ar' ? 'خطوات' : currentLang === 'hi' ? 'चरण' : currentLang === 'sv' ? 'Steg' : 'படிகள்'}`;
}
function handleFormSubmit(e) {
e.preventDefault();
// Calculate risk score (simplified example)
const age = parseInt(document.getElementById('age').value) || 0;
const weight = parseInt(document.getElementById('weight').value) || 0;
const height = parseInt(document.getElementById('height').value) || 1;
const bmi = weight / Math.pow(height / 100, 2);
let score = 0;
// Age factor
if (age > 50) score += 20;
else if (age > 40) score += 15;
else if (age > 30) score += 10;
else score += 5;
// BMI factor
if (bmi > 30) score += 25;
else if (bmi > 25) score += 15;
else if (bmi > 18.5) score += 5;
// Family history
if (document.querySelector('input[name="family"]:checked')?.value === 'yes') score += 15;
// Exercise
const exercise = document.querySelector('input[name="exercise"]:checked')?.value;
if (exercise === 'rarely') score += 15;
else if (exercise === 'monthly') score += 10;
else if (exercise === 'weekly') score += 5;
// Walking
const walking = document.querySelector('input[name="walking"]:checked')?.value;
if (walking === 'rarely') score += 10;
else if (walking === 'weekly') score += 5;
// Diet factors
const sweets = document.querySelector('input[name="sweets"]:checked')?.value;
if (sweets === 'daily') score += 15;
else if (sweets === 'weekly') score += 10;
const fasting = document.querySelector('input[name="fasting"]:checked')?.value;
if (fasting === 'yes') score -= 5;
// Stress
const stress = document.querySelector('input[name="stress"]:checked')?.value;
if (stress === 'high') score += 10;
else if (stress === 'moderate') score += 5;
// Cap score at 100
score = Math.min(score, 100);
// Determine risk level
let riskLevel, riskProbability;
if (score > 70) {
riskLevel = currentLang === 'en' ? 'High' :
currentLang === 'zh' ? '高' :
currentLang === 'ar' ? 'عالي' :
currentLang === 'hi' ? 'उच्च' :
currentLang === 'sv' ? 'Hög' : 'அதிகம்';
riskProbability = '70%';
} else if (score > 40) {
riskLevel = currentLang === 'en' ? 'Moderate' :
currentLang === 'zh' ? '中等' :
currentLang === 'ar' ? 'متوسط' :
currentLang === 'hi' ? 'मध्यम' :
currentLang === 'sv' ? 'Måttlig' : 'மிதமான';
riskProbability = '40%';
} else {
riskLevel = currentLang === 'en' ? 'Low' :
currentLang === 'zh' ? '低' :
currentLang === 'ar' ? 'منخفض' :
currentLang === 'hi' ? 'कम' :
currentLang === 'sv' ? 'Låg' : 'குறைவு';
riskProbability = '15%';
}
// Update results
document.getElementById('riskLevel').textContent = riskLevel;
document.getElementById('riskScore').textContent = `${score}/100`;
document.getElementById('riskProbability').textContent = riskProbability;
// Show results
diabetesForm.classList.add('hidden');
resultsSection.classList.remove('hidden');
}
function restartForm() {
// Reset form
diabetesForm.reset();
// Reset navigation
currentSection = 1;
formSections.forEach((section, index) => {
if (index === 0) {
section.classList.add('active');
} else {
section.classList.remove('active');
}
});
// Update progress
updateProgress();
// Show form and hide results
diabetesForm.classList.remove('hidden');
resultsSection.classList.add('hidden');
}
function downloadResults() {
// In a real app, this would generate a PDF or CSV
alert(currentLang === 'en' ? 'Results downloaded (simulated)' :
currentLang === 'zh' ? '结果已下载（模拟）' :
currentLang === 'ar' ? 'تم تنزيل النتائج (محاكاة)' :
currentLang === 'hi' ? 'परिणाम डाउनलोड किए गए (सिम्युलेटेड)' :
currentLang === 'sv' ? 'Resultat nedladdade (simulerad)' :
'முடிவுகள் பதிவிறக்கப்பட்டன (சிமுலேடட்)');
}
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=senthazalravi/diabcarenew" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>