開け閉め

力強く閉めると反動で数センチ開く

半蔵門線に乗った気になれるタイマーを作りました


電車に乗らなくなって久しい。大学の授業がオンラインだしバイトは地元だし、わざわざ東京まで足を運ぶこともなくなってしまった。

通学の時間がなくなるのは嬉しいが、そのぶん失われたものもある。 おととし、半蔵門ブログという企画をやっていた。通学などで東京メトロ半蔵門線(錦糸町~渋谷)に乗っている約30分だけを使って、noteで日記を書く。

最初は冗談半分でやっていた習慣だが、結局面白いように続いた。時間感覚が崩壊していてスケジューリングがめちゃくちゃ苦手な自分でも、よく使う電車なら時間ではなく駅名で時間経過を把握できたからかもしれない。時間もちょうどよかった。中央線だと長すぎるし、神戸電鉄神戸高速線だと短すぎる。(日本一短い路線らしいです)

渋谷に着いた時点で未完成でも無理やり投稿、一歩でも電車を降りれば誤字があっても修正は許されないというルールでやっていた。文章の読みやすさとか面白さとか、そういうのにこだわっているとあっという間に時間切れになるので、ハードルが低く気軽に書けた。地下鉄を使わなくなることは、これがなくなることを意味する。良くない。

良くないので、半蔵門線(錦糸町~渋谷)をいつでもどこでも再現できる良いWebページを作ろうと思う。そうすれば、良くなる。

手順


半蔵門線の各駅間の所要時間を入手する
②そういうタイマーを作る
以上。わざわざ手順書く必要なかったな。



半蔵門線各駅の所要時間


調べると、東京メトロAPIというものがあった。電車の駅間の所要時間や乗降車数、さらに特定の車両がいまどこにいるのかまで分かる優れものらしい。f:id:hikido:20210308013813p:plain

が、APIを利用するにはユーザー登録とログインが必要だった。審査に2営業日かかるらしいし、どうせ半蔵門線のデータしか使わないのでこのAPIは使わないことにした。どうにか人力で駅間の所要時間のデータを集めなければいけない。大変だ…。 f:id:hikido:20210308013635p:plain!

ぜんぜん大変じゃなかった。「メトロのトリセツ」というpdfブックがあって、そこにメトロ全線の所要時間が掲載されている。ひょっとして東京メトロは神なのか?

よく見てみると、渋谷から錦糸町までが29分。「約30分」という僕の直感は正しかった。そしてこの時間は、ポモドーロテクニックで推奨されている作業時間の25分ともだいたい同じだ!作業用タイマーとしての半蔵門線の有用性が証明されたことになる。少し背中を押された気分だ。頑張って作るぞ。

作る


スマホアプリやPCのソフトにするのは大変なので、簡単そうなHTMLとjavascriptの組み合わせでタイマーを作ってみる。

得られる情報は地下鉄車内にいるときと揃えたいので、

  • 今どの駅にいるか
  • 次の駅名

の2つを表示できるようにしたい。タイマーだが、残り時間は表示しない。地下鉄に乗っているときに頼りになるのは駅名表示だけなのだ。

というわけで、作った。

f:id:hikido:20210308013626p:plain 普通のタイマーと処理はたいして変わっていないが、時刻の代わりに今いる駅名と次の駅名を表示している。

書いたコード

``````javascript function departure(direction){ startTime = new Date(); //各駅ごとに到達すべき時刻(時刻表)を作成する stationID = 0; var stationLen = stationList[direction].length var diagramArray = []; var stationName; for (var i=0; i<stationLen; i++){ var stationName = stationList[direction][i][0]; stationMinute = stationList[direction][i][1]; var targetTime = new Date(startTime.getTime()+601000stationMinute); diagramArray.push([stationName,targetTime]) console.log(stationName,targetTime) } finishTime = new Date(startTime.getTime()+601000stationList[direction][stationLen-1][1]); //1秒ごとに処理をする timerID = setInterval(function(){gatangoton(diagramArray)},1000); } function start(){ var direction; if(document.getElementById("toggle").checked){ direction = 1 }else{ direction = 0 } departure(direction) }

function gatangoton(diagramArray){ //1秒ごとに駅についたか判定する関数 var stationLen = diagramArray.length var stationName = diagramArray[stationLen-1][0] var curTime = new Date(); if (nextStationID == stationLen){ nextStationID = 0 } var nextTime = diagramArray[nextStationID][1] if (curTime.getTime() >= finishTime.getTime()){ //終点についたらタイマーを終える finalArrival(stationName) clearInterval() }else if(curTime >= nextTime) { nextStationID += 1; curStationID += 1; arrival(diagramArray,curStationID); } } ``````

下のスイッチは、半蔵門線の進行方向を上り(渋谷方面)と下り(錦糸町方面)から選べるようにしたもの。正直どっちが上りでどっちが下りかは知らない。

いま調べたら、東京メトロ都心部を走っているために上りと下りの区別がないらしい。へ~~。

できた


というわけで、ちょっと綺麗にしてみた。

f:id:hikido:20210308013631p:plain
Webページなら初心者でもこんくらいのデザインはできてしまう

いい感じ。PCの全画面だと表示がぶっ壊れるバグに泣かされたが、それなりに見栄えがする。

電車のドアの開閉の音も流そうと思ったが、詳しい人に怒られそうな効果音合法かわからない効果音の2択だったのでやめた。ノイキャンのイヤホンをつけているものとして、画面をチラチラ見ることで現在地を把握していきたい。

https://hanzomontimer.web.app/ のリンクから使えるので、みんなも半蔵門線に乗ったつもりになってほしい。僕の利用経路の都合上、渋谷と錦糸町しか出発地を選べないけど許して。

僕はしばらく、このタイマーを起動して到着するまでしっかり作業し、到着したら休憩するという仕組みで勉強や作業をしてみようと思う。もしこれで作業がはかどれば、作業用タイマーとしての半蔵門線の優位性が示されたことになるので東京メトロから褒めてもらえるかもしれない。

とりあえず今日は寝て、明日からちゃんと使ってみようと思います。