|
88 | 88 | </button> |
89 | 89 | </div> |
90 | 90 |
|
91 | | - <div id="statusBar" style=" |
92 | | - padding: 0.5rem; |
93 | | - display: flex; |
94 | | - justify-content: space-around; |
95 | | - align-items: center; |
96 | | - background: var(--burnt-sienna); |
97 | | - border: 2px solid var(--cambridge-blue); |
98 | | - color: var(--eggshell);" |
99 | | - > |
100 | | - <span id="charCount">Characters: 0</span> |
101 | | - <span id="readingTime">Estimated Reading Time: 0</span> |
102 | | - <span id="wordCount">Words: 0</span> |
103 | | - </div> |
104 | 91 |
|
105 | 92 | <footer> |
106 | 93 | <div class="footer-content"> |
|
165 | 152 |
|
166 | 153 | socket.on('loadNote', (note) => { |
167 | 154 | document.getElementById('notepad').value = note.content; |
168 | | - updateCounts(); |
169 | 155 | }); |
170 | 156 |
|
171 | 157 | socket.on('noteUpdated', (content) => { |
172 | 158 | const textarea = document.getElementById('notepad'); |
173 | | - updateCounts(); |
174 | 159 | const cursorPosition = textarea.selectionStart; |
175 | 160 |
|
176 | 161 | if (textarea.value !== content) { |
|
210 | 195 |
|
211 | 196 | document.getElementById('notepad').addEventListener('input', debounce(() => { |
212 | 197 | const content = document.getElementById('notepad').value; |
213 | | - updateCounts(); |
214 | | - socket.emit('updateNote', { url, content }); |
215 | 198 |
|
216 | 199 | if (content !== lastContent) { |
217 | 200 | lastContent = content; |
|
330 | 313 | .catch(err => console.log('ServiceWorker registration failed:', err)); |
331 | 314 | }); |
332 | 315 | } |
333 | | -
|
334 | | - // Word, Character Count & Estimated Reading Time |
335 | | - const notepad = document.getElementById('notepad'); |
336 | | - const charCountElem = document.getElementById('charCount'); |
337 | | - const wordCountElem = document.getElementById('wordCount'); |
338 | | - // const readingTime = document.getElementById('readingTime'); |
339 | | -
|
340 | | - function updateCounts() { |
341 | | - const text = notepad.value; |
342 | | - const charCount = text.length; |
343 | | - const wordCount = text.trim().split(/\s+/).filter(Boolean).length; |
344 | | -
|
345 | | - const minutes = wordCount / 200; |
346 | | - const totalSeconds = Math.round(minutes * 60); |
347 | | - const mins = Math.floor(totalSeconds / 60); |
348 | | - const secs = totalSeconds % 60; |
349 | | -
|
350 | | - charCountElem.textContent = `Characters: ${charCount}`; |
351 | | - readingTime.textContent = `Reading time: ${mins > 0 ? `${mins} min ` : ""}${secs} sec`; |
352 | | - wordCountElem.textContent = `Words: ${wordCount}`; |
353 | | - } |
354 | | -
|
355 | | - notepad.addEventListener('input', updateCounts); |
356 | | - window.addEventListener('load', updateCounts); |
357 | 316 | </script> |
358 | 317 | </body> |
359 | 318 | </html> |
0 commit comments