Skip to content

Conversation

@steveseguin
Copy link
Owner

No description provided.

steveseguin and others added 30 commits May 11, 2025 13:06
Fix white-flashing on darkmode
Explicitly force the extraction of Discord usernames as text only.

This ensures that only the displayable name is captured, preventing potential issues caused by non-text nodes (such as zero-width characters or other elements) within the username container.

The `getAllContentNodes` helper in `sources/discord.js` is updated to accept a `textonly` flag, which is now passed as `true` when parsing the username element.

Includes version bump in `manifest.json`.
- Include a link to the project author's GitHub Sponsors page in the footer of documentation pages.
- This change was implemented based on user feedback to provide a more accessible and clear method for users to support ongoing project development.
- Appears in documentation pages such as commands.html, download.html, features.html, guides.html, and support.html.
Refactor message overlay presentation and scrolling logic in sampleoverlay.html:
- Update CSS for improved layout, positioning, and message visibility transitions.
- Implement dynamic scrolling logic based on container height and message visibility.
- Use requestAnimationFrame for smoother adjustments.

Refactor the Quakenet source integration in sources/quakenet.js:
- Remove dependency on Ninjafy IPC and revert to standard chrome.runtime messaging.
- Update message processing, including HTML escaping and image handling.
- Reintroduce MutationObserver for monitoring the IRC window.

Includes minor sample data tweaks in background.js for testing overlay changes.
refactor(colours): Extract color utilities to separate file

Move color calculation and utility functions from background.js
to a new dedicated file, libs/colours.js.

- Improves code organization and modularity by centralizing color logic.
- Deletes the deprecated lib.js file.
- Includes new utility functions for color manipulation (e.g., hex/rgb/hsl conversion, readability checks) in the dedicated library.
- Increments the extension version in manifest.json, reflecting the code changes on the beta branch.
```
Simplifies the implementation of message timestamp tracking and aging checks in the chat overlay (`sampleoverlay.html`).

- Removes the deprecated `setupMessageAging` function and the wrapping of `addMessageToOverlay`.
- Integrates message ID generation and timestamp recording directly into `addMessageToOverlay` using a shared `messageTimestamps` map.
- Uses a direct `setInterval` call to periodically check the age of messages based on the stored timestamps.
- Deletes timestamps from the map when corresponding messages are removed from the DOM to prevent memory leaks.
- Improves code clarity and removes unnecessary function interception.
test(utility): Prevent consecutive duplicate random messages

This change modifies the `triggerFakeRandomMessage` utility in `background.js`
to prevent it from generating the exact same message data twice in a row.

Previously, repeated calls could result in identical messages appearing
consecutively, limiting the utility for manual testing and debugging diverse
message handling scenarios. This update enhances the utility by ensuring a
greater variety of message types and content are displayed consecutively,
making it easier to observe message handling logic under diverse conditions.

- Introduce `lastRandomTestMessageData` variable to store the previous message data.
- Implement a retry mechanism using a `do...while` loop to generate a new message
  if it matches the last one, up to a maximum number of attempts.
- Add an `isEqualMessage` helper function to compare key message properties
  (name, content, image, type, donation, membership) for effective duplication
  detection.
```
Add a link within the popup interface (`popup.html`) that allows users to quickly load and test the `sampleoverlay.html` theme.

The link's URL is dynamically generated using the current session ID and password within `popup.js`, providing a convenient shortcut to a popular theme for easy preview and customization directly from the popup window.
style(sampleoverlay): Set initial spacer height

Set a large default height for the spacer element in the sample overlay HTML.

This ensures sufficient vertical space within the message list wrapper to demonstrate message scrolling and layout when viewing the sample overlay file directly, independent of the main application.
```
feat(twitch, overlay): Handle and style Twitch large emotes

- Add logic in `sources/twitch.js` to detect and extract URLs for Twitch's large ("gigantified") emotes and images.
- Modify message parsing in `sources/twitch.js` to prioritize adding the extracted large image URL (`data.contentimg`) over standard text content when present.
- Implement logic in `sources/twitch.js` to prevent adding consecutive identical large images from the same user unless the previous message element has been removed from the DOM.
- Update CSS in `featured.html` for `.largeImage` elements to improve display in the overlay:
    - Adjust positioning (`left`).
    - Remove default background and box shadow.
    - Set `min-height` to ensure adequate display space.
```
Introduce the `--content-images` CSS variable to control the maximum height of images and videos within message content containers (`.hl-imgContent`).

- Update styling rules in `dock.html` to use this variable instead of a fixed height value (was 30px).
- Connect the `--content-images` variable to the existing message scaling logic driven by the `emoji` URL parameter, allowing content images and videos to scale proportionally with emoji size.

