From d7ed7d85d4a31937b2e41607350aa72a92a5d2fb Mon Sep 17 00:00:00 2001
From: neroignis <neroignis@gmail.com>
Date: Fri, 18 Sep 2020 18:58:45 +0200
Subject: [PATCH] Add /me;

---
 app.css    |  4 ++++
 app.js     | 19 +++++++++++++++----
 index.html |  2 +-
 3 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/app.css b/app.css
index 96330c0..a53fb8b 100644
--- a/app.css
+++ b/app.css
@@ -76,3 +76,7 @@ body {
 	max-height: 2em;
 	margin-right: 5px;
 }
+
+.me-message {
+	background-color: orange;
+}
\ No newline at end of file
diff --git a/app.js b/app.js
index 7bf2b19..142500a 100644
--- a/app.js
+++ b/app.js
@@ -87,11 +87,12 @@ let kara = new Vue({
         this.scrollDown();
     },
     methods: {
-        addMessage(body, bot) {
+        addMessage(body, bot, me = false) {
             this.messages.push({
                 body: body,
                 bot: bot,
                 command: body.search('/') === 0,
+                me: me,
                 time: Date.now()
             })
         },
@@ -132,15 +133,17 @@ let kara = new Vue({
                 return false;
             }
 
-            this.userMessage(this.chatbox);
+            if (this.chatbox.search('/me') !== 0) {
+                this.userMessage(this.chatbox);
+            }
             this.scrollDown();
             this.react(this.chatbox);
             this.chatbox = '';
         },
-        react(message) {
+        react(message, recursive = false) {
             this.isTyping = true;
 
-            if (message.search('/') === 0) {
+            if (message.search('/') === 0 && !recursive) {
                 setTimeout(() => {
                     this.processCommands(message);
 
@@ -185,6 +188,10 @@ let kara = new Vue({
             if (this.checkForCommands(message, 'joke')) {
                 this.tellJoke(this.checkForCommands(message, 'joke'))
             }
+
+            if (this.checkForCommands(message, 'me')) {
+                this.meMessage(this.checkForCommands(message, 'me'))
+            }
         },
         checkForCommands(message, commands) {
             if (!Array.isArray(commands)) {
@@ -561,6 +568,10 @@ let kara = new Vue({
 
             this.updateStorage();
         },
+        meMessage(message) {
+            this.addMessage(this.username  + ' ' + message, false, true);
+            this.react(message, true);
+        },
         clearStorage() {
             localStorage.clear();
             location.reload();
diff --git a/index.html b/index.html
index 92b4c95..be8346f 100644
--- a/index.html
+++ b/index.html
@@ -37,7 +37,7 @@
                 {{ message.body }}
                 <br/>
             </div>
-            <div :class="'message user-message float-right' + (message.command ? ' command-message' : '')" v-else>
+            <div :class="'message user-message float-right' + (message.command ? ' command-message' : '') + (message.me ? ' me-message' : '')" v-else>
                 {{ message.body }}
                 <br/>
             </div>