こんにちは、スチールです。
不評そうなら元に戻します。
先日のWWDCでiPhone 4が注目を浴びてる中こっそり発表されたSafari5。
なんといっても大きな変更はSafari Extension、機能拡張の追加です。
発表からすぐにSafari Dev Centerにてドキュメントが追加されていたので
ざーっと見て簡単なExtensionを作ってみました。
（ちなみに配布するにはAppleのデベロッパーアカウントを作って証明書をゲットする必要があります。無料で作れるはずです。）
機能拡張のダウンロードはこちらでできます。
zipを解凍してsafariextzというファイルをダブルクリックするとインストールできると思います。
（インストール前にSafariの環境設定→機能拡張タブから機能拡張を「入」にしておいてください）
インストールするとツールバーにボタンが追加されます。
とあるページを見ていて、このページのリンクをつぶやきたいときに押すと、新しいタブでTwitterのページが開き、テキストボックスにサイトのタイトル、URLが追加されます。
こんな感じ。
ちなみに、ボタン押すときはTwitterにログインしておいてください！
さて、この機能拡張、作るのはけっこう簡単で、実際のコード部分は以下のようになっています。
<!DOCTYPE html>
<html>
<script type="text/javascript">
function performCommand(event) {
if (event.command === "tweet") {
var currentTitle = event.target.browserWindow.activeTab.title;
var currentURL = event.target.browserWindow.activeTab.url;
var newTabURL = "http://twitter.com?status=" + currentTitle + " " + currentURL;
//console.log(newTabURL);
event.target.browserWindow.openTab().url = encodeURI(newTabURL);
}
}
function validateCommand(event)
{
if (event.command === "tweet") {
event.target.disabled = !event.target.browserWindow.activeTab.url;
}
}
safari.application.addEventListener("command", performCommand, false);
safari.application.addEventListener("validate", validateCommand, false);
</script>
<title>title tweet</title>
<body>
</body>
</html>
ざっくりいうと、ボタンを押すと、リッスンしてたイベントが起きて、イベントのコマンド名が、自分の指定した"tweet"というコマンド名か確認します。
（tweetというコマンド名は、拡張機能ビルダーという設定画面で指定しています）
Trueであればアクティブなタブ（ようは今見てるタブ）のURL、タイトルを取得してtwitterのstatusというGETメソッドの引数に渡してあげるわけです。
ちなみに、これをコンテキストメニューでやろうとするとタイトル、URLの取得に一工夫が必要のようです。
（Injecting Scriptと呼ばれるJavaScriptとやりとりする必要があるっぽい）
あと、validateCommandは何してるかっていうと、空のタブを開いている時などはボタンを押せないようにしている感じです。
試しに空のタブ（またはTop Sitesなど）を開いてやると、ボタンがグレーになって押せないようになると思います。
↑のソースがほぼすべてなのですが、一応拡張機能全部のソースをGithubに置いてみました。
s-wool's tweet-link at master - GitHub
よかったら見てみてください。
あと、もっとこうするとよくなるよという意見がありましたらどしどしどうぞ。
（というか自分で改造してもっとよくして教えてくださいｗ）
まだ日本語のちゃんとしたドキュメントはありませんが、既に多くの方が解説をしていらっしゃいますし、Appleのドキュメントも英語ですが読みやすいので、拡張機能の作成に挑戦してみてはいかがでしょう。
では、今日はこの辺で。
んじゃっ！
0 件のコメント:
コメントを投稿