Rename notes to todos

app.js

@@ -14,7 +14,7 @@ let kara = new Vue({
         chatbox: null,
         isTyping: false,
         askedForName: false,
-        takeNote: false,
+        awaitTodo: false,
         username: '',
         themes: null,
         activeTheme: 'slate',
@@ -30,7 +30,7 @@ let kara = new Vue({
             username: null,
             location: ''
         },
-        notes: [],
+        todos: [],
         reactions: []
     },
     mounted() {
@@ -178,8 +178,8 @@ let kara = new Vue({
                     // Check commands
                     if (this.askedForName === true) {
                         this.setName(message);
-                    } else if (this.takeNote === true) {
-                        this.saveNote(message);
+                    } else if (this.awaitTodo === true) {
+                        this.saveTodo(message);
                     } else {
                         let answer = this.getReaction(message);
                         if (answer) {
@@ -264,12 +264,12 @@ let kara = new Vue({
                 return "Please tell me how i should call you.";
             }
 
-            if (this.includesAllOf(keywords, ['new', 'note']) ||
+            if (this.includesAllOf(keywords, ['new', 'todo']) ||
                 this.includesAllOf(keywords, ['new', 'task']) ||
-                this.includesAllOf(keywords, ['take', 'note']) ||
+                this.includesAllOf(keywords, ['take', 'todo']) ||
                 this.includesAllOf(keywords, ['save', 'to', 'clipboard'])
             ) {
-                this.takeNote = true;
+                this.awaitTodo = true;
                 return this.oneOf([
                     "What do you wan't me to save for you?",
                     "Tell me what you wan't to save.",
@@ -409,9 +409,9 @@ let kara = new Vue({
 
         // Commands
         processCommands: function (message) {
-            if (this.checkForCommands(message, 'note')) {
-                let noteToSave = this.checkForCommands(message, 'note');
-                this.saveNote(noteToSave);
+            if (this.checkForCommands(message, 'todo')) {
+                let todoToSave = this.checkForCommands(message, 'todo');
+                this.saveTodo(todoToSave);
             }
 
             if (this.checkForCommands(message, 'clear')) {
@@ -695,11 +695,11 @@ let kara = new Vue({
             this.updateStorage();
         },
 
-        // Notes
-        saveNote(message) {
-            this.takeNote = false;
+        // Todos
+        saveTodo(message) {
+            this.awaitTodo = false;
 
-            this.notes.push({
+            this.todos.push({
                 time: moment(),
                 body: message,
                 checked: false
@@ -710,16 +710,16 @@ let kara = new Vue({
             this.botMessage(
                 this.oneOf([
                     "Saved! :)",
-                    "You can read and check your notes in the clipboard-section. :)"
+                    "You can read and check your todos in the clipboard-section. :)"
                 ])
             )
         },
-        clearNotes() {
-            this.notes = [];
+        clearTodos() {
+            this.todos = [];
 
             this.botMessage(
                 this.oneOf([
-                    "Notes cleared. 🚮"
+                    "Todos cleared. 🚮"
                 ])
             );
 
@@ -741,8 +741,8 @@ let kara = new Vue({
             let savedMessages = JSON.parse(localStorage.getItem('messages'));
             this.messages = savedMessages ? savedMessages : [];
 
-            let savedNotes = JSON.parse(localStorage.getItem('notes'));
-            this.notes = savedNotes ? savedNotes : [];
+            let savedTodos = JSON.parse(localStorage.getItem('todos'));
+            this.todos = savedTodos ? savedTodos : [];
 
             let savedLastMessage = JSON.parse(localStorage.getItem('lastMessage'));
             this.lastMessage = savedLastMessage ? savedLastMessage : null;
@@ -758,7 +758,7 @@ let kara = new Vue({
             localStorage.setItem('activeTheme', this.activeTheme);
             localStorage.setItem('messages', JSON.stringify(this.messages));
             localStorage.setItem('answers', JSON.stringify(this.reactions));
-            localStorage.setItem('notes', JSON.stringify(this.notes));
+            localStorage.setItem('todos', JSON.stringify(this.todos));
             localStorage.setItem('lastMessage', JSON.stringify(this.lastMessage));
             localStorage.setItem('location', JSON.stringify(this.location));
         },
@@ -918,6 +918,19 @@ let kara = new Vue({
             }
 
             return costs[message2.length];
-        }
+        },
+
+        // Speech
+        say(message) {
+            var speech = new SpeechSynthesisUtterance();
+
+            // Set the text and voice attributes.
+            speech.text = message;
+            speech.volume = 1;
+            speech.rate = 1;
+            speech.pitch = 1;
+
+            window.speechSynthesis.speak(speech);
+        },
     }
 })

index.html

@@ -22,7 +22,7 @@
             <div class="btn btn-sm btn-secondary" data-toggle="modal" data-target="#settingsModal">
                 <i class="fas fa-sliders-h"></i>
             </div>
-            <div class="btn btn-sm btn-secondary" data-toggle="modal" data-target="#noteModal" v-if="notes.length > 0">
+            <div class="btn btn-sm btn-secondary" data-toggle="modal" data-target="#todoModal" v-if="todos.length > 0">
                 <i class="fas fa-clipboard"></i>
             </div>
             <div class="btn btn-sm btn-secondary" @click="scrollDown()">
@@ -73,33 +73,33 @@
                 required autofocus>
     </div>
 
-    <div class="modal fade" id="noteModal" tabindex="-1" role="dialog" aria-labelledby="noteModal" aria-hidden="true">
+    <div class="modal fade" id="todoModal" tabindex="-1" role="dialog" aria-labelledby="todoModal" aria-hidden="true">
         <div class="modal-dialog" role="document">
             <div class="modal-content">
                 <div class="modal-header">
-                    <h5 class="modal-title">Notes</h5>
+                    <h5 class="modal-title">Todos</h5>
                     <div class="float-right">
-                        <button class="btn btn-sm btn-secondary" @click="clearNotes">
+                        <button class="btn btn-sm btn-secondary" @click="clearTodos">
                             <i class="fas fa-trash"></i>
                         </button>
                     </div>
                 </div>
                 <div class="modal-body" style="max-height: 800px; overflow-y: scroll">
                     <ul class="list-group">
-                        <li class="list-group-item" v-for="note in notes" v-if="!note.checked">
+                        <li class="list-group-item" v-for="todo in todos" v-if="!todo.checked">
                             <span class="float-right">
-                                <input type="checkbox" v-model="note.checked" @change="updateStorage()"/>
+                                <input type="checkbox" v-model="todo.checked" @change="updateStorage()"/>
                             </span>
-                            {{ note.body }}
+                            {{ todo.body }}
                         </li>
                     </ul>
                     <hr/>
                     <ul class="list-group">
-                        <li class="list-group-item" v-for="note in notes" v-if="note.checked">
+                        <li class="list-group-item" v-for="todo in todos" v-if="todo.checked">
                             <span class="float-right">
-                                <input type="checkbox" v-model="note.checked" @change="updateStorage()"/>
+                                <input type="checkbox" v-model="todo.checked" @change="updateStorage()"/>
                             </span>
-                            <span style="text-decoration: line-through;">{{ note.body }}</span>
+                            <span style="text-decoration: line-through;">{{ todo.body }}</span>
                         </li>
                     </ul>
                 </div>