feat: add local ad-free newspaper

VERSION

@@ -1 +1 @@
-0.2.6
+0.2.5

browser.py

@@ -863,11 +863,76 @@ if __name__ == "__main__":
             # Update cache every 15 minutes
             time.sleep(900)
 
+    def update_news_cache():
+        """Fetch top RSS news feeds (BBC, NPR) in background and cache as local JSON to bypass CORS/Ads."""
+        import xml.etree.ElementTree as ET
+        import re
+        cache_file = _HOME / "kiosk-home" / "news-data.json"
+        
+        feeds = {
+            "World News": "http://feeds.bbci.co.uk/news/world/rss.xml",
+            "National News": "https://feeds.npr.org/1001/rss.xml"
+        }
+        
+        while True:
+            payload = {}
+            for category, url in feeds.items():
+                try:
+                    req = urllib.request.Request(url, headers={"User-Agent": "Mozilla/5.0"})
+                    xml_raw = urllib.request.urlopen(req, timeout=12).read()
+                    root = ET.fromstring(xml_raw)
+                    
+                    stories = []
+                    channel = root.find("channel")
+                    if channel is not None:
+                        # Fetch up to 10 stories per category
+                        for idx, item in enumerate(channel.findall("item")):
+                            if idx >= 10:
+                                break
+                            title = item.find("title")
+                            desc = item.find("description")
+                            pub_date = item.find("pubDate")
+                            
+                            t_str = title.text.strip() if title is not None and title.text else ""
+                            d_str = desc.text.strip() if desc is not None and desc.text else ""
+                            
+                            # Clean HTML tags from description if any
+                            d_str = re.sub('<[^<]+?>', '', d_str)
+                            
+                            p_str = ""
+                            if pub_date is not None and pub_date.text:
+                                try:
+                                    p_str = " ".join(pub_date.text.split()[:4])
+                                except Exception:
+                                    p_str = pub_date.text
+                                    
+                            stories.append({
+                                "title": t_str,
+                                "summary": d_str,
+                                "date": p_str
+                            })
+                    payload[category] = stories
+                    print(f"Successfully cached {len(stories)} stories for category: {category}")
+                except Exception as e:
+                    print(f"Failed to fetch RSS category {category}: {e}")
+            
+            if payload:
+                try:
+                    cache_file.parent.mkdir(parents=True, exist_ok=True)
+                    cache_file.write_text(json.dumps(payload, indent=2))
+                    print("Updated local news-data.json cache successfully")
+                except Exception as e:
+                    print(f"Failed to write news cache file: {e}")
+            
+            # Update news every 30 minutes
+            time.sleep(1800)
+
     def init_cdp():
         if cdp.wait_ready(timeout=30):
             print("CDP ready — persistent WebSocket connected successfully")
     
     threading.Thread(target=update_weather_cache, daemon=True).start()
+    threading.Thread(target=update_news_cache, daemon=True).start()
     threading.Thread(target=init_cdp, daemon=True).start()
 
     sys.exit(app.exec_())

config.json

@@ -3,7 +3,7 @@
     "email": "https://mail.jgitta.com/roundcube/",
     "internet": "https://www.duckduckgo.com",
     "weather": "weather.html",
-    "news": "https://news.google.com",
+    "news": "news.html",
     "facebook": "https://www.facebook.com",
     "messenger": "https://www.messenger.com",
     "youtube": "https://www.youtube.com"

deploy.sh

@@ -11,6 +11,8 @@ HOME_SRC="$REPO_DIR/home-screen-index.html"
 HOME_DST="/home/jgitta/kiosk-home/index.html"
 WEATHER_SRC="$REPO_DIR/weather.html"
 WEATHER_DST="/home/jgitta/kiosk-home/weather.html"
+NEWS_SRC="$REPO_DIR/news.html"
+NEWS_DST="/home/jgitta/kiosk-home/news.html"
 CONFIG_SRC="$REPO_DIR/config.json"
 # Auto-increment patch version (0.2.0 → 0.2.1 → 0.2.2 ...)
 VERSION_FILE="$REPO_DIR/VERSION"
@@ -62,6 +64,12 @@ if [ -f "$WEATHER_SRC" ]; then
   echo "  Synced weather page"
 fi
 
