@kyanny's blog

自分の不名誉になるような考えを最初に大胆に表明することは、自立への第一歩となる - ニーチェ ドイツ哲学者

映画のネタバレ感想文を書きやすくする

気兼ねなくネタバレを含む感想文を書きたいと常々思っていたので、作ってみた。

「ネタバレを読む」ボタン。押すとネタバレ感想文が読める。 CSS で隠すだけでは RSS/Atom フィードで全文配信したとき読めてしまうので、ボタンを押したら JavaScript で動的に書き出す仕組みにした。そのボタン一式のコードスニペットを組み立てるアプリケーションを作った。 CodePen で React の練習がてら作った。

See the Pen Create "Show Spoiler" Button by Kensuke Nagae (@kyanny) on CodePen.

Create "Show Spoiler" Button

JavaScript 関数ごとベタ書きしてしまうので、貼り付けたボタンの振る舞いをあとでまとめて変えたりすることが難しいけど、まぁ十分目的は果たした。


CSS で隠すタイプだと、はてなダイアリーの頃の d:id:matakimika は薄緑色の背景色の上に濃いめの緑色でネタバレ部分だけを塗りつぶすスタイルでやっていて、あれがとても好きだったのだけど、フィードリーダー対策というかむしろフィードリーダーで読んでくれてる人に対してネタバレしないように配慮するために JavaScript でやるのは外せなかった。

matakimika.hatenadiary.jp

これとか、どうやってたんだろと思ったらやはり至極簡単なマークアップでやっていたようだ。

f:id:a666666:20200420030526p:plain