pagerankstatus

2005年07月02日

前回のつづきです。できればそちらから読んでみてください。

今回エクステンションを作るにあたって、同じようにステータスバーに画像を表示するpagerankstatusを参考にしました。どうしてもわからないことは、他のエクステンションに聞くのが一番です。今回のエクステンションは、Firefox 1.1以降に採用される新しいエクステンションのパッケージングの形式で作りましたので、現在はDeer Parkなど開発版でしか動きません。以下はそのつもりで読んでください。ちなみにできあがったエクステンションは「lunatic」と名前をつけてます。

とりあえずできあがったパッケージのファイル構成から。XPIファイル(実体はZIPファイル)を解凍するとこんな感じ。

chrome.manifest
install.rdf
chrome
  + lunatic.jar

今までは、install.rdfとcontents.rdfってファイルにエクステンションのパッケージング情報を記述していたようですが、バージョン1.1から新しい形式に変わります(当分は後方互換性があるようです)。いままで使われていたcontents.rdfがなくなり、代わりにchrome.manifestってファイルが使われるようになります。このファイルに関する日本語のドキュメントがまだあまりないのですが、書式はかんたんなのでこのページを参考に書いてください。今回はこの新しい形式で作ってみました。今回のchrome.manifestの中身がこれ。

content lunatic jar:chrome/lunatic.jar!/content/lunatic/
overlay chrome://browser/content/browser.xul chrome://lunatic/content/lunaticOverlay.xul

install.rdfはem:fileが必要なくなりましたので、こんなにシンプルに。

<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
     xmlns:em="http://www.mozilla.org/2004/em-rdf#">
  <Description about="urn:mozilla:install-manifest">
    <em:name>lunatic</em:name>
    <em:id>{2141781c-ae09-47fc-830f-45852b2f5264}</em:id>
    <em:version>0.1</em:version>
    <em:type>2</em:type>
    <em:description>Makes you crazy!</em:description>
    <em:creator>kingfisher</em:creator>
    <em:iconURL>chrome://lunatic/content/lunatic.png</em:iconURL>
    <em:targetApplication>
      <Description>
        <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
        <em:minVersion>1.0+</em:minVersion>
      </Description>
    </em:targetApplication>
  </Description>
</RDF>

最初のem:idはこのエクステンションをアイデンティファイするものです。生成するにはこのページなどを使わせてもらいましょう。厳密にはこのようなサイトを利用して作るのは問題あるかもしれませんが、ぶっちゃけ他とかぶらなければOK！（笑）ただし後のec8030f7-c20a-464f-9b0e-13a3a9e97384はFirefox自身のIDなのでここはそのままに。em:typeはエクステンションの場合は常に「2」だそうです。他はなんとなく分かると思います。

最後のchromeってディレクトリの中身はまさにこのエクステンションの実体です。この中のlunatic.jarってファイル(こちらも実体はZIPファイル。速度を考えると非圧縮なZIPがたぶんベスト)を解凍するとこんな感じ。

content
  + lunatic
    + lunaticOverlay.xul
    + lunaticOverlay.js
    + lunatic.css
    + lunatic.png
    + 0.png
    + 1.png
        ：
        ：
    + 7.png

lunatic.pngは先ほどのinstall.rdfの中のem:iconURLで指定したもので、[ツール] - [拡張機能] で一覧表示される時などに使われる画像ファイルです。こんなところで初めてFirefoxはアルファチャネルなPNGが使えてエライと思ったり・・・ 0.pngから7.pngは月の形の画像ファイルでステータスバーに表示するものです。今回は8個用意しました。ちなみに0.pngが新月です。本当はSVGが使いたかったのですが、いまいちどうすればいいのかよくわからなくて・・・ネイティブで対応するなら、PNGやJPEGと同じようにあつかってくれればいいのですが。

で、ここからがこのエクステンションの実際の動作に関わる3つのファイルです。まずlunaticOverlay.xul。

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://lunatic/content/lunatic.css" type="text/css"?>
<overlay id="lunaticOverlay"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  <script type="application/x-javascript" src="chrome://lunatic/content/lunaticOverlay.js"/>
  <statusbar id="status-bar">
    <tooltip id="lunatic-tooltip">
      <description id="lunatic-tooltiptext" value=""/>
    </tooltip>
    <statusbarpanel class="statusbarpanel-iconic"
                    id="lunatic-moonimage" tooltip="lunatic-tooltip"/>
  </statusbar>
