Marcos Paulo
e2bcfff5ab
The skills-review desk is static, so "which draft would you ship?" needs a stateful counterpart. vote-service is a small Go API on its own pod backed by a JSON file on a ReadWriteOnce PVC, with one active vote per skill per source IP as the anti-abuse rule and CORS (ALLOWED_ORIGIN) as the caller boundary. Deployment notes that differ from the obvious path, all confirmed against the live cluster: the image is side-loaded with `ctr image import` plus `imagePullPolicy: Never` because kubelet has no credentials for the Nexus ref; the pod is pinned to `kubernets` because the hostpath PV takes a nodeAffinity for whichever node first binds it; and public exposure is Caddy on the VPS, not the cloudflared tunnel. The ingress controller runs with `use-forwarded-headers` off, so nginx overwrites X-Forwarded-For with its own peer — every visitor would collapse into one voter and each skill would cap at one vote overall. Caddy stamps the true remote address into X-Client-IP, which nginx forwards untouched, and clientIP() reads that first. Scoped to this app rather than flipping the global flag, which would change client-IP handling for every other ingress. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
54 lines
3.3 KiB
JavaScript
54 lines
3.3 KiB
JavaScript
// Reader vote widget: "which draft would you ship?" per reviewed skill.
|
|
// The page itself is static (Gitea Pages), so this talks to a small
|
|
// separate API — see /vote-service in the repository root. One vote per
|
|
// source is enforced server-side by IP, not here; this module only renders
|
|
// state and remembers the local choice so a returning visitor sees it
|
|
// without re-voting.
|
|
const API_BASE = (window.SKILLS_REVIEW_VOTE_API || '').replace(/\/$/, '');
|
|
const escape = (value) => value.replace(/[&<>"']/g, (character) => ({ '&':'&', '<':'<', '>':'>', '"':'"', "'":''' })[character]);
|
|
|
|
function voterId() {
|
|
let id = localStorage.getItem('skills-review-voter-id');
|
|
if (!id) { id = crypto.randomUUID(); localStorage.setItem('skills-review-voter-id', id); }
|
|
return id;
|
|
}
|
|
|
|
async function api(path, options = {}) {
|
|
const response = await fetch(`${API_BASE}${path}`, { ...options, headers: { 'Content-Type': 'application/json', 'X-Voter-Id': voterId(), ...options.headers } });
|
|
if (!response.ok) throw new Error(`vote API ${response.status}`);
|
|
return response.json();
|
|
}
|
|
|
|
function widgetMarkup(skillId, tally, you, unavailable) {
|
|
const total = (tally.original || 0) + (tally.improved || 0);
|
|
const share = (count) => total ? Math.round((count / total) * 100) : 0;
|
|
if (unavailable) return `<section class="vote-widget" aria-label="Vote unavailable"><span>READER VOTE</span><p>Voting is offline right now — the vote service is not configured or unreachable.</p></section>`;
|
|
return `<section class="vote-widget" aria-label="Vote on this review" data-skill="${escape(skillId)}">
|
|
<span>WHICH DRAFT WOULD YOU SHIP?</span>
|
|
<div class="vote-buttons" role="group" aria-label="Cast your vote">
|
|
<button data-vote="original" aria-pressed="${you === 'original'}">Original<b>${tally.original || 0} · ${share(tally.original || 0)}%</b></button>
|
|
<button data-vote="improved" aria-pressed="${you === 'improved'}">Improved draft<b>${tally.improved || 0} · ${share(tally.improved || 0)}%</b></button>
|
|
</div>
|
|
<p class="vote-note">${you ? `You voted ${you === 'original' ? 'original' : 'improved draft'}. Pick the other option to change it.` : 'One vote per visitor, tracked by network source.'}</p>
|
|
</section>`;
|
|
}
|
|
|
|
export async function renderVoteWidget(container, skillId) {
|
|
if (!API_BASE) { container.innerHTML = widgetMarkup(skillId, {}, null, true); return; }
|
|
container.innerHTML = widgetMarkup(skillId, {}, null, false);
|
|
const cast = async (choice) => {
|
|
container.innerHTML = widgetMarkup(skillId, {}, null, false);
|
|
try {
|
|
const result = await api('/api/votes', { method: 'POST', body: JSON.stringify({ skillId, choice }) });
|
|
container.innerHTML = widgetMarkup(skillId, { original: result.original, improved: result.improved }, result.you, false);
|
|
bind();
|
|
} catch { container.innerHTML = widgetMarkup(skillId, {}, null, true); }
|
|
};
|
|
function bind() { container.querySelectorAll('[data-vote]').forEach((button) => button.addEventListener('click', () => cast(button.dataset.vote))); }
|
|
try {
|
|
const result = await api(`/api/votes?skillId=${encodeURIComponent(skillId)}`);
|
|
container.innerHTML = widgetMarkup(skillId, result.tallies?.[skillId] || {}, result.you, false);
|
|
} catch { container.innerHTML = widgetMarkup(skillId, {}, null, true); }
|
|
bind();
|
|
}
|