Files
chktime/web/index.html
T
yoshikazuandClaude Opus 5 0d9faa54bb ログ更新の自動追従を追加 (ON/OFF 切替つき)
ヘッダの「自動追従」で有効/無効を切り替える。状態は localStorage に保持し、
既定は有効。無効時は従来どおり再読込ボタンで更新する。

- Watcher スレッド: --interval 秒ごとに jsonl を stat し、ファイル数・合計
  サイズ・最新 mtime の組が変わったら rev を進めて待機中の SSE を起こす
- /api/watch (SSE) で change を通知、20 秒ごとに ping で接続維持。
  /api/rev で現在の版も取れる
- ブラウザ側は通知を 1.2 秒まとめてから表示中のものだけ黙って作り直す。
  プロジェクト/タスクの選択・スクロール位置・絞り込み・タブは維持し、
  やりとりを末尾まで見ていた場合は追記行に追従する
- 日別集計・ガントの更新は placeholder を出さない silent 経路を追加
- 後から有効にした時に、無効だった間の変更を版の比較で取り込む

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-07-30 11:21:05 +09:00

54 lines
1.8 KiB
HTML

<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>chktime — Claude Code タスク時刻ビューア</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>chktime</h1>
<span class="sub" id="root"></span>
<span class="spacer"></span>
<label class="chk"><input type="checkbox" id="relative"> 経過時間で表示</label>
<label class="chk"><input type="checkbox" id="follow"> 自動追従</label>
<span id="follow-state" class="fstate"></span>
<button id="reload" title="キャッシュを破棄して再読込">再読込</button>
</header>
<main>
<nav id="projects" class="pane">
<div class="pane-head">プロジェクト</div>
<ul id="project-list"></ul>
</nav>
<section id="sessions" class="pane">
<div class="pane-head">
<span id="sessions-title">タスク(セッション)</span>
<input id="filter" type="search" placeholder="タイトル/プロンプトで絞り込み">
<a id="csv-sessions" class="btn" href="#" download>CSV</a>
</div>
<div class="scroll"><table id="session-table"><tbody></tbody></table></div>
</section>
<section id="detail" class="pane">
<div class="pane-head">
<span id="detail-title">やりとりの時刻</span>
<span class="tabs">
<button class="tab sel" id="tab-turns">やりとり</button>
<button class="tab" id="tab-daily">日別集計</button>
<button class="tab" id="tab-gantt">ガント</button>
</span>
<a id="csv-turns" class="btn" href="#" download>CSV</a>
</div>
<div class="scroll" id="detail-body">
<p class="empty">左のタスクを選んでください。</p>
</div>
</section>
</main>
<script src="app.js"></script>
</body>
</html>