Add ability to hide the text box
This commit is contained in:
parent
169baf4c76
commit
58eca41435
30
src/vn.rs
30
src/vn.rs
@ -166,6 +166,10 @@ fn global_styles() -> Markup {
|
|||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
.visual-novel-box.hidden {
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
}";
|
}";
|
||||||
|
|
||||||
const CHARACTER_STYLES: &str = r"
|
const CHARACTER_STYLES: &str = r"
|
||||||
@ -253,11 +257,21 @@ fn interactive_script(total_sections: usize) -> Markup {
|
|||||||
(maud::PreEscaped(format!(r"
|
(maud::PreEscaped(format!(r"
|
||||||
let currentScene = 0;
|
let currentScene = 0;
|
||||||
const totalSections = {total_sections};
|
const totalSections = {total_sections};
|
||||||
|
let textVisible = true;
|
||||||
|
|
||||||
|
function toggleText(visible) {{
|
||||||
|
document.querySelectorAll('.visual-novel-box').forEach(box => {{
|
||||||
|
box.classList.toggle('hidden', !visible);
|
||||||
|
}});
|
||||||
|
textVisible = visible;
|
||||||
|
}}
|
||||||
|
|
||||||
function updateSection() {{
|
function updateSection() {{
|
||||||
document.querySelectorAll('.selection-section').forEach((el, index) => {{
|
document.querySelectorAll('.selection-section').forEach((el, index) => {{
|
||||||
el.style.display = index === currentScene ? 'block' : 'none';
|
el.style.display = index === currentScene ? 'block' : 'none';
|
||||||
}});
|
}});
|
||||||
|
|
||||||
|
toggleText(true);
|
||||||
document.getElementById('section-counter').textContent =
|
document.getElementById('section-counter').textContent =
|
||||||
`${{currentScene + 1}}/${{totalSections}}`;
|
`${{currentScene + 1}}/${{totalSections}}`;
|
||||||
}}
|
}}
|
||||||
@ -272,10 +286,18 @@ fn interactive_script(total_sections: usize) -> Markup {
|
|||||||
updateSection();
|
updateSection();
|
||||||
}}
|
}}
|
||||||
|
|
||||||
document.addEventListener('keydown', (e) => {{
|
function handleKeys(e) {{
|
||||||
if(e.key === 'ArrowLeft') prev();
|
switch(e.key) {{
|
||||||
if(e.key === 'ArrowRight') next();
|
case 'ArrowLeft': prev(); break;
|
||||||
}});
|
case 'ArrowRight': next(); break;
|
||||||
|
case 'ArrowDown': e.preventDefault(); toggleText(false); break;
|
||||||
|
case 'ArrowUp': e.preventDefault(); toggleText(true); break;
|
||||||
|
}}
|
||||||
|
}}
|
||||||
|
|
||||||
|
document.addEventListener('keydown', handleKeys);
|
||||||
|
|
||||||
|
toggleText(true);
|
||||||
")))
|
")))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user