@ohmykreee/dsh-remote-control 0.0.0-stage → 1.0.2

package/src/svelte/lib/pomodoro.svelte.ts

@@ -0,0 +1,223 @@
+import { app } from './state.svelte';
+import {
+  cancelScheduledAlarm,
+  claimScheduledAlarm,
+  playAlarmOnce,
+  primeAudio,
+  scheduleAlarm,
+  setTabAlert,
+  startLoopingAlarm,
+  stopAlarmSound,
+} from './timer-alarm.svelte';
+import type { PomodoroSettings } from './types';
+
+/**
+ * Tomato timer that lives entirely in the controller's browser.
+ *
+ * The DSH panel only persists settings; this module owns the countdown. Timing
+ * always derives from an absolute `endsAt` timestamp, so moving between console
+ * pages (or a throttled background tab) never loses time. The runtime is a
+ * singleton because the console renders an infinite-loop clone of every page.
+ */
+
+export type PomodoroPhase = 'focus' | 'break';
+
+export interface PomodoroRuntime {
+  phase: PomodoroPhase;
+  running: boolean;
+  remainingMs: number;
+  endsAt: number;
+  finished: boolean;
+  rounds: number;
+  /** True while the end-of-timer alarm is still ringing (loop mode). */
+  alarmActive: boolean;
+}
+
+export const pomodoro = $state<PomodoroRuntime>({
+  phase: 'focus',
+  running: false,
+  remainingMs: 25 * 60_000,
+  endsAt: 0,
+  finished: false,
+  rounds: 0,
+  alarmActive: false,
+});
+
+let refs = 0;
+let timer: ReturnType<typeof setInterval> | null = null;
+let durationSignature = '';
+
+function settings(): PomodoroSettings {
+  return app.pomodoro;
+}
+
+export function phaseDurationMs(phase: PomodoroPhase = pomodoro.phase, value: PomodoroSettings = settings()): number {
+  const minutes = phase === 'focus' ? value.focusMinutes : value.breakMinutes;
+  const limit = phase === 'focus' ? 180 : 120;
+  const fallback = phase === 'focus' ? 25 : 5;
+  const raw = Number(minutes);
+  const safe = Number.isFinite(raw) ? Math.max(0.1, Math.min(limit, raw)) : fallback;
+  // Fractional minutes are allowed in settings; the timer works in whole seconds.
+  return Math.max(1, Math.round(safe * 60)) * 1000;
+}
+
+export function formatRemaining(ms: number): string {
+  const total = Math.max(0, Math.ceil(ms / 1000));
+  const minutes = Math.floor(total / 60);
+  const seconds = total % 60;
+  return `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
+}
+
+export function pomodoroProgress(): number {
+  const duration = phaseDurationMs();
+  if (duration <= 0) return 0;
+  return Math.max(0, Math.min(100, ((duration - pomodoro.remainingMs) / duration) * 100));
+}
+
+function syncDuration(): void {
+  const signature = `${settings().focusMinutes}/${settings().breakMinutes}`;
+  if (signature === durationSignature) return;
+  durationSignature = signature;
+  if (!pomodoro.running && !pomodoro.finished) pomodoro.remainingMs = phaseDurationMs();
+}
+
+function resetRuntime(): void {
+  pomodoro.phase = 'focus';
+  pomodoro.running = false;
+  pomodoro.remainingMs = phaseDurationMs('focus');
+  pomodoro.endsAt = 0;
+  pomodoro.finished = false;
+  pomodoro.rounds = 0;
+  stopAlarm();
+}
+
+function startEngine(): void {
+  durationSignature = `${settings().focusMinutes}/${settings().breakMinutes}`;
+  if (!pomodoro.running && !pomodoro.finished) pomodoro.remainingMs = phaseDurationMs();
+  if (timer) return;
+  timer = setInterval(tick, 250);
+  document.addEventListener('visibilitychange', handleVisibility);
+  (window as unknown as { __DSH_POMODORO__?: PomodoroRuntime }).__DSH_POMODORO__ = pomodoro;
+}
+
+function stopEngine(): void {
+  if (timer) clearInterval(timer);
+  timer = null;
+  document.removeEventListener('visibilitychange', handleVisibility);
+  cancelScheduledAlarm();
+  resetRuntime();
+}
+
+function handleVisibility(): void {
+  if (!document.hidden) tick();
+}
+
+function tick(): void {
+  if (!settings().enabled) {
+    resetRuntime();
+    return;
+  }
+  syncDuration();
+  if (pomodoro.alarmActive && !settings().loopAlarm) stopAlarm();
+  if (!pomodoro.running) return;
+  const remaining = pomodoro.endsAt - Date.now();
+  if (remaining <= 0) {
+    pomodoro.remainingMs = 0;
+    finish();
+    return;
+  }
+  pomodoro.remainingMs = remaining;
+}
+
+/** Reference-counted lifecycle; the card (and its clone) both acquire it. */
+export function acquirePomodoro(): () => void {
+  refs += 1;
+  if (refs === 1) startEngine();
+  let released = false;
+  return () => {
+    if (released) return;
+    released = true;
+    refs = Math.max(0, refs - 1);
+    if (refs === 0) stopEngine();
+  };
+}
+
+export function startPomodoro(): void {
+  if (!settings().enabled) return;
+  primeAudio();
+  if (pomodoro.finished) {
+    pomodoro.phase = pomodoro.phase === 'focus' ? 'break' : 'focus';
+    pomodoro.finished = false;
+    pomodoro.remainingMs = phaseDurationMs();
+  }
+  if (pomodoro.remainingMs <= 0) pomodoro.remainingMs = phaseDurationMs();
+  pomodoro.running = true;
+  pomodoro.endsAt = Date.now() + pomodoro.remainingMs;
+  stopAlarm();
+  if (!settings().soundPath.trim()) scheduleAlarm(Math.max(0.06, (pomodoro.endsAt - Date.now()) / 1000), pomodoro.endsAt);
+}
+
+export function pausePomodoro(): void {
+  if (!pomodoro.running) return;
+  pomodoro.remainingMs = Math.max(0, pomodoro.endsAt - Date.now());
+  pomodoro.running = false;
+  pomodoro.endsAt = 0;
+  cancelScheduledAlarm();
+}
+
+export function togglePomodoro(): void {
+  if (pomodoro.running) pausePomodoro();
+  else startPomodoro();
+}
+
+export function resetPomodoro(): void {
+  pomodoro.running = false;
+  pomodoro.finished = false;
+  pomodoro.phase = 'focus';
+  pomodoro.rounds = 0;
+  pomodoro.endsAt = 0;
+  pomodoro.remainingMs = phaseDurationMs('focus');
+  stopAlarm();
+}
+
+/** Switch focus/break while idle (the label in the card is a button). */
+export function switchPomodoroPhase(): void {
+  if (pomodoro.running) return;
+  pomodoro.phase = pomodoro.phase === 'focus' ? 'break' : 'focus';
+  pomodoro.finished = false;
+  pomodoro.remainingMs = phaseDurationMs();
+  stopAlarm();
+}
+
+/** Acknowledge the end-of-timer alarm and stop the looping sound. */
+export function dismissAlarm(): void {
+  stopAlarm();
+}
+
+function finish(): void {
+  const finishedPhase = pomodoro.phase;
+  pomodoro.running = false;
+  pomodoro.remainingMs = 0;
+  pomodoro.finished = true;
+  pomodoro.alarmActive = false;
+  if (finishedPhase === 'focus') pomodoro.rounds += 1;
+  const hasScheduledChime = claimScheduledAlarm(pomodoro.endsAt);
+  if (settings().loopAlarm) {
+    pomodoro.alarmActive = true;
+    startLoopingAlarm(settings().soundPath, hasScheduledChime);
+  } else if (!hasScheduledChime) {
+    playAlarmOnce(settings().soundPath);
+  }
+  setTabAlert(true);
+  try {
+    navigator.vibrate?.([140, 90, 180]);
+  } catch {
+    /* vibration is optional */
+  }
+}
+
+/** Stop the alert sound and clear the runtime flag. */
+function stopAlarm(): void {
+  stopAlarmSound();
+  pomodoro.alarmActive = false;
+}

package/src/svelte/lib/session-tree.ts

@@ -0,0 +1,80 @@
+import type { SessionItem } from './types';
+
+/** One session row plus the subagents that session dispatched. */
+export interface SessionNode {
+  session: SessionItem;
+  children: SessionNode[];
+}
+
+const STATUS_RANK: Record<string, number> = { question: 0, running: 1, error: 2, done: 3 };
+
+function statusRank(session: SessionItem): number {
+  return STATUS_RANK[session.status ?? 'done'] ?? 3;
+}
+
+/**
+ * Group subagent sessions under their durable parent session.
+ *
+ * A subagent that is active keeps its parent group near the top: a node's rank
+ * is the best rank in its whole subtree, and ties fall back to the newest
+ * activity in that subtree. Sessions whose parent is not in the live list stay
+ * at the top level (still marked as subagents), and malformed lineage falls
+ * back to a root instead of looping.
+ */
+export function buildSessionTree(sessions: SessionItem[]): SessionNode[] {
+  const nodes = new Map<string, SessionNode>();
+  const ids: string[] = [];
+  sessions.forEach((session, index) => {
+    const id = session.id || `index-${index}`;
+    ids.push(id);
+    nodes.set(id, { session, children: [] });
+  });
+
+  const parentOf = new Map<string, string>();
+  sessions.forEach((session, index) => {
+    const parentId = session.parentId || '';
+    if (parentId) parentOf.set(ids[index], parentId);
+  });
+
+  function createsCycle(id: string, parentId: string): boolean {
+    let current = parentId;
+    for (let guard = 0; current && guard < ids.length + 1; guard += 1) {
+      if (current === id) return true;
+      current = parentOf.get(current) || '';
+    }
+    return false;
+  }
+
+  const roots: SessionNode[] = [];
+  sessions.forEach((session, index) => {
+    const id = ids[index];
+    const node = nodes.get(id)!;
+    const parentId = session.parentId || '';
+    const parent = parentId ? nodes.get(parentId) : undefined;
+    if (parent && parentId !== id && !createsCycle(id, parentId)) parent.children.push(node);
+    else roots.push(node);
+  });
+
+  function subtreeRank(node: SessionNode): number {
+    let rank = statusRank(node.session);
+    for (const child of node.children) rank = Math.min(rank, subtreeRank(child));
+    return rank;
+  }
+
+  function subtreeActivity(node: SessionNode): number {
+    let latest = Number(node.session.lastActiveAt) || 0;
+    for (const child of node.children) latest = Math.max(latest, subtreeActivity(child));
+    return latest;
+  }
+
+  function sortNodes(list: SessionNode[]): void {
+    list.sort((a, b) => {
+      const byRank = subtreeRank(a) - subtreeRank(b);
+      return byRank !== 0 ? byRank : subtreeActivity(b) - subtreeActivity(a);
+    });
+    for (const node of list) sortNodes(node.children);
+  }
+
+  sortNodes(roots);
+  return roots;
+}

package/src/svelte/lib/state.svelte.ts

@@ -0,0 +1,359 @@
+import { setLocale, t } from './i18n.svelte';
+import { DEFAULT_ORDER, enabledOrder, normalizeOrder } from './pages';
+import { configureLive, connectLive, disposeLive, isLiveOpen, sendLive } from './ws';
+import type {
+  AccountData,
+  ConsoleSettings,
+  ConsoleState,
+  CountdownSettings,
+  MediaPayload,
+  NavPosition,
+  NotificationsData,
+  OverviewData,
+  PerformanceData,
+  PomodoroSettings,
+  QuestionAnswerItem,
+  ServerMessage,
+  SessionItem,
+  WeatherData,
+} from './types';
+
+const NAV_POSITIONS: readonly NavPosition[] = ['left', 'right', 'top', 'bottom'];
+
+export const COUNTDOWN_PRESET_LIMIT = 5;
+export const COUNTDOWN_MAX_SECONDS = 86_400;
+/** Presets a fresh profile starts with; the user may keep one to five. */
+export const DEFAULT_COUNTDOWN_PRESETS = [60, 300, 600];
+
+export function normalizeNavPosition(value: unknown): NavPosition {
+  return NAV_POSITIONS.includes(value as NavPosition) ? (value as NavPosition) : 'left';
+}
+
+export function normalizePomodoro(input: Partial<PomodoroSettings> | undefined, base: PomodoroSettings): PomodoroSettings {
+  const minutes = (value: unknown, fallback: number, max: number): number => {
+    const number = Number(value);
+    return Number.isFinite(number) ? Math.max(0.1, Math.min(max, Math.round(number * 100) / 100)) : fallback;
+  };
+  return {
+    enabled: input?.enabled === true,
+    focusMinutes: minutes(input?.focusMinutes, base.focusMinutes, 180),
+    breakMinutes: minutes(input?.breakMinutes, base.breakMinutes, 120),
+    soundPath: typeof input?.soundPath === 'string' ? input.soundPath : base.soundPath,
+    loopAlarm: input?.loopAlarm === true,
+  };
+}
+
+export function normalizeCountdown(
+  input: Partial<CountdownSettings> | undefined,
+  base: CountdownSettings,
+): CountdownSettings {
+  const source = Array.isArray(input?.presets) ? input.presets : [];
+  const fallbackPresets = base.presets.length > 0 ? base.presets : DEFAULT_COUNTDOWN_PRESETS;
+  const presets: number[] = [];
+  for (const entry of source.slice(0, COUNTDOWN_PRESET_LIMIT)) {
+    const seconds = Math.round(Number(entry));
+    if (!Number.isFinite(seconds)) continue;
+    presets.push(Math.max(1, Math.min(COUNTDOWN_MAX_SECONDS, seconds)));
+  }
+  return {
+    enabled: input?.enabled === true,
+    presets: presets.length > 0
+      ? presets
+      : fallbackPresets.slice(0, COUNTDOWN_PRESET_LIMIT),
+  };
+}
+
+/**
+ * Shared live state for the mobile console.
+ *
+ * Svelte 5 runes make this plain object deeply reactive, so every page (and its
+ * infinite-loop clone) renders from the same WebSocket snapshot without the
+ * old imperative `syncClones()` DOM copying.
+ */
+export const app: ConsoleState = $state({
+  online: null,
+  theme: 'dark',
+  temperatureUnit: 'celsius',
+  pushQuestions: false,
+  navPosition: 'left',
+  pomodoro: { enabled: false, focusMinutes: 25, breakMinutes: 5, soundPath: '', loopAlarm: false },
+  countdown: { enabled: false, presets: [...DEFAULT_COUNTDOWN_PRESETS] },
+  balanceDisplay: { showPeakValley: true, spendWindow: 'calendar' },
+  pageOrder: [...DEFAULT_ORDER],
+  pageEnabled: { home: true, sessions: true, music: true, performance: true },
+  pageRevision: 0,
+
+  overview: null,
+  weather: null,
+  notifications: null,
+  account: null,
+  sessions: [],
+  sessionsError: null,
+  performance: null,
+
+  media: null,
+  clockNow: Date.now(),
+
+  volumeDragging: false,
+  volumeInput: 0.2,
+  volumeTarget: 0.2,
+  volumeHoldUntil: 0,
+
+  toastVisible: false,
+  toastMessage: '',
+
+  activeKey: 'home',
+  initialKey: null,
+  hasNavigated: false,
+  fullscreen: false,
+  answerSessionId: null,
+});
+
+let toastTimer: ReturnType<typeof setTimeout> | null = null;
+
+export function setOnline(value: boolean | null): void {
+  app.online = value;
+}
+
+export function toast(message: string): void {
+  app.toastMessage = String(message || '');
+  app.toastVisible = true;
+  if (toastTimer) clearTimeout(toastTimer);
+  toastTimer = setTimeout(() => {
+    app.toastVisible = false;
+  }, 2600);
+}
+
+export function sendAction(action: string, value?: number | boolean): boolean {
+  const message = { type: 'action' as const, action, ...(value !== undefined ? { value } : {}) };
+  if (!sendLive(message)) {
+    toast(t('connecting'));
+    return false;
+  }
+  return true;
+}
+
+interface AnswerWaiter {
+  resolve: () => void;
+  reject: (error: Error) => void;
+  timer: ReturnType<typeof setTimeout>;
+}
+
+const answerWaiters = new Map<string, AnswerWaiter>();
+
+function answerKey(sessionId: string, requestId: string): string {
+  return `${sessionId}\u0000${requestId}`;
+}
+
+/** Open the quick-reply sheet for a session waiting on a question. */
+export function openQuestion(sessionId: string): void {
+  const session = app.sessions.find((item) => item.id === sessionId);
+  if (!session) return;
+  if (!app.pushQuestions) {
+    toast(t('pushQuestionsOff'));
+    return;
+  }
+  if (session.pending?.kind === 'approval') {
+    toast(t('approvalPending'));
+    return;
+  }
+  if (session.pending?.answerable === false) {
+    toast(t('answerInDsh'));
+    return;
+  }
+  if (!session.pending?.questions?.length) {
+    toast(t('answerInDsh'));
+    return;
+  }
+  app.answerSessionId = sessionId;
+}
+
+/** Close the quick-reply sheet without answering. */
+export function closeQuestion(): void {
+  app.answerSessionId = null;
+}
+
+/** Submit one complete answer batch and wait for the Host acknowledgement. */
+export function submitQuestionAnswer(
+  sessionId: string,
+  requestId: string,
+  answers: QuestionAnswerItem[],
+): Promise<void> {
+  return new Promise((resolve, reject) => {
+    if (!isLiveOpen()) {
+      reject(new Error(t('connectionLost')));
+      return;
+    }
+    const key = answerKey(sessionId, requestId);
+    const previous = answerWaiters.get(key);
+    if (previous) {
+      clearTimeout(previous.timer);
+      answerWaiters.delete(key);
+      previous.reject(new Error(t('answerReplaced')));
+    }
+    const timer = setTimeout(() => {
+      const waiter = answerWaiters.get(key);
+      if (!waiter) return;
+      answerWaiters.delete(key);
+      waiter.reject(new Error(t('answerTimeout')));
+    }, 12_000);
+    answerWaiters.set(key, { resolve, reject, timer });
+    if (!sendLive({ type: 'answer-question', sessionId, requestId, answers })) {
+      answerWaiters.delete(key);
+      clearTimeout(timer);
+      reject(new Error(t('connectionLost')));
+    }
+  });
+}
+
+export function applyTheme(theme: string): void {
+  app.theme = theme === 'light' ? 'light' : 'dark';
+}
+
+export function applySettings(settings: ConsoleSettings | undefined): void {
+  if (!settings) return;
+  if (settings.theme) applyTheme(settings.theme);
+  setLocale(settings.locale);
+  if (settings.temperatureUnit) {
+    app.temperatureUnit = settings.temperatureUnit === 'fahrenheit' ? 'fahrenheit' : 'celsius';
+  }
+  app.pushQuestions = settings.pushQuestions === true;
+  if (settings.navPosition) app.navPosition = normalizeNavPosition(settings.navPosition);
+  if (settings.pomodoro) app.pomodoro = normalizePomodoro(settings.pomodoro, app.pomodoro);
+  if (settings.countdown) app.countdown = normalizeCountdown(settings.countdown, app.countdown);
+  // The Host enforces this too; mirror it so a stale or hand-built snapshot can
+  // never render both timer cards at once.
+  if (app.pomodoro.enabled) app.countdown.enabled = false;
+  else if (app.countdown.enabled) app.pomodoro.enabled = false;
+  if (settings.balance) {
+    app.balanceDisplay = {
+      showPeakValley: settings.balance.showPeakValley !== false,
+      spendWindow: settings.balance.spendWindow === 'rolling' ? 'rolling' : 'calendar',
+    };
+  }
+  let pageChanged = false;
+  if (settings.pageOrder) {
+    app.pageOrder = normalizeOrder(settings.pageOrder);
+    pageChanged = true;
+  }
+  if (settings.pageEnabled) {
+    app.pageEnabled = { ...app.pageEnabled, ...settings.pageEnabled };
+    pageChanged = true;
+  }
+  if (pageChanged) app.pageRevision += 1;
+}
+
+function applyOverview(data: OverviewData | undefined): void {
+  if (!data) return;
+  app.overview = data;
+  applySettings(data.settings);
+  app.weather = data.weather ?? null;
+  app.notifications = data.notifications ?? null;
+  app.account = data.account ?? null;
+  app.sessions = Array.isArray(data.sessions) ? data.sessions : [];
+  app.sessionsError = data.sessionsError || null;
+  if (data.performance) app.performance = data.performance;
+}
+
+function applyMedia(payload: MediaPayload | undefined): void {
+  app.media = payload ?? null;
+}
+
+function handleMessage(message: ServerMessage): void {
+  switch (message?.type) {
+    case 'welcome':
+      setOnline(true);
+      applySettings(message.settings);
+      break;
+    case 'overview':
+      setOnline(true);
+      applyOverview(message.data as OverviewData | undefined);
+      break;
+    case 'weather':
+      app.weather = (message.data as WeatherData | undefined) ?? null;
+      break;
+    case 'notifications':
+      app.notifications = (message.data as NotificationsData | undefined) ?? null;
+      break;
+    case 'sessions':
+      app.sessions = Array.isArray(message.data) ? (message.data as SessionItem[]) : [];
+      app.sessionsError = null;
+      break;
+    case 'account':
+      app.account = (message.data as AccountData | undefined) ?? null;
+      break;
+    case 'media':
+      setOnline(true);
+      applyMedia(message.data as MediaPayload | undefined);
+      break;
+    case 'performance':
+      app.performance = (message.data as PerformanceData | undefined) ?? null;
+      break;
+    case 'settings':
+      applySettings(message.data as ConsoleSettings | undefined);
+      break;
+    case 'action-result':
+      if (!message.ok) toast(message.error || t('actionFailed'));
+      break;
+    case 'answer-result': {
+      const key = answerKey(message.sessionId || '', message.requestId || '');
+      const waiter = answerWaiters.get(key);
+      if (!waiter) break;
+      answerWaiters.delete(key);
+      clearTimeout(waiter.timer);
+      if (message.ok) waiter.resolve();
+      else waiter.reject(new Error(message.error || t('answerFailed')));
+      break;
+    }
+    case 'error':
+      toast(message.error || t('serviceError'));
+      break;
+    default:
+      break;
+  }
+}
+
+export function startLive(): void {
+  configureLive({
+    onOpen() {
+      setOnline(true);
+      sendLive({ type: 'settings' });
+    },
+    onMessage: handleMessage,
+    onClose() {
+      setOnline(false);
+    },
+  });
+  connectLive();
+}
+
+export function stopLive(): void {
+  disposeLive();
+}
+
+/** One shared second tick for the clock; media progress is owned by SeekBar. */
+export function startTicks(): () => void {
+  app.clockNow = Date.now();
+  const clockTimer = setInterval(() => {
+    app.clockNow = Date.now();
+  }, 1000);
+  return () => {
+    clearInterval(clockTimer);
+  };
+}
+
+export function restoreUrl(): void {
+  if (location.search.includes('token=') || location.search.includes('page=')) {
+    try {
+      history.replaceState({}, '', location.pathname);
+    } catch {
+      /* ignore */
+    }
+  }
+}
+
+export function exposeState(): void {
+  window.__DSH_REMOTE__ = app;
+}
+
+export { enabledOrder, normalizeOrder };