typing

Author: selimslab

_includes/clocks.html

@@ -6,33 +6,34 @@
 <div class="mono has-text-centered">
 
 
-    <p class="time" id="current-time"></p>
-    {% include clock.html type="hour" id="hourClock" %}
+  <p class="time" id="current-time"></p>
+  {% include clock.html type="hour" id="hourClock" %}
 
-    <p class="time" id="current-date"></p>
-    {% include clock.html type="month" id="monthClock" %}
+  <p class="time" id="current-date"></p>
+  {% include clock.html type="month" id="monthClock" %}
 
-    <p class="time" id="current-year"></p>
-    {% include clock.html type="year" id="yearClock" %}
+  <p class="time" id="current-year"></p>
+  {% include clock.html type="year" id="yearClock" %}
 
-    {% include clock.html type="decade" id="decadeClock" title="Decades" %}
+  {% include clock.html type="decade" id="decadeClock" title="Decades" %}
 
-    {% include clock.html type="century" id="centuryClock" title="Centuries" %}
+  {% include clock.html type="century" id="centuryClock" title="Centuries" %}
 
-    {% include clock.html type="millennia" id="millenniaClock" title="Millennia" %}
+  {% include clock.html type="millennia" id="millenniaClock" title="Millennia" %}
 
 
 </div>
 
 
 <script>
-  show_date_and_time();
+  show_date();
+  show_time();
   document.getElementById('current-year').innerHTML = new Date().getFullYear();
 
 </script>
 
 <style>
-  .time{
+  .time {
     margin: 0;
   }
 </style>

_includes/typing.html

@@ -1,7 +1,7 @@
-<div id="sentence" class="idea"></div>
+<div id="sentence" class="idea" onclick="reset()"></div>
 <div id="typingStats">
-<p id="typingAccuracy">accuracy: 0</p>
-<p id="medianWpm">median wpm: 0</p>
+    <p id="typingAccuracy">accuracy: 0</p>
+    <p id="medianWpm">median wpm: 0</p>
 </div>
 
 <style>
@@ -17,22 +17,23 @@
         margin-top: 6rem;
         visibility: hidden;
     }
+
     #typingStats p {
         margin: 0;
     }
 
     .caret {
         text-decoration: underline;
         text-decoration-thickness: 3px;
-        
+
     }
 
     .correct {
         color: #909090;
     }
 
     .incorrect {
-        background-color:  rgba(241, 2, 2, 0.769);
+        background-color: rgba(241, 2, 2, 0.769);
         white-space: pre-wrap;
     }
 
@@ -43,5 +44,4 @@
 
 
 <script src="/assets/js/idea.js"></script>
-<script src="/assets/js/typing.js"></script>
-
+<script src="/assets/js/typing.js"></script>

assets/data/ideas/lit.json

@@ -1,8 +1,6 @@
 [
   "There must be some kind of way outta here, \n Said the joker to the thief",
   "Though this be madness, yet there is method in't",
-  "古池や 蛙飛び込む 水の音",
-  "On the day they were to kill him, \n Santiago Nasar arose at five-thirty in the morning \n to wait for the boat carrying the bishop",
   "But yesterday the word of Caesar might \n Have stood against the world; \n now lies he there",
   "If you can keep your head when all about you \n Are losing theirs and blaming it on you",
   "Things fall apart; the centre cannot hold; \n The best lack all conviction, \n while the worst, \n Are full of passionate intensity",

assets/js/datetime.js

@@ -24,9 +24,11 @@ function get_the_last_day_of_this_year() {
 }
 function get_sunrise_and_sunset() {
 }
-function show_date_and_time() {
+function show_date() {
     const today = moment();
     document.getElementById('current-date').innerHTML = today.format('ddd MMM DD');
+}
+function show_time() {
     function updateClock() {
         const now = new Date();
         document.getElementById('current-time').textContent =

assets/js/datetime.ts

@@ -36,10 +36,14 @@ function get_sunrise_and_sunset(): void {
 
 }
 
-function show_date_and_time(): void {
+function show_date(): void {
 
     const today = moment();
     document.getElementById('current-date')!.innerHTML = today.format('ddd MMM DD');
+
+}
+
+function show_time(): void{
     function updateClock(): void {
         const now = new Date();
         document.getElementById('current-time')!.textContent =

assets/js/idea.js

@@ -28,7 +28,7 @@ const setIdeaIdx = (filename, idx) => {
 };
 const getNextIdea = async (filename) => {
     if (!filename) {
-        const typingFiles = ['lyrics', 'lit', 'films'];
+        const typingFiles = ['lyrics', 'lit', 'films', 'phil'];
         filename = typingFiles[Math.floor(Math.random() * typingFiles.length)];
     }
     await readIdeas(filename);

assets/js/idea.ts

@@ -30,7 +30,7 @@ const setIdeaIdx = (filename: string, idx: number): void => {
 
 const getNextIdea = async (filename?: string): Promise<string> => {
   if (!filename) {
-    const typingFiles = ['lyrics', 'lit', 'films'];
+    const typingFiles = ['lyrics', 'lit', 'films', 'phil'];
     filename = typingFiles[Math.floor(Math.random() * typingFiles.length)];
   }
   await readIdeas(filename);

index.md

@@ -14,7 +14,7 @@ layout: nav
 <script src="/assets/js/datetime.js"></script>
 
 <script>
-  show_date_and_time();
+  show_time();
 </script>
 
 <style>