Maciej Pienczyn
5229433ea8
Some checks are pending
NordaBiz Tests / Unit & Integration Tests (push) Waiting to run
NordaBiz Tests / E2E Tests (Playwright) (push) Blocked by required conditions
NordaBiz Tests / Smoke Tests (Production) (push) Blocked by required conditions
NordaBiz Tests / Send Failure Notification (push) Blocked by required conditions
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
729 lines
26 KiB
HTML
Executable File
729 lines
26 KiB
HTML
Executable File
{% extends "base.html" %}
|
|
|
|
{% block title %}Kalendarz - Norda Biznes Partner{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<style>
|
|
.calendar-header {
|
|
margin-bottom: var(--spacing-lg);
|
|
}
|
|
|
|
.calendar-header h1 {
|
|
font-size: var(--font-size-3xl);
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
/* Toolbar z przyciskami widoku */
|
|
.calendar-toolbar {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: var(--spacing-xl);
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-md);
|
|
background: var(--surface);
|
|
padding: var(--spacing-md);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: var(--shadow);
|
|
}
|
|
|
|
.view-toggle {
|
|
display: flex;
|
|
gap: 2px;
|
|
background: var(--border);
|
|
border-radius: var(--radius);
|
|
padding: 2px;
|
|
}
|
|
|
|
.view-toggle a {
|
|
padding: var(--spacing-sm) var(--spacing-md);
|
|
text-decoration: none;
|
|
color: var(--text-secondary);
|
|
border-radius: var(--radius-sm);
|
|
font-size: var(--font-size-sm);
|
|
font-weight: 500;
|
|
transition: var(--transition);
|
|
}
|
|
|
|
.view-toggle a.active {
|
|
background: var(--primary);
|
|
color: white;
|
|
}
|
|
|
|
.view-toggle a:not(.active):hover {
|
|
background: var(--surface);
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.month-nav {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-md);
|
|
}
|
|
|
|
.month-nav a {
|
|
padding: var(--spacing-xs) var(--spacing-sm);
|
|
text-decoration: none;
|
|
color: var(--text-secondary);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius-sm);
|
|
font-size: var(--font-size-sm);
|
|
transition: var(--transition);
|
|
}
|
|
|
|
.month-nav a:hover {
|
|
background: var(--surface-hover, #f3f4f6);
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.current-month {
|
|
font-weight: 600;
|
|
font-size: var(--font-size-lg);
|
|
min-width: 160px;
|
|
text-align: center;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
/* Siatka kalendarza */
|
|
.calendar-grid {
|
|
background: var(--surface);
|
|
border-radius: var(--radius-lg);
|
|
overflow: hidden;
|
|
box-shadow: var(--shadow);
|
|
}
|
|
|
|
.calendar-header-row {
|
|
display: grid;
|
|
grid-template-columns: repeat(7, 1fr);
|
|
}
|
|
|
|
.day-header {
|
|
padding: var(--spacing-sm);
|
|
text-align: center;
|
|
font-weight: 600;
|
|
font-size: var(--font-size-sm);
|
|
background: var(--primary);
|
|
color: white;
|
|
}
|
|
|
|
.day-header.weekend {
|
|
background: #1e40af;
|
|
}
|
|
|
|
.calendar-week {
|
|
display: grid;
|
|
grid-template-columns: repeat(7, 1fr);
|
|
}
|
|
|
|
.calendar-day {
|
|
min-height: 110px;
|
|
padding: var(--spacing-xs);
|
|
border: 1px solid var(--border);
|
|
border-top: none;
|
|
background: var(--background);
|
|
vertical-align: top;
|
|
}
|
|
|
|
.calendar-day:not(:last-child) {
|
|
border-right: none;
|
|
}
|
|
|
|
.calendar-day.empty {
|
|
background: #f9fafb;
|
|
}
|
|
|
|
.calendar-day.today {
|
|
background: #eff6ff;
|
|
border-color: var(--primary);
|
|
border-width: 2px;
|
|
}
|
|
|
|
.calendar-day.weekend {
|
|
background: #fafafa;
|
|
}
|
|
|
|
.day-number {
|
|
font-weight: 600;
|
|
font-size: var(--font-size-sm);
|
|
margin-bottom: var(--spacing-xs);
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.calendar-day.today .day-number {
|
|
color: var(--primary);
|
|
}
|
|
|
|
.calendar-event {
|
|
display: block;
|
|
padding: 3px 6px;
|
|
margin-bottom: 3px;
|
|
border-radius: var(--radius-sm);
|
|
font-size: 11px;
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
transition: var(--transition);
|
|
}
|
|
|
|
.calendar-event:hover {
|
|
opacity: 0.8;
|
|
transform: scale(1.02);
|
|
}
|
|
|
|
.calendar-event.meeting {
|
|
background: #dbeafe;
|
|
color: #1e40af;
|
|
}
|
|
|
|
.calendar-event.networking {
|
|
background: #fef3c7;
|
|
color: #92400e;
|
|
}
|
|
|
|
.calendar-event.webinar {
|
|
background: #dcfce7;
|
|
color: #166534;
|
|
}
|
|
|
|
.calendar-event.other {
|
|
background: #f3e8ff;
|
|
color: #7c3aed;
|
|
}
|
|
|
|
.calendar-event.external {
|
|
background: #f1f5f9;
|
|
color: #475569;
|
|
border-left: 2px solid #94a3b8;
|
|
}
|
|
|
|
/* Widok listy - istniejące style */
|
|
.events-section {
|
|
margin-bottom: var(--spacing-2xl);
|
|
}
|
|
|
|
.events-section h2 {
|
|
font-size: var(--font-size-xl);
|
|
margin-bottom: var(--spacing-lg);
|
|
color: var(--text-primary);
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-sm);
|
|
}
|
|
|
|
.event-card {
|
|
background: var(--surface);
|
|
border-radius: var(--radius-lg);
|
|
padding: var(--spacing-lg);
|
|
margin-bottom: var(--spacing-md);
|
|
box-shadow: var(--shadow);
|
|
display: flex;
|
|
gap: var(--spacing-lg);
|
|
transition: var(--transition);
|
|
}
|
|
|
|
.event-card:hover {
|
|
box-shadow: var(--shadow-md);
|
|
}
|
|
|
|
.event-card.featured {
|
|
border-left: 4px solid var(--primary);
|
|
}
|
|
|
|
.event-card.past {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.event-date-box {
|
|
min-width: 70px;
|
|
text-align: center;
|
|
background: var(--primary);
|
|
color: white;
|
|
border-radius: var(--radius);
|
|
padding: var(--spacing-sm);
|
|
}
|
|
|
|
.event-date-box .day {
|
|
font-size: var(--font-size-2xl);
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
}
|
|
|
|
.event-date-box .month {
|
|
font-size: var(--font-size-sm);
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.event-info {
|
|
flex: 1;
|
|
}
|
|
|
|
.event-title {
|
|
font-size: var(--font-size-lg);
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin-bottom: var(--spacing-xs);
|
|
}
|
|
|
|
.event-title a {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.event-title a:hover {
|
|
color: var(--primary);
|
|
}
|
|
|
|
.event-meta {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-md);
|
|
font-size: var(--font-size-sm);
|
|
color: var(--text-secondary);
|
|
margin-bottom: var(--spacing-sm);
|
|
}
|
|
|
|
.event-meta span {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-xs);
|
|
}
|
|
|
|
.event-description {
|
|
color: var(--text-secondary);
|
|
font-size: var(--font-size-sm);
|
|
}
|
|
|
|
.event-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-sm);
|
|
}
|
|
|
|
.attendee-count {
|
|
font-size: var(--font-size-sm);
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.empty-state {
|
|
text-align: center;
|
|
padding: var(--spacing-2xl);
|
|
color: var(--text-secondary);
|
|
background: var(--surface);
|
|
border-radius: var(--radius-lg);
|
|
}
|
|
|
|
.badge-type {
|
|
display: inline-block;
|
|
padding: 2px 8px;
|
|
border-radius: var(--radius-sm);
|
|
font-size: var(--font-size-xs);
|
|
font-weight: 500;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.badge-type.meeting { background: #dbeafe; color: #1e40af; }
|
|
.badge-type.webinar { background: #dcfce7; color: #166534; }
|
|
.badge-type.networking { background: #fef3c7; color: #92400e; }
|
|
.badge-type.other { background: #f3e8ff; color: #7c3aed; }
|
|
.badge-type.external { background: #f1f5f9; color: #475569; }
|
|
|
|
.event-card.external-event {
|
|
border-left: 3px solid #94a3b8;
|
|
opacity: 0.92;
|
|
}
|
|
|
|
.event-card.external-event .event-date-box {
|
|
background: #64748b;
|
|
}
|
|
|
|
.external-source {
|
|
font-size: var(--font-size-xs);
|
|
color: var(--text-secondary);
|
|
font-style: italic;
|
|
}
|
|
|
|
.filter-toggle {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-xs);
|
|
font-size: var(--font-size-sm);
|
|
color: var(--text-secondary);
|
|
cursor: pointer;
|
|
user-select: none;
|
|
}
|
|
|
|
.filter-toggle input { width: auto; }
|
|
|
|
.rsvp-list-btn { min-width: 110px; transition: var(--transition); }
|
|
.rsvp-list-btn.rsvp-attending {
|
|
background: #059669;
|
|
border-color: #059669;
|
|
color: white;
|
|
}
|
|
.rsvp-list-btn.rsvp-attending:hover {
|
|
background: #dc2626;
|
|
border-color: #dc2626;
|
|
}
|
|
.rsvp-list-btn.rsvp-not-attending {
|
|
background: #2563eb;
|
|
border-color: #2563eb;
|
|
color: white;
|
|
}
|
|
.rsvp-list-btn.rsvp-not-attending:hover {
|
|
background: #1d4ed8;
|
|
border-color: #1d4ed8;
|
|
}
|
|
|
|
/* Responsywność */
|
|
@media (max-width: 768px) {
|
|
.calendar-toolbar {
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
}
|
|
|
|
.month-nav {
|
|
justify-content: center;
|
|
}
|
|
|
|
.calendar-day {
|
|
min-height: 80px;
|
|
padding: 2px;
|
|
}
|
|
|
|
.calendar-event {
|
|
font-size: 10px;
|
|
padding: 2px 4px;
|
|
}
|
|
|
|
.day-header {
|
|
font-size: var(--font-size-xs);
|
|
padding: var(--spacing-xs);
|
|
}
|
|
|
|
.event-card {
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.event-actions {
|
|
width: 100%;
|
|
justify-content: flex-start;
|
|
padding-top: var(--spacing-sm);
|
|
border-top: 1px solid var(--border);
|
|
margin-top: var(--spacing-sm);
|
|
}
|
|
|
|
.calendar-header h1 {
|
|
font-size: var(--font-size-xl);
|
|
}
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% set pl_months = {'Jan':'sty','Feb':'lut','Mar':'mar','Apr':'kwi','May':'maj','Jun':'cze','Jul':'lip','Aug':'sie','Sep':'wrz','Oct':'paź','Nov':'lis','Dec':'gru'} %}
|
|
{% set pl_types = {'meeting':'Spotkanie','networking':'Networking','webinar':'Webinar','other':'Inne','conference':'Konferencja','workshop':'Warsztaty'} %}
|
|
|
|
{% block content %}
|
|
<div class="calendar-header">
|
|
<h1>Kalendarz wydarzeń</h1>
|
|
<div style="display: flex; align-items: center; gap: var(--spacing-md); flex-wrap: wrap;">
|
|
<p class="text-muted" style="margin: 0;">Spotkania i wydarzenia Norda Biznes</p>
|
|
<button onclick="showSubscribeModal()" style="display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; border-radius: var(--radius); font-size: 13px; cursor: pointer; font-weight: 500; white-space: nowrap;">
|
|
<svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
|
|
Subskrybuj kalendarz
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Subscribe modal -->
|
|
<div id="subscribeModal" style="display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); z-index:9999; align-items:center; justify-content:center;">
|
|
<div style="background:white; border-radius:var(--radius-xl); padding:24px; max-width:500px; width:90%; margin:auto; position:relative; top:50%; transform:translateY(-50%);">
|
|
<button onclick="document.getElementById('subscribeModal').style.display='none'" style="position:absolute; top:12px; right:16px; background:none; border:none; font-size:20px; cursor:pointer; color:#64748b;">×</button>
|
|
<h3 style="margin:0 0 8px 0; font-size:18px;">Dodaj wydarzenia do kalendarza</h3>
|
|
<p style="color:#64748b; font-size:13px; line-height:1.5; margin-bottom:16px;">
|
|
Skopiuj poniższy link i dodaj go jako subskrypcję w swoim kalendarzu.
|
|
Wydarzenia Izby będą się automatycznie synchronizować.
|
|
</p>
|
|
<div style="display:flex; gap:8px; margin-bottom:16px;">
|
|
<input id="icalUrl" readonly value="https://nordabiznes.pl/kalendarz/ical" style="flex:1; padding:8px 12px; border:1px solid #d1d5db; border-radius:var(--radius); font-size:13px; background:#f9fafb; font-family:monospace;">
|
|
<button onclick="copyIcalUrl()" id="copyBtn" style="padding:8px 16px; background:#1d4ed8; color:white; border:none; border-radius:var(--radius); font-size:13px; cursor:pointer; font-weight:500; white-space:nowrap;">Kopiuj</button>
|
|
</div>
|
|
<div style="font-size:12px; color:#64748b; line-height:1.6;">
|
|
<strong>Jak dodać:</strong><br>
|
|
<strong>iPhone/Mac:</strong> Ustawienia → Konta → Dodaj konto → Inne → Subskrypcja kalendarza → wklej link<br>
|
|
<strong>Google Calendar:</strong> Inne kalendarze (+) → Z adresu URL → wklej link<br>
|
|
<strong>Outlook:</strong> Dodaj kalendarz → Subskrybuj z internetu → wklej link
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Toolbar z przyciskami widoku -->
|
|
<div class="calendar-toolbar">
|
|
<div class="view-toggle">
|
|
<a href="?view=list" class="{% if view_mode == 'list' %}active{% endif %}">
|
|
Lista
|
|
</a>
|
|
<a href="?view=grid&year={{ year }}&month={{ month }}" class="{% if view_mode == 'grid' %}active{% endif %}">
|
|
Kalendarz
|
|
</a>
|
|
</div>
|
|
|
|
{% if view_mode == 'grid' %}
|
|
<div class="month-nav">
|
|
<a href="?view=grid&year={{ prev_year }}&month={{ prev_month }}">← Poprzedni</a>
|
|
<span class="current-month">{{ month_name }} {{ year }}</span>
|
|
<a href="?view=grid&year={{ next_year }}&month={{ next_month }}">Następny →</a>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<label class="filter-toggle" id="external-filter-label" style="display: none;">
|
|
<input type="checkbox" id="show-external" checked>
|
|
<span id="external-filter-text">Pokaż zewnętrzne</span>
|
|
</label>
|
|
|
|
{% if current_user.can_access_admin_panel() %}
|
|
<a href="{{ url_for('admin.admin_calendar') }}" class="btn btn-secondary btn-sm">Zarządzaj</a>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% if view_mode == 'grid' %}
|
|
<!-- ================ WIDOK SIATKI ================ -->
|
|
<div class="calendar-grid">
|
|
<!-- Nagłówki dni tygodnia -->
|
|
<div class="calendar-header-row">
|
|
<div class="day-header">Pon</div>
|
|
<div class="day-header">Wt</div>
|
|
<div class="day-header">Sr</div>
|
|
<div class="day-header">Czw</div>
|
|
<div class="day-header">Pt</div>
|
|
<div class="day-header weekend">Sob</div>
|
|
<div class="day-header weekend">Nd</div>
|
|
</div>
|
|
|
|
<!-- Tygodnie -->
|
|
{% for week in month_days %}
|
|
<div class="calendar-week">
|
|
{% for day in week %}
|
|
{% set is_weekend = loop.index > 5 %}
|
|
<div class="calendar-day {% if day == 0 %}empty{% endif %}{% if day == today.day and month == today.month and year == today.year %} today{% endif %}{% if is_weekend and day != 0 %} weekend{% endif %}">
|
|
{% if day != 0 %}
|
|
<div class="day-number">{{ day }}</div>
|
|
{% if day in events_by_day %}
|
|
{% for event in events_by_day[day] %}
|
|
<a href="{{ url_for('calendar.calendar_event', event_id=event.id) }}"
|
|
class="calendar-event {{ 'external' if event.is_external else event.event_type }}"
|
|
data-external="{{ 'true' if event.is_external else 'false' }}"
|
|
title="{{ event.title }}{% if event.time_start %} - {{ event.time_start.strftime('%H:%M') }}{% endif %}{% if event.is_external %} ({{ event.external_source }}){% endif %}">
|
|
{% if event.time_start %}{{ event.time_start.strftime('%H:%M') }} {% endif %}{{ event.title[:18] }}{% if event.title|length > 18 %}...{% endif %}
|
|
</a>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Legenda typów wydarzeń -->
|
|
<div style="margin-top: var(--spacing-lg); display: flex; gap: var(--spacing-lg); flex-wrap: wrap; font-size: var(--font-size-sm); color: var(--text-secondary);">
|
|
<span><span class="badge-type meeting">Spotkanie</span></span>
|
|
<span><span class="badge-type networking">Networking</span></span>
|
|
<span><span class="badge-type webinar">Webinar</span></span>
|
|
<span><span class="badge-type other">Inne</span></span>
|
|
<span><span class="badge-type external">Zewnętrzne</span></span>
|
|
</div>
|
|
|
|
{% else %}
|
|
<!-- ================ WIDOK LISTY ================ -->
|
|
|
|
<!-- Nadchodzące wydarzenia -->
|
|
<div class="events-section">
|
|
<h2>Nadchodzące wydarzenia</h2>
|
|
|
|
{% if upcoming_events %}
|
|
{% for event in upcoming_events %}
|
|
<div class="event-card {% if event.is_featured %}featured{% endif %}{% if event.is_external %} external-event{% endif %}" data-external="{{ 'true' if event.is_external else 'false' }}">
|
|
<div class="event-date-box">
|
|
<div class="day">{{ event.event_date.day }}</div>
|
|
<div class="month">{{ pl_months.get(event.event_date.strftime('%b'), event.event_date.strftime('%b')) }}</div>
|
|
</div>
|
|
<div class="event-info">
|
|
<div class="event-title">
|
|
<a href="{{ url_for('calendar.calendar_event', event_id=event.id) }}">{{ event.title }}</a>{% if event.is_external %} <span style="display:inline-block;background:#94a3b8;color:#fff;font-size:10px;padding:1px 5px;border-radius:3px;font-weight:600;vertical-align:middle;">ZEWNĘTRZNE</span>{% elif event.access_level == 'admin_only' %} <span style="display:inline-block;background:#ef4444;color:#fff;font-size:10px;padding:1px 5px;border-radius:3px;font-weight:600;vertical-align:middle;">UKRYTE</span>{% elif event.access_level == 'rada_only' %} <span style="display:inline-block;background:#f59e0b;color:#92400e;font-size:10px;padding:1px 5px;border-radius:3px;font-weight:600;vertical-align:middle;">IZBA</span>{% endif %}
|
|
</div>
|
|
{% if event.is_external and event.external_source %}
|
|
<div class="external-source">Źródło: {{ event.external_source }}</div>
|
|
{% endif %}
|
|
<div class="event-meta">
|
|
<span class="badge-type {{ 'external' if event.is_external else event.event_type }}">{{ 'Zewnętrzne' if event.is_external else pl_types.get(event.event_type, event.event_type) }}</span>
|
|
{% if event.time_start %}
|
|
<span>{{ event.time_start.strftime('%H:%M') }}{% if event.time_end %} - {{ event.time_end.strftime('%H:%M') }}{% endif %}</span>
|
|
{% endif %}
|
|
{% if event.location %}
|
|
<span>
|
|
{% if event.location_url %}
|
|
<a href="{{ event.location_url }}" target="_blank" style="color:var(--primary);text-decoration:none;">{{ event.location }}</a>
|
|
{% elif 'do ustalenia' not in event.location|lower and event.location != 'Online' %}
|
|
<a href="https://www.google.com/maps/search/{{ event.location|urlencode }}" target="_blank" style="color:var(--primary);text-decoration:none;">{{ event.location }}</a>
|
|
{% else %}
|
|
{{ event.location }}
|
|
{% endif %}
|
|
</span>
|
|
{% endif %}
|
|
{% if event.speaker_name %}
|
|
<span>Prelegent: {{ event.speaker_name }}</span>
|
|
{% endif %}
|
|
</div>
|
|
{% if event.description %}
|
|
<div class="event-description">{{ event.description|striptags|truncate(150, True) }}</div>
|
|
{% endif %}
|
|
</div>
|
|
<div class="event-actions">
|
|
{% if event.is_external %}
|
|
<span class="attendee-count">{{ event.attendee_count }} zainteresowanych</span>
|
|
{% if event.can_user_attend(current_user) %}
|
|
{% set is_attending = event.attendees|selectattr('user_id','equalto',current_user.id)|list %}
|
|
<button class="btn btn-sm rsvp-list-btn {{ 'rsvp-attending' if is_attending else 'rsvp-not-attending' }}" data-event-id="{{ event.id }}" data-attending="{{ 'true' if is_attending else 'false' }}" data-external="true" onclick="toggleListRSVP(this)" {{ 'onmouseenter=this.textContent="Nie interesuje" onmouseleave=this.textContent="Zainteresowany ✓"'|safe if is_attending }}>
|
|
{{ 'Zainteresowany ✓' if is_attending else 'Zainteresowany' }}
|
|
</button>
|
|
{% endif %}
|
|
{% else %}
|
|
<span class="attendee-count">{{ event.attendee_count }} uczestników</span>
|
|
{% if event.can_user_attend(current_user) %}
|
|
{% set is_attending = event.attendees|selectattr('user_id','equalto',current_user.id)|list %}
|
|
<button class="btn btn-sm rsvp-list-btn {{ 'rsvp-attending' if is_attending else 'rsvp-not-attending' }}" data-event-id="{{ event.id }}" data-attending="{{ 'true' if is_attending else 'false' }}" data-external="false" onclick="toggleListRSVP(this)" {{ 'onmouseenter=this.textContent="Wypisz się" onmouseleave=this.textContent="Zapisano ✓"'|safe if is_attending }}>
|
|
{{ 'Zapisano ✓' if is_attending else 'Zapisz się' }}
|
|
</button>
|
|
{% endif %}
|
|
{% endif %}
|
|
<a href="{{ url_for('calendar.calendar_event', event_id=event.id) }}" class="btn btn-outline btn-sm">Szczegóły</a>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% else %}
|
|
<div class="empty-state">
|
|
<p>Brak nadchodzących wydarzeń</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<!-- Przeszłe wydarzenia -->
|
|
{% if past_events %}
|
|
<div class="events-section">
|
|
<h2>Ostatnie wydarzenia</h2>
|
|
|
|
{% for event in past_events %}
|
|
<div class="event-card past">
|
|
<div class="event-date-box" style="background: var(--secondary);">
|
|
<div class="day">{{ event.event_date.day }}</div>
|
|
<div class="month">{{ pl_months.get(event.event_date.strftime('%b'), event.event_date.strftime('%b')) }}</div>
|
|
</div>
|
|
<div class="event-info">
|
|
<div class="event-title">
|
|
<a href="{{ url_for('calendar.calendar_event', event_id=event.id) }}">{{ event.title }}</a>
|
|
</div>
|
|
<div class="event-meta">
|
|
<span class="badge-type {{ event.event_type }}">{{ pl_types.get(event.event_type, event.event_type) }}</span>
|
|
{% if event.location %}
|
|
<span>{{ event.location }}</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="event-actions">
|
|
<span class="attendee-count">{{ event.attendee_count }} uczestników</span>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
var csrfToken = '{{ csrf_token() }}';
|
|
async function toggleListRSVP(btn) {
|
|
var eventId = btn.dataset.eventId;
|
|
var isExt = btn.dataset.external === 'true';
|
|
btn.disabled = true;
|
|
try {
|
|
var resp = await fetch('/kalendarz/' + eventId + '/rsvp', {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/json', 'X-CSRFToken': csrfToken}
|
|
});
|
|
var data = await resp.json();
|
|
if (data.success) {
|
|
var addedText = isExt ? 'Zainteresowany ✓' : 'Zapisano ✓';
|
|
var removedText = isExt ? 'Zainteresowany' : 'Zapisz się';
|
|
var hoverText = isExt ? 'Nie interesuje' : 'Wypisz się';
|
|
var countLabel = isExt ? ' zainteresowanych' : ' uczestników';
|
|
|
|
if (data.action === 'added') {
|
|
btn.textContent = addedText;
|
|
btn.classList.remove('rsvp-not-attending');
|
|
btn.classList.add('rsvp-attending');
|
|
btn.dataset.attending = 'true';
|
|
btn.onmouseenter = function() { this.textContent = hoverText; };
|
|
btn.onmouseleave = function() { this.textContent = addedText; };
|
|
} else {
|
|
btn.textContent = removedText;
|
|
btn.classList.remove('rsvp-attending');
|
|
btn.classList.add('rsvp-not-attending');
|
|
btn.dataset.attending = 'false';
|
|
btn.onmouseenter = null;
|
|
btn.onmouseleave = null;
|
|
}
|
|
var countEl = btn.parentElement.querySelector('.attendee-count');
|
|
if (countEl) countEl.textContent = data.attendee_count + countLabel;
|
|
}
|
|
} catch(e) {}
|
|
btn.disabled = false;
|
|
}
|
|
|
|
/* Filter toggle for external events */
|
|
(function() {
|
|
var cb = document.getElementById('show-external');
|
|
var label = document.getElementById('external-filter-label');
|
|
var textEl = document.getElementById('external-filter-text');
|
|
var stored = localStorage.getItem('nordabiz_show_external');
|
|
if (stored === 'false') cb.checked = false;
|
|
|
|
var extItems = document.querySelectorAll('[data-external="true"]');
|
|
var count = extItems.length;
|
|
|
|
if (count > 0) {
|
|
label.style.display = '';
|
|
textEl.textContent = 'Pokaż zewnętrzne (' + count + ')';
|
|
}
|
|
|
|
function applyFilter() {
|
|
var show = cb.checked;
|
|
localStorage.setItem('nordabiz_show_external', show);
|
|
extItems.forEach(function(el) {
|
|
el.style.display = show ? '' : 'none';
|
|
});
|
|
}
|
|
|
|
cb.addEventListener('change', applyFilter);
|
|
applyFilter();
|
|
})();
|
|
|
|
function showSubscribeModal() {
|
|
document.getElementById('subscribeModal').style.display = 'flex';
|
|
}
|
|
|
|
function copyIcalUrl() {
|
|
var input = document.getElementById('icalUrl');
|
|
input.select();
|
|
document.execCommand('copy');
|
|
var btn = document.getElementById('copyBtn');
|
|
btn.textContent = 'Skopiowano!';
|
|
setTimeout(function() { btn.textContent = 'Kopiuj'; }, 2000);
|
|
}
|
|
|
|
document.getElementById('subscribeModal').addEventListener('click', function(e) {
|
|
if (e.target === this) this.style.display = 'none';
|
|
});
|
|
{% endblock %}
|