beep/README.md

# Beep

A Twitter/X-style microblog for WordPress. Logged-in users post short updates with rich media, polls, GIFs, voice notes, and quotes. Like, reply (with nested threads), and share beeps. Designed to look like a Twitter timeline, hosted entirely on your own site.

## What's in v1.8.0

- **Twitter-style timeline.** The feed shows only top-level beeps; click a beep (or its reply count) to open the conversation in a modal with reply forms, likes, and nested threads.
- **Light theme + auto mode.** `theme="auto"` (default) follows the visitor's system preference; `dark` and `light` force a theme.
- **Lots of fixes.** Composer avatar, modal close buttons, CSS scoping, Elementor widget registration (and Beep works fine without Elementor), real avatars on replies, action-bar polish. See `readme.txt` for the full changelog.

## What's in v1.5.1

### Core Features
- **Post beeps.** Short updates up to 280 characters, with a composer at the top of the feed.
- **Like beeps and replies.** Hearts on every post and every reply, with a pop animation when you tap.
- **Nested replies.** Reply to a reply, to a reply, to a reply. Visual indent caps at two levels (deeper threads still nest structurally).
- **Latest / Top tabs.** "Top" sorts your feed by like count — a built-in way for readers to surface the best stuff.
- **Per-post Beep badge.** Every beep and reply carries a small bird icon in the corner, branding it as a Beep.
- **Friendlier visitor experience.** Logged-out visitors see clean read-only beeps; logged-in users get the full interactive feed.

### Rich Media
- **Image uploads.** Attach up to 4 images per beep. Previews in the composer with remove buttons. Images display in an adaptive grid (1×, 2×, 3×, 4× layouts).
- **GIF picker (Giphy).** Search and embed GIFs via the Giphy API. Configure your API key in **Settings → Beep**.
- **Voice notes.** Record and attach audio notes (MP3, OGG, WAV, WebM, M4A) up to 20 MB. Inline audio player with play button and waveform visualization.
- **Quote beeps.** Reference any existing beep as a quote. Loads the quoted post's author, time, and content inline.

### Polls
- **Create polls.** Add a poll to any beep with a question and 2–6 options.
- **Vote on polls.** One-click voting with live results displayed as progress bars.
- **Poll management.** Add/remove options before posting; polls are cleared after submission.

### Thread View
- **Conversation modal.** Click any beep to open a full thread/conversation view in a modal overlay.
- **Nested thread display.** Replies are indented by depth for easy reading.

### Settings & Integration
- **Admin settings page.** Configure character limit, Giphy API key, and other options under **Settings → Beep**.
- **Elementor widget.** Drag-and-drop Beep feed into any Elementor-built page.
- **Magic login support.** Works with passwordless login plugins for frictionless onboarding.

### Moderation
- **Delete any beep or reply.** Logged-in admins see a small × in the top-right of each item.
- **Approve replies before they appear.** Settings → Discussion → "Comment must be manually approved" puts replies in a queue at **Comments** in the sidebar.
- **Suspend users.** Users → click their name → scroll to **Chirp moderation** → check **Suspend from beeping**.

## Install Beep

1. In wp-admin, go to **Plugins → Add New → Upload Plugin**.
2. Upload `beep.zip` and click **Install Now**, then **Activate**.
3. On the page you want the feed (your one-page site, a dedicated "Feed" page, etc.), add the shortcode:

   ```
   [beep_feed]
   ```

   Save and visit the page. As an admin, you'll see a composer at the top — type a message and click "Beep" to post.

## Invite friends (with magic links — no passwords)

This is the easiest way to let a small circle into your Beep feed without setting up Google/Facebook developer apps. The flow:

1. **Open registration.** Go to **Settings → General**, check **Anyone can register**, and set **New User Default Role** to **Subscriber**. Save.
2. **Install passwordless login.** Plugins → Add New → search for **Passwordless Login** (any well-reviewed one — Cozmoslabs or Magic Login both work). Install and activate.
3. **Share the sign-up link.** Send your friends a direct link to:

   ```
   https://your-site.com/wp-login.php?action=register
   ```

   They type their email, get a one-time sign-in link, and they're in. No password to remember.
4. **They can now like and reply.** Liking and replying require being logged in; your feed remains read-only for the public.

## Shortcode options

```
[beep_feed limit="50" header="Messages from" sort="latest" theme="auto" show_wordmark="yes"]
```

- `limit` — how many beeps to load on first render (default 50)
- `header` — text shown next to the wordmark (default "Messages from"; pass `""` to hide)
- `sort` — initial sort: `latest` (default) or `top`
- `theme` — `auto` (default, follows the visitor's system preference), `dark`, or `light`
- `show_wordmark` — `yes` (default) or `no`

## Elementor Widget

After activating Beep, you'll find a **Beep Feed** widget in the Elementor panel. Drag it onto your page — it renders the same feed as the shortcode, with no extra configuration needed.

## Branding

Swap the bird/wordmark in `assets/`. The accent color is `#1D9BF0`; find/replace in `assets/beep.css` for a different palette.

## Changelog

### v1.5.1
- Fixed critical IIFE scope bug — all functions now properly access `config` and `handleResponse`
- Removed leaked Giphy API key from JavaScript source
- Fixed voice note upload not clearing composer state
- Added CSS for GIF picker modal, poll compose section, media preview grid, voice note preview
- Added loading spinner and empty states for feed
- Added responsive styles for GIF grid and media preview on mobile

### v1.5
- Image uploads with 4-image grid
- GIF picker via Giphy API
- Voice note attachments
- Quote beeps
- Polls with voting
- Thread/conversation modal
- Elementor widget
- Admin settings page

### v1.4
- Like beeps and replies with pop animation
- Nested replies (multiple levels deep)
- Latest / Top tabs
- Per-post Beep badge
- Read-only mode for logged-out visitors

## License

GPLv2 or later, same as WordPress.