Skip to content

Speed, accuracy, lessons logics, etc. #34

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Speed, accuracy, lessons logics, etc. #34

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3e013b2
Speed, accuracy, lessons logics, etc.
Nov 22, 2025
cc9de9b
Merge branch 'main' into change2
rebel1725 Nov 22, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
96 changes: 21 additions & 75 deletions lewa/core/templates/core/typing.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,19 +9,25 @@
<div class="level-item">
<div class="tags has-addons">
<span class="tag is-dark">Language</span>
<span class="tag is-primary">{{ writing_system.info.name }} </span>
<span class="tag is-primary"> <select id="lang-select" onchange="resetSystem()">
<option value="">--Please select--</option>
<option value="apple">Apple</option>
<option value="banana">Banana</option>
<option value="cherry">Cherry</option>
<option value="date">Date</option>
</select></span>
</div>
</div>
<div class="level-item">
<div class="tags has-addons">
<span class="tag is-dark">Lesson</span>
<span class="tag is-info">3/12</span>
<span id="lessons" class="tag is-info">3/12</span>
</div>
</div>
</div>
<div class="level-right">
<div class="level-item">
<span class="timer" id="timer">01:45</span>
<span class="timer" id="timer">00:00</span>
</div>
</div>
</div>
Expand All @@ -32,29 +38,29 @@
<span class="has-text-weight-semibold">Accuracy</span>
</div>
<div class="column">
<progress class="progress is-success" value="92" max="100">92%</progress>
<progress class="progress is-success" value="0" max="100">0%</progress>
</div>
<div class="column is-1 has-text-right">
<span class="has-text-weight-semibold">92%</span>
<span class="has-text-weight-semibold">0%</span>
</div>
</div>
<div class="columns is-mobile is-vcentered" id="div-speed">
<div class="column is-2">
<span class="has-text-weight-semibold">Speed</span>
</div>
<div class="column">
<progress class="progress is-info" value="65" max="100">65%</progress>
<progress class="progress is-info" value="0" max="100">0%</progress>
</div>
<div class="column is-1 has-text-right">
<span class="has-text-weight-semibold">18 WPM</span>
<span class="has-text-weight-semibold">0 WPM</span>
</div>
</div>
</div>
<!-- Lesson Text Display -->
<div class="box mt-5">
<div class="content is-large" id="lesson-text">
<!-- Should be Dynamically filled by JavaScript -->
M̀bɔ́lɔ́ ńtɔ́ŋ́ ǹdém bò lòndó è sómbólá è bòlóbò.
The quick brown fox jumps over the lazy dog.
</div>
</div>
<!-- User Input -->
Expand All @@ -79,13 +85,13 @@
</span>
<span>Hear Pronunciation</span>
</button>
<button id="reset-btn" class="button is-danger is-light">
<button id="reset-btn" class="button is-danger is-light" onclick="resetInput()">
<span class="icon">
<i class="fas fa-redo"></i>
</span>
<span>Reset</span>
</button>
<button id="next-btn" class="button is-success" disabled>
<button id="next-btn" class="button is-success" onclick="nextLesson()" disabled>
<span class="icon">
<i class="fas fa-arrow-right"></i>
</span>
Expand All @@ -96,76 +102,16 @@
<div class="box-mt-5">
<div id="virtual-keyboard" class="keyboard-container"></div>
</div>
{{ writing_system.layout|json_script:"keyboard_layout_data" }}
<script>
document.addEventListener("DOMContentLoaded", () => {
const layoutElement = document.getElementById('keyboard_layout_data');
if (!layoutElement) return;
const layoutData = JSON.parse(layoutElement.textContent);
const keyboardContainer = document.getElementById('virtual-keyboard');
const inputField = document.getElementById('user-input');

const resetBtnTop = document.getElementById('reset-btn');
resetBtnTop.addEventListener('click', () => {
inputField.value = "";
inputField.focus();
});

const createKey = (text, className, onClick) => {
const btn = document.createElement('button');
btn.className = `button key-btn ${className || ''}`;
btn.innerHTML = text;
btn.onclick = (e) => {
e.preventDefault();
onClick();
inputField.focus();
};
return btn;
};

Object.keys(layoutData).sort().forEach(rowKey => {
const rowDiv =document.createElement("div");
rowDiv.className = "buttons is-centered mb-2"

layoutData[rowKey].forEach(char => {
const btn = document.createElement('button');
btn.className = "button key-btn"
btn.textContent = char;
btn.onclick = () => {
inputField.value += char;
inputField.focus();
};
rowDiv.appendChild(btn);
}
);
keyboardContainer.appendChild(rowDiv);

});

const funcRow = document.createElement("div");
funcRow.className = "buttons is-centered mb-2";
const backspaceBtn = createKey('<i class="fas fa-backspace"></i>', "is-warning", () => {
inputField.value = inputField.value.slice(0, -1);
});
funcRow.appendChild(backspaceBtn);

const spaceBtn = createKey("Space", "is-light space-key", () => {
inputField.value += " ";
});
funcRow.appendChild(spaceBtn);
{{ writing_system.layout|json_script:"keyboard_layout_data" }}

const enterBtn = createKey('<i class="fas fa-level-down-alt fa-rotate-90"></i>', "is-success", () => {
inputField.value += "\n";
});
funcRow.appendChild(enterBtn);
<script src="/static/core/js/keyboard.js"></script>
<script src="/static/core/js/typing.js"></script>

keyboardContainer.appendChild(funcRow);
});
</script>
<style>
.keyboard-row { display: flex; gap: 5px;}
.key-btn { min-width: 45px;}
</style>
</div>
</section>
</div>
</section>
{% endblock content %}
1 change: 1 addition & 0 deletions lewa/static/core/data/writing_systems.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
{"qwerty-latin": {"name": "QWERTY Latin", "lessons": ["Free software is a matter of liberty, not price.", "Free software gives users the freedom to study, change and share the software.", "Proprietary software is an injustice.", "If a programme is proprietary, its users are at the mercy of its publisher.", "Users should be in control of their computing, not controlled by software publishers.", "Sharing improves software; secrecy harms users and society.", "I would like to see every programme in the world be free software.", "When software isn't free, it creates social problems, not merely technical ones.", "The goal of free software is to give users freedom and control over their computing.", "We must reject models of computing that treat users as adversaries.", "Technology must serve people's freedom, not their enslavement to corporations."], "keyboard": null}, "qwerty-latin2": {"name": "QWERTY Latin2", "lessons": ["Free software is a matter of liberty, not price.", "Free software gives users the freedom to study, change and share the software.", "Proprietary software is an injustice.", "If a programme is proprietary, its users are at the mercy of its publisher.", "Users should be in control of their computing, not controlled by software publishers.", "Sharing improves software; secrecy harms users and society.", "I would like to see every programme in the world be free software.", "When software isn't free, it creates social problems, not merely technical ones.", "The goal of free software is to give users freedom and control over their computing.", "We must reject models of computing that treat users as adversaries.", "Technology must serve people's freedom, not their enslavement to corporations."], "keyboard": null}}
Loading
Loading