Emoji-Pattern implementiert, kleine Anpassungen für Bilder

index.js

@@ -144,12 +144,16 @@ io.on('connection', (socket) => {
                     msg = msg.replace(regex, "");
                 }
 
-                msg = msg.replace(/(?<!href=")(\b[\w]+:\/\/[\w-?&;#~=\.\/\@%]+[\w\/])/g, (url) => {
-                    if (url.toLowerCase().endsWith('.jpg')
-                        || url.toLowerCase().endsWith('.gif')
-                        || url.toLowerCase().endsWith('.png')) {
-                        return '<a href="' + url + '"><img src="' + url + '" alt="" /></a>';
-                    }
+                msg = msg.replace(/(?<!(href|src)=")(\b[\w]+:\/\/[\w-?&;#~=\.\/\@%]+[\w\/])/g, (url) => {
+                    try {
+                        const urlObj = new URL(url);
+                        const urlWithoutParams = urlObj.origin + urlObj.pathname;
+                        if (urlWithoutParams.toLowerCase().endsWith('.jpg')
+                            || urlWithoutParams.toLowerCase().endsWith('.gif')
+                            || urlWithoutParams.toLowerCase().endsWith('.png')) {
+                            return '<a href="' + url + '"><img src="' + url + '" alt="" /></a>';
+                        }
+                    } catch (e) {}
 
                     var faviconUrl;
                     try {

www/js/main.js

@@ -1,3 +1,26 @@
+const emojiPatterns = [
+    { pattern: ':)', replacement: '🙂' },
+    { pattern: ':-)', replacement: '🙂' },
+    { pattern: ':D', replacement: '😀' },
+    { pattern: ':-D', replacement: '😀' },
+    { pattern: ';)', replacement: '😉' },
+    { pattern: ';-)', replacement: '😉' },
+    { pattern: ':(', replacement: '😞' },
+    { pattern: ':-(', replacement: '😞' },
+    { pattern: ':\'(', replacement: '😭' },
+    { pattern: ':\'-(', replacement: '😭' },
+    { pattern: ':\\', replacement: '😕' },
+    { pattern: ':-\\', replacement: '😕' },
+    { pattern: ':/', replacement: '😕' },
+    { pattern: ':-/', replacement: '😕' },
+    { pattern: ':|', replacement: '😐' },
+    { pattern: ':-|', replacement: '😐' },
+    { pattern: ':*', replacement: '😘' },
+    { pattern: ':-*', replacement: '😘' },
+    { pattern: '<3', replacement: '❤️' },
+    { pattern: '(y)', replacement: '👍' },
+];
+
 const socket = io();
 
 $(() => {
@@ -141,6 +164,24 @@ function onServerLogin(user, history) {
     });
 
     $("#chat-host .messageField").keypress((e) => {
+        const field = $('#chat-host .messageForm .messageField');
+        if (field.prop('selectionStart') == field.prop('selectionEnd')) {
+            const val = field.val();
+            const cursorPos = field.prop('selectionStart');
+            const valBefore = val.substring(0, cursorPos);
+            const valAfter = val.substring(cursorPos);
+
+            for (const emojiPatternItem of emojiPatterns) {
+                if (valBefore.endsWith(emojiPatternItem.pattern)) {
+                    field.val(
+                        valBefore.substring(0, valBefore.length - emojiPatternItem.pattern.length) + emojiPatternItem.replacement + valAfter
+                    );
+                    field.prop('selectionStart', cursorPos);
+                    field.prop('selectionEnd', cursorPos);
+                }
+            }
+        }
+
         if(e.key == 'Enter' && !e.shiftKey) {
             e.preventDefault();
             $('#chat-host .messageForm').submit();