夏休み7日目
去年の夏休みに何やってたか全く思い出せないから、今年の夏休みはあとから思い出せるようブログに日記をつけることにした。
— 汚染 (@osen_hub) 2021年7月26日
3日に1回以上は更新する。
『3日に1回以上は更新する』とは書いたものの、『UTCの3日に1回以上は更新する』とは書いてないですからね。OSTで考えると今日はまだ前回の更新から3日経っていません。
OSTはみんな知ってると思うけど、一応知らない人のために説明しておきます。
OST(Osen Standard Time / 汚染標準時)とは、僕(汚染)の生活リズムにより調整される基準時刻のことを指します。僕が起きた時刻を0時とし、そこからの経過時刻はUTCを採用しています。
つまり、世界が昼であっても夜であっても、僕が起きた時刻を0時とする基準時刻がOSTです。
今日は真夏なのに凍死しそうになった。これウミガメのスープみたいだな。
「男は7月の真夏にも関わらず凍死しそうになっている。なぜか?」
「男が凍死しそうになっているのは日本ですか?」
「はい」
「男は部屋の中にいますか?」
「はい」
「男は何らかの事件に巻き込まれていますか?」
「いいえ」
「男は第三者の手により凍死しそうになっていますか?」
「いいえ」
「真相が分かりました。男は朝シャワーを浴びてホクホクの茹でオタクになったあと、『アチチやね』と言いながら冷房の温度を21℃まで下げた。しかし、その後エアコンのリモコンをどこに置いたか忘れてしまい、湯冷めしまくりながら冷房のリモコンを探していた。違いますか?」
「お見事です!!!」
無事エアコンのリモコンは見つかったので凍死せずに済みました。よかったね。
食パンにマヨネーズだけを塗ったものを食べた。驚いたことに、それだけでもコンビニのサンドイッチと同じ味がした。YouTubeを見て気をそらしながら食べたら、完全にコンビニのサンドイッチだった。前から自分はバカ舌だと思っていたが、ここまで雑な舌だとは思っていなかった。
結構規模の大きなHTMLとCSSを書くことになったので、ここ数日は本腰を入れて勉強していた。
HTMLやCSSはざっと復習したかっただけだから『作りながら学ぶ…』は図書館で借り、Sassは今後も長い付き合いになりそうだったから『Web製作者のための…』は自腹を切った。
Sassを触るのは初めてだったんだけど、かなり良かった。
SassはCSSを生成するための言語で、Sassを500行くらい書けば1000行くらいのCSSを生成してくれたりする。
Sass、導入コストの割にリターンが大きいので普段からCSSを書く人は勉強して損はないと思います。
たとえば上の『Web製作者のための…』は索引を含めないと250ページくらいしかなくて、図も多いから1~2日で読み切れるけど、これを読むだけで大体のことはできるようになると思われます。
夏休み3日目
去年の夏休みは半分くらいをベッドの上で天井を眺めたり、ベッドの上で壁を眺めたりして過ごしてしまった。
このことを今でも結構後悔しているので、今年は夏休みの髄までしゃぶりにしゃぶりつくしたい。
夏休みを楽しむには、とりあえず「あとどれくらい夏休みが残っているか」を常に把握できるようにしておく必要がある。
ということで、夏休みの残り時間を常に表示してくれるサイトを作った。
サイトとはいっても雑なHTMLと雑なJSだけのシンプルなサイトで、プログラミング初心者が世界に挨拶した後に作るサイトみたいな見た目だけど。
時間ができたらオシャレにCSSでデコりたいなぁ。チョー↑盛れてるアゲアゲな見た目にしたい。
需要があるかは知らないけど、一応HTMLとJSのソースコード貼っておきます。
index.html
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>なつやすみタイマー</title> </head> <body> <p id="nowDate"></p> <p id="elapsedDate"></p> <p id="leftDate"></p> <p id="nowAndLeftPercent"></p> <script type="text/javascript" src="index.js"></script> </body> </html>
index.js
let nowDateElm = document.getElementById('nowDate'); let elapsedDateElm = document.getElementById('elapsedDate'); let leftDateElm = document.getElementById('leftDate'); let nowAndLeftPercentElm = document.getElementById('nowAndLeftPercent'); function updateTimer() { const nowDate = new Date(); const nowDateString = (nowDate.getMonth()+1) + "月 " + nowDate.getDate() + "日 " + nowDate.getHours() + "時 " + nowDate.getMinutes() + "分 " + nowDate.getSeconds() + "秒"; nowDateElm.textContent = nowDateString; // 今日は夏休みの何日目かを計算 const startDate = new Date(2021, 6, 27, 0, 0, 0, 0); const elapsedDays = Math.floor((nowDate - startDate) / (24*60*60*1000)) + 1; const elapsedHours = Math.floor(((nowDate - startDate) / (60*60*1000)) % 24); const elapsedMinutes = Math.floor(((nowDate - startDate) / (60*1000)) % 60); const elapsedSeconds = Math.floor(((nowDate - startDate) / 1000) % 60); const elapsedDateString = "今日は夏休み " + elapsedDays + "日目です。" + "(今日は" + elapsedHours + ":" + elapsedMinutes + ":" + elapsedSeconds + "が経過しました)" elapsedDateElm.textContent = elapsedDateString; // 夏休みの残り日数を計算 const endDate = new Date(2021, 8, 17, 0, 0, 0, 0); const leftDays = Math.floor((endDate - nowDate) / (24*60*60*1000)) + 1; const leftHours = Math.floor(((endDate - nowDate) / (60*60*1000)) % 24); const leftMinutes = Math.floor(((endDate - nowDate) / (60*1000)) % 60); const leftSeconds = Math.floor(((endDate - nowDate) / 1000) % 60); const leftDateString = "夏休み終了まであと " + leftDays + "日 " + leftHours + ":" + leftMinutes + ":" + leftSeconds; leftDateElm.textContent = leftDateString; // 夏休みの残りパーセントを計算 const allDate = endDate - startDate; const nowPercent = ((nowDate - startDate) / allDate) * 1000000; const leftPercent = ((endDate - nowDate) / allDate) * 1000000; const percentString = "現在夏休みの " + Math.round(nowPercent)/10000 + "% が終了しました。\n" + "残りは" + Math.round(leftPercent)/10000 + "% です。"; nowAndLeftPercentElm.textContent = percentString; } setInterval(updateTimer, 50);