風柳メモ

ソフトウェア・プログラミング関連の覚書が中心

ちょっとだけカユイところに手が届くブラウザ拡張／スクリプト

ブラウザ ユーザースクリプト

覚え書きを兼ねて、今後も更新される可能性のある自作のブラウザ拡張機能／スクリプト類をまとめてみました。

一覧

Googleスプレッドシート上にまとめてありますので、そちらを見たほうが見やすいかもです。
docs.google.com

関連

memo.furyutei.work
memo.furyutei.work

Amazon.co.jp のカユイところに手が届くブラウザ拡張／スクリプト

Amazon ブラウザ 拡張機能 アドオン ユーザースクリプト

覚え書きを兼ねて、今後も更新される可能性のある自作の Amazon.co.jp 用ブラウザ拡張機能／スクリプト類をまとめてみました。

一覧

Googleスプレッドシート上にまとめてありますので、そちらを見たほうが見やすいかもです。
docs.google.com

関連

memo.furyutei.work
memo.furyutei.work

船を出すのなら九月…その船は今どこにふらふらと浮かんでいるのか？

九月というと反射的に、中島みゆきさんの「船を出すのなら九月」とか
アルバム「生きていてもいいですか」に収録に収録されています

生きていてもいいですか【リマスター(HQCD)】

生きていてもいいですか【リマスター(HQCD)】

シギサワカヤさんの「九月病」
九月病 上巻 (ジェッツコミックス)

九月病 上巻 (ジェッツコミックス)

九月病 下巻 (ジェッツコミックス)

九月病 下巻 (ジェッツコミックス)

とかを連想してしまう、業の深い（？）自分がいます。
いずれも名作ですので、体験したことのない方はぜひご体感ください。
なお、心身ともに良好なときに視聴することをおすすめします

船を出すのなら九月 [作詞・作曲：中島みゆき]

船を出すのなら九月　誰も見ていない星の九月
人を捨てるなら九月　人は皆　冬の仕度で夢中だ

あなたがいなくても　愛は愛は愛は
愛は　まるで星のようにある

船を出すのなら九月　誰も皆　海を見飽きた頃の九月

夢をとばすなら九月　たくさんの愛がやせる九月
海へ逃げるなら九月　知らぬまに夜が誘いをのばしてる

あなたがいなくても　愛は愛は愛は
愛は　どうせ砂のようにある

人を捨てるなら九月　誰も皆　冬を見ている夜の九月
船を出すのなら九月　誰も皆　海を見飽きた頃の九月

宙船（そらふね） [作詞・作曲：中島みゆき]

その船を漕いでゆけ　おまえの手で漕いでゆけ
おまえが消えて喜ぶ者に　おまえのオールをまかせるな

その船は今どこに　ふらふらと浮かんでいるのか
その船は今どこで　ボロボロで進んでいるのか
流されまいと逆らいながら
船は挑み　船は傷み
すべての水夫が恐れをなして逃げ去っても
その船を漕いでゆけ　おまえの手で漕いでゆけ
おまえが消えて喜ぶ者に　おまえのオールをまかせるな

その船は自らを宙船(そらふね)と　忘れているのか
その船は舞い上がるその時を　忘れているのか
地平の果て　水平の果て
そこが船の離陸地点
すべての港が灯りを消して黙り込んでも
その船を漕いでゆけ　おまえの手で漕いでゆけ
おまえが消えて喜ぶ者に　おまえのオールをまかせるな

何の試験の時間なんだ　何を裁く秤(はかり)なんだ
何を狙って付き合うんだ　何が船を動かすんだ
何の試験の時間なんだ　何を裁く秤なんだ
何を狙って付き合うんだ　何が船を動かすんだ
その船を漕いでゆけ　おまえの手で漕いでゆけ
おまえが消えて喜ぶ者に　おまえのオールをまかせるな
その船を漕いでゆけ　おまえの手で漕いでゆけ
おまえが消えて喜ぶ者に　おまえのオールをまかせるな

こちらはアルバム「ララバイSINGER」に収録されています

ララバイSINGER

ララバイSINGER

このブログにしては異色の記事ですが、せっかくはてなブログでJASRAC管理の歌詞を掲載できるようになったのに、そのことに気がついてからもそういえばまだ一度も利用したことなかったなとちょっと思ったので……。

関連

Twitterのカユイところに手が届くブラウザ拡張／スクリプト

Twitter ブラウザ 拡張機能 アドオン ユーザースクリプト

覚え書きを兼ねて、今後も更新される可能性のある自作のTwitter用ブラウザ拡張機能／スクリプト類をまとめてみました。

一覧

Googleスプレッドシート上にまとめてありますので、そちらを見たほうが見やすいかもです。
docs.google.com

関連

memo.furyutei.work
memo.furyutei.work

はてなブログの記事に更新日付を表示＆古い記事に警告を出す試み

JavaScript はてなブログ

