1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
|
/***********************************************************************
* State file processing *
***********************************************************************/
function makeDeck(cards) {
let today = new Date();
// Granularity only at the day level.
today.setHours(0, 0, 0, 0);
return cards.filter((card) => {
return (new Date(card.scheduled)) <= today;
});
}
function pad(n) {
return n < 10 ? '0' + n : n;
}
function statusString() {
const now = Date.now();
const elapsedSeconds = Math.floor((now - window.started) / 1000);
const minutes = Math.floor(elapsedSeconds / 60);
const seconds = elapsedSeconds % 60;
return `Card ${window.index + 1} of ${window.deck.length} scheduled for review, ${window.cards.length} total
Current session: ${pad(minutes)}:${pad(seconds)}`;
}
function showCard(card) {
const front = document.getElementById('flashcard-front');
const back = document.getElementById('flashcard-back');
front.innerHTML = card.front;
back.innerHTML = card.back;
}
function toggleCard() {
const front = document.getElementById('flashcard-front');
const back = document.getElementById('flashcard-back');
if (front.style.display === "block") {
front.style.display = "none";
back.style.display = "block";
} else {
back.style.display = "none";
front.style.display = "block";
}
}
function loadCards(data) {
const statusInfo = document.getElementById('status-info');
window.cards = data;
window.deck = makeDeck(window.cards);
window.index = 0;
window.started = Date.now();
// Temporary
showCard(window.cards[0]);
setInterval(() => { statusInfo.innerText = statusString() }, 1000);
// Add an event listener for the spacebar press
window.addEventListener('keydown', (event) => {
if (event.code === 'Space') {
toggleCard();
}
});
}
/***********************************************************************
* Status display *
***********************************************************************/
function showToast(message, duration = 3000) {
const toast = document.getElementById("toast");
toast.textContent = message;
// Show the toast
toast.classList.add("show");
// Hide the toast after specified time
setTimeout(() => {
toast.classList.remove("show");
}, duration);
}
window.addEventListener("load", (event) => {
document.getElementById('cards-input').addEventListener('change', function(event) {
const file = event.target.files[0];
if (!file) return;
const reader = new FileReader();
reader.onload = function(e) {
try {
const content = e.target.result;
loadCards(JSON.parse(content));
} catch (error) {
console.error("JSON Parsing Error:", error);
}
};
reader.onerror = function(error) {
document.getElementById('result').textContent = "Error reading file: " + error;
console.error("File Reading Error:", error);
};
reader.readAsText(file); // Read the file as text
});
});
|
