From 3155fb85f00609f4c46de1b423779451a8ec55bb Mon Sep 17 00:00:00 2001 From: WolverinDEV Date: Fri, 17 Jul 2020 23:56:20 +0200 Subject: [PATCH] Updated a lot of chat related things --- ChangeLog.md | 16 +- README.md | 13 +- file.ts | 2 + loader/app/animation.ts | 1 + loader/app/polifill.ts | 16 +- loader/app/targets/app.ts | 45 - loader/html/index.html.ejs | 6 +- package-lock.json | 3825 +++++++++++------ package.json | 14 +- shared/css/static/modal.scss | 2 +- shared/html/templates.html | 132 - shared/js/ConnectionHandler.ts | 7 +- shared/js/MessageFormatter.ts | 293 -- shared/js/MessageFormatter.tsx | 465 ++ shared/js/connection/CommandHandler.ts | 140 +- shared/js/events.ts | 39 +- shared/js/file/Avatars.tsx | 28 +- shared/js/file/ImageCache.ts | 2 +- shared/js/proto.ts | 8 +- shared/js/ui/channel.ts | 10 +- shared/js/ui/client.ts | 41 +- shared/js/ui/frames/chat.ts | 5 +- shared/js/ui/frames/chat_frame.ts | 50 +- shared/js/ui/frames/side/ChatBox.scss | 2 + shared/js/ui/frames/side/ChatBox.tsx | 14 +- .../ui/frames/side/ConversationDefinitions.ts | 164 + .../js/ui/frames/side/ConversationManager.ts | 743 +++- ...Conversations.scss => ConversationUI.scss} | 205 +- shared/js/ui/frames/side/ConversationUI.tsx | 891 ++++ shared/js/ui/frames/side/Conversations.tsx | 498 --- .../side/PrivateConversationDefinitions.ts | 32 + .../frames/side/PrivateConversationHistory.ts | 291 ++ .../frames/side/PrivateConversationManager.ts | 464 ++ .../ui/frames/side/PrivateConversationUI.scss | 173 + .../ui/frames/side/PrivateConversationUI.tsx | 206 + shared/js/ui/frames/side/chat_box.ts | 268 -- shared/js/ui/frames/side/chat_helper.ts | 71 +- shared/js/ui/frames/side/conversations_old.ts | 630 --- .../ui/frames/side/private_conversations.ts | 904 ---- shared/js/ui/htmltags.ts | 4 +- shared/js/ui/modal/ModalChangeVolumeNew.tsx | 8 +- shared/js/ui/modal/ModalGroupCreate.tsx | 4 +- .../js/ui/modal/ModalGroupPermissionCopy.tsx | 4 +- .../permission/ModalPermissionEditor.tsx | 4 +- .../ui/modal/transfer/ModalFileTransfer.tsx | 5 +- shared/js/ui/react-elements/Avatar.tsx | 41 +- .../js/ui/react-elements/ContextDivider.scss | 8 +- .../js/ui/react-elements/ContextDivider.tsx | 6 +- shared/js/ui/react-elements/Countdown.tsx | 51 + shared/js/ui/react-elements/LoadingDots.tsx | 11 +- shared/js/ui/react-elements/Modal.scss | 2 +- shared/js/ui/react-elements/Modal.tsx | 4 +- .../ui/react-elements/TimestampRenderer.tsx | 18 + shared/js/ui/react-elements/i18n/index.tsx | 34 +- shared/js/ui/server.ts | 6 +- shared/js/ui/tree/View.tsx | 7 +- shared/js/ui/view.tsx | 38 +- tsconfig.json | 3 +- vendor/emoji-picker/.gitignore | 1 - vendor/emoji-picker/LICENSE | 3 - vendor/emoji-picker/README.md | 2 - vendor/emoji-picker/index.html | 70 - vendor/emoji-picker/package.json | 29 - .../src/jquery.lsxemojipicker.css | 103 - .../emoji-picker/src/jquery.lsxemojipicker.ts | 834 ---- vendor/emoji-picker/webpack.config.js | 57 - vendor/emoji-picker/yarn.lock | 3002 ------------- vendor/highlight/CHANGES.md | 1896 -------- vendor/highlight/LICENSE | 24 - vendor/highlight/README.md | 188 - vendor/highlight/README.ru.md | 142 - vendor/highlight/highlight.pack.js | 2 - vendor/highlight/styles/a11y-dark.css | 99 - vendor/highlight/styles/a11y-light.css | 99 - vendor/highlight/styles/agate.css | 108 - vendor/highlight/styles/an-old-hope.css | 89 - vendor/highlight/styles/androidstudio.css | 66 - vendor/highlight/styles/arduino-light.css | 88 - vendor/highlight/styles/arta.css | 73 - vendor/highlight/styles/ascetic.css | 45 - vendor/highlight/styles/atelier-cave-dark.css | 83 - .../highlight/styles/atelier-cave-light.css | 85 - vendor/highlight/styles/atelier-dune-dark.css | 69 - .../highlight/styles/atelier-dune-light.css | 69 - .../highlight/styles/atelier-estuary-dark.css | 84 - .../styles/atelier-estuary-light.css | 84 - .../highlight/styles/atelier-forest-dark.css | 69 - .../highlight/styles/atelier-forest-light.css | 69 - .../highlight/styles/atelier-heath-dark.css | 69 - .../highlight/styles/atelier-heath-light.css | 69 - .../styles/atelier-lakeside-dark.css | 69 - .../styles/atelier-lakeside-light.css | 69 - .../highlight/styles/atelier-plateau-dark.css | 84 - .../styles/atelier-plateau-light.css | 84 - .../highlight/styles/atelier-savanna-dark.css | 84 - .../styles/atelier-savanna-light.css | 84 - .../highlight/styles/atelier-seaside-dark.css | 69 - .../styles/atelier-seaside-light.css | 69 - .../styles/atelier-sulphurpool-dark.css | 69 - .../styles/atelier-sulphurpool-light.css | 69 - .../styles/atom-one-dark-reasonable.css | 77 - vendor/highlight/styles/atom-one-dark.css | 96 - vendor/highlight/styles/atom-one-light.css | 96 - vendor/highlight/styles/brown-paper.css | 64 - vendor/highlight/styles/brown-papersq.png | Bin 18198 -> 0 bytes vendor/highlight/styles/codepen-embed.css | 60 - vendor/highlight/styles/color-brewer.css | 71 - vendor/highlight/styles/darcula.css | 77 - vendor/highlight/styles/dark.css | 63 - vendor/highlight/styles/darkula.css | 6 - vendor/highlight/styles/default.css | 99 - vendor/highlight/styles/docco.css | 97 - vendor/highlight/styles/dracula.css | 76 - vendor/highlight/styles/far.css | 71 - vendor/highlight/styles/foundation.css | 88 - vendor/highlight/styles/github-gist.css | 71 - vendor/highlight/styles/github.css | 99 - vendor/highlight/styles/gml.css | 78 - vendor/highlight/styles/googlecode.css | 89 - vendor/highlight/styles/grayscale.css | 101 - vendor/highlight/styles/gruvbox-dark.css | 108 - vendor/highlight/styles/gruvbox-light.css | 108 - vendor/highlight/styles/hopscotch.css | 83 - vendor/highlight/styles/hybrid.css | 102 - vendor/highlight/styles/idea.css | 97 - vendor/highlight/styles/ir-black.css | 73 - vendor/highlight/styles/isbl-editor-dark.css | 112 - vendor/highlight/styles/isbl-editor-light.css | 112 - vendor/highlight/styles/kimbie.dark.css | 74 - vendor/highlight/styles/kimbie.light.css | 74 - vendor/highlight/styles/lightfair.css | 87 - vendor/highlight/styles/magula.css | 70 - vendor/highlight/styles/mono-blue.css | 59 - vendor/highlight/styles/monokai-sublime.css | 83 - vendor/highlight/styles/monokai.css | 70 - vendor/highlight/styles/nord.css | 309 -- vendor/highlight/styles/obsidian.css | 88 - vendor/highlight/styles/ocean.css | 74 - vendor/highlight/styles/paraiso-dark.css | 72 - vendor/highlight/styles/paraiso-light.css | 72 - vendor/highlight/styles/pojoaque.css | 83 - vendor/highlight/styles/pojoaque.jpg | Bin 1186 -> 0 bytes vendor/highlight/styles/purebasic.css | 96 - vendor/highlight/styles/qtcreator_dark.css | 83 - vendor/highlight/styles/qtcreator_light.css | 83 - vendor/highlight/styles/railscasts.css | 106 - vendor/highlight/styles/rainbow.css | 85 - vendor/highlight/styles/routeros.css | 108 - vendor/highlight/styles/school-book.css | 69 - vendor/highlight/styles/school-book.png | Bin 486 -> 0 bytes vendor/highlight/styles/shades-of-purple.css | 97 - vendor/highlight/styles/solarized-dark.css | 84 - vendor/highlight/styles/solarized-light.css | 84 - vendor/highlight/styles/sunburst.css | 102 - .../highlight/styles/tomorrow-night-blue.css | 75 - .../styles/tomorrow-night-bright.css | 74 - .../styles/tomorrow-night-eighties.css | 74 - vendor/highlight/styles/tomorrow-night.css | 75 - vendor/highlight/styles/tomorrow.css | 72 - vendor/highlight/styles/vs.css | 68 - vendor/highlight/styles/vs2015.css | 115 - vendor/highlight/styles/xcode.css | 104 - vendor/highlight/styles/xt256.css | 92 - vendor/highlight/styles/zenburn.css | 80 - vendor/twemoji/info.txt | 1 - vendor/twemoji/twemoji.min.js | 2 - vendor/xbbcode | 2 +- webpack.config.ts | 4 +- 168 files changed, 6408 insertions(+), 18410 deletions(-) delete mode 100644 shared/js/MessageFormatter.ts create mode 100644 shared/js/MessageFormatter.tsx create mode 100644 shared/js/ui/frames/side/ConversationDefinitions.ts rename shared/js/ui/frames/side/{Conversations.scss => ConversationUI.scss} (51%) create mode 100644 shared/js/ui/frames/side/ConversationUI.tsx delete mode 100644 shared/js/ui/frames/side/Conversations.tsx create mode 100644 shared/js/ui/frames/side/PrivateConversationDefinitions.ts create mode 100644 shared/js/ui/frames/side/PrivateConversationHistory.ts create mode 100644 shared/js/ui/frames/side/PrivateConversationManager.ts create mode 100644 shared/js/ui/frames/side/PrivateConversationUI.scss create mode 100644 shared/js/ui/frames/side/PrivateConversationUI.tsx delete mode 100644 shared/js/ui/frames/side/chat_box.ts delete mode 100644 shared/js/ui/frames/side/conversations_old.ts delete mode 100644 shared/js/ui/frames/side/private_conversations.ts create mode 100644 shared/js/ui/react-elements/Countdown.tsx create mode 100644 shared/js/ui/react-elements/TimestampRenderer.tsx delete mode 100644 vendor/emoji-picker/.gitignore delete mode 100644 vendor/emoji-picker/LICENSE delete mode 100644 vendor/emoji-picker/README.md delete mode 100644 vendor/emoji-picker/index.html delete mode 100644 vendor/emoji-picker/package.json delete mode 100644 vendor/emoji-picker/src/jquery.lsxemojipicker.css delete mode 100644 vendor/emoji-picker/src/jquery.lsxemojipicker.ts delete mode 100644 vendor/emoji-picker/webpack.config.js delete mode 100644 vendor/emoji-picker/yarn.lock delete mode 100644 vendor/highlight/CHANGES.md delete mode 100644 vendor/highlight/LICENSE delete mode 100644 vendor/highlight/README.md delete mode 100644 vendor/highlight/README.ru.md delete mode 100644 vendor/highlight/highlight.pack.js delete mode 100644 vendor/highlight/styles/a11y-dark.css delete mode 100644 vendor/highlight/styles/a11y-light.css delete mode 100644 vendor/highlight/styles/agate.css delete mode 100644 vendor/highlight/styles/an-old-hope.css delete mode 100644 vendor/highlight/styles/androidstudio.css delete mode 100644 vendor/highlight/styles/arduino-light.css delete mode 100644 vendor/highlight/styles/arta.css delete mode 100644 vendor/highlight/styles/ascetic.css delete mode 100644 vendor/highlight/styles/atelier-cave-dark.css delete mode 100644 vendor/highlight/styles/atelier-cave-light.css delete mode 100644 vendor/highlight/styles/atelier-dune-dark.css delete mode 100644 vendor/highlight/styles/atelier-dune-light.css delete mode 100644 vendor/highlight/styles/atelier-estuary-dark.css delete mode 100644 vendor/highlight/styles/atelier-estuary-light.css delete mode 100644 vendor/highlight/styles/atelier-forest-dark.css delete mode 100644 vendor/highlight/styles/atelier-forest-light.css delete mode 100644 vendor/highlight/styles/atelier-heath-dark.css delete mode 100644 vendor/highlight/styles/atelier-heath-light.css delete mode 100644 vendor/highlight/styles/atelier-lakeside-dark.css delete mode 100644 vendor/highlight/styles/atelier-lakeside-light.css delete mode 100644 vendor/highlight/styles/atelier-plateau-dark.css delete mode 100644 vendor/highlight/styles/atelier-plateau-light.css delete mode 100644 vendor/highlight/styles/atelier-savanna-dark.css delete mode 100644 vendor/highlight/styles/atelier-savanna-light.css delete mode 100644 vendor/highlight/styles/atelier-seaside-dark.css delete mode 100644 vendor/highlight/styles/atelier-seaside-light.css delete mode 100644 vendor/highlight/styles/atelier-sulphurpool-dark.css delete mode 100644 vendor/highlight/styles/atelier-sulphurpool-light.css delete mode 100644 vendor/highlight/styles/atom-one-dark-reasonable.css delete mode 100644 vendor/highlight/styles/atom-one-dark.css delete mode 100644 vendor/highlight/styles/atom-one-light.css delete mode 100644 vendor/highlight/styles/brown-paper.css delete mode 100644 vendor/highlight/styles/brown-papersq.png delete mode 100644 vendor/highlight/styles/codepen-embed.css delete mode 100644 vendor/highlight/styles/color-brewer.css delete mode 100644 vendor/highlight/styles/darcula.css delete mode 100644 vendor/highlight/styles/dark.css delete mode 100644 vendor/highlight/styles/darkula.css delete mode 100644 vendor/highlight/styles/default.css delete mode 100644 vendor/highlight/styles/docco.css delete mode 100644 vendor/highlight/styles/dracula.css delete mode 100644 vendor/highlight/styles/far.css delete mode 100644 vendor/highlight/styles/foundation.css delete mode 100644 vendor/highlight/styles/github-gist.css delete mode 100644 vendor/highlight/styles/github.css delete mode 100644 vendor/highlight/styles/gml.css delete mode 100644 vendor/highlight/styles/googlecode.css delete mode 100644 vendor/highlight/styles/grayscale.css delete mode 100644 vendor/highlight/styles/gruvbox-dark.css delete mode 100644 vendor/highlight/styles/gruvbox-light.css delete mode 100644 vendor/highlight/styles/hopscotch.css delete mode 100644 vendor/highlight/styles/hybrid.css delete mode 100644 vendor/highlight/styles/idea.css delete mode 100644 vendor/highlight/styles/ir-black.css delete mode 100644 vendor/highlight/styles/isbl-editor-dark.css delete mode 100644 vendor/highlight/styles/isbl-editor-light.css delete mode 100644 vendor/highlight/styles/kimbie.dark.css delete mode 100644 vendor/highlight/styles/kimbie.light.css delete mode 100644 vendor/highlight/styles/lightfair.css delete mode 100644 vendor/highlight/styles/magula.css delete mode 100644 vendor/highlight/styles/mono-blue.css delete mode 100644 vendor/highlight/styles/monokai-sublime.css delete mode 100644 vendor/highlight/styles/monokai.css delete mode 100644 vendor/highlight/styles/nord.css delete mode 100644 vendor/highlight/styles/obsidian.css delete mode 100644 vendor/highlight/styles/ocean.css delete mode 100644 vendor/highlight/styles/paraiso-dark.css delete mode 100644 vendor/highlight/styles/paraiso-light.css delete mode 100644 vendor/highlight/styles/pojoaque.css delete mode 100644 vendor/highlight/styles/pojoaque.jpg delete mode 100644 vendor/highlight/styles/purebasic.css delete mode 100644 vendor/highlight/styles/qtcreator_dark.css delete mode 100644 vendor/highlight/styles/qtcreator_light.css delete mode 100644 vendor/highlight/styles/railscasts.css delete mode 100644 vendor/highlight/styles/rainbow.css delete mode 100644 vendor/highlight/styles/routeros.css delete mode 100644 vendor/highlight/styles/school-book.css delete mode 100644 vendor/highlight/styles/school-book.png delete mode 100644 vendor/highlight/styles/shades-of-purple.css delete mode 100644 vendor/highlight/styles/solarized-dark.css delete mode 100644 vendor/highlight/styles/solarized-light.css delete mode 100644 vendor/highlight/styles/sunburst.css delete mode 100644 vendor/highlight/styles/tomorrow-night-blue.css delete mode 100644 vendor/highlight/styles/tomorrow-night-bright.css delete mode 100644 vendor/highlight/styles/tomorrow-night-eighties.css delete mode 100644 vendor/highlight/styles/tomorrow-night.css delete mode 100644 vendor/highlight/styles/tomorrow.css delete mode 100644 vendor/highlight/styles/vs.css delete mode 100644 vendor/highlight/styles/vs2015.css delete mode 100644 vendor/highlight/styles/xcode.css delete mode 100644 vendor/highlight/styles/xt256.css delete mode 100644 vendor/highlight/styles/zenburn.css delete mode 100644 vendor/twemoji/info.txt delete mode 100644 vendor/twemoji/twemoji.min.js diff --git a/ChangeLog.md b/ChangeLog.md index 5bb20d24..d00c2f73 100644 --- a/ChangeLog.md +++ b/ChangeLog.md @@ -1,11 +1,23 @@ # Changelog: * **XX.XX.20** - - Rewrote the channel conversation UI + - Rewrote the channel conversation UI and manager - Several bug fixes like the scrollbar - Updated the channel history view mode - Improved chat box behaviour - Automatically crawling all channels on server join for new messages (requires TeaSpeak 1.4.16-b2 or higher) - + - Improved the channel chat history browsing experience + - Added support for the `qote` bbcode and markdown syntax + - Recoded the private conversation UI and manager + - Improved client disconnect/reconnect handing + - Updated several chat box issues + - Improved history view + - Improved chat experience when chatting with two different users which have the same identity + - Automatically reopening the last open private chats + - Fixed the chat partner typing indicator + - Fixed chat scroll bar after switching tabs + - Fixed the chat "scroll to new messages" button + - Finalized the loader animation + * **12.07.20** - Made the loader compatible with ES5 to support older browsers - Updated the loader animation diff --git a/README.md b/README.md index f0d1634a..8ad2038c 100644 --- a/README.md +++ b/README.md @@ -11,7 +11,14 @@ To **report an issue**, then find and push the **New Issue** button, fill all th You can also ask questions here, if you have any. # Browser support: -MS Edge: partitional - No voice support (missing data channel support) - + +| Browser | Supported | +| -- | -- | +| MS Edge | Partitional | +| MS Edge (Chromium) | Yes | +| Chrome | Yes | +| Firefox | Yes | +| Opera | Yes | +| Safari | Yes | +| Internet Explorer | No | diff --git a/file.ts b/file.ts index d0cf2e10..a5bcb724 100644 --- a/file.ts +++ b/file.ts @@ -134,6 +134,7 @@ const APP_FILE_LIST_SHARED_VENDORS: ProjectResource[] = [ "type": "js", "search-pattern": /.*(\.min)?\.js$/, "build-target": "dev|rel", + "search-exclude": /.*xbbcode.*/g, "path": "vendor/", "local-path": "./vendor/" @@ -142,6 +143,7 @@ const APP_FILE_LIST_SHARED_VENDORS: ProjectResource[] = [ "type": "css", "search-pattern": /.*\.css$/, "build-target": "dev|rel", + "search-exclude": /.*xbbcode.*/g, "path": "vendor/", "local-path": "./vendor/" diff --git a/loader/app/animation.ts b/loader/app/animation.ts index d14f616e..6ada9777 100644 --- a/loader/app/animation.ts +++ b/loader/app/animation.ts @@ -37,6 +37,7 @@ function initializeElements() { image.alt = lazyImage.getAttribute("alt"); image.src = lazyImage.getAttribute(apngSupport ? "src-apng" : "src-gif") || lazyImage.getAttribute("src"); image.className = lazyImage.className; + image.draggable = false; lazyImage.replaceWith(image); } diff --git a/loader/app/polifill.ts b/loader/app/polifill.ts index 3acd59a0..712039bc 100644 --- a/loader/app/polifill.ts +++ b/loader/app/polifill.ts @@ -1,9 +1,15 @@ -/* IE11 */ -if(!Element.prototype.remove) - Element.prototype.remove = function() { - this.parentElement?.removeChild(this); - }; +/* IE11 and safari */ +if(Element.prototype.remove === undefined) + Object.defineProperty(Element.prototype, "remove", { + enumerable: false, + configurable: false, + writable: false, + value: function(){ + this.parentElement.removeChild(this); + } + }); +/* IE11 */ function ReplaceWithPolyfill() { let parent = this.parentNode, i = arguments.length, currentNode; if (!parent) return; diff --git a/loader/app/targets/app.ts b/loader/app/targets/app.ts index 118c119b..c861aa11 100644 --- a/loader/app/targets/app.ts +++ b/loader/app/targets/app.ts @@ -63,10 +63,6 @@ const loader_javascript = { await loader.scripts.load_multiple([ ["vendor/jsrender/jsrender.min.js"], - ["vendor/xbbcode/src/parser.js"], - ["vendor/emoji-picker/src/jquery.lsxemojipicker.js"], - ["vendor/twemoji/twemoji.min.js", ""], /* empty string means not required */ - ["vendor/highlight/highlight.pack.js", ""], /* empty string means not required */ ["vendor/remarkable/remarkable.min.js", ""], /* empty string means not required */ ], { cache_tag: cache_tag(), @@ -127,23 +123,6 @@ const loader_webassembly = { const loader_style = { load_style: async taskId => { - const options = { - cache_tag: cache_tag(), - max_parallel_requests: -1 - }; - - await loader.style.load_multiple([ - "vendor/xbbcode/src/xbbcode.css" - ], options, LoaderTaskCallback(taskId)); - - await loader.style.load_multiple([ - "vendor/emoji-picker/src/jquery.lsxemojipicker.css" - ], options, LoaderTaskCallback(taskId)); - - await loader.style.load_multiple([ - ["vendor/highlight/styles/darcula.css", ""], /* empty string means not required */ - ], options, LoaderTaskCallback(taskId)); - if(__build.mode === "debug") { await loader_style.load_style_debug(taskId); } else { @@ -213,24 +192,6 @@ const loader_style = { } }; -/* register tasks */ -loader.register_task(loader.Stage.INITIALIZING, { - name: "safari fix", - function: async () => { - /* safari remove "fix" */ - if(Element.prototype.remove === undefined) - Object.defineProperty(Element.prototype, "remove", { - enumerable: false, - configurable: false, - writable: false, - value: function(){ - this.parentElement.removeChild(this); - } - }); - }, - priority: 50 -}); - loader.register_task(loader.Stage.INITIALIZING, { name: "secure tester", function: async () => { @@ -279,12 +240,6 @@ loader.register_task(loader.Stage.TEMPLATES, { priority: 10 }); -loader.register_task(loader.Stage.JAVASCRIPT_INITIALIZING, { - name: "lsx emoji picker setup", - function: async () => await (window as any).setup_lsx_emoji_picker({twemoji: typeof(window.twemoji) !== "undefined"}), - priority: 10 -}); - loader.register_task(loader.Stage.SETUP, { name: "page setup", function: async () => { diff --git a/loader/html/index.html.ejs b/loader/html/index.html.ejs index 81b33761..3e03582f 100644 --- a/loader/html/index.html.ejs +++ b/loader/html/index.html.ejs @@ -68,7 +68,7 @@ var initial_css;