はてなブログが配信しているサイトマップの仕様が変わっていることに、今更ながら気が付きました。
変化したのが2020/04/01からなので、何ヶ月気が付かなかったのか、という話ですが。
sitemap.xml の中身を覗いてみたら、クエリで年月を指定することにより、指定月に作成した記事の更新日付を取得できるようです。

これを利用して、フッタなどに貼り付けることで

  • 個別記事に更新日付を表示
  • 更新日付が古い場合には、警告を表示

するようなスクリプトを試作してみました。

f:id:furyu-tei:20200818053148p:plain
はてなブログの記事に更新日付を入れてみる＆古い記事には警告を表示する

更新日付の取得方法について

はてなブログの記事には作成日付は最初から入っており、例えば

var entry_date = new Date( document.querySelector( 'time[datetime][pubdate].updated' ).getAttribute( 'datetime' ) );

のようにすることで、簡単に取得することができます。
これを用いて記事が古いかどうかを判断して表示するスクリプトは以前から存在します。
sprint-life.hatenablog.com

しかし、実際には記事は更新されることもよくあり、その記事の情報が古いかどうかは更新日付を元に判断したいところです。

2020/04/01より前のサイトマップ仕様

2020/03/31まで、サイトマップの仕様は

/sitemap.xml?page=<ページ番号>

のような形式で、1ページ毎に作成日付の新しいものから順に100件ずつ、記事のURLと更新日付が含まれる仕様になっていました。
なお、当概仕様のサイトマップには現在でもアクセス可能です。
これだと、特定記事の更新日付を取得するためには、当該記事のURLが現れるまでひたすらページ番号を増やしてアクセスする必要があります。
上記の記事やコメント中でも、サイトマップから更新日を取得することは可能ではあるものの、記事と一致させることが手間なので実用的ではない旨書かれています。

このサイトマップを使った更新日付表示の実装例は
www.tsubasa-note.blog

等があるようです。
また、サイトマップの場合には何度もアクセスが発生してしまう問題を解消するため、AMP（更新日付が埋め込まれている）を利用した実装もあるようです。
psn.hatenablog.jp

2020/04/01 以降のサイトマップ仕様

2020/04/01から配信されるようになったサイトマップの仕様では、

/sitemap_periodical.xml?year=<作成年>&month=<作成月>

のようにすると、

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
    <url>
        <loc>https://memo.furyutei.work/entry/20161015/1476495230</loc>
        <lastmod>2016-12-06T09:08:18+09:00</lastmod>
    </url>
    <url>
        <loc>https://memo.furyutei.work/entry/20161008/1475863694</loc>
        <lastmod>2016-12-06T09:08:56+09:00</lastmod>
    </url>
    <url>
        <loc>https://memo.furyutei.work/entry/20161008/1475860031</loc>
        <lastmod>2017-11-14T07:08:24+09:00</lastmod>
    </url>
    <url>
        <loc>https://memo.furyutei.work/entry/20161007/1475839249</loc>
        <lastmod>2020-03-07T03:29:59+09:00</lastmod>
    </url>
</urlset>

のように、指定した年月に作成した記事のURLと更新日の一覧を取得することが出来るようになっていました。
これならアクセスが1回だけで済むので、実用的だと思われます。

個別記事に更新日付を表示＆古い記事に警告を表示するスクリプトとCSSのサンプル

注意事項
  • スクリプトをブログのフッタなどに貼り付ける場合、<script>～</script>で囲むのを忘れないこと
  • サンプルソースコードはGist上にあります。なお、残念ながら Gist 上のコードは外部スクリプトとしては読み込めません（Content-Type: text/plain; charset=utf-8 のため）
  • async/await とか使っているので、モダンブラウザじゃないと動きません(笑)
    それじゃ嫌だというかたはこちらの記事等を参考にして、新しいサイトマップ仕様に対応させてみてください
ソースコード

更新日付と警告用スクリプト（ブログのデザイン→カスタマイズ→フッタへの貼り付け用）

更新日付と警告用CSS（ブログのデザイン→カスタマイズ→デザインCSS貼り付け用）

参考

kanaxx.hatenablog.jp
sprint-life.hatenablog.com
www.tsubasa-note.blog
psn.hatenablog.jp

余談

記事の更新時刻が例えば

2017-11-14T07:08:24+09:00

という文字列で与えられたとき、閲覧者のタイムゾーンによらずに日本標準時の年月日で

2017-11-14

という文字列に変換するためにはどうするのがスマートなんですかね……？
いや、上記サンプル中ではT以降の文字を消す、という手抜き実装ですが……

また、同様に

2017-11-13T22:08:24Z

で与えられた場合には？

var modified_date = new Date( '2017-11-13T22:08:24Z' );
modified_date.setHours( modified_date.getHours()+9 );
var jst_date_string = modified_date.toISOString().replace( /T.*$/, '' );

のようにすれば一応できるけれど、正攻法ではないですね……。