Add transparent overlay window (#4746)

Chatterino · Oct 6, 2024 · afa8067 · afa8067
1 parent 9ba7ef3
commit afa8067
Show file tree

Hide file tree

Showing 40 changed files with 1,465 additions and 191 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,7 @@
 - Major: Add option to show pronouns in user card. (#5442, #5583)
 - Major: Release plugins alpha. (#5288)
 - Major: Improve high-DPI support on Windows. (#4868, #5391)
+- Major: Added transparent overlay window (default keybind: <kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>N</kbd>). (#4746)
 - Minor: Removed the Ctrl+Shift+L hotkey for toggling the "live only" tab visibility state. (#5530)
 - Minor: Add support for Shared Chat messages. Shared chat messages can be filtered with the `flags.shared` filter variable, or with search using `is:shared`. Some messages like subscriptions are filtered on purpose to avoid confusion for the broadcaster. If you have both channels participating in Shared Chat open, only one of the message triggering your highlight will trigger. (#5606, #5625)
 - Minor: Moved tab visibility control to a submenu, without any toggle actions. (#5530)

diff --git a/docs/ChatterinoTheme.schema.json b/docs/ChatterinoTheme.schema.json
@@ -215,6 +215,47 @@
         "text": { "$ref": "#/definitions/qt-color" }
       },
       "required": ["backgrounds", "line", "text"]
+    },
+    "text-colors": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "caret": { "$ref": "#/definitions/qt-color" },
+        "chatPlaceholder": { "$ref": "#/definitions/qt-color" },
+        "link": { "$ref": "#/definitions/qt-color" },
+        "regular": { "$ref": "#/definitions/qt-color" },
+        "system": { "$ref": "#/definitions/qt-color" }
+      },
+      "required": ["caret", "chatPlaceholder", "link", "regular", "system"]
+    },
+    "message-backgrounds": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "alternate": { "$ref": "#/definitions/qt-color" },
+        "regular": { "$ref": "#/definitions/qt-color" }
+      },
+      "required": ["alternate", "regular"]
+    },
+    "message-colors": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "backgrounds": { "$ref": "#/definitions/message-backgrounds" },
+        "disabled": { "$ref": "#/definitions/qt-color" },
+        "highlightAnimationEnd": { "$ref": "#/definitions/qt-color" },
+        "highlightAnimationStart": { "$ref": "#/definitions/qt-color" },
+        "selection": { "$ref": "#/definitions/qt-color" },
+        "textColors": { "$ref": "#/definitions/text-colors" }
+      },
+      "required": [
+        "backgrounds",
+        "disabled",
+        "highlightAnimationEnd",
+        "highlightAnimationStart",
+        "selection",
+        "textColors"
+      ]
     }
   },
   "type": "object",
@@ -229,37 +270,12 @@
           "type": "object",
           "additionalProperties": false,
           "properties": {
-            "backgrounds": {
-              "type": "object",
-              "additionalProperties": false,
-              "properties": {
-                "alternate": { "$ref": "#/definitions/qt-color" },
-                "regular": { "$ref": "#/definitions/qt-color" }
-              },
-              "required": ["alternate", "regular"]
-            },
+            "backgrounds": { "$ref": "#/definitions/message-backgrounds" },
             "disabled": { "$ref": "#/definitions/qt-color" },
             "highlightAnimationEnd": { "$ref": "#/definitions/qt-color" },
             "highlightAnimationStart": { "$ref": "#/definitions/qt-color" },
             "selection": { "$ref": "#/definitions/qt-color" },
-            "textColors": {
-              "type": "object",
-              "additionalProperties": false,
-              "properties": {
-                "caret": { "$ref": "#/definitions/qt-color" },
-                "chatPlaceholder": { "$ref": "#/definitions/qt-color" },
-                "link": { "$ref": "#/definitions/qt-color" },
-                "regular": { "$ref": "#/definitions/qt-color" },
-                "system": { "$ref": "#/definitions/qt-color" }
-              },
-              "required": [
-                "caret",
-                "chatPlaceholder",
-                "link",
-                "regular",
-                "system"
-              ]
-            }
+            "textColors": { "$ref": "#/definitions/text-colors" }
           },
           "required": [
             "backgrounds",
@@ -270,6 +286,27 @@
             "textColors"
           ]
         },
