緊張感のあるタイマー（最後にカウントあり）V2 📖

以前作ったタイマーの改良版です。以前のアカウントがツイッターで登録していたためこちらで登録しなおしました。

プログラム: (→大)
/* ========================================================================================================= ---- 概要 ---- 1秒ごとにピッピッ鳴って焦燥感を煽ります。 また、時計を見ないでいいように切りのいい時間でアナウンスをしてくれます。 お勉強のお供にどうぞ！！ 要望などがありましたら https://x.com/g_doudoC/status/1808149662802891252 ---- 行った変更点 ---- 同時再生ができるように同期処理を取り入れた（無駄だったw） システム時計から引き算をするのではなく、素直に1秒毎のタイマーを使う処理に変えた ボタンを一度に反復を利用して作成 ↑↓長押しで連続増減する スタート中に↑↓を押すとストップする 止めない限り、スタートを1回しか押せないようにした ---- 今後の改善点 ---- 重複再生ができるライブラリを自分で作ってそれを使う AndroidとWindowsの自動音声のスピードは調整しています。 それ以外のOSを利用していて読み上げスピードに違和感を感じたら教えてください OtoLogic(https://otologic.jp)さんの音源を使わせていただきました =========================================================================================================*/ # --- 初期化処理 --- 全タイマー停止 audio=「https://n3s.nadesi.com/image.php?f=38.mp3」をオーディオ開く H=0。M=0。S=0 updown_button={}。func_buton={} updown_ID=NULL。タイマーID=NULL。E_time=NULL OS取得で条件分岐: 「windows」ならば: 話者速度=5 違えば: 話者速度=3 # --- DOM要素を作成 --- timeで["H","M","S"]を反復: # "time反復>> time:{time}"を表示 timeで条件分岐: "H"なら、「時:」のラベル作成。ここまで "M"なら、「分:」のラベル作成。ここまで "S"なら、「秒:」のラベル作成。ここまで sideで["up","down"]を反復: # "side反復>> time:{time} side:{side}"を表示 sideで条件分岐: "up"なら: updown_button["{time}{side}"]=upbutton_set "down"なら: updown_button["{time}{side}"]=downbutton_set updown_button["{time}{side}"]にbutton_event_add updown_button["{time}{side}"]に{ "余白": "7px", "文字サイズ": "18px" }をDOMスタイル一括設定 /* WINDOWの"focusout"がDOMイベント発火した時には: 「イベント:{対象イベント["type"]}」を表示 「停止:{updown_ID}」を表示 updown_IDのタイマー停止 */ 関数　upbutton_set obj=「↑」のボタン作成 objの"mousedown"がDOMイベント発火した時には: Event=対象。 タイマーIDのタイマー停止 タイマーID=NULL E_time=Eventのイベント対象特定。E_timeを時計増やす # コールバックでの変数はローカルの可能性あり # グローバルで代入していない変数は使わないように 0.5秒後には 0.1秒毎には: E_timeを時計増やす updown_ID=対象 ここまで updown_ID=対象 objを戻す ここまで 関数　downbutton_set obj=「↓」のボタン作成 objの"mousedown"がDOMイベント発火した時には: Event=対象。 タイマーIDのタイマー停止 タイマーID=NULL E_time=Eventのイベント対象特定。E_timeを時計減らす # コールバックでの変数はローカルの可能性あり # グローバルで代入していない変数は使わないように 0.5秒後には 0.1秒毎には: E_timeを時計減らす updown_ID=対象 ここまで updown_ID=対象 ここまで 関数　button_event_add(objに) Eventで["mouseup","mouseleave"]を反復: objのEventがDOMイベント発火した時には: # 「イベント:{対象イベント["type"]}」を表示 # 「停止:{updown_ID}」を表示 updown_IDのタイマー停止 ここまで 改行作成 funcで["スタート","ストップ","リセット"]を反復: func_buton[func] = funcのボタン作成 func_buton[func]に{ "余白": "10px", "文字サイズ": "30px" }をDOMスタイル一括設定 # --- イベント設定 --- func_buton["スタート"]をクリックした時には もし、((H+M+S = 0) || タイマーID!=NULL)なら、NULLを戻す 「スタート」と話す １秒毎には: 差表示処理 タイマーID=対象 ここまで func_buton["ストップ"]をクリックした時には タイマーIDのタイマー停止 タイマーID=NULL ここまで func_buton["リセット"]をクリックした時には タイマーIDのタイマー停止 タイマーID=NULL H=0。M=0。S=0 時間変更 ここまで 時間変更 # --- 同期処理 --- 関数 秒音再生とは ASYNC audioをオーディオ停止 audioをオーディオ再生 ここまで 関数 （STRで）時報再生とは ASYNC STRと話す ここまで # --- 関数定義 --- 関数　イベント対象特定(Eの) updown_buttonを反復: もし、対象=Eならば: MID(対象キー,1,1)を戻す ここまで 関数　時計増(Tを) Tで条件分岐: "H"ならば: H=H+1 もし、H >= 60ならば、H=0 "M"ならば: M=M+1 もし、M >= 60ならば、M=0 "S"ならば: S=S+1 もし、S >= 60ならば、S=0 時間変更 ここまで 関数　時計減(Tを) Tで条件分岐: "H"ならば: H=H-1 もし、H < 0ならば、H=59 "M"ならば: M=M-1 もし、M < 0ならば、M=59 "S"ならば: S=S-1 もし、S < 0ならば、S=59 時間変更 ここまで ●時間変更とは ZH=Hを2でゼロ埋め ZM=Mを2でゼロ埋め ZS=Sを2でゼロ埋め 全描画クリア 「bold 120px serif」に描画フォント設定して、[25,150]に「{ZH}:{ZM}:{ZS}」を文字描画。 ここまで ●差表示処理とは S=S-1 # 0h0m0sより下になるとことはないので除外 # 秒の繰り下がり もし、S<0なら: M=M-1 S=59 # 分の繰り下がり もし、M<0なら: H=H-1 M=59 # --- 音声 --- 秒音再生 もし、(H+M = 0)ならば: もし、S=30ならば、「30秒」で時報再生 違えば、もし、(S<=10 && S!=0)ならば、Sで時報再生。 違えば、もし、S=0ならば、「ゼロ」で時報再生。 もし、S=0ならば: もし(H=0 && ((M%10 = 0 && M!=0) || M=1))ならば、「{M}分」で時報再生 もし(H>0 && M=0)ならば、「{H}時間」で時報再生 もし、(H+M+S = 0)なら: タイマーIDのタイマー停止 「時間です」と話す # --- 画面更新 --- 時間変更 ここまで。