アナログ時計を表示するUserScript
Scrapboxの右上辺りにアナログ時計を表示するUserScript
jsimport { setup } from "https://scrapbox.io/api/code/takker/アナログ時計を表示するUserScript/script.js";
setup();目的
時刻を視覚化することで、だらだらとネットサーフィン等してどのくらい時間を溶かしたか感覚でわかるように出来ないか
自分の認知はあてにならないので、時刻を視覚化して認識を現実に合わせる必要がある
実装
時計UI
<analog-clock>をそのまま使う
script.jsimport "https://scrapbox.io/api/code/takker/@matthewp%2Fanalog-clock/mod.js";
export function setup(hidden = false) {
const clock = document.createElement("analog-clock");
clock.dark = true;
clock.offset = 9;
clock.style.position = "fixed";
clock.style.right = "80px";
clock.style.top = "45px";
clock.style.width = "20rem";
clock.style.height = "20rem";
clock.hidden = hidden;
document.body.append(clock);
scrapbox.PageMenu.addMenu({
title: "Analog Clock",
image: "https://img.icons8.com/ios/180/FFFFFF/clock--v3.png",script.js onClick: () => clock.hidden = !clock.hidden,
});
}#2022-02-20 04:34:01 defaultで表示するかどうかを決められるようにした
#2021-09-14 17:37:33