+        "overlayMessages": {
+          "type": "object",
+          "additionalProperties": false,
+          "properties": {
+            "backgrounds": { "$ref": "#/definitions/message-backgrounds" },
+            "disabled": { "$ref": "#/definitions/qt-color" },
+            "selection": { "$ref": "#/definitions/qt-color" },
+            "textColors": { "$ref": "#/definitions/text-colors" },
+            "background": {
+              "$ref": "#/definitions/qt-color",
+              "description": "Note: The alpha value is ignored (set through the settings)"
+            }
+          },
+          "required": [
+            "backgrounds",
+            "disabled",
+            "selection",
+            "textColors",
+            "background"
+          ]
+        },
         "scrollbars": {
           "type": "object",
           "additionalProperties": false,
@@ -376,6 +413,7 @@
       "required": [
         "accent",
         "messages",
+        "overlayMessages",
         "scrollbars",
         "splits",
         "tabs",

diff --git a/resources/themes/Black.json b/resources/themes/Black.json
@@ -22,6 +22,22 @@
         "system": "#8c7f7f"
       }
     },
+    "overlayMessages": {
+      "backgrounds": {
+        "alternate": "#32000000",
+        "regular": "transparent"
+      },
+      "disabled": "#64000000",
+      "selection": "#40ffffff",
+      "textColors": {
+        "caret": "#ffffff",
+        "chatPlaceholder": "#5d5555",
+        "link": "#4286f4",
+        "regular": "#ffffff",
+        "system": "#8c7f7f"
+      },
+      "background": "#000"
+    },
     "scrollbars": {
       "background": "#00000000",
       "thumb": "#4d4d4d",

diff --git a/resources/themes/Dark.json b/resources/themes/Dark.json
@@ -22,6 +22,22 @@
         "system": "#8c7f7f"
       }
     },
+    "overlayMessages": {
+      "backgrounds": {
+        "alternate": "#32000000",
+        "regular": "transparent"
+      },
+      "disabled": "#64000000",
+      "selection": "#40ffffff",
+      "textColors": {
+        "caret": "#ffffff",
+        "chatPlaceholder": "#5d5555",
+        "link": "#4286f4",
+        "regular": "#ffffff",
+        "system": "#8c7f7f"
+      },
+      "background": "#000"
+    },
     "scrollbars": {
       "background": "#00000000",
       "thumb": "#575757",

diff --git a/resources/themes/Light.json b/resources/themes/Light.json
@@ -22,6 +22,22 @@
         "system": "#8c7f7f"
       }
     },
+    "overlayMessages": {
+      "backgrounds": {
+        "alternate": "#32000000",
+        "regular": "transparent"
+      },
+      "disabled": "#64000000",
+      "selection": "#40ffffff",
+      "textColors": {
+        "caret": "#ffffff",
+        "chatPlaceholder": "#5d5555",
+        "link": "#4286f4",
+        "regular": "#ffffff",
+        "system": "#8c7f7f"
+      },
+      "background": "#333"
+    },
     "scrollbars": {
       "background": "#00000000",
       "thumb": "#a8a8a8",

diff --git a/resources/themes/White.json b/resources/themes/White.json
@@ -22,6 +22,22 @@
         "system": "#8c7f7f"
       }
     },
