SlideShareやSpeakerDeck等で現在表示してるページのパーマネントにURLを書き換えるブックマークレットを書きました。

においてあります。

使い方は、SlideShare、SpeakerDeckでスライド表示中にブックマークレットを実行すれば、そのページ数にアクセスできるパーマネントリンクにURLを書き換えてくれます。

slideshare, SpeakerDeck の URL でページ番号を指定するには - わからん を参考に作りました。

かなり雑に現在ページを取得してるのでサイトの構造が変化するとうごかなくなるかもしれません。 その場合はazu/where-page-in-slide にソース公開してあるので修正送って頂けると嬉しいです。

ブックマークレットの仕組み

このブックマークレットはBrowserify + bookmarkletterで作られています。

bookmarkletterはこのために書いた、コマンドラインからブックマークレットを作成するツールです。

また、bookmarkletterを作ってから気づいたのですが、GitHubのREADMEにはjavascript:なリンクは埋め込む事が出来ません(セキュリティの都合)

そのため、ブックマークレットはazu.github.io/where-page-in-slide のようにGitHub Pagesに公開しています。

更新する度にGitHub Pagesを書き換えるのは面倒だったので、ブックマークレット自体をファイルとして置いて、それをXHRで読み込んでリンクに埋め込むライブラリを書きました。

azu/embed-bookmarkletsは大したことはやっていなくて、以下のように読み込んで使います。

<script src="https://azu.github.io//embed-bookmarklets/embed-bookmarklets.js"></script>

このスクリプトを読み込んだページに<a href="ブックマークレットファイルのURL" rel="bookmarklets">という属性を持つHTMLを書いておきます。

以下のような感じですね。

<p>Drop & Drop <a href="./where-page-in-slide.js" rel="bookmarklets">where-page-in-slide</a> to bookmark toolbar.</p>
<script src="https://azu.github.io//embed-bookmarklets/embed-bookmarklets.js"></script>

そうすると、hrefで指定したファイルを読み込んでhrefの中に埋め込んでくれます。

<p>Drop & Drop <a href="javascript:..." rel="bookmarklets">where-page-in-slide</a> to bookmark toolbar.</p>

これで、ブックマークレットファイルだけを更新すれば配布ページも自動的に更新されるようになります。

ブックマークレットの配布はlet.hatelabo.jpを使うのが楽なのですが、httpsに対応してないためこういう配布方法にしました。

他のメリットとしては一つのファイルにまとめる事(ブックマークレット内で<script>ロードしないこと)でポップアップブロックの制限にかからなくなることあげられます。

Browserifyを使えば気軽にライブラリもインライン化して入れられるので便利です。