fix: update triage badge dynamically when tag changes
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -114,7 +114,27 @@
|
|||||||
{% block extra_scripts %}
|
{% block extra_scripts %}
|
||||||
<script src="https://cdn.jsdelivr.net/npm/hammerjs@2.0.8/hammer.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/hammerjs@2.0.8/hammer.min.js"></script>
|
||||||
<script>
|
<script>
|
||||||
// ── Desktop Alpine app (unchanged) ──────────────────────────────────────────
|
// ── Shared badge helper ──────────────────────────────────────────────────────
|
||||||
|
function updateBadge(cardEl, tag) {
|
||||||
|
let badge = cardEl.querySelector('.badge');
|
||||||
|
if (!badge) {
|
||||||
|
badge = document.createElement('div');
|
||||||
|
cardEl.appendChild(badge);
|
||||||
|
}
|
||||||
|
const MAP = {
|
||||||
|
journal: ['badge-xs badge-success', 'J'],
|
||||||
|
story: ['badge-xs badge-info', 'S'],
|
||||||
|
skip: ['badge-xs badge-ghost opacity-60', 'X'],
|
||||||
|
};
|
||||||
|
if (MAP[tag]) {
|
||||||
|
badge.className = `absolute top-1 right-1 badge ${MAP[tag][0]}`;
|
||||||
|
badge.textContent = MAP[tag][1];
|
||||||
|
} else {
|
||||||
|
badge.remove();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ── Desktop Alpine app ───────────────────────────────────────────────────────
|
||||||
function triageApp(albumId) {
|
function triageApp(albumId) {
|
||||||
return {
|
return {
|
||||||
focused: null,
|
focused: null,
|
||||||
@@ -145,6 +165,7 @@ function triageApp(albumId) {
|
|||||||
} else {
|
} else {
|
||||||
el.classList.add('border-base-300', 'opacity-40');
|
el.classList.add('border-base-300', 'opacity-40');
|
||||||
}
|
}
|
||||||
|
updateBadge(el, tag);
|
||||||
this.updateCount();
|
this.updateCount();
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -168,6 +189,7 @@ function triageApp(albumId) {
|
|||||||
.filter(c => !c.startsWith('border-') && c !== 'opacity-40')
|
.filter(c => !c.startsWith('border-') && c !== 'opacity-40')
|
||||||
.join(' ');
|
.join(' ');
|
||||||
el.classList.add('border-base-300', 'opacity-40');
|
el.classList.add('border-base-300', 'opacity-40');
|
||||||
|
updateBadge(el, 'skip');
|
||||||
});
|
});
|
||||||
this.updateCount();
|
this.updateCount();
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user