mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-12 20:16:15 -08:00
Merge remote-tracking branch 'origin/master' into agent/download-season-queue
# Conflicts: # apps/electron-backend/src/app/events/database/download-requests.ts # libs/portal/xtream/feature/src/lib/serial-details/serial-details.component.spec.ts # libs/portal/xtream/feature/src/lib/serial-details/serial-details.component.ts # libs/ui/components/src/lib/season-container/episode-download.util.ts # libs/ui/components/src/lib/season-container/episode-utils.spec.ts # libs/ui/components/src/lib/season-container/season-container.component.spec.ts # libs/ui/components/src/lib/season-container/season-container.component.ts
This commit is contained in:
4gray committed
commit
31ac306bb0
243 files changed
+12935
-1106
No files matched your search
@@ -0,0 +1,165 @@
|
||||
# Unofficial Websites Cover Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Generate, validate, and publish a branded 16:9 cover image for the unofficial IPTVnator websites safety post.
|
||||
|
||||
**Architecture:** Create one project-bound raster asset with the built-in image-generation tool, then reference it through the blog collection’s existing `heroImage` frontmatter field. Keep the artwork text-free and independent of real services or user data so the same file is safe for the article hero, blog cards, and Open Graph metadata.
|
||||
|
||||
**Tech Stack:** Built-in OpenAI image generation, Astro 5 content collections, static assets under `apps/website/public/`, Nx website build.
|
||||
|
||||
---
|
||||
|
||||
## File Map
|
||||
|
||||
- Create `apps/website/public/blog/beware-unofficial-iptvnator-websites.png`: final 16:9 raster cover.
|
||||
- Modify `apps/website/src/content/blog/beware-unofficial-iptvnator-websites.mdx`: add the public asset URL to `heroImage` frontmatter.
|
||||
- No production component or schema changes are needed because the existing blog layout, cards, structured data, and Open Graph head already consume `heroImage`.
|
||||
|
||||
### Task 1: Generate and select the cover
|
||||
|
||||
**Files:**
|
||||
- Create: `apps/website/public/blog/beware-unofficial-iptvnator-websites.png`
|
||||
|
||||
- [ ] **Step 1: Generate one horizontal image with the built-in image tool**
|
||||
|
||||
Use this prompt exactly as the base generation brief:
|
||||
|
||||
```text
|
||||
Use case: stylized-concept
|
||||
Asset type: IPTVnator blog header and social-sharing cover
|
||||
Primary request: Create a premium editorial illustration that distinguishes the authentic IPTVnator project from unofficial lookalike websites. A crisp, original screen-and-broadcast-signal symbol derived from IPTVnator's established app-icon language is the central protected artifact. Two faint, fragmented browser-like panels recede beyond the left and right canvas edges as unofficial copies. Add one small pale-red warning marker as the only caution accent.
|
||||
Scene/backdrop: matte near-black graphite field with a restrained technical grid and subtle tactile grain
|
||||
Subject: central teal television-screen outline with broadcast arcs, concentric signal rings behind it, a small verification check attached to the central artifact, low-contrast broken browser silhouettes at both edges
|
||||
Style/medium: high-end flat editorial technology illustration, minimalist, precise, lightly tactile, strong silhouette, not a UI screenshot
|
||||
Composition/framing: horizontal 16:9 hero cover; central subject inside the middle 60 percent safe area; generous negative space; edge browser silhouettes may bleed out of frame; readable as a small blog-card thumbnail
|
||||
Lighting/mood: calm, authoritative, protective, restrained contrast
|
||||
Color palette: #0a0a08 graphite, #121210 charcoal, IPTVnator teal #20a8a8 / #38c4c4 / #5ee0e0, pale red #fdebec with muted red #9f2f2d, tiny warm-bone highlights #f0f0eb
|
||||
Materials/textures: matte surfaces, fine grid, very subtle paper-like grain
|
||||
Constraints: no text; no named or recognizable unofficial website; no real playlist, channel, stream, account, subscription, or copyrighted media content; no third-party logos; no watermark; keep the core mark original rather than pasting a logo
|
||||
Avoid: people, hooded figures, padlocks, shields, phishing hooks, generic cybersecurity stock imagery, neon, purple-blue AI gradients, glossy 3D, glassmorphism, heavy shadows, dense dashboards, excessive warning symbols
|
||||
```
|
||||
|
||||
Expected: one coherent 16:9 cover with the official signal dominant and the unofficial browser forms visibly secondary.
|
||||
|
||||
- [ ] **Step 2: Inspect the generated image at full size**
|
||||
|
||||
Open the generated bitmap with the local image viewer and verify all of the following:
|
||||
|
||||
- the canvas is horizontal and close to 16:9;
|
||||
- the central screen/signal mark is crisp and remains inside the middle safe area;
|
||||
- no text, watermark, third-party branding, real content, or malformed pseudo-UI appears;
|
||||
- the teal and pale-red accents match the approved palette;
|
||||
- the result is flat and editorial rather than glossy, neon, or generic cybersecurity art.
|
||||
|
||||
Expected: every check passes. If exactly one visual defect remains, perform one targeted edit that names only that defect and repeats all invariants above, then inspect again.
|
||||
|
||||
- [ ] **Step 3: Save the selected asset into the project**
|
||||
|
||||
Copy the selected built-in output from its generated-images location to:
|
||||
|
||||
```text
|
||||
apps/website/public/blog/beware-unofficial-iptvnator-websites.png
|
||||
```
|
||||
|
||||
Expected: the project-bound final exists at the exact path and the selected output is not referenced from the generated-images directory.
|
||||
|
||||
- [ ] **Step 4: Verify the file and thumbnail legibility**
|
||||
|
||||
Run:
|
||||
|
||||
```bash
|
||||
sips -g format -g pixelWidth -g pixelHeight apps/website/public/blog/beware-unofficial-iptvnator-websites.png
|
||||
sips -Z 480 apps/website/public/blog/beware-unofficial-iptvnator-websites.png --out /tmp/iptvnator-unofficial-sites-cover-thumb.png
|
||||
```
|
||||
|
||||
Expected: PNG format, landscape dimensions close to 16:9, and a 480-pixel thumbnail whose central signal remains clearly readable when inspected.
|
||||
|
||||
### Task 2: Connect the cover to the blog post
|
||||
|
||||
**Files:**
|
||||
- Modify: `apps/website/src/content/blog/beware-unofficial-iptvnator-websites.mdx`
|
||||
|
||||
- [ ] **Step 1: Add the existing `heroImage` frontmatter field**
|
||||
|
||||
Insert this line immediately after `author: 4gray`:
|
||||
|
||||
```yaml
|
||||
heroImage: /iptvnator/blog/beware-unofficial-iptvnator-websites.png
|
||||
```
|
||||
|
||||
Expected: the post uses the same public-URL convention as existing release and guide posts.
|
||||
|
||||
- [ ] **Step 2: Verify the frontmatter reference and asset pairing**
|
||||
|
||||
Run:
|
||||
|
||||
```bash
|
||||
rg -n "^heroImage: /iptvnator/blog/beware-unofficial-iptvnator-websites\.png$" apps/website/src/content/blog/beware-unofficial-iptvnator-websites.mdx
|
||||
test -f apps/website/public/blog/beware-unofficial-iptvnator-websites.png
|
||||
```
|
||||
|
||||
Expected: `rg` prints exactly one frontmatter match and `test` exits successfully.
|
||||
|
||||
### Task 3: Validate the website integration
|
||||
|
||||
**Files:**
|
||||
- Verify: `apps/website/src/content/blog/beware-unofficial-iptvnator-websites.mdx`
|
||||
- Verify: `apps/website/public/blog/beware-unofficial-iptvnator-websites.png`
|
||||
|
||||
- [ ] **Step 1: Bootstrap Nx discovery if dependencies are absent**
|
||||
|
||||
If `node_modules` is missing, run:
|
||||
|
||||
```bash
|
||||
pnpm install --frozen-lockfile
|
||||
```
|
||||
|
||||
Then run:
|
||||
|
||||
```bash
|
||||
pnpm nx show projects
|
||||
```
|
||||
|
||||
Expected: Nx lists workspace projects and includes `website`.
|
||||
|
||||
- [ ] **Step 2: Build the website**
|
||||
|
||||
Run:
|
||||
|
||||
```bash
|
||||
pnpm nx build website
|
||||
```
|
||||
|
||||
Expected: the Astro build succeeds and emits the blog post under `dist/apps/website/blog/beware-unofficial-iptvnator-websites/`.
|
||||
|
||||
- [ ] **Step 3: Verify the built metadata and static asset**
|
||||
|
||||
Run:
|
||||
|
||||
```bash
|
||||
rg -n "beware-unofficial-iptvnator-websites\.png" dist/apps/website/blog/beware-unofficial-iptvnator-websites/index.html
|
||||
test -f dist/apps/website/blog/beware-unofficial-iptvnator-websites.png
|
||||
```
|
||||
|
||||
Expected: the built HTML references the cover in article/Open Graph metadata and the static file exists in the built blog directory.
|
||||
|
||||
- [ ] **Step 4: Review scope and release-note policy**
|
||||
|
||||
Run:
|
||||
|
||||
```bash
|
||||
git diff --check
|
||||
git status --short
|
||||
```
|
||||
|
||||
Expected: no whitespace errors; the final implementation changes only the generated cover and the blog post frontmatter beyond the already-approved design and plan documents. Skip `.changes/` because website content is auto-exempt from the runtime release-note gate. Canonical architecture documentation does not need an update because no runtime behavior, contract, route, or workflow changed.
|
||||
|
||||
- [ ] **Step 5: Commit the implementation**
|
||||
|
||||
```bash
|
||||
git add apps/website/public/blog/beware-unofficial-iptvnator-websites.png apps/website/src/content/blog/beware-unofficial-iptvnator-websites.mdx docs/superpowers/plans/2026-08-02-unofficial-websites-cover.md
|
||||
git commit -m "docs(website): add unofficial sites post cover"
|
||||
```
|
||||
|
||||
Expected: the generated cover, frontmatter integration, and implementation plan are committed together.
|
||||
@@ -0,0 +1,39 @@
|
||||
# Unofficial IPTVnator Websites Blog Cover Design
|
||||
|
||||
## Goal
|
||||
|
||||
Create one horizontal 16:9 cover image for the blog post “Beware of Unofficial IPTVnator Websites and IPTV Services.” The image should make the distinction between the authentic IPTVnator project and unofficial lookalike websites immediately understandable without repeating the article title inside the artwork.
|
||||
|
||||
## Approved Direction
|
||||
|
||||
The approved concept is **Official Signal**. A crisp IPTVnator screen-and-broadcast mark is the central artifact. Concentric signal rings establish authenticity and continuity, while two faint, fragmented browser-like panels recede beyond the left and right edges as unofficial copies. A small pale-red warning marker supplies the only caution color. The composition remains legible when cropped into an aspect-ratio blog card.
|
||||
|
||||
## Visual System
|
||||
|
||||
- Canvas: 16:9 landscape, suitable for a 2200 × 1238 source image.
|
||||
- Background: matte IPTVnator graphite (`#0a0a08`) with a restrained technical grid and light grain.
|
||||
- Primary accent: IPTVnator teal (`#20a8a8`, `#38c4c4`, and `#5ee0e0`).
|
||||
- Warning accent: pale red (`#fdebec`) with muted red detail (`#9f2f2d`).
|
||||
- Main subject: a screen and broadcast-signal symbol derived from the established IPTVnator app-icon language, rendered as an original illustration rather than a pasted logo.
|
||||
- Supporting forms: two low-contrast browser silhouettes with broken or dashed edges, clearly secondary to the official signal.
|
||||
- Material character: flat, editorial, and lightly tactile; no gradients, glass effects, or heavy shadows.
|
||||
- Text: none inside the final image.
|
||||
|
||||
## Composition
|
||||
|
||||
The official signal occupies the central safe area, with enough surrounding negative space to remain readable in both the article hero and smaller listing cards. Signal rings form a controlled circular rhythm behind it. The unofficial panels are partly cropped by the canvas edges and carry lower contrast, preventing them from competing with the main mark. The pale-red warning marker sits off-axis as the single second-read detail.
|
||||
|
||||
## Constraints
|
||||
|
||||
- Do not reproduce or name any unofficial website.
|
||||
- Do not depict real playlist, channel, stream, account, or subscription content.
|
||||
- Do not add people, hooded figures, padlocks, shields, phishing hooks, or generic cybersecurity stock imagery.
|
||||
- Do not use neon, purple-blue AI gradients, glassmorphism, glossy 3D rendering, or dense dashboard UI.
|
||||
- Do not add text, watermarks, unrelated logos, or trademarked third-party graphics.
|
||||
- Keep all key elements inside the center-safe crop while allowing the secondary browser silhouettes to bleed beyond the frame.
|
||||
|
||||
## Deliverable and Integration
|
||||
|
||||
Generate a single project-bound raster cover with the built-in image-generation tool. Save the selected asset under `apps/website/public/blog/` using a descriptive, non-versioned filename. Add its `/iptvnator/blog/...` URL as `heroImage` in `apps/website/src/content/blog/beware-unofficial-iptvnator-websites.mdx`.
|
||||
|
||||
Validate the saved dimensions and file type, inspect the final image at full size and as a small thumbnail, run the website build, and verify that the post’s social metadata resolves to the new cover. No release note is required because this is website content and is auto-exempt from the runtime release-note gate.
|
||||
Reference in new issue
Block a user