</overlay>

ここでXULの解説が始まったりはしません。だってわかんないもん！（笑）このファイルの中身はpagerankstatusのものまねです。そしてlunaticOverlay.xulに読み込まれるlunaticOverlay.js。

function makeYouCrazy(){
  moonimage = document.getElementById('lunatic-moonimage');
  tooltiptext = document.getElementById('lunatic-tooltiptext');
  var firstnewmoon = Date.UTC(2005,5,7,6,55,0);
  var lifespanday = 29.530589;
  var lifespanmsec = lifespanday * 24 * 60 * 60 * 1000;
  current = new Date();
  var phase = (current.getTime() - firstnewmoon) % lifespanmsec / lifespanmsec;
  var imagetype = Math.round(phase * 8);
  if(imagetype == 8){
    imagetype = 0;
  }
  var age = Math.round(phase * lifespanday * 100) / 100;
  moonimage.setAttribute("status" , imagetype);
  tooltiptext.setAttribute("value" , age);
  window.setTimeout(makeYouCrazy , 600000);
}
window.setTimeout(makeYouCrazy , 1000);

これもものまねで作るとpagerankstatusができてしまうので(笑)、がんばって書いてみました。javascriptもよくわかりませんが、動いているしこんなのでいいんじゃないかと。月の満ち欠けの周期を朔望周期って言うらしいのですが、これって一定ではなくて結構長くなったり短くなったりするので、誤差が凄いです(泣)。正確な数字をだすにはかなり複雑な計算が必要なようなので、参考になるものがないかと探していたら、glunarclockっていうずばりなGnomeのアプレットが見つかったので、ソースをのぞいて見たのですが・・・無理！！（笑）最後にlunatic.css。

statusbarpanel#lunatic-moonimage[status="0"] {
    list-style-image: url("chrome://lunatic/content/0.png");
}
statusbarpanel#lunatic-moonimage[status="1"] {
    list-style-image: url("chrome://lunatic/content/1.png");
}
statusbarpanel#lunatic-moonimage[status="2"] {
    list-style-image: url("chrome://lunatic/content/2.png");
}
statusbarpanel#lunatic-moonimage[status="3"] {
    list-style-image: url("chrome://lunatic/content/3.png");
}
statusbarpanel#lunatic-moonimage[status="4"] {
    list-style-image: url("chrome://lunatic/content/4.png");
}
statusbarpanel#lunatic-moonimage[status="5"] {
    list-style-image: url("chrome://lunatic/content/5.png");
}
statusbarpanel#lunatic-moonimage[status="6"] {
    list-style-image: url("chrome://lunatic/content/6.png");
}
statusbarpanel#lunatic-moonimage[status="7"] {
    list-style-image: url("chrome://lunatic/content/7.png");
}

list-style-imageってのが気持ち悪いのですが、こんなものらしい・・・

以上がど素人による簡単なFirefoxのエクステンションの作り方でした。これならできるって人、きっとたくさんいるでしょ？今回のこのエクステンションも画像ファイルを用意して固めれば動きますが、なにがあっても責任取れませんのでよろしく！パッケージの配布なんかもいたしません。もうすぐ新月かな？

2005年01月07日

Mozilla.orgのPageRank

かなりどうでもいいねたですが・・・

この前の更新で、このサイトにも初めてついたGoogleのPageRankですが、ちょっと気になってMozilla.orgを調べてみると、「9」でした(前からでしょうか？)。google.co.jpが「8」なことを考えるとかなりすごいですけど、このまま話題を撒き散らしていけば、数えるほどしか存在しないPageRank「10」のサイトになるのも夢ではないような気がします。そしてそれがまた話題になって・・・

FirefoxでPageRankを確認したい方はpagerankstatusをどうぞ！

2005年07月02日

2005年01月07日

+ Links +

+ Entries +

+ Categories +

+ about +