Make team suggestions clickable
- Added addToTeamFromSuggestion function - Clicking a suggestion now adds it to your team (up to 4 operators) - Visual feedback with cursor pointer and + indicator
This commit is contained in:
+9
-1
@@ -556,6 +556,13 @@
|
|||||||
updateTeamUI();
|
updateTeamUI();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function addToTeamFromSuggestion(id) {
|
||||||
|
if (!selectedTeam.includes(id) && selectedTeam.length < 4) {
|
||||||
|
selectedTeam.push(id);
|
||||||
|
updateTeamUI();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function updateTeamUI() {
|
function updateTeamUI() {
|
||||||
// Update operator selection
|
// Update operator selection
|
||||||
document.querySelectorAll('.select-option').forEach(el => {
|
document.querySelectorAll('.select-option').forEach(el => {
|
||||||
@@ -624,12 +631,13 @@
|
|||||||
</div>`
|
</div>`
|
||||||
: '<div style="width:50px;height:50px;background:rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:center;border-radius:8px;font-size:20px;color:var(--text-secondary);">?</div>';
|
: '<div style="width:50px;height:50px;background:rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:center;border-radius:8px;font-size:20px;color:var(--text-secondary);">?</div>';
|
||||||
return `
|
return `
|
||||||
<div class="suggestion-item">
|
<div class="suggestion-item" onclick="addToTeamFromSuggestion('${id}')" style="cursor:pointer;transition:all 0.2s;" onmouseover="this.style.borderColor='var(--cyan)'" onmouseout="this.style.borderColor='var(--cyan)'">
|
||||||
${imgHtml}
|
${imgHtml}
|
||||||
<div class="suggestion-info">
|
<div class="suggestion-info">
|
||||||
<h5>${op ? op.name.toUpperCase() : id} ${op && op.free ? '<span style="font-size:9px;color:#39ff14;background:#000;padding:2px 6px;border-radius:3px;">FREE</span>' : ''}</h5>
|
<h5>${op ? op.name.toUpperCase() : id} ${op && op.free ? '<span style="font-size:9px;color:#39ff14;background:#000;padding:2px 6px;border-radius:3px;">FREE</span>' : ''}</h5>
|
||||||
<p>${reason}</p>
|
<p>${reason}</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div style="margin-left:auto;color:var(--cyan);font-size:20px;">+</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}).join('');
|
}).join('');
|
||||||
|
|||||||
Reference in New Issue
Block a user