clubesportsudes/team-tryouts
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix probleme avec dispos

Browse Source
This commit is contained in:
cedrick2711
2026-08-06 13:41:53 -04:00
parent d25b35c928
commit 68e3da6601
11 changed files with 582 additions and 246 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/pages/edit_profile.html
-190
View File
@@ -104,25 +104,6 @@
<input type="password" id="password" name="password" placeholder="Enter new password">
</div>
{% if user.role == 'player' %}
<hr class="section-divider">
<h4 class="section-title"><i class="fas fa-clock"></i> My Disponibilities</h4>
<p class="text-muted small">Select your available time blocks for matches (5pm to 12am). Green = selected, Gray = available to select.</p>
<div id="disponibilities-grid">
<p class="text-muted">Loading...</p>
</div>
<div class="form-actions">
<button type="button" class="btn btn-primary" onclick="saveDisponibilities()">
<i class="fas fa-save"></i> Save Disponibilities
</button>
<button type="button" class="btn btn-secondary" onclick="clearDisponibilities()">
<i class="fas fa-trash"></i> Clear All
</button>
</div>
{% endif %}
<div class="form-actions">
<a href="{{ url_for('users.profile') }}" class="btn btn-secondary">Cancel</a>
<button type="submit" class="btn btn-primary">Save Changes</button>
@@ -165,177 +146,6 @@ document.addEventListener('DOMContentLoaded', function() {
// Show gamertag inputs for already selected games
toggleGamertagInputs();
{% if user.role == 'player' %}
renderDisponibilityGrid();
{% endif %}
});
{% if user.role == 'player' %}
// Generate time slots from 5pm (17:00) to 12am (24:00)
var TIME_SLOTS = [];
for (var h = 17; h <= 24; h++) {
for (var m = 0; m < 60; m += 30) {
if (h === 24 && m > 0) continue;
var displayHour;
var displayAmpm;
if (h === 24) {
displayHour = 12;
displayAmpm = 'AM';
} else if (h > 12) {
displayHour = h - 12;
displayAmpm = 'PM';
} else {
displayHour = h;
displayAmpm = 'PM';
}
var timeStr = (h < 10 ? '0' : '') + h + ':' + (m < 10 ? '0' : '') + m;
var displayTime = displayHour + ':' + (m < 10 ? '0' : '') + m + ' ' + displayAmpm;
TIME_SLOTS.push({ time: timeStr, display: displayTime });
}
}
var DAYS = [
{ value: 0, name: 'Monday' },
{ value: 1, name: 'Tuesday' },
{ value: 2, name: 'Wednesday' },
{ value: 3, name: 'Thursday' },
{ value: 4, name: 'Friday' },
{ value: 5, name: 'Saturday' },
{ value: 6, name: 'Sunday' }
];
// Store selected slots: {day: [time, time, ...]}
var selectedSlots = {};
function renderDisponibilityGrid() {
var grid = document.getElementById('disponibilities-grid');
grid.innerHTML = '<div style="margin-bottom: 10px;"><strong>Click time blocks to select your available hours</strong></div>';
var container = document.createElement('div');
container.className = 'disponibility-grid';
DAYS.forEach(function(day) {
var dayRow = document.createElement('div');
dayRow.className = 'disponibility-day-row';
var dayLabel = document.createElement('div');
dayLabel.className = 'disponibility-day-label';
dayLabel.textContent = day.name;
dayRow.appendChild(dayLabel);
var timeBlocks = document.createElement('div');
timeBlocks.className = 'disponibility-time-blocks';
TIME_SLOTS.forEach(function(slot) {
var block = document.createElement('div');
block.className = 'disponibility-time-block';
block.dataset.day = day.value;
block.dataset.time = slot.time;
block.textContent = slot.display;
block.onclick = function() {
toggleSlot(day.value, slot.time, block);
};
timeBlocks.appendChild(block);
});
dayRow.appendChild(timeBlocks);
container.appendChild(dayRow);
});
grid.appendChild(container);
loadMyDisponibilities();
}
function toggleSlot(day, time, element) {
if (!selectedSlots[day]) selectedSlots[day] = [];
var index = selectedSlots[day].indexOf(time);
if (index > -1) {
selectedSlots[day].splice(index, 1);
element.classList.remove('selected');
} else {
selectedSlots[day].push(time);
element.classList.add('selected');
}
}
function loadMyDisponibilities() {
fetch('{{ url_for("users.get_my_disponibilities") }}')
.then(function(response) { return response.json(); })
.then(function(data) {
selectedSlots = {};
for (var day in data) {
var slots = data[day];
slots.forEach(function(slot) {
selectedSlots[day] = selectedSlots[day] || [];
selectedSlots[day].push(slot.start_time);
});
}
document.querySelectorAll('.disponibility-time-block').forEach(function(block) {
var day = block.dataset.day;
var time = block.dataset.time;
if (selectedSlots[day] && selectedSlots[day].indexOf(time) > -1) {
block.classList.add('selected');
} else {
block.classList.remove('selected');
}
});
})
.catch(function(error) {
console.error('Error loading disponibilities:', error);
});
}
function saveDisponibilities() {
var slots = [];
for (var day in selectedSlots) {
selectedSlots[day].forEach(function(time) {
slots.push({ day_of_week: parseInt(day), start_time: time });
});
}
fetch('{{ url_for("users.add_disponibilities_bulk") }}', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ slots: slots })
})
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
var msg = document.createElement('div');
msg.className = 'alert alert-success';
msg.style.marginTop = '10px';
msg.innerHTML = '<i class="fas fa-check"></i> Disponibilities saved successfully!';
document.getElementById('disponibilities-grid').appendChild(msg);
setTimeout(function() { msg.remove(); }, 3000);
}
})
.catch(function(error) {
console.error('Error saving disponibilities:', error);
});
}
function clearDisponibilities() {
if (!confirm('Are you sure you want to clear all your disponibilities?')) return;
fetch('{{ url_for("users.clear_disponibilities") }}', {
method: 'POST'
})
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
selectedSlots = {};
document.querySelectorAll('.disponibility-time-block').forEach(function(block) {
block.classList.remove('selected');
});
}
});
}
{% endif %}
</script>
{% endblock %}