+    "overlayMessages": {
+      "backgrounds": {
+        "alternate": "#32000000",
+        "regular": "transparent"
+      },
+      "disabled": "#64000000",
+      "selection": "#40ffffff",
+      "textColors": {
+        "caret": "#ffffff",
+        "chatPlaceholder": "#5d5555",
+        "link": "#4286f4",
+        "regular": "#ffffff",
+        "system": "#8c7f7f"
+      },
+      "background": "#333"
+    },
     "scrollbars": {
       "background": "#00000000",
       "thumb": "#b3b3b3",

diff --git a/src/CMakeLists.txt b/src/CMakeLists.txt
@@ -551,6 +551,8 @@ set(SOURCE_FILES
         widgets/Label.hpp
         widgets/Notebook.cpp
         widgets/Notebook.hpp
+        widgets/OverlayWindow.cpp
+        widgets/OverlayWindow.hpp
         widgets/Scrollbar.cpp
         widgets/Scrollbar.hpp
         widgets/TooltipEntryWidget.cpp
@@ -638,6 +640,8 @@ set(SOURCE_FILES
         widgets/helper/NotebookButton.hpp
         widgets/helper/NotebookTab.cpp
         widgets/helper/NotebookTab.hpp
+        widgets/helper/OverlayInteraction.cpp
+        widgets/helper/OverlayInteraction.hpp
         widgets/helper/RegExpItemDelegate.cpp
         widgets/helper/RegExpItemDelegate.hpp
         widgets/helper/ResizingTextEdit.cpp

diff --git a/src/controllers/hotkeys/ActionNames.hpp b/src/controllers/hotkeys/ActionNames.hpp
@@ -181,6 +181,20 @@ inline const std::map<HotkeyCategory, ActionDefinitionMap> actionNames{
          {"showSearch", ActionDefinition{"Search current channel"}},
          {"showGlobalSearch", ActionDefinition{"Search all channels"}},
          {"debug", ActionDefinition{"Show debug popup"}},
+         {"popupOverlay", ActionDefinition{"New overlay popup"}},
+         {"toggleOverlayInertia",
+          ActionDefinition{
+              .displayName = "Toggle overlay click-through",
+              .argumentDescription = "<target popup: this or thisOrAll or all>",
+              .minCountArguments = 1,
+              .maxCountArguments = 1,
+              .possibleArguments{
+                  {"This", {"this"}},
+                  {"All", {"all"}},
+                  {"This or all", {"thisOrAll"}},
+              },
+              .argumentsPrompt = "Target popup:",
+          }},
      }},
     {HotkeyCategory::SplitInput,
      {
@@ -259,7 +273,8 @@ inline const std::map<HotkeyCategory, ActionDefinitionMap> actionNames{
          {"moveTab",
           ActionDefinition{
               "Move tab",
-              "<where to move the tab: next, previous, or new index of tab>",
+              "<where to move the tab: next, previous, or new index of "
+              "tab>",
               1,
           }},
          {"newSplit", ActionDefinition{"Create a new split"}},

diff --git a/src/controllers/hotkeys/HotkeyController.cpp b/src/controllers/hotkeys/HotkeyController.cpp
@@ -403,6 +403,12 @@ void HotkeyController::addDefaults(std::set<QString> &addedHotkeys)
         this->tryAddDefault(addedHotkeys, HotkeyCategory::Split,
                             QKeySequence("F10"), "debug",
                             std::vector<QString>(), "open debug popup");
+        this->tryAddDefault(addedHotkeys, HotkeyCategory::Split,
+                            QKeySequence("Ctrl+Alt+N"), "popupOverlay", {},
+                            "open overlay");
+        this->tryAddDefault(
+            addedHotkeys, HotkeyCategory::Split, QKeySequence("Ctrl+Shift+U"),
+            "toggleOverlayInertia", {"all"}, "toggle overlay click-through");
     }
 
     // split input

diff --git a/src/messages/MessageColor.cpp b/src/messages/MessageColor.cpp
@@ -1,6 +1,6 @@
 #include "messages/MessageColor.hpp"
 
-#include "singletons/Theme.hpp"
+#include "messages/layouts/MessageLayoutContext.hpp"
 
 namespace chatterino {
 
@@ -15,18 +15,18 @@ MessageColor::MessageColor(Type type)
 {
 }
 
-const QColor &MessageColor::getColor(Theme &themeManager) const
+const QColor &MessageColor::getColor(const MessageColors &colors) const
 {
     switch (this->type_)
     {
         case Type::Custom:
             return this->customColor_;
         case Type::Text:
-            return themeManager.messages.textColors.regular;
+            return colors.regularText;
         case Type::System:
-            return themeManager.messages.textColors.system;
+            return colors.systemText;
         case Type::Link:
-            return themeManager.messages.textColors.link;
+            return colors.linkText;
     }
 
     static QColor _default;

diff --git a/src/messages/MessageColor.hpp b/src/messages/MessageColor.hpp
@@ -4,15 +4,16 @@
 #include <QString>
 
 namespace chatterino {
-class Theme;
+
+struct MessageColors;
 
 struct MessageColor {
     enum Type { Custom, Text, Link, System };
 
     MessageColor(const QColor &color);
     MessageColor(Type type_ = Text);
 
-    const QColor &getColor(Theme &themeManager) const;
+    const QColor &getColor(const MessageColors &colors) const;
 
     QString toString() const;