Add 2026 and README.md

README.md

@@ -0,0 +1,28 @@
+## BOOKMETER PLUS
+
+
+For a start let get the docker container going 
+```bash
+docker compose up -d --remove-orphans
+```
+
+### Vite
+Then for development purposes execute:
+```bash
+bin/dev
+```
+This command will start server on port 5173. http://localhost:5173
+
+
+### Tailwind
+If we want to rebuild tailwind styles then lets start this command in another terminal window: 
+
+```bash
+bin/tailwindbuild
+```
+
+To download bookmeter json files there is a PHP script
+
+```bash
+php download_posts.ph
+```

index.html

@@ -63,6 +63,10 @@
                 </button>
             </div>
             <div class="d-block max-w-xs mr-2">
+                <label for="basic-year-2026" class="p-2.5 inline-block">
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="basic-year-2026"
+                           value="2026"/> 2026
+                </label>
                 <label for="basic-year-2025" class="p-2.5 inline-block">
                     <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="basic-year-2025"
                            value="2025"/> 2025
@@ -129,16 +133,16 @@
             </div>
             <div class="d-block max-w-xs mr-2">
                 <label for="year-2025" class="p-2.5 inline-block">
-                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2025" value="2025"/>
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2026" value="2026"/>2026
-                    2025
+                </label>
+                <label for="year-2025" class="p-2.5 inline-block">
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2025" value="2025"/>2025
                 </label>
                 <label for="year-2024" class="p-2.5 inline-block">
-                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2024" value="2024"/>
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2024" value="2024"/>2024
-                    2024
                 </label>
                 <label for="year-2023" class="p-2.5 inline-block">
-                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2023" value="2023"/>
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="year-2023" value="2023"/>2023
-                    2023
                 </label>
             </div>
 

src/main.js

@@ -20,8 +20,8 @@ Alpine.data('bookmeterList', function () {
         title: '',
         author: '',
         nameFilter: '',
-        years: [2023, 2024, 2025],
+        years: [2023, 2024, 2025, 2026],
-        year: this.$persist(['2025']).as('year-filter'),
+        year: this.$persist(['2026']).as('year-filter'),
         orderColumn: ['order', 0],
         advancedSearch: this.$persist(0).as('advanced-search'),
         async init() {
@@ -39,13 +39,14 @@ Alpine.data('bookmeterList', function () {
             let qp = new URLSearchParams(window.location.search);
             if(qp.get('filter')) this.nameFilter = qp.get('filter');
 
-            const [data1, data2, data3] = await Promise.all([
+            const [data1, data2, data3, data4] = await Promise.all([
+                fetch('/posts_2026.json').then(res => res.json()),
                 fetch('/posts_2025.json').then(res => res.json()),
                 fetch('/posts_2024.json').then(res => res.json()),
                 fetch('/posts_2023.json').then(res => res.json())
             ])
 
-            this.items = [...data1, ...data2, ...data3]
+            this.items = [...data1, ...data2, ...data3, ...data4]
                 .filter(i => i.book.title.length > 0)
                 .map(i => ({
                 ...i,