This change provides finer control over the display size of embedded media within messages and enables them to scale along with other message elements like emojis, consistent with recent UI scaling improvements on the `beta` branch.
fix(overlay): Add missing semicolon to large image style

Adds the missing semicolon after the `left:120px` property in the
`.largeImage` CSS rule found in `featured.html`.

This resolves a minor syntax error in the featured overlay's styles,
ensuring correct parsing and consistency for large images and emotes,
building upon recent feature work in this area.
```
style(ui): Ensure content images use configured height

Add `height` property to `.hl-imgContent img, .hl-imgContent video` rule in `dock.html`.

This ensures images and videos consistently respect the `--content-images` variable for height, not just maximum height, improving styling consistency within the chat display.
```
fix(sampleoverlay): Prevent rendering empty messages

Add validation to `addMessageToOverlay` in `sampleoverlay.html`
to skip messages lacking essential content.

This avoids rendering empty message elements when data fields
such as chatname, chatmessage, donation, hasDonation, or contentimg
are all null, undefined, or empty.
```
Removes obsolete and unused code from background.js to improve clarity and reduce file size.

- Removes String.prototype.replaceAllCase utility function.
- Removes validTLDs set and isValidTLD function.
- Removes large filterXSS function, potentially replaced or no longer needed in this context.
- Removes createTestMessage helper function, suggesting changes in testing approach or location.
- Removes unused Jokes array data.
- Adds reference to libs/objects.js in background.html, possibly for moved/new utility logic.
feat(patreon): Add chat integration

Implement basic support for ingesting chat messages from Patreon.

- Adds a new content script (`sources/patreon.js`) using a MutationObserver to detect and process incoming messages.
- Includes logic to extract sender names, profile pictures, and message content from the page structure.
- Updates `manifest.json` with `*.patreon.com` host permissions and registers the new content script.
- Adds the Patreon source icon (`sources/images/patreon.png`).
- Bumps the extension version to 3.20.0 as part of this feature addition.
```
Add logic to detect user icons with inline color styles in Fansly messages and generate a corresponding SVG badge when no traditional badges are found. This provides a visual indicator for users who lack standard badges but have role-specific icon colors, improving integration accuracy for the platform.

- Implement icon color parsing and SVG badge generation within `sources/fansly.js`.
- Re-enable processing of newly added messages by uncommenting the `processMessage` call in the MutationObserver callback within `sources/fansly.js` to ensure real-time chat updates were handled.
- Refactor the internal processing flag for the chat container element from a direct property (`.marked`) to a `dataset` property (`.dataset.marked`) in `sources/fansly.js` for better separation of concerns and standard practice.
- Update the `.firsttime` CSS selector in `dock.html` to include `.odd.firsttime` for improved styling consistency with new messages.
- Comment out redundant `processMessage` call in `setInterval` loop in `sources/fansly.js` to prevent reprocessing already handled initial messages.
- Increment the extension manifest version to 3.21.0 in `manifest.json` for release tracking.
feat(automix): Add setup UI and enhance embedding

- Implement a user interface in automix.html for configuring VDO.Ninja and chat links.
- Allow bypassing the setup UI via 'vdo' and 'chat' URL parameters for direct linking.
- Enhance dynamic iframe layout and sizing logic for optimal embedding of Social Stream pages (dock.html, featured.html) and external chat sources.
- Delay displaying the chat iframe until the embedded VDO.Ninja stream signals readiness ('seeding' or 'view-connection').
- Add an event listener in automix.html to receive 'resizeWindow' messages from embedded Social Stream iframes, enabling them to adjust chat overlay dimensions within the automix container.
- Include a new star icon (icons/star.svg) and its license (icons/license-*.pdf) for the automix UI.
- Clean up minor unused CSS rules in dock.html.
- Remove debug console.log statement from sources/fansly.js.
```
Introduce a new setting (`hostFirstSimilarOnly`) to filter and hide host-originated messages if a message with the same content was received within the last 5 seconds.

This helps reduce chat clutter and prevents redundant actions (like TTS or bot commands) triggered by reflected host messages arriving through multiple sources or mechanisms simultaneously.

Changes include:
- Implement `HostMessageFilter` class in `background.js` to track recent host messages.
- Integrate filtering logic in message processing based on the new `hostFirstSimilarOnly` setting.
- Add corresponding toggle option in `popup.html` for user control.
- Increment extension version in `manifest.json`.
- Use `.raw` property as source of truth for extension popup links (`popup.js`), fixing
  copy-to-clipboard and display logic. Removes reliance on deprecated
  `[data-raw]` attribute and cleans TTS provider parameters from URLs.
- Extend host message filter expiration from 5 seconds to 20 seconds (`background.js`)
  to improve effectiveness of duplicate message hiding from the same host.
- Add a beta notice section to the download documentation (`docs/download.html`, `docs/css/download.css`).
  Directs users to the beta site, supporting the 'beta' branch focus.
- Increment manifest version to 3.21.2 (`manifest.json`).
fix(extension): Improve host message filter logic and expiry

- Increase message expiry time in HostMessageFilter (background.js) from 20s to 60s to improve duplicate detection over longer periods.
- Correct logic in HostMessageFilter (background.js) to properly handle falsy textonly values (false, "") ensuring fallback to chatmessage when it exists.
- Update extension version in manifest.json to 3.21.3.

This commit continues ongoing work on the host message filtering system within the extension, building upon recent related changes on the beta branch.
```
Implement message history and DOM element marking to prevent the Patreon source from processing the same message multiple times.

