Group series/multipart cards by default, release 0.3.0

The card view showed every occurrence of a recurring event as its own
tile, cluttering the grid. Upgrade the <ote-events> embed to v0.4.0
and add a default-on "Agrupar series" toggle next to the card view
button (visible only in card view, since group-events is cards-only)
that collapses same-partOf.id events into one stacked card.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

Author: hhkaos

CHANGELOG.md

@@ -1,5 +1,19 @@
 # OTE Reader changelog
 
+## 0.3.0 - 2026-08-13
+
+### Added
+
+- An "Agrupar series" toggle next to the card view button that collapses
+  events sharing the same `partOf.id` into a single stacked card, enabled
+  by default. Only shown in card view, since grouping only applies there.
+
+### Changed
+
+- Upgraded the `<ote-events>` embed to
+  [v0.4.0](https://github.com/OpenTechEvents/ote-tools/releases/tag/embed-v0.4.0),
+  which adds the `group-events` attribute the series toggle relies on.
+
 ## 0.2.0 - 2026-08-12
 
 ### Fixed

CLAUDE.md

@@ -0,0 +1,21 @@
+# OTE Reader
+
+Attendee-facing PWA for subscribing to OpenTechEvents feeds. Vanilla JS
+(`app.js`), no build step — `<ote-events>` is loaded from a versioned CDN
+URL in `index.html`, not vendored.
+
+## Release checklist
+
+Whenever a change is user-facing (new feature, fix, behavior change),
+update these together before considering the task done:
+
+1. Add an entry to `CHANGELOG.md` under a new version heading (date =
+   today, semver: patch for fixes, minor for features, major for breaking
+   changes).
+2. Bump the version to match in both `package.json` (`version`) and
+   `app.js` (`APP_VERSION` constant, near the top). `APP_VERSION` is what
+   renders in the Ajustes modal (`#app-version` in `index.html`) — no
+   separate manual edit needed there.
+
+Internal/invisible changes (refactors, tooling, comments) don't need a
+version bump or changelog entry.

app.js

@@ -1,7 +1,7 @@
 (function () {
   'use strict';
 
-  var APP_VERSION = '0.2.0';
+  var APP_VERSION = '0.3.0';
   var DEMO_MODE = new URLSearchParams(location.search).get('demo') === '1' || location.pathname.replace(/\/+$/, '').endsWith('/demo');
   var STORAGE = DEMO_MODE ? 'ote-reader-demo-state-v1' : 'ote-reader-state-v1';
   var INSTALL_DISMISSED = 'ote-reader-install-dismissed-v1';
@@ -28,7 +28,8 @@
     filters: { q: '', mode: '', language: '', country: '', cfp: false, future: true },
     savedFilters: [],
     savedEvents: [],
-    view: 'cards'
+    view: 'cards',
+    groupSeries: true
   };
   var feedCache = new Map();
   var adopterCache = null;
@@ -395,6 +396,8 @@
       button.classList.toggle('is-active', button.dataset.view === state.view);
       button.setAttribute('aria-pressed', String(button.dataset.view === state.view));
     });
+    $('group-series-wrap').hidden = state.view !== 'cards';
+    $('group-series').checked = state.groupSeries;
   }
 
   function renderLibrary() {
@@ -1114,6 +1117,11 @@
       return;
     }
     widget.setAttribute('layout', state.view === 'feed' ? 'list' : state.view);
+    if (state.view === 'cards' && state.groupSeries) {
+      widget.setAttribute('group-events', 'series,multipart');
+    } else {
+      widget.removeAttribute('group-events');
+    }
     widget.setAttribute('theme', document.documentElement.dataset.theme || 'light');
     widget.setAttribute('fields', 'image,when,location,attendance,description,price,tags,organizer');
     widget.setAttribute('show-past', 'true');
@@ -1603,6 +1611,11 @@
         render();
       });
     });
+    $('group-series').addEventListener('change', function () {
+      state.groupSeries = this.checked;
+      persist();
+      render();
+    });
     $('refresh').addEventListener('click', function () {
       state.feeds.forEach(loadFeed);
     });

index.html

@@ -125,6 +125,10 @@ <h2>Colecciones</h2>
                 <span>Calendario</span>
               </button>
             </div>
+            <label class="check" id="group-series-wrap" hidden>
+              <input id="group-series" type="checkbox" checked>
+              Agrupar series
+            </label>
           </div>
         </div>
       </section>
@@ -242,7 +246,7 @@ <h3>Instalación</h3>
   </section>
 </dialog>
 
-<script type="module" src="https://tools.opentechevents.org/embed/v0.3.1/ote-events.js"></script>
+<script type="module" src="https://tools.opentechevents.org/embed/v0.4.0/ote-events.js"></script>
 <script src="app.js"></script>
 </body>
 </html>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ote-reader",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "private": true,
   "type": "module",
   "description": "Attendee-facing PWA for subscribing to OpenTechEvents feeds.",

styles.css

@@ -319,6 +319,7 @@ label {
   white-space: nowrap;
 }
 .check input { width: 18px; min-height: 18px; }
+.check[hidden] { display: none; }
 
 .workspace {
   display: grid;