-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathheader.js
More file actions
175 lines (169 loc) · 9.76 KB
/
Copy pathheader.js
File metadata and controls
175 lines (169 loc) · 9.76 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
class Nav {
constructor() {
this.el = document.getElementById('header-wrap');
if (!this.el) return;
var page = document.body.getAttribute('data-page') || 'home';
this.el.innerHTML = this.render(page);
// If main.js already ran, re-bind mobile menu / sticky / onePageNav
if (window.FingerCoderNav && typeof FingerCoderNav.reinit === 'function') {
FingerCoderNav.reinit();
}
}
isHome(page) {
return page === 'home';
}
render = (page) => {
var home = this.isHome(page);
var h = (hash) => (home ? hash : 'index.html' + hash);
var eventsActive = page === 'events' ? ' active' : '';
var galleryActive = page === 'gallery' ? ' active' : '';
var videosActive = page === 'videos' ? ' active' : '';
// solid white bar on inner pages (no dark hero slider behind)
var solidClass = home ? '' : ' nav-solid';
return `
<nav class="navbar navbar-expand-lg fixed-top scrolling-navbar${solidClass}" role="navigation" aria-label="منوی اصلی">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#main-navbar"
aria-controls="main-navbar" aria-expanded="false" aria-label="باز و بسته کردن منو">
<span class="navbar-toggler-icon"></span>
<span class="icon-menu"></span>
<span class="icon-menu"></span>
<span class="icon-menu"></span>
</button>
<a href="index.html" class="navbar-brand" title="صفحه اصلی فینگرکدر">
<img src="assets/img/logo.png" width="120" height="40" alt="لوگوی جامعه فینگرکدر">
</a>
</div>
<div class="collapse navbar-collapse" id="main-navbar">
<ul class="navbar-nav justify-content-center">
<li class="nav-item${page === 'home' ? ' active' : ''}">
<a class="nav-link" href="${h('#header-wrap')}"${page === 'home' ? ' aria-current="page"' : ''}>خانه</a>
</li>
<li class="nav-item">
<a class="nav-link" href="${h('#services')}">چرا فینگرکدر</a>
</li>
<li class="nav-item${eventsActive}">
<a class="nav-link external" href="events.html"${page === 'events' ? ' aria-current="page"' : ''}>نشستها</a>
</li>
<li class="nav-item${videosActive}">
<a class="nav-link external" href="videos.html"${page === 'videos' ? ' aria-current="page"' : ''}>ویدیوها</a>
</li>
<li class="nav-item">
<a class="nav-link" href="${h('#team')}">تیم اجرایی</a>
</li>
<li class="nav-item${galleryActive}">
<a class="nav-link external" href="gallery.html"${page === 'gallery' ? ' aria-current="page"' : ''}>تصاویر</a>
</li>
<li class="nav-item">
<a class="nav-link" href="${h('#faq')}">سوالات متداول</a>
</li>
<li class="nav-item">
<a class="nav-link" href="${h('#sponsors')}">حامیان</a>
</li>
<li class="nav-item">
<a class="nav-link" href="${h('#pricing')}">حامی شو</a>
</li>
<li class="nav-item">
<a class="nav-link" href="${h('#contact')}">تماس با ما</a>
</li>
</ul>
</div>
</div>
<ul class="mobile-menu">
<li><a class="page-scroll" href="${h('#header-wrap')}">خانه</a></li>
<li><a class="page-scroll" href="${h('#services')}">چرا فینگرکدر</a></li>
<li><a class="page-scroll" href="events.html">نشستها</a></li>
<li><a class="page-scroll" href="videos.html">ویدیوها</a></li>
<li><a class="page-scroll" href="${h('#team')}">تیم اجرایی</a></li>
<li><a class="page-scroll" href="gallery.html">تصاویر</a></li>
<li><a class="page-scroll" href="${h('#faq')}">سوالات متداول</a></li>
<li><a class="page-scroll" href="${h('#sponsors')}">حامیان</a></li>
<li><a class="page-scroll" href="${h('#pricing')}">حامی شو</a></li>
<li><a class="page-scroll" href="${h('#contact')}">تماس با ما</a></li>
</ul>
</nav>
${
home
? `
<div id="main-slide" class="carousel slide carousel-fade" data-ride="carousel" data-interval="6500" aria-label="اسلایدر معرفی فینگرکدر">
<ol class="carousel-indicators">
<li data-target="#main-slide" data-slide-to="0" class="active" aria-label="اسلاید ۱"></li>
<li data-target="#main-slide" data-slide-to="1" aria-label="اسلاید ۲"></li>
<li data-target="#main-slide" data-slide-to="2" aria-label="اسلاید ۳"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<div class="slide-media">
<img src="assets/img/slider/slide1.jpeg" width="1600" height="900" alt="فینگرکدر — دورهمی هفتگی برنامهنویسان" fetchpriority="high" decoding="async">
</div>
<div class="carousel-caption">
<div class="slide-panel">
<span class="slide-kicker">جامعه برنامهنویسان · شیراز</span>
<p class="slide-eyebrow">هر هفته یک فرصت تازه برای رشد</p>
<h1 class="heading">برای من، برای تو، برای همه</h1>
<p class="slide-lead">فینگرکدر جاییست برای ارائه، یادگیری و شبکهسازی واقعی — نه فقط اسلاید و شعار.</p>
<div class="slide-actions">
<a href="events.html" class="btn btn-common btn-lg">نشستهای جاری</a>
<a href="#services" class="btn btn-border btn-lg">چرا فینگرکدر؟</a>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="slide-media">
<img src="assets/img/slider/slide2.jpeg" width="1600" height="900" alt="ارائهدهندگان نشستهای فینگرکدر" loading="lazy" decoding="async">
</div>
<div class="carousel-caption">
<div class="slide-panel">
<span class="slide-kicker">دانش از دل تجربه</span>
<p class="slide-eyebrow">از جونیور تا سنیور</p>
<h1 class="heading">بیش از ۴۰ نشست برگزارشده</h1>
<p class="slide-lead">موضوعات وب، بکاند، سئو، امنیت، DevOps و بازار کار — با صدای خود برنامهنویسان.</p>
<div class="slide-stats">
<span class="slide-stat"><strong>۴۰+</strong> نشست</span>
<span class="slide-stat"><strong>۲۲+</strong> ارائهدهنده</span>
</div>
<div class="slide-actions">
<a href="events.html" class="btn btn-common btn-lg">آرشیو نشستها</a>
<a href="https://t.me/fingercoder" class="btn btn-border btn-lg" target="_blank" rel="noopener noreferrer">درخواست ارائه</a>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="slide-media">
<img src="assets/img/slider/slide3.jpeg" width="1600" height="900" alt="شرکتکنندگان حضوری فینگرکدر" loading="lazy" decoding="async">
</div>
<div class="carousel-caption">
<div class="slide-panel">
<span class="slide-kicker">جامعهای زنده</span>
<p class="slide-eyebrow">حضور واقعی، ارتباط ماندگار</p>
<h1 class="heading">۵۶۰+ شرکتکننده حضوری</h1>
<p class="slide-lead">ظرفیت محدود هر نشست یعنی کیفیت بالاتر، گفتوگوی جدیتر و دوستان جدید در اکوسیستم IT.</p>
<div class="slide-stats">
<span class="slide-stat"><strong>۵۰</strong> نفر ظرفیت</span>
<span class="slide-stat"><strong>۳</strong> شهر</span>
</div>
<div class="slide-actions">
<a href="gallery.html" class="btn btn-common btn-lg">گالری تصاویر</a>
<a href="#timer" class="btn btn-border btn-lg">نشست بعدی</a>
</div>
</div>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#main-slide" role="button" data-slide="prev" aria-label="اسلاید قبلی">
<span class="carousel-control" aria-hidden="true"><i class="lni-chevron-left"></i></span>
<span class="sr-only">قبلی</span>
</a>
<a class="carousel-control-next" href="#main-slide" role="button" data-slide="next" aria-label="اسلاید بعدی">
<span class="carousel-control" aria-hidden="true"><i class="lni-chevron-right"></i></span>
<span class="sr-only">بعدی</span>
</a>
</div>`
: ''
}`;
};
}
new Nav();