+if [ -f "$NEWS_SRC" ]; then
+  cp "$NEWS_SRC" "$NEWS_DST"
+  chown jgitta:jgitta "$NEWS_DST" 2>/dev/null || true
+  echo "  Synced news page"
+fi
+
 echo "==> Committing and pushing to Gitea..."
 git -C "$REPO_DIR" add -A
 git -C "$REPO_DIR" commit -m "$COMMIT_MSG" 2>/dev/null || echo "  (nothing new to commit)"
@@ -95,6 +103,7 @@ if [ -n "$KIOSK" ]; then
     config_json=\\\$(cat config.json | sed 's/\\\\\\\\/\\\\\\\\\\\\\\\\/g' | sed 's/\\\"/\\\\\\\"/g' | tr '\\\n' ' ')
     sed \"s|const config = {};|const config = \\\$config_json;|\" home-screen-index.html > /home/jgitta/kiosk-home/index.html
     cp weather.html /home/jgitta/kiosk-home/weather.html
+    cp news.html /home/jgitta/kiosk-home/news.html
     /usr/local/bin/kiosk-restart
   "
   echo "  Production updated."

install-kiosk.sh

@@ -47,6 +47,7 @@ apt-get install -y \
   git \
   curl \
   openssh-server \
+  fonts-noto-color-emoji \
   2>&1 | grep -Ev "^(Reading|Selecting|Preparing|Unpacking|Setting|Processing|Triggers|Get)"
 
 # ── Kiosk repo ─────────────────────────────────────────────────────

news.html