- Uses the element's `data-index` attribute to track processed messages.
- Adds a marker directly on the DOM element to avoid repeated processing attempts.
- Increases the processing delay slightly for added stability.
- Addresses an issue where Patreon can inject duplicate message elements into the DOM, causing duplicates in the stream.
chore(extension): Remove debug logs for host message filter

Remove temporary `console.log` statements from `background.js`.

These logs were used for debugging the host message filtering logic, specifically near the `hostMessageFilter.isHostDuplicate` check within the `applyBotActions` function.

This commit cleans up code following recent work on improving the handling and filtering of host messages within the extension as part of ongoing `beta` branch development.
```
Adds logic within the message processing loop in `dock.html` to identify messages containing images (emotes) that function as commands.

- Checks the `alt` attribute of images within a message.
- If an image's `alt` text starts with `!` and it is the first element in the message content, the message's internal `data.command` flag is set to `true`.
- This allows subsequent features like TTS, beeping, and other message processing logic to react as if the message were a standard text command.
- Enables using specific emotes or images to trigger actions or filters.
Add `overflow: hidden` to the `.testimonials` CSS rule in `docs/css/styles.css`. This change prevents potential content overflow issues within that section on the documentation site, ensuring layout stability.
Implement detection for the "Meld/" user agent string and apply corresponding UI adjustments and logic in the dock interface.

- Detect the Meld environment by checking `navigator.userAgent`.
- Apply styling and behavioral changes in `dock.html` similar to the OBS Browser Source mode (e.g., hide menu, adjust margins/overflow, force autoscroll, scale adjustments).
- Set environment-specific background and transparency styles in `dock.html`.
- Enable loading external JavaScript via URL parameters when running in Meld (similar to OBS/standalone environments).
- Make minor UI adjustments in `actions/index.html` (e.g., remove back link, add description).
- Hide the Giveaway tool link in `popup.html`.
- Comment out unused custom parameter logic in `popup.js`.
steveseguin and others added 29 commits May 19, 2025 15:08
fix(youtube): Improve polling state cleanup in message fetch

Modify the finally block logic within the `fetchChatMessages` function in
`sources/websocket/youtube.html`.

Ensure the `isPolling` flag is consistently reset to false after fetch
attempts, regardless of the outcome (success, non-ok response, or error).
This prevents potential stuck states for the polling flag, allowing subsequent
fetch calls, and improves the robustness of the YouTube chat fetching mechanism.
```
Creates a new GitHub Actions workflow to automate the deployment
of the application to GitHub Pages.

- Deploys content from the `main` branch to the root of the `gh-pages` branch.
- Deploys content from the `beta` branch to the `/beta` subdirectory on the `gh-pages` branch.
- Prevents Jekyll processing on the gh-pages branch with a `.nojekyll` file.
- Workflow is triggered on push to `main` or `beta`, and manually via `workflow_dispatch`.

This addresses the need for automated hosting of both main and beta
versions on GitHub Pages.
chore: Update fake message user image URL

Replace external URL with internal asset for the mock user image in the fake message generator.

This improves reliability and reduces dependency on third-party resources for internal testing/demonstration within the `triggerFakeRandomMessage` function in `background.js`.
```
fix(featured): Ensure donation amount wrapping

Previously, the donation amount in the overlay (`featured.html`) lacked the `.donation` class when an avatar was present but no donation title was provided. This could lead to incorrect styling or wrapping issues, particularly in compact layouts.

This change applies the `.donation` class consistently to the donation amount container in this specific scenario (`featured.html`) to maintain proper styling and layout behavior.

A dedicated test case mimicking this layout (avatar present, no title, with donation amount) has been added to the fake message generator (`background.js`) to facilitate testing this layout and styling in the overlay.
```
Removes a static block of test/demo message data from the `triggerFakeRandomMessage` function in `background.js`.

