Skip to content

feat(forum): add spoiler tags and YouTube/SoundCloud embeds#956

Open
quantbitrealmSimon wants to merge 1 commit intoBeyondMafia:masterfrom
quantbitrealmSimon:feat/forum-spoiler-youtube-embed
Open

feat(forum): add spoiler tags and YouTube/SoundCloud embeds#956
quantbitrealmSimon wants to merge 1 commit intoBeyondMafia:masterfrom
quantbitrealmSimon:feat/forum-spoiler-youtube-embed

Conversation

@quantbitrealmSimon
Copy link

Description

This PR implements enhanced forum content features as requested in #46.

Features Added

  1. Spoiler Tags - Users can now use ||spoiler text|| syntax to hide content behind clickable spoilers

    • Click to reveal/hide spoiler content
    • Smooth transition animation
    • Clear UI indication
  2. YouTube Video Embeds - Auto-embed YouTube videos from:

    • Direct syntax: youtube:VIDEO_ID
    • URLs: https://youtube.com/watch?v=VIDEO_ID or https://youtu.be/VIDEO_ID
    • Responsive iframe with 560x315 dimensions
  3. SoundCloud Embeds - Embed SoundCloud tracks using:

    • Syntax: soundcloud:TRACK_URL
    • Full player with artwork, comments, and controls

Implementation

  • Created EnhancedMarkdown.jsx component extending ReactMarkdown
  • Custom text renderer processes placeholders for spoilers and embeds
  • Added comprehensive CSS styling in markdown.css
  • Updated Thread.jsx to use the new component

Usage Examples

This is a ||spoiler|| that you can click to reveal!

Check out this video: youtube:dQw4w9WgXcQ

Listen to this: soundcloud:https://soundcloud.com/artist/track

Testing

  • Spoiler tags render correctly and toggle on click
  • YouTube videos embed with correct dimensions
  • SoundCloud tracks embed with full player
  • Multiple embeds/spoilers in same post work correctly
  • Existing markdown content continues to work

Screenshots

(Screenshots would be attached here showing the features in action)

Fixes #46

/claim 46


/cc @pikulet

- Add EnhancedMarkdown component with support for:
  - Spoiler tags (||spoiler text||)
  - YouTube video embeds (youtube:VIDEO_ID or youtube.com/watch?v=VIDEO_ID)
  - SoundCloud embeds (soundcloud:TRACK_URL)
- Update Thread.jsx to use EnhancedMarkdown
- Add CSS styles for spoilers and embeds

Fixes BeyondMafia#46
/claim 46
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.

feat(forum): allow more content type to be displayed

2 participants