# YouTube Unbranded Embed Service 🎬

A minimal embedding service that removes YouTube native branding, logos, titles, and related video suggestions. Delivers a clean HTML5 player with custom theme colors.

---

## Endpoints

### 1. Landing Documentation
```http
GET /
```
Serves this minimal reference guide (HTML for browsers, Markdown for AI agents).

### 2. Video Embed Player
```http
GET /embed/:id
```
Renders the clean unbranded player. The `:id` parameter accepts:
- Direct 11-character video ID (e.g. `dQw4w9WgXcQ`)
- Full YouTube watch URL (e.g. `https://www.youtube.com/watch?v=dQw4w9WgXcQ`)
- Shortened URL (e.g. `https://youtu.be/dQw4w9WgXcQ`)
- YouTube Shorts URL (e.g. `https://youtube.com/shorts/dQw4w9WgXcQ`)

*Also supports query parameter fallback: `GET /embed?v=VIDEO_ID`*

---

## Query Parameters

| Parameter | Type | Default | Description | Example |
| :--- | :--- | :--- | :--- | :--- |
| `color` / `theme` | `string` | `#ef4444` | Player accent color (hex or CSS name) | `color=3b82f6` |
| `controls` | `string` | `all` | Controls preset (`all`, `minimal`, `none` / `0`) or comma list | `controls=minimal` |
| `autoplay` | `boolean` | `0` | Automatically starts playback on load (auto-mutes if needed) | `autoplay=1` |
| `muted` / `mute` | `boolean` | `0` | Starts video muted | `muted=1` |
| `loop` | `boolean` | `0` | Replays video continuously when finished | `loop=1` |
| `speed` | `number` | `1` | Initial playback speed (`0.5`, `1.25`, `1.5`, `2`) | `speed=1.5` |
| `start` / `t` | `number` | `0` | Playback start offset in seconds (`45` or `1m30s`) | `start=45` |
| `radius` | `string` | `0px` | Container border radius in px | `radius=12` |
| `poster` | `string` | `auto` | Custom thumbnail image URL | `poster=https://...` |
| `ratio` | `string` | `16 / 9` | Container CSS aspect ratio | `ratio=16/9` |
| `bg` | `string` | `#000000` | Canvas background color | `bg=0f172a` |

---

## Framing, CORS & Caching

The service sends only the necessary headers to allow embedding while maintaining simple edge caching:

- `Content-Security-Policy: frame-ancestors *`
- `Access-Control-Allow-Origin: *`
- `Access-Control-Allow-Methods: GET, HEAD, OPTIONS`
- `Cross-Origin-Resource-Policy: cross-origin`
- `X-Frame-Options` is omitted
- `Cache-Control: public, max-age=0, s-maxage=31536000, must-revalidate` (1 year CDN cache, 0s browser cache for instant cache busting on video embeds; root `/` is un-cached)

---

## Quick Embed Examples

### HTML `<iframe>`
```html
<iframe 
  src="https://e.raiyansarker.com/embed/LXb3EKWsInQ?color=%233b82f6&radius=8" 
  width="100%" 
  height="450" 
  style="border: none; aspect-ratio: 16 / 9; max-width: 100%;" 
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" 
  allowfullscreen
></iframe>
```

### React / Next.js
```tsx
export function VideoEmbed({ videoId = "LXb3EKWsInQ" }) {
  return (
    <iframe
      src={`https://e.raiyansarker.com/embed/${videoId}?color=%236366f1&radius=12`}
      width="100%"
      height="100%"
      style={{ border: "none", aspectRatio: "16 / 9", maxWidth: "100%" }}
      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
      allowFullScreen
    />
  );
}
```