This ensures the function relies exclusively on its dynamic message generation logic, preventing potential use of outdated hardcoded examples.

Continues cleanup of the fake message generation logic on the `beta` branch.
The previous commit introduced the GitHub Pages deployment workflow with a typo in the filename (.github/workflows/deploy,yml).

This commit renames the file to the correct .yml extension (.github/workflows/deploy.yml) so it is recognized and executed by GitHub Actions.
Implement backend processing for new webhook events and improve data handling.

- Add logic in `background.js` to handle incoming Stripe `checkout.session.completed` and Fourthwall `ORDER_PLACED` webhook data.
- Also include processing logic in `background.js` for Buy Me A Coffee (BMAC) webhook data.
- Map Stripe, Fourthwall, and BMAC data fields (name, message, amount, currency, products) to the standardized internal message object format for display in the chat overlay (`featured.html`) and dashboard (`dock.html`).
- Introduce version compatibility checks using a new `compareVersions` utility in `dock.html` and `background.js` to prevent processing incompatible webhook data (Kofi, BMAC, Stripe, Fourthwall) from older sources.
- Move the `Currencies` object definition from `dock.html` to a dedicated `currency.js` file for better organization and reuse across the application.
- Add the `compareVersions` utility function to `libs/objects.js`.
- Update the project version number in `manifest.json`.
- Adjust version compatibility checks within the Stripe, Ko-Fi, and Buy Me a Coffee webhook processing logic in `dock.html`. This ensures webhook data is only processed by frontend code versions loaded via URL (`urlVersion`) that are compatible with the current logic (version >= 3.21.10), preventing potential data misinterpretation by older frontend code.
Fixes incorrect version comparison logic for incoming webhook handlers in `dock.html`.

Previously, the check `comparison < 0` incorrectly prevented processing webhooks received from URLs with versions *newer* than the current application version (3.21.10).

This commit changes the condition to `comparison > 0` for Stripe, Ko-Fi, and Buy Me a Coffee handlers. This ensures that only webhooks from URL versions older than the minimum required version are rejected, while newer versions are processed correctly.
fix(api): Conditionally apply webhook version check

Apply the webhook version comparison check only when running with a socket server.

Previously, the version comparison check within webhook processing would reject webhooks if the URL version was newer than 3.21.10, irrespective of whether a socket server was active or the validation was required in that context. This incorrect behavior prevented webhooks from being processed correctly in environments where the socket server was not in use.

This change modifies the logic in `dock.html` to ensure the version comparison is only performed when the `socketserver` variable is true, specifically affecting the validation for Stripe, Ko-Fi, and Buy Me a Coffee webhooks. This complements the previous correction of the comparison logic itself by ensuring it's applied under the correct conditions.
```
Integrate 7TV emote fetching and rendering logic for Kick streams.

- Add background script logic (`background.js`) to fetch required Kick user IDs for 7TV API lookups and handle 7TV API requests for Kick.
- Implement fetching, caching, merging (with BTTV/FFZ), and rendering logic within both the old (`sources/kick.js`) and new (`sources/kick_new.js`) Kick source scripts.
- Ensure cached 7TV Kick emotes are cleared in `background.js` when 7TV emote settings are changed.
Enhance the YouTube source page UI and integration logic.

- Implement flexible header layout in `youtube.html` for improved display and overflow handling of user and channel info.
- Add specific CSS styling for the channel input section in `youtube.html`.
- Refactor `fetchWithTimeout` in `youtube.html` to correctly handle method, body, and headers passed in options.
- Ensure `type: "youtube"` is included in `pushMessage` calls for Super Chat and Membership messages in `youtube.html`.
- Update Membership badge from `<img>` to a `<span>` with a star emoji in `youtube.html`.
- Adjust chat input focus selector to `#input-text` in `youtube.js`.
Adds a "Change" button to the YouTube source configuration page.

This button allows users to disconnect from the current YouTube
channel or video and reset the UI state.

When clicked, it:
- Clears the active connection polling.
- Resets displayed stats, events, and header info.
- Clears the stored channel/video ID from local storage.

This provides a convenient way to switch to a different YouTube
channel or video from the source configuration page without needing
to remove and re-add the entire source.
- Remove unused variables and comments.
- Eliminate commented-out inactivity check and unread tips click logic.
- Streamline implementation details within `avatarCache`, `messageLog`, and `StreamState`.
- Remove excessive blank lines and commented-out code blocks.
Update `.github/workflows/deploy.yml` to reflect current branch structure and deployment strategy for GitHub Pages.

