-
Now: ${now} ${health}
+ return `
+
now ${now} ${health}
-
Context switches: ${ev.switch_count || 0}
+
context switches: ${ev.switch_count || 0}
`;
}
-function updateActiveDrift(drift) {
- const el = document.getElementById('drift');
+// updateActiveDrift owns the active status band: it renders on-task, nudge,
+// drift, or pending content into #statusband and rebinds the buttons.
+function updateActiveDrift(state) {
+ const el = document.getElementById('statusband');
if (!el) return;
- const status = drift && drift.status;
- if (status === 'drifting') {
- el.innerHTML = `
-
⚠ Possible drift
-
${drift.reason || ''}
-
- Back to task
- This is on task
- End session
-
`;
+ setStateAttr(state);
+ const drift = state.drift || {};
+ const switches = (state.evidence && state.evidence.switch_count) || 0;
+
+ if (drift.status === 'drifting') {
+ el.className = 'band statusband col';
+ el.innerHTML = `
Drift
+
${drift.reason || 'This looks off task.'}
+
+ Back to task
+ This is on task
+ End session
+
`;
document.getElementById('refocus').onclick = () => post('/refocus');
document.getElementById('ontask').onclick = () => post('/ontask');
document.getElementById('enddrift').onclick = () => post('/complete');
return;
}
- const nudge = (drift && drift.nudge) || '';
+
+ const nudge = drift.nudge || '';
if (!nudge) dismissedNudge = null; // trajectory recovered; allow future nudges
if (nudge && nudge !== dismissedNudge) {
- el.innerHTML = `
-
Heads up
+ el.className = 'band statusband col';
+ el.innerHTML = `
Heads up
${nudge}
-
- Dismiss
-
`;
+
+ Dismiss
+
`;
document.getElementById('dismissnudge').onclick = () => {
dismissedNudge = nudge;
- const e = document.getElementById('drift');
- if (e) e.innerHTML = '';
+ setStateAttr(state);
+ updateActiveDrift(state);
};
return;
}
- if (status === 'pending') {
- el.innerHTML = `
checking focus…
`;
+
+ if (drift.status === 'pending') {
+ el.className = 'band statusband';
+ el.innerHTML = `
Active checking focus… `;
return;
}
- el.innerHTML = '';
+
+ el.className = 'band statusband';
+ el.innerHTML = `
Active
+
on task · ${switches} switches `;
}
function updatePlanningCoach(coach) {
@@ -83,8 +110,6 @@ function updatePlanningCoach(coach) {
if (coach.status === 'error') { statusEl.textContent = coach.error || 'coach unavailable'; return; }
if (coach.status === 'ready' && coach.proposal) {
statusEl.textContent = 'AI suggestion applied — edit freely.';
- // Pre-fill once per ready proposal so later manual edits are not clobbered
- // by subsequent SSE ticks (idempotent via the dataset stamp below).
const stamp = JSON.stringify(coach.proposal);
if (statusEl.dataset.applied === stamp) return;
statusEl.dataset.applied = stamp;
@@ -102,34 +127,43 @@ function updatePlanningCoach(coach) {
}
function render(state) {
+ setStateAttr(state);
const rs = state.runtime_state;
if (rs === 'planning' && renderedState === 'planning') {
- updatePlanningCoach(state.coach); // partial update only
+ updatePlanningCoach(state.coach);
return;
}
if (rs === 'active' && renderedState === 'active') {
- updateActiveDrift(state.drift);
+ updateActiveDrift(state);
return;
}
if (countdownTimer) { clearInterval(countdownTimer); countdownTimer = null; }
renderedState = rs;
+
if (rs === 'locked') {
- view.innerHTML = `
Locked
-
No active commitment.
-
Start planning `;
+ view.innerHTML = `
Locked
+
+
No active commitment.
+
Start planning
+
`;
document.getElementById('plan').onclick = () => post('/planning');
+
} else if (rs === 'planning') {
- view.innerHTML = `
Planning
-
Rough intent
-
-
Sharpen
-
-
Next action
-
Success condition
-
Minutes
-
Allowed apps (comma-separated window classes)
-
-
Start commitment `;
+ view.innerHTML = `
Planning
+
+
Rough intent
+
+
Sharpen
+
+
+
+ Next action Success condition Minutes Allowed apps (comma-separated window classes)
+ Start commitment
+
`;
const na = document.getElementById('na'), sc = document.getElementById('sc'),
mins = document.getElementById('mins'), start = document.getElementById('start');
const check = () => { start.disabled = !(na.value.trim() && sc.value.trim() && +mins.value > 0); };
@@ -146,29 +180,35 @@ function render(state) {
if (intent) post('/coach', { intent });
};
updatePlanningCoach(state.coach);
+
} else if (rs === 'active') {
const c = state.commitment || {};
- view.innerHTML = `
Active
-
-
--:--
-
${c.next_action || ''}
-
Done when: ${c.success_condition || ''}
+ view.innerHTML = `
+
+
+
${c.next_action || ''}
+
done when: ${c.success_condition || ''}
+
${evidenceBlock(state.evidence)}
-
Complete `;
+
Complete
`;
document.getElementById('done').onclick = () => post('/complete');
const t = document.getElementById('t');
const tick = () => { t.textContent = fmt((c.deadline_unix_secs || 0) - Date.now() / 1000); };
tick();
countdownTimer = setInterval(tick, 250);
- updateActiveDrift(state.drift);
+ updateActiveDrift(state);
+
} else if (rs === 'review') {
const c = state.commitment || {};
- view.innerHTML = `
Review
-
Session ended
-
${c.next_action || ''}
+ view.innerHTML = `
Review
+
+
Session ended
+
${c.next_action || ''}
+
${evidenceBlock(state.evidence)}
-
End `;
+
End
`;
document.getElementById('end').onclick = () => post('/end');
+
} else {
view.textContent = rs;
}