25分やって、5分休む。作業配信のリズムを、配信画面にそのまま出すウィジェットです。 OBSに置くだけで使えます。インストールは要りません。 外部のサービスには一切つなぎません。作業時間はどこにも送られません。 ──────────────────────── ■ できること ──────────────────────── ・作業25分 → 休憩5分 を自動でくり返します ・4セットごとに長い休憩（15分）に切り替わります ・「今日の作業 1時間27分」と、その日の合計が出ます ・作業中は赤、休憩中は緑と、色が変わります ・残り時間のバーが減っていきます ・「2 / 4 セット目」で、いま何本目かが分かります 時間の長さ（25分 / 5分 / 15分 / 4セット）は、 設定ファイルの数字を書き換えるだけで変えられます。 50分やって10分休む、でも構いません。 ──────────────────────── ■ ここが違います：時間がズレません ──────────────────────── よくある作りだと「1秒ごとに1秒減らす」ので、 PCが重いときに、少しずつ時間が遅れていきます。 このタイマーは「終わる時刻」を先に決めて、 そこから引き算して表示しています。 画面の更新が何回飛んでも、残り時間は狂いません。 検算ずみです。 1秒きざみで1200回すすめても、20分を一気に飛ばしても、 どちらも残りは ちょうど 5:00 でした。 ──────────────────────── ■ 動かしかた ──────────────────────── 【方法1】配信画面のタイマーを直接クリックする OBSでソースを右クリック →「対話」を開き、クリックすると 開始と一時停止が切り替わります。いちばん手数が少ない方法です。 【方法2】操作パネル（control.html）をOBSの中に入れる OBSの「表示」→「ドック」→「カスタムブラウザドック」に control.html の場所を入れると、OBSの中にボタンが出ます。 ・開始 / 一時停止 ・次へ進む（休憩を飛ばす、作業を早く切り上げる） ・タイマーだけ戻す（その日の合計は消えません） ・今日の記録ごとリセット ★正直に書いておきます★ control.html を「ダブルクリック」で開くと、ふだんお使いの ブラウザで開きます。OBSのタイマーとは保存場所が別なので、 そこからはOBSのタイマーを動かせません。 OBSから動かしたいときは、必ずカスタムブラウザドックに入れてください。 （同じブラウザで開いたページどうしは、ちゃんと連動します） 「次へ進む」を押すと、次の区切りに切り替わっていったん止まります。 続けるときは「開始」を押してください。 （区切りが自然に来たときは、設定しだいで自動で続きます） ──────────────────────── ■ 入っているもの ──────────────────────── pomodoro.html 配信画面に置く本体 control.html 手元で押す操作パネル config.js 設定ファイル。ここだけ書き換えます README_使い方.txt 使い方 README_English.txt 英語版 設定ファイルは1つだけです。メモ帳で開いて数字を書き換えて保存するだけ。 ──────────────────────── ■ 置きかた（3分） ──────────────────────── 1. フォルダを好きな場所に置く 2. OBSで ソース ＋ → ブラウザ を追加 3. 「ローカルファイル」にチェックし、pomodoro.html を選ぶ 4. 幅600 / 高さ220 くらいから 背景は透明なので、そのまま配信画面に重ねられます。 ──────────────────────── ■ 設定でできること ──────────────────────── workMin / breakMin / longBreakMin それぞれの長さ（分） setsBeforeLong 何セットで長い休憩か（0で無し） autoNext 区切りで自動で次へ進むか size / color / workColor / breakColor 文字の大きさと色 showPhase / showRound / showTotal / showBar 出す項目を選ぶ panel うしろに帯を敷いて読みやすくする beep 区切りで短い音を鳴らす（既定はオフ） resetDaily 日付が変わったら0に戻す URLのうしろに書いて上書きすることもできます。 pomodoro.html?workMin=50&breakMin=10 このとき操作パネルは、本体が実際に使っている長さに自動で合わせます。 ──────────────────────── ■ 品質について ──────────────────────── 出す前に 91項目の自動テスト を通しています。 残り時間の計算、休憩への切り替え、4セット目の長い休憩、 通算作業時間、日付が変わったときの初期化、操作パネルとの連動などを、 仮想の時計で動かして1つずつ確かめています。 Chrome で動作を確認しています。 OBSのブラウザソースは Chrome と同じ仕組みで動きます。 Edge / Firefox でも動く作りですが、こちらでは確認できていません。 ──────────────────────── ■ 使ってよい範囲 ──────────────────────── ・個人／法人を問わず、配信・動画でお使いいただけます（商用可） ・中身を書き換えて、ご自分用に調整していただいてかまいません ・ファイルそのものの再配布・販売はご遠慮ください