diff --git a/README.md b/README.md index 210e282..d1caf24 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,17 @@ # PI Weekly Newspaper +[![Application Preview](docs/screenshots/mosaic_small.png)](docs/gallery.html) + Generates weekly ePub "newspapers" from the [Plymouth Independent](https://www.plymouthindependent.org/) RSS feed, optimized for the Xtreink X4 e-reader (800x480 screen). +[📸 View all screenshots](docs/screenshots.md) | [🖼️ View Interactive Gallery](docs/gallery.html) + +## Screenshots & Gallery + +- **[Interactive HTML Gallery](docs/gallery.html)** - A slide deck view of the app's features. +- **[Markdown Screenshots List](docs/screenshots.md)** - A full page showing all screenshots with descriptions. +- **[Large Mosaic](docs/screenshots/mosaic_large.png)** - A high-resolution 4x2 grid of all screenshots (great for sharing). + ## Quick Start ```bash diff --git a/docs/gallery.html b/docs/gallery.html new file mode 100644 index 0000000..5024d0b --- /dev/null +++ b/docs/gallery.html @@ -0,0 +1,215 @@ + + + + + + Plymouth Independent Weekly - Gallery + + + + +
+

Plymouth Independent Weekly

+

Application Gallery

+
+ +
+ +
+
+ Dashboard +
1. Dashboard Overview
+
+
+ Articles +
2. Articles List & Filtering
+
+
+ Publish Single Week +
3. Publish - Single Week Selection
+
+
+ Publish Multi-Week +
4. Publish - Multi-Week Range
+
+
+ Publish Single Article +
5. Publish - Single Article
+
+
+ Issues Archive +
6. Issues Archive
+
+
+ Web Reader +
7. Built-in Web Reader
+
+
+ Settings +
8. Application Settings
+
+
+ +
+ +
+ + + + + + + + +
+ + ← Back to README + + + + \ No newline at end of file diff --git a/docs/screenshots.md b/docs/screenshots.md new file mode 100644 index 0000000..1dd8771 --- /dev/null +++ b/docs/screenshots.md @@ -0,0 +1,35 @@ +# Plymouth Independent Weekly - Screenshots + +Here is a detailed look at the various screens and features of the application. + +## 1. Dashboard +The main dashboard provides an overview of the scheduler status and the latest generated issue. +![Dashboard](screenshots/01-dashboard.png) + +## 2. Articles +The articles view lists all fetched articles and allows filtering by week and category. +![Articles](screenshots/02-articles.png) + +## 3. Publish - Single Week +The publish screen features a combined week selector. Here, a single week is selected. +![Publish Single Week](screenshots/03-publish.png) + +## 4. Publish - Multi-Week Range +The combined week selector also allows selecting a range of weeks to compile into a single issue. +![Publish Multi-Week](screenshots/04-publish_multi_week.png) + +## 5. Publish - Single Article +You can also choose to publish a single article as a standalone issue. +![Publish Single Article](screenshots/05-publish_single_article.png) + +## 6. Issues Archive +The issues archive lists all generated issues, allowing you to read, download, push to a library, or regenerate them. +![Issues](screenshots/06-issues.png) + +## 7. Web Reader +The built-in web reader provides a clean, distraction-free reading experience for generated issues. +![Reader](screenshots/07-reader.png) + +## 8. Settings +The settings screen allows you to configure the RSS feed, auto-publish schedule, and ePub cover dimensions. +![Settings](screenshots/08-settings.png) diff --git a/docs/screenshots/01-dashboard.png b/docs/screenshots/01-dashboard.png new file mode 100644 index 0000000..900dddd Binary files /dev/null and b/docs/screenshots/01-dashboard.png differ diff --git a/docs/screenshots/02-articles.png b/docs/screenshots/02-articles.png new file mode 100644 index 0000000..24672d4 Binary files /dev/null and b/docs/screenshots/02-articles.png differ diff --git a/docs/screenshots/03-publish.png b/docs/screenshots/03-publish.png new file mode 100644 index 0000000..3f295b3 Binary files /dev/null and b/docs/screenshots/03-publish.png differ diff --git a/docs/screenshots/04-publish_multi_week.png b/docs/screenshots/04-publish_multi_week.png new file mode 100644 index 0000000..cd8f983 Binary files /dev/null and b/docs/screenshots/04-publish_multi_week.png differ diff --git a/docs/screenshots/05-publish_single_article.png b/docs/screenshots/05-publish_single_article.png new file mode 100644 index 0000000..2417d92 Binary files /dev/null and b/docs/screenshots/05-publish_single_article.png differ diff --git a/docs/screenshots/06-issues.png b/docs/screenshots/06-issues.png new file mode 100644 index 0000000..24843b3 Binary files /dev/null and b/docs/screenshots/06-issues.png differ diff --git a/docs/screenshots/07-reader.png b/docs/screenshots/07-reader.png new file mode 100644 index 0000000..bd29060 Binary files /dev/null and b/docs/screenshots/07-reader.png differ diff --git a/docs/screenshots/08-settings.png b/docs/screenshots/08-settings.png new file mode 100644 index 0000000..7394b0c Binary files /dev/null and b/docs/screenshots/08-settings.png differ diff --git a/docs/screenshots/mosaic_large.png b/docs/screenshots/mosaic_large.png new file mode 100644 index 0000000..b86eda9 Binary files /dev/null and b/docs/screenshots/mosaic_large.png differ diff --git a/docs/screenshots/mosaic_small.png b/docs/screenshots/mosaic_small.png new file mode 100644 index 0000000..d56db00 Binary files /dev/null and b/docs/screenshots/mosaic_small.png differ diff --git a/scripts/make_mosaic.py b/scripts/make_mosaic.py new file mode 100644 index 0000000..2f02d2c --- /dev/null +++ b/scripts/make_mosaic.py @@ -0,0 +1,61 @@ +import os +from PIL import Image, ImageDraw, ImageFont + +def create_mosaic(image_paths, output_path, columns, rows, target_width, padding=20, bg_color=(245, 245, 245)): + images = [] + for path in image_paths: + img = Image.open(path) + # Calculate new height to maintain aspect ratio + aspect_ratio = img.height / img.width + target_height = int(target_width * aspect_ratio) + img = img.resize((target_width, target_height), Image.Resampling.LANCZOS) + images.append(img) + + if not images: + return + + # All images should be same size now + img_w, img_h = images[0].size + + mosaic_w = (img_w * columns) + (padding * (columns + 1)) + mosaic_h = (img_h * rows) + (padding * (rows + 1)) + + mosaic = Image.new('RGB', (mosaic_w, mosaic_h), bg_color) + + for i, img in enumerate(images): + if i >= columns * rows: + break + col = i % columns + row = i // columns + + x = padding + col * (img_w + padding) + y = padding + row * (img_h + padding) + + mosaic.paste(img, (x, y)) + + # Add a subtle shadow/border + draw = ImageDraw.Draw(mosaic) + draw.rectangle([x-1, y-1, x+img_w, y+img_h], outline=(200, 200, 200), width=1) + + mosaic.save(output_path, quality=95) + print(f"Saved {output_path}") + +if __name__ == '__main__': + src_dir = 'temp_screenshots' + out_dir = 'docs/screenshots' + os.makedirs(out_dir, exist_ok=True) + + # Get the 8 numbered screenshots + files = sorted([f for f in os.listdir(src_dir) if f.startswith('0') and f.endswith('.png')]) + paths = [os.path.join(src_dir, f) for f in files] + + # Copy them to docs/screenshots + import shutil + for f in files: + shutil.copy(os.path.join(src_dir, f), os.path.join(out_dir, f)) + + # Create large mosaic (4x2 grid, each image 800px wide) + create_mosaic(paths, os.path.join(out_dir, 'mosaic_large.png'), columns=4, rows=2, target_width=800) + + # Create small mosaic (4x2 grid, each image 250px wide) + create_mosaic(paths, os.path.join(out_dir, 'mosaic_small.png'), columns=4, rows=2, target_width=250) diff --git a/templates/publish.html b/templates/publish.html index 1630645..d6f7533 100644 --- a/templates/publish.html +++ b/templates/publish.html @@ -26,7 +26,7 @@ {% for week in calendar_weeks %} + onclick="selectWeekMulti(this)" role="button" tabindex="0"> {{ week.iso_week }}{% if week.article_count %} ({{ week.article_count }}){% endif %} {% for day in week.days %} {{ day.day }} @@ -194,7 +194,7 @@ function renderCalendar(weeks, tbodyId, rowClass, onclickFn) { return `${d.day}`; }).join(''); const count = w.article_count ? ` (${w.article_count})` : ''; - return ` + return ` ${w.iso_week}${count}${days} `; }).join('');