@@ -0,0 +1,282 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>News</title>
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+
+    body {
+      font-family: Arial, sans-serif;
+      background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
+      background-attachment: fixed;
+      color: white;
+      min-height: 100vh;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      padding: 30px 20px;
+    }
+
+    /* Frosted glass container */
+    .container {
+      background: rgba(0, 0, 0, 0.4);
+      backdrop-filter: blur(16px);
+      -webkit-backdrop-filter: blur(16px);
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      border-radius: 36px;
+      padding: 40px 30px;
+      width: 100%;
+      max-width: 1000px;
+      box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
+    }
+
+    header {
+      text-align: center;
+      margin-bottom: 40px;
+    }
+
+    header h1 {
+      font-size: 48px;
+      font-weight: bold;
+      color: #fff;
+      letter-spacing: 1px;
+      text-shadow: 0 4px 10px rgba(0,0,0,0.3);
+    }
+
+    header p {
+      font-size: 20px;
+      color: #ffd700;
+      margin-top: 8px;
+      font-weight: bold;
+    }
+
+    #loading-box {
+      text-align: center;
+      font-size: 26px;
+      padding: 60px 0;
+      color: #e2e8f0;
+    }
+
+    .category-title {
+      font-size: 32px;
+      font-weight: bold;
+      color: #38bdf8;
+      margin: 40px 0 20px 0;
+      border-bottom: 3px solid rgba(56, 189, 248, 0.3);
+      padding-bottom: 10px;
+      display: flex;
+      align-items: center;
+      gap: 12px;
+    }
+
+    /* Accordion stories list */
+    .stories-list {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+    }
+
+    .story-card {
+      background: rgba(255, 255, 255, 0.05);
+      border: 1px solid rgba(255, 255, 255, 0.08);
+      border-radius: 20px;
+      overflow: hidden;
+      transition: background 0.2s, transform 0.15s;
+    }
+
+    .story-card:hover {
+      background: rgba(255, 255, 255, 0.09);
+      transform: translateY(-2px);
+    }
+
+    /* Large tap target for header */
+    .story-header {
+      padding: 24px 28px;
+      cursor: pointer;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      gap: 20px;
+      user-select: none;
+    }
+
+    .story-headline {
+      font-size: 24px;
+      font-weight: bold;
+      line-height: 1.35;
+      color: #fff;
+    }
+
+    .story-chevron {
+      font-size: 28px;
+      color: #94a3b8;
+      transition: transform 0.2s;
+    }
+
+    .story-card.open .story-chevron {
+      transform: rotate(90deg);
+      color: #38bdf8;
+    }
+
+    /* Smooth accordion drawer */
+    .story-body {
+      max-height: 0;
+      overflow: hidden;
+      transition: max-height 0.3s cubic-bezier(0, 1, 0, 1);
+      background: rgba(0, 0, 0, 0.2);
+    }
+
+    .story-card.open .story-body {
+      max-height: 1000px; /* arbitrary high value to animate cleanly */
+      transition: max-height 0.3s ease-in;
+    }
+
+    .story-content {
+      padding: 24px 28px;
+      border-top: 1px solid rgba(255, 255, 255, 0.05);
+    }
+
+    .story-summary {
+      font-size: 22px;
+      line-height: 1.6;
+      color: #f1f5f9;
+      margin-bottom: 16px;
+    }
+
+    .story-meta {
+      font-size: 16px;
+      color: #94a3b8;
+      font-weight: bold;
+    }
+
+    /* Giant Home Button */
+    .footer-nav {
+      text-align: center;
+      margin-top: 50px;
+    }
+
+    .home-btn {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      background: linear-gradient(135deg, #10b981, #059669);
+      color: white;
+      text-decoration: none;
+      padding: 22px 55px;
+      font-size: 28px;
+      font-weight: bold;
+      border-radius: 22px;
+      box-shadow: 0 8px 24px rgba(16, 185, 129, 0.35);
+      cursor: pointer;
+      border: none;
+      transition: transform 0.1s, box-shadow 0.1s;
+    }
+
+    .home-btn:hover {
+      transform: translateY(-3px);
+      box-shadow: 0 12px 30px rgba(16, 185, 129, 0.5);
+    }
+
+    .home-btn:active {
+      transform: translateY(0px);
+    }
+  </style>
+</head>
+<body>
+
+  <div class="container">
+    <header>
+      <h1>📰 Daily Newspaper</h1>
+      <p id="newspaper-date">Today's Edition</p>
+    </header>
+
+    <div id="loading-box">🗞️ Delivery in progress... Please wait.</div>
+
+    <div id="news-content" style="display: none;">
+      <!-- World News Section -->
+      <div class="category-title">🌐 World News</div>
+      <div class="stories-list" id="world-news-list"></div>
+
+      <!-- National News Section -->
+      <div class="category-title">🇺🇸 National News</div>
+      <div class="stories-list" id="national-news-list"></div>
+    </div>
+
+    <div class="footer-nav">
+      <a href="index.html" class="home-btn">⌂  Go Home</a>
+    </div>
+  </div>
+
+  <script>
+    // Format publication dates cleanly
+    function formatToday() {
+      const now = new Date();
+      return now.toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });
+    }
+
+    async function loadNews() {
+      document.getElementById('newspaper-date').textContent = formatToday();
+
+      try {
+        const resp = await fetch("news-data.json");
+        const data = await resp.json();
+
+        renderCategory("World News", data["World News"], "world-news-list");
+        renderCategory("National News", data["National News"], "national-news-list");
+
+        document.getElementById('loading-box').style.display = 'none';
+        document.getElementById('news-content').style.display = 'block';
+      } catch (e) {
+        document.getElementById('loading-box').textContent = "⚠️ Preparing newspaper... Please wait a moment.";
+      }
+    }
+
+    function renderCategory(catName, stories, containerId) {
+      const box = document.getElementById(containerId);
+      box.innerHTML = ""; // Clear loader
+
+      if (!stories || stories.length === 0) {
+        box.innerHTML = `<div style="padding: 20px; font-size: 20px; color: #94a3b8; text-align: center;">No stories available.</div>`;
+        return;
+      }
+
+      stories.forEach((story, idx) => {
+        const card = document.createElement('div');
+        card.className = 'story-card';
+
+        card.innerHTML = `
+          <div class="story-header" onclick="toggleStory(this)">
+            <div class="story-headline">${story.title}</div>
+            <div class="story-chevron">▸</div>
+          </div>
+          <div class="story-body">
+            <div class="story-content">
+              <div class="story-summary">${story.summary}</div>
+              <div class="story-meta">⌚ Published: ${story.date || 'Recent'}</div>
+            </div>
+          </div>
+        `;
+        box.appendChild(card);
+      });
+    }
+
+    // Interactive in-place accordion expansion
+    function toggleStory(headerElement) {
+      const card = headerElement.parentElement;
+      const isOpen = card.classList.contains('open');
+
+      // Close all other story cards in the same list to keep it neat
+      const allCards = card.parentElement.querySelectorAll('.story-card');
+      allCards.forEach(c => c.classList.remove('open'));
+
+      if (!isOpen) {
+        card.classList.add('open');
+      }
+    }
+
+    window.onload = loadNews;
+  </script>
+</body>
+</html>