İndex.html

Pasted Oct 4, 2026, 6:35 AM1 file374 linesexpires in 363 days

Scan to open on your phone

Point a camera at the QR code - it opens this exact paste, no app needed.

https://codepastes.com/zzgt4946v7a3102a
İndex.html
<!DOCTYPE html>
<html lang="az">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
<title>BalHesabla — DİM balını dəqiq hesabla</title>
<link href="https://fonts.googleapis.com/css2?family=Unbounded:wght@500;700&family=Manrope:wght@400;600;800&display=swap" rel="stylesheet">
<style>
:root{--bg:#0D1117;--bg2:#161B22;--cy:#58A6FF;--pu:#8B949E;--tx:#E6EDF3;--mu:#8B949E;--gl:rgba(255,255,255,.05);--bd:rgba(255,255,255,.12);--chrome:linear-gradient(135deg,#f0f6fc 0%,#8B949E 38%,#c9d1d9 56%,#6e7681 100%)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:linear-gradient(160deg,var(--bg),var(--bg2) 60%,var(--bg)) fixed;color:var(--tx);font:400 16px/1.6 Manrope,system-ui,sans-serif;min-height:100vh;overflow-x:hidden}
body::before,body::after{content:"";position:fixed;width:540px;height:540px;border-radius:50%;filter:blur(40px);z-index:-1;pointer-events:none;animation:drift 24s ease-in-out infinite alternate}
body::before{left:-160px;top:8%;background:radial-gradient(circle,rgba(88,166,255,.24),transparent 66%)}
body::after{right:-180px;bottom:-60px;background:radial-gradient(circle,rgba(139,148,158,.22),transparent 66%);animation-direction:alternate-reverse}
@keyframes drift{to{transform:translate(110px,70px) scale(1.18)}}
h1,h2,h3{font-family:Unbounded,Manrope,sans-serif;line-height:1.2}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--cy);outline-offset:2px}
.glass,header{background:rgba(255,255,255,.05);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 32px 0 rgba(0,0,0,.37),inset 0 1px 0 rgba(255,255,255,.14)}
.glass{position:relative;overflow:hidden;border-radius:20px;transition:border-color .4s,box-shadow .4s,transform .4s}
.glass::before,.glass::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .45s}
.glass::before{background:radial-gradient(190px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.17),transparent 70%)}
.glass::after{background-image:radial-gradient(1.5px 1.5px at 12% 28%,#fff,transparent),radial-gradient(1px 1px at 38% 72%,#cfe6ff,transparent),radial-gradient(1.5px 1.5px at 64% 18%,#fff,transparent),radial-gradient(1px 1px at 82% 58%,#cfe6ff,transparent),radial-gradient(1.5px 1.5px at 92% 88%,#fff,transparent),radial-gradient(1px 1px at 22% 90%,#fff,transparent),radial-gradient(1px 1px at 52% 40%,#fff,transparent)}
.glass:hover{border-color:rgba(88,166,255,.45);box-shadow:0 8px 32px rgba(0,0,0,.37),0 0 30px rgba(88,166,255,.14),inset 0 1px 0 rgba(255,255,255,.2)}
.glass:hover::before{opacity:1}
.glass:hover::after{opacity:1;animation:twinkle 1.7s ease-in-out infinite}
@keyframes twinkle{50%{opacity:.2}}
header{position:sticky;top:0;z-index:10;border-width:0 0 1px;border-radius:0;padding-top:env(safe-area-inset-top,0)}
.bar{max-width:1100px;margin:auto;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{font:700 1.15rem Unbounded;text-decoration:none;color:var(--tx)}
.logo b{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 10px rgba(88,166,255,.5))}
nav{display:flex;gap:4px}
nav a{padding:8px 14px;border-radius:12px;color:var(--mu);text-decoration:none;font-weight:600;font-size:.92rem;transition:.3s;border:1px solid transparent}
nav a:hover{color:var(--tx);background:rgba(255,255,255,.06)}
nav a.on{color:var(--tx);background:rgba(88,166,255,.14);border-color:rgba(88,166,255,.45);box-shadow:0 0 18px rgba(88,166,255,.22),inset 0 1px 0 rgba(255,255,255,.2)}
#burger{display:none;background:rgba(255,255,255,.06);border:1px solid var(--bd);border-radius:12px;padding:8px 12px;cursor:pointer}
main{max-width:1100px;margin:auto;padding:28px 18px 60px}
.page{display:none}.page.show{display:block;animation:in .45s ease}
@keyframes in{from{opacity:0;transform:translateY(12px);filter:blur(6px)}to{opacity:1;filter:none}}
.btn{position:relative;overflow:hidden;border:0;cursor:pointer;padding:14px 26px;border-radius:14px;font-weight:800;text-decoration:none;display:inline-block;transition:.35s}
.btn.p{background:var(--chrome);color:#0D1117;box-shadow:0 0 26px rgba(88,166,255,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.btn.p::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-20deg);transition:left .7s}
.btn.p:hover{transform:translateY(-2px);box-shadow:0 0 40px rgba(88,166,255,.55),inset 0 1px 0 #fff}
.btn.p:hover::after{left:130%}
.btn.s{background:rgba(255,255,255,.05);color:var(--cy);border:1px solid rgba(88,166,255,.5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn.s:hover{background:rgba(88,166,255,.14);box-shadow:0 0 22px rgba(88,166,255,.3)}
.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:28px;align-items:center;padding:30px 0}
.hero h1{font-size:clamp(1.8rem,4.6vw,3.1rem)}
.hero h1 span{background:linear-gradient(90deg,#f0f6fc,#58A6FF 55%,#8B949E);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--mu);margin:16px 0 26px;max-width:46ch}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.orb{padding:30px;text-align:center}
.orb .n{font:700 4.2rem Unbounded;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(88,166,255,.5))}
.orb small{color:var(--mu)}
.meter{height:10px;border-radius:9px;background:rgba(255,255,255,.08);margin-top:14px;overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,.4)}
.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,#58A6FF,#c9d1d9);box-shadow:0 0 14px rgba(88,166,255,.8);transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
h2{font-size:clamp(1.4rem,3vw,2rem);margin-bottom:8px}
h4{margin-bottom:6px}
.sub{color:var(--mu);margin-bottom:22px}
.tip{padding:22px}.tip h3{font-size:1rem;margin-bottom:8px;color:var(--cy)}.tip p{color:var(--mu);font-size:.93rem}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.chip{background:rgba(255,255,255,.05);border:1px solid var(--bd);border-radius:14px;padding:10px 18px;cursor:pointer;font-weight:800;transition:.3s;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.chip:hover{border-color:var(--cy);box-shadow:0 0 16px rgba(88,166,255,.25)}
.chip.on{background:linear-gradient(135deg,#a5d0ff,#58A6FF 50%,#8B949E);color:#0D1117;border-color:transparent;box-shadow:0 0 22px rgba(88,166,255,.45),inset 0 1px 0 rgba(255,255,255,.6)}
.chip.sm{font-weight:600;font-size:.88rem;padding:8px 14px}
.calc{display:grid;grid-template-columns:1.15fr 1fr;gap:20px;align-items:start}
.panel{padding:22px}
.blk{margin-top:22px;padding-top:6px;border-top:1px solid var(--bd)}
input[type=number],input[type=search],select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--bd);background:rgba(13,17,23,.5);box-shadow:inset 0 1px 3px rgba(0,0,0,.35);transition:.3s}
input:focus,select:focus{border-color:var(--cy);box-shadow:0 0 0 3px rgba(88,166,255,.18);outline:0}
.subj{margin-top:12px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.two small,label small{color:var(--mu)}
.big{width:100%;margin-top:22px;font-size:1.15rem;padding:18px;animation:glow 3s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 46px rgba(88,166,255,.6),inset 0 1px 0 #fff}}
.res{text-align:center}
.res .tot{font:700 3.6rem Unbounded;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 16px rgba(88,166,255,.5));margin:4px 0 10px}
.res .row{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--bd);color:var(--mu);font-size:.93rem;text-align:left}
.res .row b{color:var(--tx);white-space:nowrap}
.res .dir{padding:14px 0 6px}
.res .dir>h4{color:var(--cy);text-align:left;margin-top:10px}
.warn{color:#ff7b72;font-size:.9rem;margin-top:10px}
.uni{padding:18px;display:flex;flex-direction:column;gap:8px}
.uni:hover{transform:translateY(-3px)}
.uni h3{font-size:.95rem}
.tag{display:inline-block;font-size:.74rem;padding:2px 10px;border-radius:20px;border:1px solid var(--bd);color:var(--mu);margin:0 4px 4px 0;background:rgba(255,255,255,.03)}
.tag.D{color:#79c0ff;border-color:rgba(88,166,255,.45)}.tag.O{color:#e6edf3;border-color:rgba(201,209,217,.4)}.tag.A{color:#e3b341;border-color:rgba(227,179,65,.4)}
.tag.hi{color:#56d364;border-color:rgba(86,211,100,.4)}.tag.mid{color:#e3b341;border-color:rgba(227,179,65,.4)}
.sc{font:700 1.05rem Unbounded;color:var(--cy)}
.filters{display:grid;grid-template-columns:2fr 1fr;gap:12px;padding:16px;margin-bottom:14px}
.sp{padding:16px 18px}.sp .top{display:flex;justify-content:space-between;gap:10px;font-weight:600}
.sp .meter{margin-top:10px;height:7px}
.note{color:var(--mu);font-size:.84rem;margin-top:22px}
code{color:var(--cy)}
footer{text-align:center;color:var(--mu);font-size:.82rem;padding:24px 18px calc(24px + env(safe-area-inset-bottom,0));border-top:1px solid var(--bd)}
@media(max-width:820px){
 #burger{display:block}
 nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;padding:10px 18px 16px;background:rgba(13,17,23,.78);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid var(--bd)}
 nav.open{display:flex}
 .hero,.calc{grid-template-columns:1fr}
 .filters{grid-template-columns:1fr}
 body::before,body::after{width:360px;height:360px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
</style>
</head>
<body>
<header><div class="bar">
 <a class="logo" href="#home">Bal<b>Hesabla</b></a>
 <button id="burger" aria-label="Menyu">☰</button>
 <nav id="nav">
  <a href="#home" data-p="home">Ana Səhifə</a>
  <a href="#calc" data-p="calc">Bal Hesabla</a>
  <a href="#unis" data-p="unis">Universitetlər &amp; Akademiyalar</a>
  <a href="#specs" data-p="specs">İxtisaslar</a>
 </nav>
</div></header>

<main>
<section class="page" id="home">
 <div class="hero">
  <div>
   <h1>DİM Balını <span>Dəqiq Hesabla!</span></h1>
   <p>Buraxılış və blok imtahanının düz-səhv saylarını yaz, 700 üzərindən yekun balını gör və ona uyğun universitet, ixtisas tövsiyələrini al.</p>
   <div class="cta"><a class="btn p" href="#calc">Sürətli Başla</a><a class="btn s" href="#unis">Universitetləri İncələ</a></div>
  </div>
  <div class="glass orb"><div class="n" id="orbN">0</div><small>maksimum yekun bal</small><div class="meter"><i id="orbM"></i></div></div>
 </div>
 <h2>Abituriyentlər üçün bildirişlər</h2>
 <p class="sub">İmtahandan əvvəl nəzərə al.</p>
 <div class="grid">
  <div class="glass tip"><h3>Hesablama düsturu</h3><p>Hər fənn üzrə Net = Düz − (Səhv × 0.25). Buraxılış 300, blok 400, yekun 700 baldır.</p></div>
  <div class="glass tip"><h3>I qrupda iki altqrup</h3><p>Fizika-Kimya və Fizika-İnformatika. İkisinə də girirsənsə, hər istiqamət ayrıca hesablanır.</p></div>
  <div class="glass tip"><h3>Nəticə təxminidir</h3><p>DİM sualların çətinliyinə görə fərdi çəkilər tətbiq edir. Bu hesablayıcı sadələşdirilmiş əmsallarla işləyir, rəsmi nəticə fərqli çıxa bilər.</p></div>
  <div class="glass tip"><h3>Rəsmi mənbəni yoxla</h3><p>Keçid balları hər il dəyişir. Son rəqəmlər üçün DİM-in rəsmi səhifəsinə bax.</p></div>
 </div>
</section>

<section class="page" id="calc">
 <h2>Bal Hesablayıcı</h2>
 <p class="sub">Qrupunu seç, düz və səhv saylarını daxil et.</p>
 <div class="chips" id="gChips"></div>
 <div class="chips" id="subChips"></div>
 <div class="calc">
  <div class="glass panel">
   <h4>Buraxılış imtahanı (maks. 300)</h4>
   <div id="burF"></div>
   <div class="blk"><h4 id="blkT">Blok imtahanı (maks. 400)</h4><div id="blkF"></div></div>
   <button class="btn p big" id="go">Dəqiq Hesabla</button>
   <div class="warn" id="err"></div>
  </div>
  <div class="glass panel res">
   <small style="color:var(--mu)">Yekun bal (maks. 700)</small>
   <div class="tot" id="tot">—</div>
   <div id="det"></div>
  </div>
 </div>
 <div id="rec"></div>
 <p class="note">Hesablama: hər fənnin neti sual sayına bölünüb 100 bala çevrilir. Buraxılışda üç fənn 100-er bal (cəmi 300), blokda fənlər 1.5 / 1.25 / 1.25 əmsalı ilə (cəmi 400) toplanır. Blokda sual sayları: Riyaziyyat 25, digər fənlər 30 qəbul edilib.</p>
</section>

<section class="page" id="unis">
 <h2>Universitetlər &amp; Akademiyalar</h2>
 <p class="sub">Dövlət, özəl və xüsusi təyinatlı ali təhsil müəssisələri.</p>
 <div class="glass filters">
  <div><label for="q"><small>Axtarış</small></label><input type="search" id="q" placeholder="Ad və ya şəhər"></div>
  <div><label for="ft"><small>Növ</small></label><select id="ft"><option value="">Hamısı</option><option value="D">Dövlət</option><option value="O">Özəl</option><option value="A">Akademiya</option></select></div>
 </div>
 <div class="chips" id="uChips"></div>
 <p class="sub" id="cnt"></p>
 <div class="grid" id="uList"></div>
</section>

<section class="page" id="specs">
 <h2>İxtisas Bələdçisi</h2>
 <p class="sub">Qruplar üzrə ixtisaslar və təxmini keçid balları.</p>
 <div class="chips" id="sChips"></div>
 <div class="grid" id="sList" style="grid-template-columns:repeat(auto-fill,minmax(290px,1fr))"></div>
</section>
</main>
<footer>BalHesabla rəsmi mənbə deyil. Dəqiq məlumat üçün DİM-in rəsmi saytına müraciət et.</footer>

<script>
const $=id=>document.getElementById(id);
const GN={0:"Hamısı",1:"I Qrup",2:"II Qrup",3:"III Qrup",4:"IV Qrup"};
const TN={D:"Dövlət",O:"Özəl",A:"Akademiya"};

const BUR=[{n:"Azərbaycan dili",q:30},{n:"Riyaziyyat",q:25},{n:"Xarici dil",q:30}];
const BQ=n=>n==="Riyaziyyat"?25:30;
const W=[1.5,1.25,1.25];
const DA=["Riyaziyyat","Fizika","Kimya"],DB=["Riyaziyyat","Fizika","İnformatika"];
const SUBJ={2:["Riyaziyyat","Coğrafiya","Tarix"],3:["Azərbaycan dili","Tarix","Ədəbiyyat"],4:["Biologiya","Kimya","Fizika"]};
const SUBN={a:"1-ci altqrup (Fizika - Kimya)",b:"2-ci altqrup (Fizika - İnformatika)",c:"Hər iki altqrup (Kimya + İnformatika)"};
const pts=(d,w,q)=>Math.max(0,d-w*.25)/q*100;

const U=`Bakı Dövlət Universiteti (BDU)|Bakı|D|1,2,3,4|540
Azərbaycan Dövlət İqtisad Universiteti (UNEC)|Bakı|D|2,3|560
Azərbaycan Dövlət Neft və Sənaye Universiteti (ADNSU)|Bakı|D|1|520
ADA Universiteti|Bakı|D|1,2,3|640
Bakı Mühəndislik Universiteti (BMU)|Bakı|O|1,2|430
Azərbaycan Dövlət Pedaqoji Universiteti (ADPU)|Bakı|D|2,3,4|460
Bakı Slavyan Universiteti (BSU)|Bakı|D|3|480
Azərbaycan Tibb Universiteti|Bakı|D|4|620
Azərbaycan Texniki Universiteti|Bakı|D|1|470
Azərbaycan Memarlıq və İnşaat Universiteti|Bakı|D|1|450
Azərbaycan Dillər Universiteti|Bakı|D|3|510
Azərbaycan Mədəniyyət və İncəsənət Universiteti|Bakı|D|3|430
Xəzər Universiteti|Bakı|O|1,2,3|420
Qafqaz Universiteti|Bakı|O|1,2,3|400
Odlar Yurdu Universiteti|Bakı|O|1,2,3|390
Bakı Biznes Universiteti|Bakı|D|2|420
Bakı Asiya Universiteti|Bakı|O|2,3|350
Azərbaycan Universiteti|Bakı|O|2,3|340
Qərbi Kaspi Universiteti|Bakı|O|1,2,3|360
Bakı Qızlar Universiteti|Bakı|D|3,4|400
Azərbaycan Turizm və Menecment Universiteti|Bakı|D|2,3|450
Azərbaycan Kooperasiya Universiteti|Bakı|D|2|400
Bakı Ali Neft Məktəbi|Bakı|D|1|610
Azərbaycan Dövlət Aqrar Universiteti|Gəncə|D|4|400
Azərbaycan Texnologiya Universiteti|Gəncə|D|1,4|400
Gəncə Dövlət Universiteti|Gəncə|D|2,3,4|420
Sumqayıt Dövlət Universiteti|Sumqayıt|D|1,4|410
Lənkəran Dövlət Universiteti|Lənkəran|D|2,3,4|380
Naxçıvan Dövlət Universiteti|Naxçıvan|D|1,2,3,4|400
Mingəçevir Dövlət Universiteti|Mingəçevir|D|1,2|380
Milli Aviasiya Akademiyası (MAA)|Bakı|A|1|500
Dövlət İdarəçilik Akademiyası (DİA)|Bakı|A|2,3|580
Polis Akademiyası|Bakı|A|3|570
FHN Akademiyası|Bakı|A|1,4|560
Dövlət Gömrük Komitəsi Akademiyası|Bakı|A|2|550
Azərbaycan Dövlət Rəssamlıq Akademiyası|Bakı|A|3|400
Bakı Musiqi Akademiyası|Bakı|A|3|400
Azərbaycan Dövlət Bədən Tərbiyəsi və İdman Akademiyası|Bakı|A|3,4|420
Dövlət Təhlükəsizliyi Xidmətinin Heydər Əliyev adına Akademiyası|Bakı|A|3|600
Silahlı Qüvvələrin Hərbi Akademiyası|Bakı|A|1,2,3|520
Heydər Əliyev adına Azərbaycan Ali Hərbi Məktəbi|Bakı|A|1,2,3|520`.split("\n").map(l=>{const[n,c,t,g,s]=l.split("|");return{n,c,t,g:g.split(",").map(Number),s:+s}});

const SP={
1:`Proqram mühəndisliyi|620|1|2
Kompüter elmləri|610|1|2
İnformasiya təhlükəsizliyi|600|1|2
Robototexnika və mexatronika|540|1|0
Neft-qaz mühəndisliyi|560|0|1
Kimya mühəndisliyi|500|0|1
Elektrik mühəndisliyi|520|0|0
Aviasiya mühəndisliyi|530|1|0`,
2:`Beynəlxalq iqtisadi münasibətlər|580|0
Maliyyə|570|0
İqtisadiyyat|560|0
Rəqəmsal marketinq|540|1
Biznesin idarə olunması|520|0
Menecment|520|0
Mühasibat uçotu və audit|500|0
Turizm və qonaqpərvərlik|450|0`,
3:`Beynəlxalq münasibətlər|610|0
Hüquqşünaslıq|600|0
Tərcüməçilik|560|0
Psixologiya|550|1
Jurnalistika|540|0
Filologiya (ingilis dili)|520|0
Sosial iş|440|0
Pedaqogika|430|0`,
4:`Müalicə işi (Tibb)|640|0
Stomatologiya|630|0
Pediatriya|600|0
Əczaçılıq|560|0
Biotexnologiya|540|1
Qida mühəndisliyi|470|0
Ekologiya|450|1
Baytarlıq|420|0`};
const S=Object.fromEntries(Object.entries(SP).map(([k,v])=>[k,v.split("\n").map(l=>{const[n,s,f,a]=l.split("|");return{n,s:+s,f:+f,a:a===undefined?0:+a}})]));

function route(){
 const p=(location.hash||"#home").slice(1),el=$(p),id=el&&el.classList.contains("page")?p:"home";
 document.querySelectorAll(".page").forEach(e=>e.classList.toggle("show",e.id===id));
 document.querySelectorAll("nav a").forEach(a=>a.classList.toggle("on",a.dataset.p===id));
 $("nav").classList.remove("open");scrollTo(0,0);
}
addEventListener("hashchange",route);
$("burger").onclick=()=>$("nav").classList.toggle("open");
function count(el,to,ms){let t0=null;const f=t=>{t0=t0||t;const k=Math.min((t-t0)/ms,1);el.textContent=Math.round(to*k);if(k<1)requestAnimationFrame(f)};requestAnimationFrame(f)}
count($("orbN"),700,1500);setTimeout(()=>$("orbM").style.width="100%",100);

function chips(box,items,cur,cb,cls=""){
 box.innerHTML="";
 items.forEach(([k,label])=>{const b=document.createElement("button");b.className="chip "+cls+(k==cur?" on":"");b.textContent=label;b.onclick=()=>{cb(k);chips(box,items,k,cb,cls)};box.appendChild(b)});
}
const inp=(key,q,id)=>`<div class="subj"><label><small>${key}${q?` (${q} sual)`:""}</small></label><div class="two">
 <input type="number" min="0" max="${q}" data-k="${id}d" placeholder="Düz" aria-label="${key} düz">
 <input type="number" min="0" max="${q}" data-k="${id}w" placeholder="Səhv" aria-label="${key} səhv"></div></div>`;

let G=1,SB="a";
const dirs=()=>G!==1?[SUBJ[G]]:SB==="a"?[DA]:SB==="b"?[DB]:[DA,DB];
const dirLabel=i=>G!==1?"":SB==="c"?(i?"İnformatika istiqaməti":"Kimya istiqaməti"):SUBN[SB];
function drawForm(){
 $("subChips").style.display=G===1?"flex":"none";
 $("burF").innerHTML=BUR.map((s,i)=>inp(s.n,s.q,"u"+i)).join("");
 const names=[...new Set(dirs().flat())];
 $("blkF").innerHTML=names.map(n=>inp(n,BQ(n),"b"+n)).join("");
 $("blkT").textContent="Blok imtahanı (maks. 400)"+(dirs().length>1?" - hər istiqamət ayrıca hesablanır":"");
 $("tot").textContent="—";$("det").innerHTML="";$("rec").innerHTML="";$("err").textContent="";
}
chips($("gChips"),[[1,"I Qrup"],[2,"II Qrup"],[3,"III Qrup"],[4,"IV Qrup"]],1,g=>{G=g;drawForm()});
chips($("subChips"),[["a",SUBN.a],["b",SUBN.b],["c",SUBN.c]],"a",s=>{SB=s;drawForm()},"sm");
drawForm();

const val=k=>{const e=document.querySelector(`[data-k="${k}"]`);return e&&e.value!==""?+e.value:0};
function net(id,name,q){
 const d=val(id+"d"),w=val(id+"w");
 if(d<0||w<0||d+w>q)throw new Error(`${name}: düz və səhv cəmi ${q}-dən çox ola bilməz.`);
 return{d,w,n:d-w*.25,p:pts(d,w,q)};
}
$("go").onclick=()=>{
 $("err").textContent="";
 try{
  let bur=0,rows="";
  BUR.forEach((s,i)=>{const r=net("u"+i,s.n,s.q);bur+=r.p;rows+=`<div class="row"><span>${s.n}: net ${r.n.toFixed(2)}</span><b>${r.p.toFixed(1)} / 100</b></div>`});
  const res=dirs().map((names,i)=>{
   let blk=0,rr="";
   names.forEach((n,j)=>{const r=net("b"+n,n,BQ(n)),b=r.p*W[j];blk+=b;rr+=`<div class="row"><span>${n}: net ${r.n.toFixed(2)}</span><b>${b.toFixed(1)} / ${(100*W[j]).toFixed(0)}</b></div>`});
   return{label:dirLabel(i),blk,rr,tot:Math.round(bur+blk),sub:G===1?(SB==="c"?(i?"b":"a"):SB):0};
  });
  let h=`<h4 style="text-align:left;color:var(--pu)">Buraxılış balı: <span style="color:var(--tx)">${bur.toFixed(1)} / 300</span></h4>${rows}`;
  res.forEach(r=>{h+=`<div class="dir">${r.label?`<h4>${r.label}</h4>`:""}${r.rr}
   <div class="row"><span>Blok balı</span><b>${r.blk.toFixed(1)} / 400</b></div>
   <div class="row"><span>Yekun bal</span><b style="color:var(--cy)">${r.tot} / 700</b></div>
   <div class="meter"><i style="width:${r.tot/7}%"></i></div></div>`});
  $("det").innerHTML=h;
  $("tot").textContent=res.map(r=>r.tot).join(" / ");
  $("rec").innerHTML=res.map(r=>reco(r)).join("");
  $("rec").scrollIntoView({behavior:"smooth",block:"nearest"});
 }catch(e){$("err").textContent=e.message}
};
function reco(r){
 const t=r.tot;
 const us=U.filter(u=>u.g.includes(G)&&u.s<=t+25).sort((a,b)=>b.s-a.s).slice(0,6);
 const sp=S[G].filter(s=>s.s<=t+25&&(G!==1||!s.a||s.a==={a:1,b:2}[r.sub]));
 return `<h2 style="margin-top:30px">Tövsiyələr${r.label?": "+r.label:""} (${t} bal)</h2>
 <p class="sub">${us.length?"Balına uyğun universitetlər və ixtisaslar:":"Bu bal üçün kataloqda uyğun müəssisə tapılmadı."}</p>
 <div class="grid">${us.map(u=>card(u,`<span class="tag ${t>=u.s?"hi":"mid"}">${t>=u.s?"Yüksək şans":"Sərhəddə"}</span>`)).join("")}</div>
 ${sp.length?`<h3 style="font-size:1rem;margin:22px 0 12px">Uyğun ixtisaslar</h3><div class="grid">${sp.sort((a,b)=>b.s-a.s).slice(0,6).map(spCard).join("")}</div>`:""}`;
}
function card(u,x=""){
 return `<div class="glass uni"><h3>${u.n}</h3><div><span class="tag ${u.t}">${TN[u.t]}</span><span class="tag">${u.c}</span>${x}</div>
 <div>${u.g.map(g=>`<span class="tag">${GN[g]}</span>`).join("")}</div>
 <div class="sc">~${u.s} <small style="font:400 .75rem Manrope;color:var(--mu)">təxmini keçid</small></div></div>`;
}
function spCard(x){
 const al=x.a===1?"Fizika-Kimya":x.a===2?"Fizika-İnformatika":"";
 return `<div class="glass sp"><div class="top"><span>${x.n}</span><span class="sc" style="font-size:.92rem">~${x.s}</span></div>
 ${x.f?'<span class="tag hi" style="margin-top:6px">Gələcək</span>':""}${al?`<span class="tag">${al}</span>`:""}
 <div class="meter"><i style="width:${x.s/7}%"></i></div></div>`;
}

let UG=0;
function drawU(){
 const q=$("q").value.trim().toLowerCase(),t=$("ft").value;
 const r=U.filter(u=>(!q||(u.n+" "+u.c).toLowerCase().includes(q))&&(!UG||u.g.includes(UG))&&(!t||u.t===t)).sort((a,b)=>b.s-a.s);
 $("cnt").textContent=r.length+" nəticə";
 $("uList").innerHTML=r.length?r.map(u=>card(u)).join(""):`<div class="glass tip"><h3>Nəticə tapılmadı</h3><p>Axtarışı qısalt və ya qrup və növü “Hamısı” seç.</p></div>`;
}
chips($("uChips"),[0,1,2,3,4].map(g=>[g,GN[g]]),0,g=>{UG=g;drawU()});
$("q").oninput=drawU;$("ft").onchange=drawU;drawU();

function drawS(g){$("sList").innerHTML=S[g].slice().sort((a,b)=>b.s-a.s).map(spCard).join("")}
chips($("sChips"),[1,2,3,4].map(g=>[g,GN[g]]),1,drawS);drawS(1);
document.addEventListener("pointermove",e=>{const g=e.target.closest&&e.target.closest(".glass");if(g){const r=g.getBoundingClientRect();g.style.setProperty("--mx",(e.clientX-r.left)+"px");g.style.setProperty("--my",(e.clientY-r.top)+"px")}});
route();
</script>
</body>
</html>

23,627 chars · codepastes.com