feat: populate all mood dropdowns dynamically from API
Replace hardcoded <option> lists in #mood (tab1 DM mood) and #chat-mood-select (tab7 chat mood) with empty selects populated by populateMoodDropdowns(). Respects evil mode emoji mapping. Called on DOMContentLoaded and after server cards render.
This commit is contained in:
@@ -690,20 +690,7 @@
|
|||||||
<div class="section">
|
<div class="section">
|
||||||
<label for="mood">Mood:</label>
|
<label for="mood">Mood:</label>
|
||||||
<select id="mood">
|
<select id="mood">
|
||||||
<option value="angry">💢 angry</option>
|
<option value="">Loading moods...</option>
|
||||||
<option value="asleep">💤 asleep</option>
|
|
||||||
<option value="bubbly">🫧 bubbly</option>
|
|
||||||
<option value="curious">👀 curious</option>
|
|
||||||
<option value="excited">✨ excited</option>
|
|
||||||
<option value="flirty">🫦 flirty</option>
|
|
||||||
<option value="irritated">😒 irritated</option>
|
|
||||||
<option value="melancholy">🍷 melancholy</option>
|
|
||||||
<option value="neutral" selected>neutral</option>
|
|
||||||
<option value="romantic">💌 romantic</option>
|
|
||||||
<option value="serious">👔 serious</option>
|
|
||||||
<option value="shy">👉👈 shy</option>
|
|
||||||
<option value="silly">🪿 silly</option>
|
|
||||||
<option value="sleepy">🌙 sleepy</option>
|
|
||||||
</select>
|
</select>
|
||||||
<button onclick="setMood()">Set Mood</button>
|
<button onclick="setMood()">Set Mood</button>
|
||||||
<button onclick="resetMood()">Reset Mood</button>
|
<button onclick="resetMood()">Reset Mood</button>
|
||||||
@@ -1408,19 +1395,6 @@
|
|||||||
<label style="display: block; margin-bottom: 0.5rem; font-weight: bold;">😊 Miku's Mood:</label>
|
<label style="display: block; margin-bottom: 0.5rem; font-weight: bold;">😊 Miku's Mood:</label>
|
||||||
<select id="chat-mood-select" style="width: 100%; padding: 0.5rem; background: #333; color: #fff; border: 1px solid #555; border-radius: 4px;">
|
<select id="chat-mood-select" style="width: 100%; padding: 0.5rem; background: #333; color: #fff; border: 1px solid #555; border-radius: 4px;">
|
||||||
<option value="neutral" selected>neutral</option>
|
<option value="neutral" selected>neutral</option>
|
||||||
<option value="angry">💢 angry</option>
|
|
||||||
<option value="asleep">💤 asleep</option>
|
|
||||||
<option value="bubbly">🫧 bubbly</option>
|
|
||||||
<option value="curious">👀 curious</option>
|
|
||||||
<option value="excited">✨ excited</option>
|
|
||||||
<option value="flirty">🫦 flirty</option>
|
|
||||||
<option value="irritated">😒 irritated</option>
|
|
||||||
<option value="melancholy">🍷 melancholy</option>
|
|
||||||
<option value="romantic">💌 romantic</option>
|
|
||||||
<option value="serious">👔 serious</option>
|
|
||||||
<option value="shy">👉👈 shy</option>
|
|
||||||
<option value="silly">🪿 silly</option>
|
|
||||||
<option value="sleepy">🌙 sleepy</option>
|
|
||||||
</select>
|
</select>
|
||||||
<div style="font-size: 0.85rem; color: #aaa; margin-top: 0.3rem;">
|
<div style="font-size: 0.85rem; color: #aaa; margin-top: 0.3rem;">
|
||||||
Choose Miku's emotional state for this conversation
|
Choose Miku's emotional state for this conversation
|
||||||
@@ -1990,6 +1964,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||||||
// Load initial data
|
// Load initial data
|
||||||
loadStatus();
|
loadStatus();
|
||||||
loadServers();
|
loadServers();
|
||||||
|
populateMoodDropdowns(); // Populate DM and chat mood dropdowns immediately
|
||||||
loadLastPrompt();
|
loadLastPrompt();
|
||||||
loadLogs();
|
loadLogs();
|
||||||
checkEvilModeStatus();
|
checkEvilModeStatus();
|
||||||
@@ -2465,8 +2440,35 @@ async function populateMoodDropdowns() {
|
|||||||
|
|
||||||
if (data.moods) {
|
if (data.moods) {
|
||||||
console.log(`🎭 Found ${data.moods.length} moods:`, data.moods);
|
console.log(`🎭 Found ${data.moods.length} moods:`, data.moods);
|
||||||
|
const emojiMap = evilMode ? EVIL_MOOD_EMOJIS : MOOD_EMOJIS;
|
||||||
|
|
||||||
// Clear existing mood options from all dropdowns (keep "Select Mood..." option)
|
// Populate the DM mood dropdown (#mood on tab1)
|
||||||
|
const dmMoodSelect = document.getElementById('mood');
|
||||||
|
if (dmMoodSelect) {
|
||||||
|
dmMoodSelect.innerHTML = '';
|
||||||
|
data.moods.forEach(mood => {
|
||||||
|
const opt = document.createElement('option');
|
||||||
|
opt.value = mood;
|
||||||
|
opt.textContent = `${emojiMap[mood] || ''} ${mood}`.trim();
|
||||||
|
if (mood === 'neutral') opt.selected = true;
|
||||||
|
dmMoodSelect.appendChild(opt);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Populate the chat mood dropdown (#chat-mood-select on tab7)
|
||||||
|
const chatMoodSelect = document.getElementById('chat-mood-select');
|
||||||
|
if (chatMoodSelect) {
|
||||||
|
chatMoodSelect.innerHTML = '';
|
||||||
|
data.moods.forEach(mood => {
|
||||||
|
const opt = document.createElement('option');
|
||||||
|
opt.value = mood;
|
||||||
|
opt.textContent = `${emojiMap[mood] || ''} ${mood}`.trim();
|
||||||
|
if (mood === 'neutral') opt.selected = true;
|
||||||
|
chatMoodSelect.appendChild(opt);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Populate per-server mood dropdowns (mood-select-{guildId})
|
||||||
document.querySelectorAll('[id^="mood-select-"]').forEach(select => {
|
document.querySelectorAll('[id^="mood-select-"]').forEach(select => {
|
||||||
// Keep only the first option ("Select Mood...")
|
// Keep only the first option ("Select Mood...")
|
||||||
while (select.children.length > 1) {
|
while (select.children.length > 1) {
|
||||||
@@ -2474,19 +2476,17 @@ async function populateMoodDropdowns() {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// Update all mood dropdowns
|
|
||||||
data.moods.forEach(mood => {
|
data.moods.forEach(mood => {
|
||||||
const moodOption = document.createElement('option');
|
const moodOption = document.createElement('option');
|
||||||
moodOption.value = mood;
|
moodOption.value = mood;
|
||||||
moodOption.textContent = `${mood} ${MOOD_EMOJIS[mood] || ''}`;
|
moodOption.textContent = `${mood} ${emojiMap[mood] || ''}`;
|
||||||
|
|
||||||
// Add to all mood dropdowns
|
|
||||||
document.querySelectorAll('[id^="mood-select-"]').forEach(select => {
|
document.querySelectorAll('[id^="mood-select-"]').forEach(select => {
|
||||||
select.appendChild(moodOption.cloneNode(true));
|
select.appendChild(moodOption.cloneNode(true));
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log('🎭 Mood dropdowns populated successfully');
|
console.log('🎭 All mood dropdowns populated successfully');
|
||||||
} else {
|
} else {
|
||||||
console.warn('🎭 No moods found in response');
|
console.warn('🎭 No moods found in response');
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user