- Update main branch reference from `master` to `main`.
- Update beta branch reference and adjust its deployment subdirectory path to `gh-pages-content/beta`.
- Refine the internal commit message used by the deployment action.

Also adds the `type="text/javascript"` attribute to `<script>` tags across several HTML files for consistency.
- Ignore workflow file changes in push trigger.
- Add conditions to skip workflow run based on commit message (`[skip pages]`) and actor (github-pages[bot]).
- Add `[skip pages]` tag to the internal deployment commit message.
- These changes prevent recursive workflow runs and unnecessary triggers.
Add blank line before the "Relay Messages" section heading (section 5) in `docs/customoverlays.md` to improve clarity and formatting.
Prevent infinite CI loops and unnecessary workflow runs (deploy, validate) caused by the force-push of automatically enhanced commit messages.

- Add `[auto-enhanced]` tag to commit messages generated by `.github/scripts/enhance-commits.js`.
- Update workflow conditions in `.github/workflows/deploy.yml`, `.github/workflows/enhance-commits.yml`, and `.github/workflows/validate_html.yml` to check for this tag and skip the job if present.

This ensures only manual pushes or initial PR commits trigger the full suite of workflows, and the enhancement process doesn't cause cascades.

[auto-enhanced]
- Add support for URL-encoded `/live/` patterns (`%2Flive%2F`) in Instagram source logic to improve compatibility with different link formats.
- Refine CSS for YouTube websocket page (`sources/websocket/youtube.html`) to improve layout, particularly for full-height containers and scrolling chat area.
- Update `fetchWithTimeout` logic in YouTube source for more robust error handling and detailed logging.

[auto-enhanced]
- Load standard emoji data from a new `emotes.json` file.
- Implement client-side logic in `sources/websocket/youtube.html` to fetch, cache (7 days), and map emojis by ID and shortcut for display.
- Add basic CSS styling (`.chat-emoji`) for displayed chat emojis.
- Integrate the text-only mode setting from the extension into the YouTube source (`youtube.js` and `youtube.html`) to allow conditional rendering of chat elements based on user preference.
- Corrects data attribute `data-optionparam1` to `data-optionparam10` in `popup.html`.

[auto-enhanced]
- Integrates a large set of custom emotes from `sources/websocket/custom_emotes.json` for use in YouTube chat.
- Refactors the emoji and emote handling logic in `sources/websocket/youtube.html` to correctly process and display both custom emotes and standard Unicode/shortcut emojis, improving message rendering accuracy.
- Adds responsive CSS styles to `sources/websocket/youtube.html` to optimize the chat textarea height and hide headers on smaller viewports.
- Adds `data-translate` attributes to profile management buttons in `libs/profiles.js` as preparation for internationalization (i18n).
- Updates the extension version in `manifest.json`.

[auto-enhanced]
Adds switches to popup.html allowing users to hide messages
from Kofi and YouTube streams. Extends the existing hide
option for Kick messages within the UI settings.

[auto-enhanced]
feat(tiktok): Add viewer count reporting

Implement logic within the TikTok source (`sources/tiktok.js`) to extract and report the live viewer count.

- Locate and parse the element displaying the live viewer count (`[data-e2e='live-people-count']`).
- Handle 'K' and 'M' suffixes in the reported count.
- Send a 'viewer_update' message via `chrome.runtime.sendMessage` to make the count available for display in the main dashboard or overlay (e.g., for `settings.showviewercount` or `settings.hypemode`).
```

[auto-enhanced]
Adds a new testimonial from "Apollo and Frens" and their image to the index.html landing page.

[auto-enhanced]
Correct the image file extension for the Apollo and Frens
testimonial in index.html from .png to .jpg.

Ensures the testimonial author image displays correctly on the website.

[auto-enhanced]
- Make messages in the events dashboard (`events.html`) clickable.
- Implement logic to send the full event data of a clicked message to connected overlay instances (peers with label "overlay" or generic).
- This allows users to manually highlight or feature specific events on their stream overlay via interaction with the dashboard.
- Enhance WebSocket connectivity with automatic reconnection attempts and error handling.
- Increase the default number of displayed events from 100 to 200.
- Add CSS styles to provide visual feedback for clickable messages.
- Implement tracking of connected peers within the iframe/postMessage handler for targeted messaging.

[auto-enhanced]
@steveseguin steveseguin merged commit 38a91e3 into main May 23, 2025
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants