<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DIU Student Clubs Directory | Office of Students' Affairs</title>
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,300&family=DM+Serif+Display:ital@0;1&display=swap" rel="stylesheet">
<style>
:root {
--bg: #f4f6f8;
--surface: #ffffff;
--border: #dde2e8;
--accent: #1a3a2a;
--accent2: #2d5c42;
--accent-light: #e8f0eb;
--amber: #b5720f;
--amber-bg: #fef3dc;
--red: #9b2c2c;
--red-bg: #fdeaea;
--blue: #1c4270;
--blue-bg: #e5eef7;
--purple: #4c3699;
--purple-bg: #edeaff;
--tan: #6b5000;
--tan-bg: #f5efd5;
--text: #1a1a1a;
--text2: #4a4a4a;
--text3: #7a7a7a;
--row-alt: #f9fafb;
--row-hover: #eef4f0;
--shadow: 0 2px 12px rgba(0,0,0,0.08);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: 'DM Sans', sans-serif;
background: var(--bg);
color: var(--text);
font-size: 13.5px;
line-height: 1.5;
}
/* HEADER */
.header {
background: var(--accent);
padding: 36px 40px 30px;
position: relative;
overflow: hidden;
}
.header::after {
content: '';
position: absolute;
top: -80px; right: -80px;
width: 300px; height: 300px;
border-radius: 50%;
background: rgba(255,255,255,0.04);
pointer-events: none;
}
.header-inner {
max-width: 1400px;
margin: 0 auto;
position: relative;
z-index: 1;
display: flex;
align-items: flex-end;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
.header-eyebrow {
font-size: 10.5px;
font-weight: 600;
letter-spacing: 2px;
text-transform: uppercase;
color: rgba(255,255,255,0.45);
margin-bottom: 8px;
}
.header-title {
font-family: 'DM Serif Display', serif;
font-size: clamp(22px, 3vw, 36px);
font-weight: 400;
color: #fff;
line-height: 1.15;
}
.header-title em { font-style: italic; color: rgba(255,255,255,0.65); }
.header-sub {
font-size: 12.5px;
color: rgba(255,255,255,0.5);
margin-top: 6px;
font-weight: 300;
}
.header-stats {
display: flex;
background: rgba(255,255,255,0.07);
border: 1px solid rgba(255,255,255,0.12);
border-radius: 10px;
overflow: hidden;
flex-shrink: 0;
}
.stat {
padding: 14px 22px;
text-align: center;
border-right: 1px solid rgba(255,255,255,0.1);
}
.stat:last-child { border-right: none; }
.stat-val { font-family: 'DM Serif Display', serif; font-size: 24px; color: #fff; line-height: 1; display: block; }
.stat-lbl { font-size: 10px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: rgba(255,255,255,0.45); display: block; margin-top: 3px; }
/* TOOLBAR */
.toolbar {
background: var(--surface);
border-bottom: 1px solid var(--border);
padding: 13px 40px;
position: sticky;
top: 0;
z-index: 100;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.toolbar-inner {
max-width: 1400px;
margin: 0 auto;
display: flex;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
.search-wrap { position: relative; flex: 1; min-width: 180px; max-width: 300px; }
.search-ico { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text3); pointer-events: none; }
.search-inp {
width: 100%;
padding: 8px 10px 8px 32px;
border: 1.5px solid var(--border);
border-radius: 7px;
font-family: 'DM Sans', sans-serif;
font-size: 13px;
color: var(--text);
background: var(--bg);
outline: none;
transition: border-color 0.18s, background 0.18s;
}
.search-inp:focus { border-color: var(--accent2); background: #fff; }
.filters { display: flex; gap: 5px; flex-wrap: wrap; }
.fbtn {
padding: 6px 13px;
border-radius: 100px;
border: 1.5px solid var(--border);
background: transparent;
font-family: 'DM Sans', sans-serif;
font-size: 12px;
font-weight: 500;
color: var(--text2);
cursor: pointer;
transition: all 0.15s;
white-space: nowrap;
}
.fbtn:hover { border-color: var(--accent2); color: var(--accent); }
.fbtn.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.toolbar-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.result-count { font-size: 12px; color: var(--text3); white-space: nowrap; }
.print-btn {
padding: 6px 14px;
border-radius: 7px;
border: 1.5px solid var(--border);
background: transparent;
font-family: 'DM Sans', sans-serif;
font-size: 12px;
font-weight: 500;
color: var(--text2);
cursor: pointer;
display: flex;
align-items: center;
gap: 5px;
transition: all 0.15s;
}
.print-btn:hover { border-color: var(--accent2); color: var(--accent); background: var(--accent-light); }
/* MAIN */
.main { max-width: 1400px; margin: 24px auto 60px; padding: 0 40px; }
/* TABLE */
.tbl-wrap {
background: var(--surface);
border: 1px solid var(--border);
border-radius: 12px;
overflow: hidden;
box-shadow: var(--shadow);
}
.tbl-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
thead tr { background: var(--accent); }
thead th {
padding: 12px 14px;
text-align: left;
font-weight: 600;
font-size: 10.5px;
text-transform: uppercase;
letter-spacing: 1.2px;
color: rgba(255,255,255,0.75);
white-space: nowrap;
border-right: 1px solid rgba(255,255,255,0.08);
cursor: pointer;
user-select: none;
transition: color 0.15s, background 0.15s;
}
thead th:last-child { border-right: none; }
thead th:hover { color: #fff; background: rgba(255,255,255,0.06); }
thead th.sorted { color: #fff; }
.sort-arrow { margin-left: 3px; font-size: 9px; opacity: 0.55; }
thead th.sorted .sort-arrow { opacity: 1; }
tbody tr { border-bottom: 1px solid var(--border); transition: background 0.1s; }
tbody tr:last-child { border-bottom: none; }
tbody tr:nth-child(even) { background: var(--row-alt); }
tbody tr:hover { background: var(--row-hover); }
td { padding: 10px 14px; vertical-align: middle; }
.col-no { font-size: 11px; font-weight: 700; color: var(--text3); text-align: center; width: 38px; min-width: 38px; }
.col-name { min-width: 185px; max-width: 235px; }
.col-name-text { font-weight: 600; color: var(--text); line-height: 1.35; font-size: 12.5px; }
.col-sm { min-width: 95px; }
.col-email { min-width: 175px; }
.col-person { min-width: 145px; }
.email-a { color: var(--accent2); text-decoration: none; font-size: 12px; word-break: break-all; display: inline-flex; align-items: center; gap: 5px; }
.email-a:hover { text-decoration: underline; }
.person-name { font-weight: 500; font-size: 12.5px; color: var(--text); }
.person-phone { font-size: 11.5px; color: var(--text3); font-variant-numeric: tabular-nums; }
.na { color: var(--text3); font-size: 11.5px; }
/* BADGES */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 100px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.3px; white-space: nowrap; }
.badge-dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; display: inline-block; flex-shrink: 0; }
.b-central { background: var(--accent-light); color: var(--accent); }
.b-dept { background: var(--blue-bg); color: var(--blue); }
.b-active { background: #e0f4e8; color: #1a6b38; }
.b-partial { background: var(--amber-bg); color: var(--amber); }
.b-inactive { background: var(--red-bg); color: var(--red); }
.b-new { background: var(--purple-bg); color: var(--purple); }
.b-rebuild { background: var(--tan-bg); color: var(--tan); }
/* SECTION DIVIDER ROWS */
.sec-row td {
background: #edf1f5;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
color: var(--text3);
padding: 6px 14px;
border-bottom: 1px solid var(--border);
}
/* EMPTY */
.empty-row td { text-align: center; padding: 56px 20px; color: var(--text3); font-size: 14px; }
.empty-row { display: none; }
/* FOOTER */
.page-footer { text-align: center; font-size: 11.5px; color: var(--text3); padding: 20px; border-top: 1px solid var(--border); margin-top: 32px; }
/* PRINT */
@media print {
.toolbar, .print-btn { display: none !important; }
.header { padding: 18px 24px; }
.header-stats { display: none; }
.main { padding: 0 10px; margin-top: 10px; }
.tbl-wrap { box-shadow: none; border: 1px solid #bbb; border-radius: 0; }
body { font-size: 11px; }
td, th { padding: 6px 10px !important; }
tbody tr:hover { background: transparent !important; }
.sec-row td { background: #eee !important; }
}
@media (max-width: 700px) {
.header { padding: 24px 16px; }
.header-inner { flex-direction: column; align-items: flex-start; }
.toolbar { padding: 10px 16px; }
.main { padding: 0 12px; margin-top: 14px; }
.stat { padding: 10px 14px; }
}
</style>
</head>
<body>
<header class="header">
<div class="header-inner">
<div>
<div class="header-eyebrow">Daffodil International University · Office of Students' Affairs</div>
<h1 class="header-title">Student Clubs & Associations <em>Directory</em></h1>
<p class="header-sub">Official contact register · Academic Year 2024–2025</p>
</div>
<div class="header-stats">
<div class="stat"><span class="stat-val" id="s-total">57</span><span class="stat-lbl">Total</span></div>
<div class="stat"><span class="stat-val" id="s-active">—</span><span class="stat-lbl">Active</span></div>
<div class="stat"><span class="stat-val" id="s-central">—</span><span class="stat-lbl">Central</span></div>
<div class="stat"><span class="stat-val" id="s-dept">—</span><span class="stat-lbl">Dept.</span></div>
</div>
</div>
</header>
<div class="toolbar">
<div class="toolbar-inner">
<div class="search-wrap">
<span class="search-ico"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.3"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg></span>
<input class="search-inp" id="q" type="text" placeholder="Search club, person, email…" autocomplete="off">
</div>
<div class="filters" id="filters">
<button class="fbtn on" data-f="all">All</button>
<button class="fbtn" data-f="Central Club">Central</button>
<button class="fbtn" data-f="Departmental Club">Departmental</button>
<button class="fbtn" data-f="active">Active</button>
<button class="fbtn" data-f="partial">Partially Active</button>
<button class="fbtn" data-f="inactive">Inactive</button>
<button class="fbtn" data-f="new">New</button>
</div>
<div class="toolbar-right">
<span class="result-count" id="rc">57 clubs</span>
<button class="print-btn" onclick="window.print()">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2"><polyline points="6 9 6 2 18 2 18 9"/><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><rect x="6" y="14" width="12" height="8"/></svg>
Print
</button>
</div>
</div>
</div>
<div class="main">
<div class="tbl-wrap">
<div class="tbl-scroll">
<table id="tbl">
<thead>
<tr>
<th data-col="no">#<span class="sort-arrow">↕</span></th>
<th data-col="name">Club Name<span class="sort-arrow">↕</span></th>
<th data-col="type">Type<span class="sort-arrow">↕</span></th>
<th data-col="status">Status<span class="sort-arrow">↕</span></th>
<th>Club Email</th>
<th>Convener / Co-Convener</th>
<th>President</th>
<th>President Contact</th>
<th>General Secretary</th>
<th>GS Contact</th>
</tr>
</thead>
<tbody id="tbody">
<tr class="empty-row" id="empty-row"><td colspan="10">No clubs match your search.</td></tr>
</tbody>
</table>
</div>
</div>
</div>
<footer class="page-footer">
Office of Students' Affairs · Daffodil International University, Savar, Dhaka · OSA Club Directory 2024–2025
</footer>
<script>
const CLUBS = [{"no":1,"name":"DIU Cultural Club (DIUCC)","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Anuz Kumar Chakrabarty","president":"Sadia Afrin Mithila","president_contact":"8801306-692969","general_secretary":"Saima Islam","gs_contact":""},{"no":2,"name":"DIU Debating Club (DIUDC)","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Nazmul Huda Azad","president":"Fahim Shakil","president_contact":"8801822887141","general_secretary":"Jisun Ahmad","gs_contact":"8801963055447"},{"no":3,"name":"Social Business Students' Forum (SBSF)","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Kamruzzaman","president":"B M Mazba-UnNaby","president_contact":"8801776253740","general_secretary":"Md. Shohidul Islam","gs_contact":"8801821866620"},{"no":4,"name":"DIU Photographic Society","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Shohel Arman","president":"N M Nayem Ul Islam","president_contact":"8801721708834","general_secretary":"Md. Mubarak Hossain Razwan","gs_contact":"8801313323612"},{"no":5,"name":"Daffodil Prothom-alo Bondhu Shova","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Anowar Habib Kazal","president":"Nazmul Hasan Samrat","president_contact":"8801734613095","general_secretary":"Jakia Akter Lima","gs_contact":"8801314495146"},{"no":6,"name":"Robotics Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Hafizul Imran","president":"Md. Sameul Hasan","president_contact":"8801707654740","general_secretary":"Roktim Saha","gs_contact":"8801778052484"},{"no":7,"name":"DIU Voluntary Service Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Amir Sohel","president":"Md. Rezaul Karim Emon","president_contact":"8801629697779","general_secretary":"Md. Redwan Islam","gs_contact":"8801723972843"},{"no":8,"name":"Rotaract Club of DIU","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Dara Abdus Satter","president":"Md. Rahad Uddin","president_contact":"8801633608068","general_secretary":"Md. Ashikur Rahman Farazi","gs_contact":"8801629843481"},{"no":9,"name":"DIU MUNA (Model United Nations Association)","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Indrajeet Mallick","president":"Md. Arifur Rahman","president_contact":"8801781211130","general_secretary":"Md. Shakwat Hossen","gs_contact":"8801630588987"},{"no":10,"name":"DIU Air Rover Scout","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Farhana Rahman","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":11,"name":"All Stars Daffodil","type":"Central Club","status":"Re-Building Process","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Arpita Ghose Tusi","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":12,"name":"DIU Change Together Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Jasia Mustafa","president":"Mehedi Hasan Himel","president_contact":"8801863441950","general_secretary":"M. Nahimul Hoque Tonmoy","gs_contact":"8801875954786"},{"no":13,"name":"Chess Club of DIU","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Nafiz Ahmed Emon","president":"Kona Jaman Bristy","president_contact":"8801575426118","general_secretary":"Margub Hasan Jamil","gs_contact":"8801746225752"},{"no":14,"name":"BNCC","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Engr. Md. Zahirul Islam","president":"Joy Das","president_contact":"8801303822894","general_secretary":"","gs_contact":""},{"no":15,"name":"DIU Karate-Do-Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Ishaque Mijee","president":"Md. Shoadul Islam Niloy","president_contact":"8801813307100","general_secretary":"Md. Tanvir Khan","gs_contact":"8801618946369"},{"no":16,"name":"DIU Film Society","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Meherabul Haque / Khaled Hasan Munna","president":"Uma Rani Kormokar","president_contact":"01308484133","general_secretary":"Utpol Malo Joy","gs_contact":"8801303205592"},{"no":17,"name":"DIU Blood Donors Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Juwel Rana / Mir. Sabrina Alam","president":"Salman Farshi","president_contact":"8801791141873","general_secretary":"Labib Ahmed Leo","gs_contact":"8801303920670"},{"no":18,"name":"Cyber Security Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Dewan Mamun Raza","president":"Efadul Islam","president_contact":"8801765839908","general_secretary":"Sadman Khan","gs_contact":"8801836124774"},{"no":19,"name":"Data Science Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Shohel Arman","president":"Md. Wahiduzzaman Nayem","president_contact":"8801886650636","general_secretary":"Khondokar Yuvraz","gs_contact":"8801704503068"},{"no":20,"name":"SkillUp Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Prof. Dr. Mohammad Rokibul Kabir","president":"Shahidul Islam Nayeem","president_contact":"8801868706453","general_secretary":"Sadia Afrin Pornam","gs_contact":"8801956931583"},{"no":21,"name":"DIU-YES Club","type":"Central Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Saida Mahamuda Rahman / Sonia Akter","president":"Fahim Fahmidy","president_contact":"8801922328208","general_secretary":"Sadman Sakib (VP)","gs_contact":"8801786418656"},{"no":22,"name":"Readers Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Ariful Islam Laskar","president":"Mst. Tanzila Ferdosh Mahi","president_contact":"8801310149679","general_secretary":"Jahin Jawad","gs_contact":"8801717613543"},{"no":23,"name":"DIU Research Society","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Khaled Sifullah","president":"Sadia Zaman","president_contact":"8801757824633","general_secretary":"Mahmudul Hasan","gs_contact":"8801679836701"},{"no":24,"name":"DIU Mathematical Society (DIUMS)","type":"Central Club","status":"New Club","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Noor Muhammad","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":25,"name":"Health & Fitness Club","type":"Central Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":26,"name":"DIU Investment Club","type":"Central Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Repon Miah","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":27,"name":"Public Health Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Mejbah Uddin Mithu","president":"Abu Hurairah","president_contact":"8801941758274","general_secretary":"Nishat Naila","gs_contact":"8801719202345"},{"no":28,"name":"Study Abroad Forum","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Ashraful Islam Talukder","president":"Md. Tarequl Islam","president_contact":"","general_secretary":"Md. Nazmul Hasan","gs_contact":""},{"no":29,"name":"DIU Architecture Club (DIUAC)","type":"Departmental Club","status":"New Club","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Asif Ibne Basit Turza","president":"Eirtashiam Islam","president_contact":"8801788144804","general_secretary":"Hridwan Hrid","gs_contact":"8801572998827"},{"no":30,"name":"DIU Business & Education Club (DIUBEC)","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Sayedul Anam","president":"Robin Rajbonshe","president_contact":"","general_secretary":"Sagor Paul","gs_contact":""},{"no":31,"name":"English Literary Club (ELC)","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Mahmudul Hasan / Rubaiaat-E-Tarik Prithwee","president":"Mohiuddin Raja","president_contact":"8801733751296","general_secretary":"Sumaia Islam Tamanna","gs_contact":"8801754694821"},{"no":32,"name":"Computer and Programming Club (DIUCPC)","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Mayen Uddin Mojumdar","president":"Rubayat Uddin Rimon","president_contact":"8801742165996","general_secretary":"Golam Rabbani Joy","gs_contact":"8801768804069"},{"no":33,"name":"DIU Girls Computer & Programming Club (GCPC)","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Most. Hasna Hena","president":"Khadiza Akter","president_contact":"8801307123615","general_secretary":"Kai Meherunnesa Dola","gs_contact":"8801684050850"},{"no":34,"name":"DIU NFE Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Md. Mahbubur Rahman","president":"Md. Masud Rana","president_contact":"8801780505741","general_secretary":"Md. Hossain Shahriar","gs_contact":"8801725789042"},{"no":35,"name":"DIU Communication Club","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Md. Abdul Kabil Khan","president":"Tamanna Yesmin Maria","president_contact":"8801792166228","general_secretary":"Md. Ishrak Alam Khan","gs_contact":"8801780972449"},{"no":36,"name":"Daffodil Moot Court Society (DMCS)","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":37,"name":"DIU Real Estate Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Shakil Ahmed / Nafisa Farid Moumi","president":"Azizul Haque","president_contact":"8801725967811","general_secretary":"Jahid Hasan Shovo","gs_contact":"8801646173032"},{"no":38,"name":"DIU Textile Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Alamgir Hossain","president":"S M Tasrif Shovon Polok","president_contact":"8801739482449","general_secretary":"Abu Rayhan Rifat","gs_contact":"8801762729272"},{"no":39,"name":"DIU Creative Park","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mizanur Rahman Ashik","president":"Sahedul Islam Nishat","president_contact":"","general_secretary":"Masrur Mizbha Mappy","gs_contact":""},{"no":40,"name":"Software Engineering Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Izaz Ahmmed Tuhin","president":"Md. Abdul Alim","president_contact":"8801770896366","general_secretary":"Syed Roman","gs_contact":"8801314937329"},{"no":41,"name":"ICE Club (Information & Communication Engineering)","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Taslim Arefin","president":"Raihan Ahmed Hridoy","president_contact":"8801910643324","general_secretary":"","gs_contact":""},{"no":42,"name":"Society for Young Business Leaders","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Mohammad Shibli Shahriar","president":"Israt Jahan","president_contact":"8801773314267","general_secretary":"Tahmid Ahamed","gs_contact":"8801620662584"},{"no":43,"name":"HR Club","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Khadiza Rahman Tanchi","president":"Mahmuda Akter Moly","president_contact":"8801929985620","general_secretary":"Snigdha Mandal Niha","gs_contact":"8801746258006"},{"no":44,"name":"Marketing Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Sharmin Jahan","president":"Sakhwat Hossain Emon","president_contact":"8801761696767","general_secretary":"Partho Ghosh","gs_contact":"8801924255338"},{"no":45,"name":"ITM Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Nafees Imran","president":"Eliyas Ahmed Bin Hashem","president_contact":"","general_secretary":"Shahriyar Tanvir","gs_contact":""},{"no":46,"name":"Civil Engineering Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Kazi Obaidur Rahman","president":"Arindom Biswas Rudro","president_contact":"","general_secretary":"Atiqur Rahman","gs_contact":""},{"no":47,"name":"Finance Club","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Sabrina Akhter","president":"Md. Akibuzzaman","president_contact":"8801644000296","general_secretary":"Sadia Afrin Porna","gs_contact":"8801956931583"},{"no":48,"name":"DIU EEE Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Sohel Rana","president":"Talha Ibna Tamjid Kabbo","president_contact":"8801303149941","general_secretary":"Md. Salahuddin Metul","gs_contact":"8801645819254"},{"no":49,"name":"Pharmacia Club","type":"Departmental Club","status":"Reactivated","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"","president":"Md. Ashraful Islam","president_contact":"8801866149992","general_secretary":"Muntasir Sarkar","gs_contact":"8801834761078"},{"no":50,"name":"CIS Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Israfil","president":"Mainul Islam Tamim","president_contact":"8801639507665","general_secretary":"Sazzadu Mira","gs_contact":"8801316563825"},{"no":51,"name":"Daffodil Entrepreneurs Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Muhammad Mustafa Shakil","president":"Bayezid Chowdhury","president_contact":"8801767937890","general_secretary":"Md. Rashed Kamal","gs_contact":"8801858200206"},{"no":52,"name":"DIU Agricultural Science Club","type":"Departmental Club","status":"New Club","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Shoaib Arifin","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":53,"name":"E-Business Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Omar Faruk","president":"Md. Mohaiminul Islam Noqib","president_contact":"8801708363751","general_secretary":"MD. Ashraful Islam","gs_contact":"8801929184757"},{"no":54,"name":"Daffodil AI Club","type":"Central Club","status":"New Club","email":"","convener":"Dr. Fernaz Narin Nur","president":"Md. Rony","president_contact":"8801890190638","general_secretary":"Abid Khan","gs_contact":"8801825929393"},{"no":55,"name":"DIU Accounting Club","type":"Departmental Club","status":"New Club","email":"","convener":"Md. Rayhanul Islam","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":56,"name":"DIU PESS Club","type":"Departmental Club","status":"New Club","email":"","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":57,"name":"Software Quality Assurance & Testing Club","type":"Departmental Club","status":"New Club","email":"","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""}];
// Stats
const activeN = CLUBS.filter(c => { const s = c.status.toLowerCase(); return s.includes('active') && !s.includes('partial') && !s.includes('inact'); }).length;
document.getElementById('s-active').textContent = activeN;
document.getElementById('s-central').textContent = CLUBS.filter(c => c.type === 'Central Club').length;
document.getElementById('s-dept').textContent = CLUBS.filter(c => c.type === 'Departmental Club').length;
// Helpers
function statusBadge(s) {
if (!s) return '<span class="na">—</span>';
const sl = s.toLowerCase();
if (sl.includes('active') && !sl.includes('partial') && !sl.includes('inact') && !sl.includes('re'))
return `<span class="badge b-active"><span class="badge-dot"></span>Active</span>`;
if (sl.includes('partial'))
return `<span class="badge b-partial"><span class="badge-dot"></span>Partial</span>`;
if (sl.includes('inact'))
return `<span class="badge b-inactive"><span class="badge-dot"></span>Inactive</span>`;
if (sl.includes('new'))
return `<span class="badge b-new"><span class="badge-dot"></span>New</span>`;
if (sl.includes('rebuild') || sl.includes('reactivat'))
return `<span class="badge b-rebuild"><span class="badge-dot"></span>Rebuild</span>`;
return `<span class="badge b-rebuild">${s}</span>`;
}
function typeBadge(t) {
if (t === 'Central Club') return `<span class="badge b-central">Central</span>`;
if (t === 'Departmental Club') return `<span class="badge b-dept">Dept.</span>`;
return '<span class="na">—</span>';
}
function emailCell(e) {
if (!e) return '<span class="na">—</span>';
return `<a class="email-a" href="mailto:${e}"><svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.3"><rect x="2" y="4" width="20" height="16" rx="2"/><polyline points="2,4 12,13 22,4"/></svg>${e}</a>`;
}
function personCell(name) {
return name ? `<span class="person-name">${name}</span>` : '<span class="na">—</span>';
}
function phoneCell(p) {
return p ? `<span class="person-phone">${p}</span>` : '<span class="na">—</span>';
}
// State
let sortCol = 'no', sortAsc = true, currentFilter = 'all', currentSearch = '';
function matches(c) {
const sl = c.status.toLowerCase();
if (currentFilter === 'active') { if (!(sl.includes('active') && !sl.includes('partial') && !sl.includes('inact'))) return false; }
else if (currentFilter === 'partial') { if (!sl.includes('partial')) return false; }
else if (currentFilter === 'inactive') { if (!sl.includes('inact')) return false; }
else if (currentFilter === 'new') { if (!sl.includes('new')) return false; }
else if (currentFilter !== 'all') { if (c.type !== currentFilter) return false; }
if (!currentSearch) return true;
const q = currentSearch.toLowerCase();
return [c.name, c.email, c.convener, c.president, c.general_secretary].some(v => v && v.toLowerCase().includes(q));
}
function getSorted(arr) {
return [...arr].sort((a, b) => {
let av = a[sortCol] ?? '', bv = b[sortCol] ?? '';
if (typeof av === 'number') return sortAsc ? av - bv : bv - av;
return sortAsc ? String(av).localeCompare(String(bv)) : String(bv).localeCompare(String(av));
});
}
function render() {
const filtered = getSorted(CLUBS.filter(matches));
const tbody = document.getElementById('tbody');
const emptyRow = document.getElementById('empty-row');
Array.from(tbody.querySelectorAll('tr:not(#empty-row)')).forEach(r => r.remove());
if (filtered.length === 0) {
emptyRow.style.display = '';
document.getElementById('rc').textContent = '0 clubs';
return;
}
emptyRow.style.display = 'none';
document.getElementById('rc').textContent = `${filtered.length} club${filtered.length !== 1 ? 's' : ''}`;
const showSections = currentFilter === 'all' && !currentSearch && sortCol === 'no';
let lastType = null;
filtered.forEach(c => {
if (showSections && c.type !== lastType) {
const sec = document.createElement('tr');
sec.className = 'sec-row';
sec.innerHTML = `<td colspan="10">${c.type || 'Other'}</td>`;
tbody.appendChild(sec);
lastType = c.type;
}
const tr = document.createElement('tr');
tr.innerHTML =
`<td class="col-no">${c.no}</td>` +
`<td class="col-name"><div class="col-name-text">${c.name}</div></td>` +
`<td class="col-sm">${typeBadge(c.type)}</td>` +
`<td class="col-sm">${statusBadge(c.status)}</td>` +
`<td class="col-email">${emailCell(c.email)}</td>` +
`<td class="col-person">${personCell(c.convener)}</td>` +
`<td class="col-person">${personCell(c.president)}</td>` +
`<td class="col-person">${phoneCell(c.president_contact)}</td>` +
`<td class="col-person">${personCell(c.general_secretary)}</td>` +
`<td class="col-person">${phoneCell(c.gs_contact)}</td>`;
tbody.appendChild(tr);
});
}
// Sort
document.querySelectorAll('thead th[data-col]').forEach(th => {
th.addEventListener('click', () => {
const col = th.dataset.col;
sortAsc = (sortCol === col) ? !sortAsc : true;
sortCol = col;
document.querySelectorAll('thead th').forEach(t => { t.classList.remove('sorted'); const a = t.querySelector('.sort-arrow'); if (a) a.textContent = '↕'; });
th.classList.add('sorted');
const arrow = th.querySelector('.sort-arrow');
if (arrow) arrow.textContent = sortAsc ? ' ↑' : ' ↓';
render();
});
});
// Filter
document.getElementById('filters').addEventListener('click', e => {
const btn = e.target.closest('.fbtn');
if (!btn) return;
document.querySelectorAll('.fbtn').forEach(b => b.classList.remove('on'));
btn.classList.add('on');
currentFilter = btn.dataset.f;
render();
});
// Search
document.getElementById('q').addEventListener('input', e => {
currentSearch = e.target.value.trim();
render();
});
render();
</script>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DIU Student Clubs Directory | Office of Students' Affairs</title>
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,300&family=DM+Serif+Display:ital@0;1&display=swap" rel="stylesheet">
<style>
:root {
--bg: #f4f6f8;
--surface: #ffffff;
--border: #dde2e8;
--accent: #1a3a2a;
--accent2: #2d5c42;
--accent-light: #e8f0eb;
--amber: #b5720f;
--amber-bg: #fef3dc;
--red: #9b2c2c;
--red-bg: #fdeaea;
--blue: #1c4270;
--blue-bg: #e5eef7;
--purple: #4c3699;
--purple-bg: #edeaff;
--tan: #6b5000;
--tan-bg: #f5efd5;
--text: #1a1a1a;
--text2: #4a4a4a;
--text3: #7a7a7a;
--row-alt: #f9fafb;
--row-hover: #eef4f0;
--shadow: 0 2px 12px rgba(0,0,0,0.08);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: 'DM Sans', sans-serif;
background: var(--bg);
color: var(--text);
font-size: 13.5px;
line-height: 1.5;
}
/* HEADER */
.header {
background: var(--accent);
padding: 36px 40px 30px;
position: relative;
overflow: hidden;
}
.header::after {
content: '';
position: absolute;
top: -80px; right: -80px;
width: 300px; height: 300px;
border-radius: 50%;
background: rgba(255,255,255,0.04);
pointer-events: none;
}
.header-inner {
max-width: 1400px;
margin: 0 auto;
position: relative;
z-index: 1;
display: flex;
align-items: flex-end;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
.header-eyebrow {
font-size: 10.5px;
font-weight: 600;
letter-spacing: 2px;
text-transform: uppercase;
color: rgba(255,255,255,0.45);
margin-bottom: 8px;
}
.header-title {
font-family: 'DM Serif Display', serif;
font-size: clamp(22px, 3vw, 36px);
font-weight: 400;
color: #fff;
line-height: 1.15;
}
.header-title em { font-style: italic; color: rgba(255,255,255,0.65); }
.header-sub {
font-size: 12.5px;
color: rgba(255,255,255,0.5);
margin-top: 6px;
font-weight: 300;
}
.header-stats {
display: flex;
background: rgba(255,255,255,0.07);
border: 1px solid rgba(255,255,255,0.12);
border-radius: 10px;
overflow: hidden;
flex-shrink: 0;
}
.stat {
padding: 14px 22px;
text-align: center;
border-right: 1px solid rgba(255,255,255,0.1);
}
.stat:last-child { border-right: none; }
.stat-val { font-family: 'DM Serif Display', serif; font-size: 24px; color: #fff; line-height: 1; display: block; }
.stat-lbl { font-size: 10px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: rgba(255,255,255,0.45); display: block; margin-top: 3px; }
/* TOOLBAR */
.toolbar {
background: var(--surface);
border-bottom: 1px solid var(--border);
padding: 13px 40px;
position: sticky;
top: 0;
z-index: 100;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.toolbar-inner {
max-width: 1400px;
margin: 0 auto;
display: flex;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
.search-wrap { position: relative; flex: 1; min-width: 180px; max-width: 300px; }
.search-ico { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text3); pointer-events: none; }
.search-inp {
width: 100%;
padding: 8px 10px 8px 32px;
border: 1.5px solid var(--border);
border-radius: 7px;
font-family: 'DM Sans', sans-serif;
font-size: 13px;
color: var(--text);
background: var(--bg);
outline: none;
transition: border-color 0.18s, background 0.18s;
}
.search-inp:focus { border-color: var(--accent2); background: #fff; }
.filters { display: flex; gap: 5px; flex-wrap: wrap; }
.fbtn {
padding: 6px 13px;
border-radius: 100px;
border: 1.5px solid var(--border);
background: transparent;
font-family: 'DM Sans', sans-serif;
font-size: 12px;
font-weight: 500;
color: var(--text2);
cursor: pointer;
transition: all 0.15s;
white-space: nowrap;
}
.fbtn:hover { border-color: var(--accent2); color: var(--accent); }
.fbtn.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.toolbar-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.result-count { font-size: 12px; color: var(--text3); white-space: nowrap; }
.print-btn {
padding: 6px 14px;
border-radius: 7px;
border: 1.5px solid var(--border);
background: transparent;
font-family: 'DM Sans', sans-serif;
font-size: 12px;
font-weight: 500;
color: var(--text2);
cursor: pointer;
display: flex;
align-items: center;
gap: 5px;
transition: all 0.15s;
}
.print-btn:hover { border-color: var(--accent2); color: var(--accent); background: var(--accent-light); }
/* MAIN */
.main { max-width: 1400px; margin: 24px auto 60px; padding: 0 40px; }
/* TABLE */
.tbl-wrap {
background: var(--surface);
border: 1px solid var(--border);
border-radius: 12px;
overflow: hidden;
box-shadow: var(--shadow);
}
.tbl-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
thead tr { background: var(--accent); }
thead th {
padding: 12px 14px;
text-align: left;
font-weight: 600;
font-size: 10.5px;
text-transform: uppercase;
letter-spacing: 1.2px;
color: rgba(255,255,255,0.75);
white-space: nowrap;
border-right: 1px solid rgba(255,255,255,0.08);
cursor: pointer;
user-select: none;
transition: color 0.15s, background 0.15s;
}
thead th:last-child { border-right: none; }
thead th:hover { color: #fff; background: rgba(255,255,255,0.06); }
thead th.sorted { color: #fff; }
.sort-arrow { margin-left: 3px; font-size: 9px; opacity: 0.55; }
thead th.sorted .sort-arrow { opacity: 1; }
tbody tr { border-bottom: 1px solid var(--border); transition: background 0.1s; }
tbody tr:last-child { border-bottom: none; }
tbody tr:nth-child(even) { background: var(--row-alt); }
tbody tr:hover { background: var(--row-hover); }
td { padding: 10px 14px; vertical-align: middle; }
.col-no { font-size: 11px; font-weight: 700; color: var(--text3); text-align: center; width: 38px; min-width: 38px; }
.col-name { min-width: 185px; max-width: 235px; }
.col-name-text { font-weight: 600; color: var(--text); line-height: 1.35; font-size: 12.5px; }
.col-sm { min-width: 95px; }
.col-email { min-width: 175px; }
.col-person { min-width: 145px; }
.email-a { color: var(--accent2); text-decoration: none; font-size: 12px; word-break: break-all; display: inline-flex; align-items: center; gap: 5px; }
.email-a:hover { text-decoration: underline; }
.person-name { font-weight: 500; font-size: 12.5px; color: var(--text); }
.person-phone { font-size: 11.5px; color: var(--text3); font-variant-numeric: tabular-nums; }
.na { color: var(--text3); font-size: 11.5px; }
/* BADGES */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 100px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.3px; white-space: nowrap; }
.badge-dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; display: inline-block; flex-shrink: 0; }
.b-central { background: var(--accent-light); color: var(--accent); }
.b-dept { background: var(--blue-bg); color: var(--blue); }
.b-active { background: #e0f4e8; color: #1a6b38; }
.b-partial { background: var(--amber-bg); color: var(--amber); }
.b-inactive { background: var(--red-bg); color: var(--red); }
.b-new { background: var(--purple-bg); color: var(--purple); }
.b-rebuild { background: var(--tan-bg); color: var(--tan); }
/* SECTION DIVIDER ROWS */
.sec-row td {
background: #edf1f5;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
color: var(--text3);
padding: 6px 14px;
border-bottom: 1px solid var(--border);
}
/* EMPTY */
.empty-row td { text-align: center; padding: 56px 20px; color: var(--text3); font-size: 14px; }
.empty-row { display: none; }
/* FOOTER */
.page-footer { text-align: center; font-size: 11.5px; color: var(--text3); padding: 20px; border-top: 1px solid var(--border); margin-top: 32px; }
/* PRINT */
@media print {
.toolbar, .print-btn { display: none !important; }
.header { padding: 18px 24px; }
.header-stats { display: none; }
.main { padding: 0 10px; margin-top: 10px; }
.tbl-wrap { box-shadow: none; border: 1px solid #bbb; border-radius: 0; }
body { font-size: 11px; }
td, th { padding: 6px 10px !important; }
tbody tr:hover { background: transparent !important; }
.sec-row td { background: #eee !important; }
}
@media (max-width: 700px) {
.header { padding: 24px 16px; }
.header-inner { flex-direction: column; align-items: flex-start; }
.toolbar { padding: 10px 16px; }
.main { padding: 0 12px; margin-top: 14px; }
.stat { padding: 10px 14px; }
}
</style>
</head>
<body>
<header class="header">
<div class="header-inner">
<div>
<div class="header-eyebrow">Daffodil International University · Office of Students' Affairs</div>
<h1 class="header-title">Student Clubs & Associations <em>Directory</em></h1>
<p class="header-sub">Official contact register · Academic Year 2024–2025</p>
</div>
<div class="header-stats">
<div class="stat"><span class="stat-val" id="s-total">57</span><span class="stat-lbl">Total</span></div>
<div class="stat"><span class="stat-val" id="s-active">—</span><span class="stat-lbl">Active</span></div>
<div class="stat"><span class="stat-val" id="s-central">—</span><span class="stat-lbl">Central</span></div>
<div class="stat"><span class="stat-val" id="s-dept">—</span><span class="stat-lbl">Dept.</span></div>
</div>
</div>
</header>
<div class="toolbar">
<div class="toolbar-inner">
<div class="search-wrap">
<span class="search-ico"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.3"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg></span>
<input class="search-inp" id="q" type="text" placeholder="Search club, person, email…" autocomplete="off">
</div>
<div class="filters" id="filters">
<button class="fbtn on" data-f="all">All</button>
<button class="fbtn" data-f="Central Club">Central</button>
<button class="fbtn" data-f="Departmental Club">Departmental</button>
<button class="fbtn" data-f="active">Active</button>
<button class="fbtn" data-f="partial">Partially Active</button>
<button class="fbtn" data-f="inactive">Inactive</button>
<button class="fbtn" data-f="new">New</button>
</div>
<div class="toolbar-right">
<span class="result-count" id="rc">57 clubs</span>
<button class="print-btn" onclick="window.print()">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2"><polyline points="6 9 6 2 18 2 18 9"/><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><rect x="6" y="14" width="12" height="8"/></svg>
</button>
</div>
</div>
</div>
<div class="main">
<div class="tbl-wrap">
<div class="tbl-scroll">
<table id="tbl">
<thead>
<tr>
<th data-col="no">#<span class="sort-arrow">↕</span></th>
<th data-col="name">Club Name<span class="sort-arrow">↕</span></th>
<th data-col="type">Type<span class="sort-arrow">↕</span></th>
<th data-col="status">Status<span class="sort-arrow">↕</span></th>
<th>Club Email</th>
<th>Convener / Co-Convener</th>
<th>President</th>
<th>President Contact</th>
<th>General Secretary</th>
<th>GS Contact</th>
</tr>
</thead>
<tbody id="tbody">
<tr class="empty-row" id="empty-row"><td colspan="10">No clubs match your search.</td></tr>
</tbody>
</table>
</div>
</div>
</div>
<footer class="page-footer">
Office of Students' Affairs · Daffodil International University, Savar, Dhaka · OSA Club Directory 2024–2025
</footer>
<script>
const CLUBS = [{"no":1,"name":"DIU Cultural Club (DIUCC)","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Anuz Kumar Chakrabarty","president":"Sadia Afrin Mithila","president_contact":"8801306-692969","general_secretary":"Saima Islam","gs_contact":""},{"no":2,"name":"DIU Debating Club (DIUDC)","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Nazmul Huda Azad","president":"Fahim Shakil","president_contact":"8801822887141","general_secretary":"Jisun Ahmad","gs_contact":"8801963055447"},{"no":3,"name":"Social Business Students' Forum (SBSF)","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Kamruzzaman","president":"B M Mazba-UnNaby","president_contact":"8801776253740","general_secretary":"Md. Shohidul Islam","gs_contact":"8801821866620"},{"no":4,"name":"DIU Photographic Society","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Shohel Arman","president":"N M Nayem Ul Islam","president_contact":"8801721708834","general_secretary":"Md. Mubarak Hossain Razwan","gs_contact":"8801313323612"},{"no":5,"name":"Daffodil Prothom-alo Bondhu Shova","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Anowar Habib Kazal","president":"Nazmul Hasan Samrat","president_contact":"8801734613095","general_secretary":"Jakia Akter Lima","gs_contact":"8801314495146"},{"no":6,"name":"Robotics Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Hafizul Imran","president":"Md. Sameul Hasan","president_contact":"8801707654740","general_secretary":"Roktim Saha","gs_contact":"8801778052484"},{"no":7,"name":"DIU Voluntary Service Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Amir Sohel","president":"Md. Rezaul Karim Emon","president_contact":"8801629697779","general_secretary":"Md. Redwan Islam","gs_contact":"8801723972843"},{"no":8,"name":"Rotaract Club of DIU","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Dara Abdus Satter","president":"Md. Rahad Uddin","president_contact":"8801633608068","general_secretary":"Md. Ashikur Rahman Farazi","gs_contact":"8801629843481"},{"no":9,"name":"DIU MUNA (Model United Nations Association)","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Indrajeet Mallick","president":"Md. Arifur Rahman","president_contact":"8801781211130","general_secretary":"Md. Shakwat Hossen","gs_contact":"8801630588987"},{"no":10,"name":"DIU Air Rover Scout","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Farhana Rahman","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":11,"name":"All Stars Daffodil","type":"Central Club","status":"Re-Building Process","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Arpita Ghose Tusi","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":12,"name":"DIU Change Together Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Jasia Mustafa","president":"Mehedi Hasan Himel","president_contact":"8801863441950","general_secretary":"M. Nahimul Hoque Tonmoy","gs_contact":"8801875954786"},{"no":13,"name":"Chess Club of DIU","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Nafiz Ahmed Emon","president":"Kona Jaman Bristy","president_contact":"8801575426118","general_secretary":"Margub Hasan Jamil","gs_contact":"8801746225752"},{"no":14,"name":"BNCC","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Engr. Md. Zahirul Islam","president":"Joy Das","president_contact":"8801303822894","general_secretary":"","gs_contact":""},{"no":15,"name":"DIU Karate-Do-Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Ishaque Mijee","president":"Md. Shoadul Islam Niloy","president_contact":"8801813307100","general_secretary":"Md. Tanvir Khan","gs_contact":"8801618946369"},{"no":16,"name":"DIU Film Society","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Meherabul Haque / Khaled Hasan Munna","president":"Uma Rani Kormokar","president_contact":"01308484133","general_secretary":"Utpol Malo Joy","gs_contact":"8801303205592"},{"no":17,"name":"DIU Blood Donors Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Juwel Rana / Mir. Sabrina Alam","president":"Salman Farshi","president_contact":"8801791141873","general_secretary":"Labib Ahmed Leo","gs_contact":"8801303920670"},{"no":18,"name":"Cyber Security Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Dewan Mamun Raza","president":"Efadul Islam","president_contact":"8801765839908","general_secretary":"Sadman Khan","gs_contact":"8801836124774"},{"no":19,"name":"Data Science Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Shohel Arman","president":"Md. Wahiduzzaman Nayem","president_contact":"8801886650636","general_secretary":"Khondokar Yuvraz","gs_contact":"8801704503068"},{"no":20,"name":"SkillUp Club","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Prof. Dr. Mohammad Rokibul Kabir","president":"Shahidul Islam Nayeem","president_contact":"8801868706453","general_secretary":"Sadia Afrin Pornam","gs_contact":"8801956931583"},{"no":21,"name":"DIU-YES Club","type":"Central Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Saida Mahamuda Rahman / Sonia Akter","president":"Fahim Fahmidy","president_contact":"8801922328208","general_secretary":"Sadman Sakib (VP)","gs_contact":"8801786418656"},{"no":22,"name":"Readers Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Ariful Islam Laskar","president":"Mst. Tanzila Ferdosh Mahi","president_contact":"8801310149679","general_secretary":"Jahin Jawad","gs_contact":"8801717613543"},{"no":23,"name":"DIU Research Society","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Khaled Sifullah","president":"Sadia Zaman","president_contact":"8801757824633","general_secretary":"Mahmudul Hasan","gs_contact":"8801679836701"},{"no":24,"name":"DIU Mathematical Society (DIUMS)","type":"Central Club","status":"New Club","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Noor Muhammad","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":25,"name":"Health & Fitness Club","type":"Central Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":26,"name":"DIU Investment Club","type":"Central Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Repon Miah","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":27,"name":"Public Health Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Mejbah Uddin Mithu","president":"Abu Hurairah","president_contact":"8801941758274","general_secretary":"Nishat Naila","gs_contact":"8801719202345"},{"no":28,"name":"Study Abroad Forum","type":"Central Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Ashraful Islam Talukder","president":"Md. Tarequl Islam","president_contact":"","general_secretary":"Md. Nazmul Hasan","gs_contact":""},{"no":29,"name":"DIU Architecture Club (DIUAC)","type":"Departmental Club","status":"New Club","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Asif Ibne Basit Turza","president":"Eirtashiam Islam","president_contact":"8801788144804","general_secretary":"Hridwan Hrid","gs_contact":"8801572998827"},{"no":30,"name":"DIU Business & Education Club (DIUBEC)","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Sayedul Anam","president":"Robin Rajbonshe","president_contact":"","general_secretary":"Sagor Paul","gs_contact":""},{"no":31,"name":"English Literary Club (ELC)","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Mahmudul Hasan / Rubaiaat-E-Tarik Prithwee","president":"Mohiuddin Raja","president_contact":"8801733751296","general_secretary":"Sumaia Islam Tamanna","gs_contact":"8801754694821"},{"no":32,"name":"Computer and Programming Club (DIUCPC)","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Mayen Uddin Mojumdar","president":"Rubayat Uddin Rimon","president_contact":"8801742165996","general_secretary":"Golam Rabbani Joy","gs_contact":"8801768804069"},{"no":33,"name":"DIU Girls Computer & Programming Club (GCPC)","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Most. Hasna Hena","president":"Khadiza Akter","president_contact":"8801307123615","general_secretary":"Kai Meherunnesa Dola","gs_contact":"8801684050850"},{"no":34,"name":"DIU NFE Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Md. Mahbubur Rahman","president":"Md. Masud Rana","president_contact":"8801780505741","general_secretary":"Md. Hossain Shahriar","gs_contact":"8801725789042"},{"no":35,"name":"DIU Communication Club","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Md. Abdul Kabil Khan","president":"Tamanna Yesmin Maria","president_contact":"8801792166228","general_secretary":"Md. Ishrak Alam Khan","gs_contact":"8801780972449"},{"no":36,"name":"Daffodil Moot Court Society (DMCS)","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":37,"name":"DIU Real Estate Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Shakil Ahmed / Nafisa Farid Moumi","president":"Azizul Haque","president_contact":"8801725967811","general_secretary":"Jahid Hasan Shovo","gs_contact":"8801646173032"},{"no":38,"name":"DIU Textile Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Alamgir Hossain","president":"S M Tasrif Shovon Polok","president_contact":"8801739482449","general_secretary":"Abu Rayhan Rifat","gs_contact":"8801762729272"},{"no":39,"name":"DIU Creative Park","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mizanur Rahman Ashik","president":"Sahedul Islam Nishat","president_contact":"","general_secretary":"Masrur Mizbha Mappy","gs_contact":""},{"no":40,"name":"Software Engineering Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Izaz Ahmmed Tuhin","president":"Md. Abdul Alim","president_contact":"8801770896366","general_secretary":"Syed Roman","gs_contact":"8801314937329"},{"no":41,"name":"ICE Club (Information & Communication Engineering)","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Taslim Arefin","president":"Raihan Ahmed Hridoy","president_contact":"8801910643324","general_secretary":"","gs_contact":""},{"no":42,"name":"Society for Young Business Leaders","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Mohammad Shibli Shahriar","president":"Israt Jahan","president_contact":"8801773314267","general_secretary":"Tahmid Ahamed","gs_contact":"8801620662584"},{"no":43,"name":"HR Club","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Khadiza Rahman Tanchi","president":"Mahmuda Akter Moly","president_contact":"8801929985620","general_secretary":"Snigdha Mandal Niha","gs_contact":"8801746258006"},{"no":44,"name":"Marketing Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Sharmin Jahan","president":"Sakhwat Hossain Emon","president_contact":"8801761696767","general_secretary":"Partho Ghosh","gs_contact":"8801924255338"},{"no":45,"name":"ITM Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Nafees Imran","president":"Eliyas Ahmed Bin Hashem","president_contact":"","general_secretary":"Shahriyar Tanvir","gs_contact":""},{"no":46,"name":"Civil Engineering Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Kazi Obaidur Rahman","president":"Arindom Biswas Rudro","president_contact":"","general_secretary":"Atiqur Rahman","gs_contact":""},{"no":47,"name":"Finance Club","type":"Departmental Club","status":"Inactive","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Ms. Sabrina Akhter","president":"Md. Akibuzzaman","president_contact":"8801644000296","general_secretary":"Sadia Afrin Porna","gs_contact":"8801956931583"},{"no":48,"name":"DIU EEE Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Md. Sohel Rana","president":"Talha Ibna Tamjid Kabbo","president_contact":"8801303149941","general_secretary":"Md. Salahuddin Metul","gs_contact":"8801645819254"},{"no":49,"name":"Pharmacia Club","type":"Departmental Club","status":"Reactivated","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"","president":"Md. Ashraful Islam","president_contact":"8801866149992","general_secretary":"Muntasir Sarkar","gs_contact":"8801834761078"},{"no":50,"name":"CIS Club","type":"Departmental Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Israfil","president":"Mainul Islam Tamim","president_contact":"8801639507665","general_secretary":"Sazzadu Mira","gs_contact":"8801316563825"},{"no":51,"name":"Daffodil Entrepreneurs Club","type":"Departmental Club","status":"Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Mr. Muhammad Mustafa Shakil","president":"Bayezid Chowdhury","president_contact":"8801767937890","general_secretary":"Md. Rashed Kamal","gs_contact":"8801858200206"},{"no":52,"name":"DIU Agricultural Science Club","type":"Departmental Club","status":"New Club","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Md. Shoaib Arifin","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":53,"name":"E-Business Club","type":"Central Club","status":"Partially Active","email":"This email address is being protected from spambots. You need JavaScript enabled to view it.","convener":"Dr. Omar Faruk","president":"Md. Mohaiminul Islam Noqib","president_contact":"8801708363751","general_secretary":"MD. Ashraful Islam","gs_contact":"8801929184757"},{"no":54,"name":"Daffodil AI Club","type":"Central Club","status":"New Club","email":"","convener":"Dr. Fernaz Narin Nur","president":"Md. Rony","president_contact":"8801890190638","general_secretary":"Abid Khan","gs_contact":"8801825929393"},{"no":55,"name":"DIU Accounting Club","type":"Departmental Club","status":"New Club","email":"","convener":"Md. Rayhanul Islam","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":56,"name":"DIU PESS Club","type":"Departmental Club","status":"New Club","email":"","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""},{"no":57,"name":"Software Quality Assurance & Testing Club","type":"Departmental Club","status":"New Club","email":"","convener":"","president":"","president_contact":"","general_secretary":"","gs_contact":""}];
// Stats
const activeN = CLUBS.filter(c => { const s = c.status.toLowerCase(); return s.includes('active') && !s.includes('partial') && !s.includes('inact'); }).length;
document.getElementById('s-active').textContent = activeN;
document.getElementById('s-central').textContent = CLUBS.filter(c => c.type === 'Central Club').length;
document.getElementById('s-dept').textContent = CLUBS.filter(c => c.type === 'Departmental Club').length;
// Helpers
function statusBadge(s) {
if (!s) return '<span class="na">—</span>';
const sl = s.toLowerCase();
if (sl.includes('active') && !sl.includes('partial') && !sl.includes('inact') && !sl.includes('re'))
return `<span class="badge b-active"><span class="badge-dot"></span>Active</span>`;
if (sl.includes('partial'))
return `<span class="badge b-partial"><span class="badge-dot"></span>Partial</span>`;
if (sl.includes('inact'))
return `<span class="badge b-inactive"><span class="badge-dot"></span>Inactive</span>`;
if (sl.includes('new'))
return `<span class="badge b-new"><span class="badge-dot"></span>New</span>`;
if (sl.includes('rebuild') || sl.includes('reactivat'))
return `<span class="badge b-rebuild"><span class="badge-dot"></span>Rebuild</span>`;
return `<span class="badge b-rebuild">${s}</span>`;
}
function typeBadge(t) {
if (t === 'Central Club') return `<span class="badge b-central">Central</span>`;
if (t === 'Departmental Club') return `<span class="badge b-dept">Dept.</span>`;
return '<span class="na">—</span>';
}
function emailCell(e) {
if (!e) return '<span class="na">—</span>';
return `<a class="email-a" href="mailto:${e}"><svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.3"><rect x="2" y="4" width="20" height="16" rx="2"/><polyline points="2,4 12,13 22,4"/></svg>${e}</a>`;
}
function personCell(name) {
return name ? `<span class="person-name">${name}</span>` : '<span class="na">—</span>';
}
function phoneCell(p) {
return p ? `<span class="person-phone">${p}</span>` : '<span class="na">—</span>';
}
// State
let sortCol = 'no', sortAsc = true, currentFilter = 'all', currentSearch = '';
function matches(c) {
const sl = c.status.toLowerCase();
if (currentFilter === 'active') { if (!(sl.includes('active') && !sl.includes('partial') && !sl.includes('inact'))) return false; }
else if (currentFilter === 'partial') { if (!sl.includes('partial')) return false; }
else if (currentFilter === 'inactive') { if (!sl.includes('inact')) return false; }
else if (currentFilter === 'new') { if (!sl.includes('new')) return false; }
else if (currentFilter !== 'all') { if (c.type !== currentFilter) return false; }
if (!currentSearch) return true;
const q = currentSearch.toLowerCase();
return [c.name, c.email, c.convener, c.president, c.general_secretary].some(v => v && v.toLowerCase().includes(q));
}
function getSorted(arr) {
return [...arr].sort((a, b) => {
let av = a[sortCol] ?? '', bv = b[sortCol] ?? '';
if (typeof av === 'number') return sortAsc ? av - bv : bv - av;
return sortAsc ? String(av).localeCompare(String(bv)) : String(bv).localeCompare(String(av));
});
}
function render() {
const filtered = getSorted(CLUBS.filter(matches));
const tbody = document.getElementById('tbody');
const emptyRow = document.getElementById('empty-row');
Array.from(tbody.querySelectorAll('tr:not(#empty-row)')).forEach(r => r.remove());
if (filtered.length === 0) {
emptyRow.style.display = '';
document.getElementById('rc').textContent = '0 clubs';
return;
}
emptyRow.style.display = 'none';
document.getElementById('rc').textContent = `${filtered.length} club${filtered.length !== 1 ? 's' : ''}`;
const showSections = currentFilter === 'all' && !currentSearch && sortCol === 'no';
let lastType = null;
filtered.forEach(c => {
if (showSections && c.type !== lastType) {
const sec = document.createElement('tr');
sec.className = 'sec-row';
sec.innerHTML = `<td colspan="10">${c.type || 'Other'}</td>`;
tbody.appendChild(sec);
lastType = c.type;
}
const tr = document.createElement('tr');
tr.innerHTML =
`<td class="col-no">${c.no}</td>` +
`<td class="col-name"><div class="col-name-text">${c.name}</div></td>` +
`<td class="col-sm">${typeBadge(c.type)}</td>` +
`<td class="col-sm">${statusBadge(c.status)}</td>` +
`<td class="col-email">${emailCell(c.email)}</td>` +
`<td class="col-person">${personCell(c.convener)}</td>` +
`<td class="col-person">${personCell(c.president)}</td>` +
`<td class="col-person">${phoneCell(c.president_contact)}</td>` +
`<td class="col-person">${personCell(c.general_secretary)}</td>` +
`<td class="col-person">${phoneCell(c.gs_contact)}</td>`;
tbody.appendChild(tr);
});
}
// Sort
document.querySelectorAll('thead th[data-col]').forEach(th => {
th.addEventListener('click', () => {
const col = th.dataset.col;
sortAsc = (sortCol === col) ? !sortAsc : true;
sortCol = col;
document.querySelectorAll('thead th').forEach(t => { t.classList.remove('sorted'); const a = t.querySelector('.sort-arrow'); if (a) a.textContent = '↕'; });
th.classList.add('sorted');
const arrow = th.querySelector('.sort-arrow');
if (arrow) arrow.textContent = sortAsc ? ' ↑' : ' ↓';
render();
});
});
// Filter
document.getElementById('filters').addEventListener('click', e => {
const btn = e.target.closest('.fbtn');
if (!btn) return;
document.querySelectorAll('.fbtn').forEach(b => b.classList.remove('on'));
btn.classList.add('on');
currentFilter = btn.dataset.f;
render();
});
// Search
document.getElementById('q').addEventListener('input', e => {
currentSearch = e.target.value.trim();
render();
});
render();
</script>
</body>
</html>