▼ Firefox で以下をクリックして下さい(ダウンロードして、Firefox にドラッグ&ドロップでも OK )
http://winofsql.jp/download/twitter_embed.xpi
IE で作ったものとほぼ同等の機能を Firefox の アドオンで実装しました。
Firefox の拡張は今回久しぶりに作ってみて、昔とかなり開発環境に変化が
ありました。いい事も悪い事もあったのですが、悪い事の代替えの為に、雛型
として使えるように考慮して作成しました。
ダウンロードして、拡張子を .zip に変更して解凍すると MKEditor のプロ
ジェクトが同梱されています。機能としては、以下のようなものが主になりま
す。
1) 右クリックのポップアップメニュー
2) そのページが特定のページ以外では表示しない
3) 右クリックした場所のオブジェクトの処理
4) ダイアログを表示する
5) クリップボード
6) タブを開く処理
7) xmlhttprequest による Twitter API 呼び出し
画面イメージはインストール後にアドレスバーに
chrome://sk1/content/sk1_app.xul と入力すると確認できます。
さらに、Firebug で中を見ると実行時の表記が解りやすいと思います。
var targetWindow;
// *********************************************************
// ウインドウの初期処理
// *********************************************************
function onLoad() {
targetWindow = window.arguments[0];
// *************************************************
// 右クリックした場所のデータ
// *************************************************
var str = "";
var tag = targetWindow.document.activeElement.tagName;
switch( tag ) {
case "A" :
str = targetWindow.document.activeElement.href;
break;
default:
str = targetWindow.document.activeElement.innerHTML;
break;
}
// *************************************************
// ID を含むリンクである事をチェック
// *************************************************
if ( str.search("\/status\/") < 0 ) {
document.getElementById("text").value = "対象リンクがありません";
return;
}
// *************************************************
// ID を取得
// *************************************************
var arr = str.split("/");
str = arr[arr.length-1];
// *************************************************
// API で埋め込みコードを取得
// *************************************************
var req = Components.classes["@mozilla.org/xmlextras/xmlhttprequest;1"].createInstance();
req.open('GET', "https://api.twitter.com/1/statuses/oembed.xml?maxwidth=550&align=left&id=" + str, false);
req.send();
var resultXML = req.responseXML;
str = resultXML.getElementsByTagName("html")[0].firstChild.nodeValue;
document.getElementById("text").value = str;
if ( document.getElementById("text").value == '' ) {
document.getElementById("text").value = "★ データの取得に失敗しました。再試行して下さい"
}
}
// *********************************************************
// ユーザが OK をクリックした時だけに一度実行される
// *********************************************************
function onOK() {
close();
}
// *********************************************************
// クリップボードへのコピー
// *********************************************************
function setData() {
const gClipboardHelper = Components.classes["@mozilla.org/widget/clipboardhelper;1"].
getService(Components.interfaces.nsIClipboardHelper);
var text_data = document.getElementById("text").value;
gClipboardHelper.copyString(text_data);
}
// *********************************************************
// タブを開いて、そこを選択する
// *********************************************************
function openTab() {
var text_data = document.getElementById("text").value;
document.getElementById("codeTestIframe").contentWindow.postMessage(text_data,"*");
window.opener.gBrowser.selectedTab =
window.opener.gBrowser.addTab("http://toolbox.winofsql.jp/tool_html_links.php?p=0&ns=1&ht=300#code_test");
close();
}
関連する記事
Twitter用埋め込みコードを取得する IE拡張
posted by
at 2012-01-28 22:56
|
ツール
|
|
Settings ページには以下のようなセクションがあり、最初は『追加』ができるようになっていて、一つ追加すると、編集のみが可能になっています。追加直後、デフォルトの短縮 URL のドメインとなりますが、bit.ly に戻してもいいし、他の bitly.com や j.mp を使っても同じ結果となります。
本来は、もっと短いドメインを取得して使うのだと思いますが、とりあえず自分のドメインを使っておくと、あらゆる URL は自分のサブドメインとして表現できる事になるので、いろいろな宣伝にも使えると言ったところだと思います。
ちなみに、アマゾンのページを短縮すると、
※ エキスパートモードで表示しています
アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります
