blob: 3fa3ad18fe717899335c4115a804d680dd0fbee2 (
plain) (
blame)
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
|
{% extends "base.html" %}
{% block title %}{{ poll.title }} - SlotFinder{% endblock %}
{% block bodyclass %}poll-view{% endblock %}
{% block content %}
<div class="poll-page">
<div id="loading-overlay" class="loading-overlay">
<div class="loading-spinner"></div>
</div>
<header class="poll-header">
<h1>{{ poll.title }}</h1>
{% if poll.description %}<p class="poll-desc">{{ poll.description }}</p>{% endif %}
<div class="participants-section">
<span class="participants-label">Participants:</span>
<div id="participants-list" class="participants-list"></div>
<div id="join-section" class="join-section" style="display:none">
<button id="join-btn" class="btn btn-primary">Join Poll</button>
</div>
<div id="admin-section" class="admin-section" style="display:none;">
<button id="edit-btn" class="btn btn-small">Edit</button>
<button id="lock-btn" class="btn btn-small">🔓 Lock</button>
<button id="delete-btn" class="btn btn-small btn-danger">Delete</button>
</div>
<div id="locked-notice" class="locked-notice" style="display:none;">🔒 This poll has been locked by the organizer</div>
</div>
</header>
<!-- Guest join modal -->
<div id="guest-modal" class="modal-overlay" style="display:none;">
<div class="modal">
<button id="guest-modal-close" class="modal-close">×</button>
<h3>Join Poll</h3>
<p class="modal-subtitle">Enter your name to join, or <a href="{{ url_for('login') }}">sign in</a> instead.</p>
<div class="modal-form">
<input type="text" id="guest-display-name" placeholder="Your Name" required>
</div>
<div class="modal-actions">
<span id="guest-modal-error" class="modal-error"></span>
<button id="guest-modal-join" class="btn btn-primary">Join</button>
</div>
</div>
</div>
<!-- Edit poll modal -->
<div id="edit-modal" class="modal-overlay" style="display:none;">
<div class="modal modal-large">
<button id="edit-modal-close" class="modal-close">×</button>
<h3>Edit Poll</h3>
<div class="modal-form">
<input type="text" id="edit-poll-title" placeholder="Poll Title" required>
<textarea id="edit-poll-description" placeholder="Description (optional)"></textarea>
<label class="form-label">Available Dates</label>
<div class="calendar-nav">
<button type="button" id="edit-prev-month"><</button>
<span id="edit-month-year"></span>
<button type="button" id="edit-next-month">></button>
</div>
<div class="calendar" id="edit-calendar"></div>
<p class="hint">Click to toggle, Shift+click for range. Removing dates will discard existing responses for those days.</p>
<label class="checkbox-option">
<input type="checkbox" id="edit-allow-anonymous">
<span>Allow non-logged in users to view and join</span>
</label>
</div>
<div class="modal-actions">
<span id="edit-modal-error" class="modal-error"></span>
<button id="edit-modal-save" class="btn btn-primary">Save Changes</button>
</div>
</div>
</div>
<div class="poll-content">
<div class="panel results-panel">
<table id="results-table">
<thead>
<tr>
<th>Time Slot</th>
<th>Available</th>
<th>
<span id="attendees-mode-available" class="attendees-mode-toggle active">Attendees</span>
<span class="attendees-mode-separator">/</span>
<span id="attendees-mode-unavailable" class="attendees-mode-toggle">Unavailable</span>
</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="panel calendar-panel">
<div class="panel-header">
<h2>Select Days <button id="reset-days-btn" class="reset-btn" title="Reset days">↻</button></h2>
<label class="view-switch">
<input type="checkbox" id="view-mode-toggle">
<span class="switch-slider"></span>
<span class="switch-label">View All</span>
</label>
</div>
<div class="calendar-nav">
<button id="prev-month"><</button>
<span id="month-year"></span>
<button id="next-month">></button>
</div>
<div class="calendar" id="calendar"></div>
<p class="hint"><span class="hint-text" id="hint-text">Ctrl+click to toggle multiple</span><span class="hint-help" id="hint-help" title="Click: Select this day Ctrl+click: Toggle without clearing Shift+click: Select range C: Clear hovered panel Shift+C: Clear all"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M478-240q21 0 35.5-14.5T528-290q0-21-14.5-35.5T478-340q-21 0-35.5 14.5T428-290q0 21 14.5 35.5T478-240Zm-36-154h74q0-33 7.5-52t42.5-52q26-26 41-49.5t15-56.5q0-56-41-86t-97-30q-57 0-92.5 30T342-618l66 26q5-18 22.5-39t53.5-21q32 0 48 17.5t16 38.5q0 20-12 37.5T506-526q-44 39-54 59t-10 73Zm38 314q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"/></svg></span></p>
<div class="calendar-actions">
<input type="text" id="note-input" class="note-input" placeholder="Add a note (optional)">
<button id="submit-btn" class="btn btn-primary" disabled><span class="btn-text">Submit Availability</span><span class="btn-check">✓ Submitted</span></button>
</div>
</div>
<div class="panel time-panel">
<h2>Select Time <button id="reset-time-btn" class="reset-btn" title="Reset time">↻</button></h2>
<div class="time-grid" id="time-grid"></div>
</div>
<div class="panel notes-panel">
<h2>Notes</h2>
<div id="notes-pane" class="notes-pane-content">
<span class="notes-pane-empty">Click a time slot to view notes</span>
</div>
</div>
</div>
</div>
{% endblock %}
{% block scripts %}
<script src="{{ url_for('static', filename='js/poll.js') }}"></script>
<script>initPoll('{{ poll.id }}', {{ 'true' if current_user.is_authenticated else 'false' }});</script>
{% endblock %}
|
