mePixel/ccl4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ Updated dialogbuilder to make speaker names bold

Browse Source
This commit is contained in:
AgentSchmisch 2025-06-13 16:39:38 +02:00
parent 9fbcf3d566
commit 6a51629359
1 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
dialogBuilder.html
View File

@ -182,7 +182,8 @@
const selectedPart = getSelectedDialoguePart();
dialogue[selectedPart].push({
speaker: speakerName,
// Wrap the speaker name with <b> tags for JSON output
speaker: `<b>${speakerName}</b>`,
text: lineText
});
@ -240,18 +241,19 @@
p.dataset.part = partKey; // Store the part key
p.dataset.index = index; // Store the index within the part array
// Apply different styles based on the speaker
if (line.speaker === party1NameInput.value) {
// Apply different styles based on the speaker (checking against un-bolded names for comparison)
if (line.speaker.replace(/<\/?b>/g, '') === party1NameInput.value) { // Remove <b> tags for comparison
p.classList.add('bg-blue-100', 'self-start', 'mr-auto');
} else if (line.speaker === party2NameInput.value) {
} else if (line.speaker.replace(/<\/?b>/g, '') === party2NameInput.value) { // Remove <b> tags for comparison
p.classList.add('bg-green-100', 'self-end', 'ml-auto');
lineWrapper.classList.add('justify-end'); // Align wrapper to end for party 2
} else {
// Fallback for speaker names that might not match inputs
// Fallback for speaker names that might not match inputs or have other formatting
p.classList.add('bg-gray-100');
}
p.innerHTML = `<span class="font-bold text-gray-700">${line.speaker}:</span> <span class="line-text">${line.text}</span>`;
// Set innerHTML directly, allowing the <b> tag from the 'speaker' property to render
p.innerHTML = `${line.speaker}: <span class="line-text">${line.text}</span>`;
// Add blur event listener for editing
p.addEventListener('blur', (event) => {
@ -388,6 +390,7 @@
// Event Listeners
addParty1Btn.addEventListener('click', () => addDialogueLine(party1NameInput.value));
// Corrected: changed party22NameInput to party2NameInput
addParty2Btn.addEventListener('click', () => addDialogueLine(party2NameInput.value));
generateJsonBtn.addEventListener('click', generateJson);
copyJsonBtn.addEventListener('click', copyJsonToClipboard);