diff options
Diffstat (limited to 'files/ja/creating_a_mozilla_extension')
14 files changed, 0 insertions, 599 deletions
diff --git a/files/ja/creating_a_mozilla_extension/adding_the_structure/index.html b/files/ja/creating_a_mozilla_extension/adding_the_structure/index.html deleted file mode 100644 index 14f2bcc5e0..0000000000 --- a/files/ja/creating_a_mozilla_extension/adding_the_structure/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: Adding the structure -slug: Creating_a_Mozilla_Extension/Adding_the_structure -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Adding_the_structure ---- -<p> -</p><p>今回の拡張機能の UI はステータスバー上のアイコンです。この UI を実装するために、<code><a href="ja/XUL/statusbarpanel">statusbarpanel</a></code> 要素を <code>navigator.xul</code> ファイルの <code><a href="ja/XUL/statusbar">statusbar</a></code> 要素に追加します。 -</p> -<pre class="eval"><statusbar id="status-bar" class="chromeclass-status" - ondragdrop="nsDragAndDrop.drop(event, contentAreaDNDObserver);"> -<statusbarpanel id="component-bar"/> -<statusbarpanel id="statusbar-display" - label="&statusText.label;" flex="1"/> -<statusbarpanel class="statusbarpanel-progress"> - <progressmeter class="progressmeter-statusbar" - id="statusbar-icon" mode="normal" value="0"/> -</statusbarpanel> -<span><statusbarpanel class="statusbarpanel-iconic" - id="tinderbox-status" status="none"/></span> -<statusbarpanel class="statusbarpanel-iconic" id="offline-status"/> -<statusbarpanel class="statusbarpanel-iconic" id="security-button" - onclick="BrowserPageInfo(null, 'securityTab')"/> -</statusbar> -</pre> -<p><code>statusbar</code> XUL 要素は、アプリケーションの状態を表示するステータスバーを定義しています。これにはテキストメッセージ (例えば、Mozilla でドキュメントをロードし終えた時に表示される「完了」や、グラフィカルなメッセージ (例えば、Mozilla で表示しているドキュメントが SSL で暗号化されているかどうかを示す鍵のアイコン) を含めることができます。 -</p><p>ステータスバーは <code>statusbarpanel</code> XUL 要素で定義される複数のパネルから構成されています。各ステータスバーパネルは別々の情報を表示します。グラフィカルパネル (我々が作っている、アイコンを表示するようなもの) には <code><a href="ja/XUL/Style/statusbarpanel-iconic">statusbarpanel-iconic</a></code> class が追加されます。これで、CSS スタイルシートで要素の見た目が定義されるようになります。 -</p><p><code>status</code> 属性は、XUL の <code>statusbarpanel</code> 要素の定義にはありませんが、この拡張機能では現在の Tinderbox の状態を保持するのに使います。Tinderbox のステータスをサーバから取得する毎に <code>status</code> 属性の値を更新します。また、<code>status</code> の値に対応するアイコンが表示されるように CSS ルールを定義します。すべての XUL 要素は、XUL レンダリングエンジンが認識するもの以外に、追加の属性を持つことができます。エンジンは追加された属性を無視するので、属性を追加することで問題が起こったり、(CSS で明示的に指定する場合を除き) GUI 部品を表示する方法が変更されたりすることはありません。 -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Finding_the_code_to_modify">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Specifying_the_appearance">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/conclusion/index.html b/files/ja/creating_a_mozilla_extension/conclusion/index.html deleted file mode 100644 index a02a20b694..0000000000 --- a/files/ja/creating_a_mozilla_extension/conclusion/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Conclusion -slug: Creating_a_Mozilla_Extension/Conclusion -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Conclusion ---- -<p> -</p><p>これで実際に動作する Mozilla 拡張機能のインストーラができあがりました！ テストをするには、新しく Mozilla をインストールし、その Mozilla から XPI ファイルを読み込ませて拡張機能をインストールしてください (Web からロードさせても、<code><a class=" external">file:///</a></code> URL を使ってローカルのハードディスクからロードしても動作するでしょう) 。Mozilla は自動的にファイルがインストーラであるかどうか判断し、インストーラであると判断されれば、ソフトウェアをインストールするかどうか尋ねるでしょう。拡張機能をインストールしたら、Mozilla を再起動し、動作するか確認しましょう。 -</p><p>もしあなたがこのチュートリアルに従って作ったインストーラが動かなければ、<a class="link-https" href="https://addons.mozilla.org/ja/seamonkey/addon/832">こちらの動作するバージョン</a> を問題を見つけ出す参考にしてください。 -</p><p>このチュートリアル・課題の発展としては: -</p> -<ol><li> ビルドステータスを追加してみましょう。Tinderbox は CVS ツリーがチェックインに対してオープンであるかクローズであるかを教えてくれます。どのように JavaScript を用いてツリーがオープンかクローズかどうかを判断し、またどのように CSS を用いてそれに応じたアイコンを表示するのでしょうか？ -</li><li> Mozilla では大抵、CSS と画像ファイルはインストールディレクトリの中の <code>skin</code> サブディレクトリに配置されます。CSS とイメージファイルを <code>skin</code> サブディレクトリにインストールするには、XPI の構造とインストールスクリプトをどのように変更したらよいでしょうか？ -</li><li> ステータスアイコンをクリックしたら Tinderbox ページを開くようにするには拡張機能をどのように変更したらよいでしょうか？ -</li><li> Mozilla はこのチュートリアルではローカライズすべきテキストがないために述べられていなかった 4 番目の UI レイヤー — ローカライズテキスト — を持っています。追加する必要があるなら、どうすればローカライズテキストを拡張機能に追加できるでしょうか？ -</li><li> Tinderbox は複数のコードベースについて記録を取っています。具体的には、Mozilla のメインのコードベース (trunk) と安定版ブランチとを追跡しています。trunk と安定版ブランチの両方のステータスを表示するようにするには どのように tinderstatus を修正したら良いでしょうか？ -</li><li> この拡張機能は Netscape 7 には問題なくインストールできます。Firefox では chrome レジストリが必要とする項目が若干違うため、<code>contents.rdf</code> を修正する必要があるでしょう。例えば <code><a class=" external">chrome://navigator/content/navigator.xul</a></code> を <code><a class=" external">chrome://browser/content/browser.xul</a></code> に変更する必要があります。 -</li></ol> -<p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/ja/docs/Creating_a_Mozilla_Extension:Making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution" style="float: left;">« 前のページ</a><br></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_retrieving_tinderbox_status/index.html b/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_retrieving_tinderbox_status/index.html deleted file mode 100644 index 1bb7a43bcf..0000000000 --- a/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_retrieving_tinderbox_status/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: Enabling the behavior - retrieving tinderbox status -slug: >- - Creating_a_Mozilla_Extension/Enabling_the_behavior_-_retrieving_tinderbox_status -tags: - - Add-ons - - Extensions -translation_of: >- - Archive/Mozilla/Creating_a_Mozilla_extension/Enabling_the_behavior_-_retrieving_tinderbox_status ---- -<p> -</p><p>これで我々の拡張機能ができましたが、このままではまだ動きません。動くようにするには、Tinderbox の状態に合わせて拡張機能のステータスを変更する JavaScript のコードが必要です。まず最初に、Tinderbox サーバから現在の Tinderbox の状態を取得する関数を書きます。 -</p> -<pre class="eval">var gXMLHttpRequest; - -function loadTinderboxStatus() { - gXMLHttpRequest = new XMLHttpRequest(); - gXMLHttpRequest.onload = updateTinderboxStatus; - gXMLHttpRequest.open("GET", "<span>http://tinderbox.mozilla.org/SeaMonkey/panel.html</span>"); - gXMLHttpRequest.send(null); -} -</pre> -<p><a href="ja/XMLHttpRequest">XMLHttpRequest</a> は HTTP を介してドキュメントを取得するための Mozilla のインターフェイスです。これは XML コンテンツを取得し、解析して DOM に変換するように設計されています。XML 以外のコンテンツも (解析はしませんが) ちゃんと取得できます。今回は、現在の Tinderbox の状態の概要を含む HTML ファイルを取得するのに使います。その HTML ファイルは Tinderbox サーバがビルドを終える度に更新されています。そのファイルには、アクティブな Tinderbox クライアントのリストと、最新のビルドの結果が示されています。 -</p><p>今回のようなシンプルな場合なら、XMLHttpRequest を使うのは簡単です。<code>new</code> で XMLHttpRequest のインスタンスを生成し、インスタンスの <code>onload</code> プロパティに <code>updateTinderboxStatus()</code> をセット (この関数はドキュメントの読み込みが終わった時に実行したい関数です) し、インスタンスの <code>open</code> メソッドを、発行したい HTTP リクエストのタイプと、取得するドキュメントの URL を引数に指定して呼び、最後に実際にリクエストを送る <code>send</code> メソッドを呼び出します。<span style="color: darkgreen; background: #ef9;">【訳注: updateTinderboxStatus() 関数は次の Step で作成します】</span> -</p><p>XMLHttpRequest は与えられた URL にあるドキュメントを取得し、取得し終わると <code>updateTinderboxStatus()</code> を呼びます。 -</p><p>XMLHttpRequest のインスタンスをグローバル変数として定義したのに注意してください。これは <code>updateTinderboxStatus()</code> がこの関数と同様に このインスタンスを参照する必要があるけれど、この関数が直接に <code>updateTinderboxStatus()</code> を呼ぶのではないので、この関数から <code>updateTinderboxStatus()</code> へ XMLHttpRequest のインスタンスを渡すことができないためです。 -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Specifying_the_appearance">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Enabling_the_behavior_-_updating_the_status_bar_panel">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_updating_the_status_bar_panel/index.html b/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_updating_the_status_bar_panel/index.html deleted file mode 100644 index 7584fd9abb..0000000000 --- a/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_updating_the_status_bar_panel/index.html +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: Enabling the behavior - updating the status bar panel -slug: >- - Creating_a_Mozilla_Extension/Enabling_the_behavior_-_updating_the_status_bar_panel -tags: - - Add-ons - - Extensions -translation_of: >- - Archive/Mozilla/Creating_a_Mozilla_extension/Enabling_the_behavior_-_updating_the_status_bar_panel ---- -<p> -</p><p><code>loadTinderboxStatus()</code> を動作させるには、対応する <code>updateTinderboxStatus()</code> 関数を定義しなければなりません。 -</p> -<pre class="eval">function updateTinderboxStatus() -{ - var icon = document.getElementById('tinderbox-status'); - - if (gXMLHttpRequest.responseText.match("EE0000")) - icon.setAttribute("status", "busted"); - else if (gXMLHttpRequest.responseText.match("FFAA00")) - icon.setAttribute("status", "testfailed"); - else if (gXMLHttpRequest.responseText.match("11DD11")) - icon.setAttribute("status", "success"); - else - icon.setAttribute("status", ""); -} -</pre> -<p><code>updateTinderboxStatus()</code> では、我々の拡張機能の UI を表す <code>statusbarpanel</code> 要素への参照を取得し、次に、取得した HTML ドキュメント (<code>XMLHttpRequest</code> インスタンスの <code>responseText</code> プロパティに入っています) に検索をかけます。赤 (RGB コード「EE0000」で表される) が含まれていれば、それは Tinderbox クライアントが Mozilla のビルドに失敗したことを示しています。オレンジ色 (「FFAA00」) が含まれていれば、それは Tinderbox クライアントが Mozilla のビルドには成功したが、そのビルドがテストには失敗したことを示しています。緑色 (「11DD11」) が含まれていれば、それはクライアントが Mozilla のビルドにもテストにも成功したことを示しています。<code>updateTinderboxStatus()</code> 関数は、ドキュメント中に色を見つけたら、対応する値をパネルの <code>status</code> 属性にセットします。その結果、前に定義した CSS ルールによって、アイコンが Tinderbox の状態に対応するものに切り替えられます。我々の条件文は成功の判定よりも先に、悪い結果 (bustage <span style="color: darkgreen; background: #ef9;">【訳注: ビルド失敗】</span>、テスト失敗) の判定をしているため、成功のステータスよりも失敗のステータスが優先して表示されます。<span style="color: darkgreen; background: #ef9;">【訳注: もしそうでないと、「ひとつでも成功しているビルドがあれば、成功のステータスが表示される」ことになってしまいます】</span> -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Enabling_the_behavior_-_retrieving_tinderbox_status">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Enabling_the_behavior_-_updating_the_status_periodically">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_updating_the_status_periodically/index.html b/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_updating_the_status_periodically/index.html deleted file mode 100644 index a472bbb3f0..0000000000 --- a/files/ja/creating_a_mozilla_extension/enabling_the_behavior_-_updating_the_status_periodically/index.html +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: Enabling the behavior - updating the status periodically -slug: >- - Creating_a_Mozilla_Extension/Enabling_the_behavior_-_updating_the_status_periodically -tags: - - Add-ons - - Extensions -translation_of: >- - Archive/Mozilla/Creating_a_Mozilla_extension/Enabling_the_behavior_-_updating_the_status_periodically ---- -<p> -</p><p>これで Tinderbox のステータスを取得してアイコンを更新するコードができたので、それを定期的に実行するようにしましょう。 -</p> -<pre class="eval">function loadTinderboxStatus() { - gXMLHttpRequest = new XMLHttpRequest(); - gXMLHttpRequest.onload = updateTinderboxStatus; - gXMLHttpRequest.open("GET", "<span>http://tinderbox.mozilla.org/SeaMonkey/panel.html</span>"); - gXMLHttpRequest.send(null); - <span>window.setTimeout(loadTinderboxStatus, 60000);</span> -} - -<span>window.setTimeout(loadTinderboxStatus, 1000);</span> -</pre> -<p><code><a href="ja/DOM/window.setTimeout">window.setTimeout</a></code> は、指定された関数を一定時間後に実行させます。これを <code>loadTinderboxStatus</code> 関数の中で使い、この関数を スタートアップの 1 秒後 (1,000 ミリ秒) とその後 1 分毎 (60,000 ミリ秒) に実行するようにします。これで、ユーザは Tinderbox サーバに負荷をあまりかけず、かつ Mozilla がリクエストのせいで遅くならずに、比較的多く Tinderbox の更新ができるようになります。 -</p><p>我々のコードはこれで動くようになりましたが、Mozilla はこのコードについて何も知りません。この機能を有効にするには、<a href="ja/Creating_a_Mozilla_Extension/Specifying_the_appearance">外見を指定する</a> で我々の CSS のコードへの参照を <code>navigator.xul</code> に追加したのと同様に、<code>navigator.xul</code> に我々の JavaScript のコードの参照を加えます。<code>tinderstatus.js</code> という名前の JavaScript のコードを <code>navigator.xul</code> と同じディレクトリに置き、<code>navigator.xul</code> の他の JavaScript スクリプトを参照している所に <code>tinderstatus.js</code> も参照させるようにします。 -</p> -<pre class="eval">... - -<!-- Navigator --> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/browser.js</a>"/> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/navigator.js</a>"/> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/navigatorDD.js</a>"/> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/sessionHistoryUI.js</a>"/> - -<span><script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/tinderstatus.js</a>"/></span> - -<!-- hook for stringbundle overlays --> - -... -</pre> -<p>この変更を行い、Mozilla を再起動すれば、Tinderbox ステータスパネルに 現在の Tinderbox の状態が表示されるはずです。<a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=SeaMonkey">Tinderbox に行き</a>、パネルがアクティブな Tinderbox クライアントの現在の状態のうち最悪のものを表示しているか確かめてください。 -</p><p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/ja/docs/Creating_a_Mozilla_Extension:Enabling_the_behavior_-_updating_the_status_bar_panel" style="float: left;">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Making_it_into_a_static_overlay">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/finding_the_code_to_modify/index.html b/files/ja/creating_a_mozilla_extension/finding_the_code_to_modify/index.html deleted file mode 100644 index fbabff13e3..0000000000 --- a/files/ja/creating_a_mozilla_extension/finding_the_code_to_modify/index.html +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: Finding the code to modify -slug: Creating_a_Mozilla_Extension/Finding_the_code_to_modify -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Finding_the_code_to_modify ---- -<p>書き換えるべきファイルが分かったので、次はそのファイルから書き換えるべきコードを見つけます。これも <a href="ja/DOM_Inspector">DOM Inspector</a> で簡単にできます。DOM Inspector の左側の「Document - DOM Nodes」ペインが、ブラウザウィンドウの XUL ファイルのツリー構造を表示しています。ツリーのノードを選択すると、ブラウザウィンドウの対応する部分の周りで、赤いボーダーが数秒間点滅します。</p> -<p>下にスクロールして、ツリーの <code><a href="ja/XUL/statusbar">statusbar</a></code> ノードを選択します。ブラウザウィンドウの下のステータスバーの周りが赤く点滅するのに注目してください。DOM Inspector の <code>statusbar</code> ノードの隣のプラス記号をクリックし、出てきた <code><a href="ja/XUL/statusbarpanel">statusbarpanel</a></code> ノードをひとつずつ選択していきます。ステータスバーの別々の箇所が赤く点滅するのに注目してください。</p> -<p><code>navigator.xul</code> ファイルをテキストエディタで開き、<code>statusbar</code> 要素を検索してください。我々が作る拡張機能の UI を追加するのはその中です。</p> - -<div><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Finding_the_file_to_modify">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Adding_the_structure">次のページ »</a></p> -</div></div> diff --git a/files/ja/creating_a_mozilla_extension/finding_the_file_to_modify/index.html b/files/ja/creating_a_mozilla_extension/finding_the_file_to_modify/index.html deleted file mode 100644 index 70ac78fe59..0000000000 --- a/files/ja/creating_a_mozilla_extension/finding_the_file_to_modify/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: Finding the file to modify -slug: Creating_a_Mozilla_Extension/Finding_the_file_to_modify -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Finding_the_file_to_modify ---- -<p> -</p><p>これで改造できる Mozilla ができたので、次は改造するファイルを探しましょう。Mozilla の UI は、3 つのレイヤー 「構造」、「スタイル」、「ふるまい」に分かれています。構造レイヤーは部品 (メニュー、ボタンなど) とそれらの UI 上での相対位置を定義します。スタイルレイヤーは部品の見え方 (サイズ、色、スタイルなど) やそれらの全体的な位置 (アライメント <span style="color: darkgreen; background: #ef9;">【訳注: 右寄せや中央寄せなどを定義すること】</span>) を決定します。ふるまいレイヤーは、部品がどのように動作するか、ユーザが部品をどう使うことができるかを指定します。 -<span>mention the localization layer</span> -</p><p>(注意: これらのレイヤーは完全に排他的ではではありません。例えば、位置の情報は構造レイヤーとスタイルレイヤーの両方で指定できますし、「ふるまい」の一部はスタイルレイヤーで定義できます。) </p><p>それでは、3つの UI レイヤーにコードを加えて行きましょう。まずは構造レイヤーから始めます。構造レイヤーは XUL ファイルで構成されています。<a href="ja/XUL">XUL</a> は XML-based User Interface Language の略で (「ズール」と発音します)、アプリケーションのインターフェイスを記述するために設計された、XML ベースの言語です。これは一般的なウィジェット (メニュー、ボタン、ツールバーなど) と、多くの洗練されたウィジェット (ツリー、ブラウザ、カラーピッカー) を含んでいます。 -</p><p>Mozilla のウィンドウやダイアログボックスでは、ひとつのウィンドウがひとつの XUL ファイルで定義されています (オーバーレイの仕組みを利用して、他のウィンドウから一部を提供してもらうこともあります)。Tinderbox の状態を示すアイコンを Mozilla に加えるには、まずはブラウザウィンドウの構造が一体どの XUL ファイルで定義されているのか探す必要があります。 -</p><p>ウィンドウに対応する XUL ファイルを見つけるには、DOM Inspector を使うのが最もよい方法です。<a href="ja/DOM_Inspector">DOM Inspector</a> は Mozilla に付属のツールで、Web ページおよび XUL ウィンドウの DOM を調べることができます。DOM Inspector を起動するには、[ツール] メニューから [Web 開発] サブメニューを選択し、[DOM Inspector] を選択します。DOM Inspector が別ウィンドウで開きます。 -</p><p>DOM Inspector ウィンドウで、[File] メニューから [Inspect a Window] サブメニューを選択し、Mozilla ブラウザウィンドウのアイテム (ブラウザが現在開いているページの名前がつけられています) を選択します。DOM Inspector には Mozilla ブラウザのウィンドウを定義している XUL ファイルの URL、ここでは <code><a class=" external">chrome://navigator/content/navigator.xul</a></code> が表示されます。 -</p><p>chrome URL は、Mozilla をインストールしたディレクトリの <code>chrome</code> サブディレクトリの中のファイルを参照するために Mozilla 内部で 使われている URL のことです。chrome URL にはパス部がありますが、そのパスは必ずしもディレクトリ階層そのものを 示しているわけではありません。この場合、chrome URL は <code>mozilla-installation-directory/chrome/content/navigator/navigator.xul</code> を示しています。 -<span>[explain further, http://www.mozilla.org/xpfe/ConfigChromeSpec.html]</span> -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Making_a_Mozilla_installation_modifiable">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Finding_the_code_to_modify">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/index.html b/files/ja/creating_a_mozilla_extension/index.html deleted file mode 100644 index 72a23569fa..0000000000 --- a/files/ja/creating_a_mozilla_extension/index.html +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: Creating a Mozilla Extension -slug: Creating_a_Mozilla_Extension -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension ---- -<div><div class="warning warningHeader"> - <p><strong>警告:</strong> <strong>この記事の内容は古くなっている可能性があります。</strong> This tutorial describes how to create an extension for the old versions of Mozilla Suite (currently SeaMonkey). See <a href="/ja/docs/Building_an_Extension">Building an Extension</a> for an up-to-date tutorial (it focuses on Firefox, but is also applicable to other new applications).</p> -</div></div> - -<div class="note"> - <p>このチュートリアルは Mozilla Suite (現在は SeaMonkey) 向け拡張機能の作り方を解説したものです。どなたか内容を更新して Firefox に対応させてください。</p> -</div> -<p>Mozilla の拡張機能とは、Mozilla ブラウザにインストールできる、追加の機能を提供するものです。(例えば <a class="external" href="http://linky.mozdev.org/">Linky</a> は、ドキュメント中・選択範囲中の複数のリンクを一度に開く項目をコンテキストメニューに追加します)。このチュートリアルでは、現在の Mozilla のソースコードの状態 (最新のコードがコンパイルに成功し、テストを通ったかどうか) を示すアイコンをステータスバーに表示する拡張機能を作る過程を見ていきます。この拡張機能は、コードの状態を取得するために、ソースコードの状態を追跡する mozilla.org の Web ツールである <a class="external" href="http://tinderbox.mozilla.org/">Tinderbox</a> にアクセスします。</p> -<p>このチュートリアルを修了すれば、どのように Mozilla のユーザインターフェイス (UI) が構築されているのか、どうやって拡張したい UI のソースコードを見つけるか、インストールされている Mozilla に変更を加える前の準備、Web ページを読み込み解析する Mozilla のネットワークライブラリを JavaScript から使う方法、他のユーザが使えるように Mozilla の拡張機能をパッケージ化するための動的オーバーレイの使い方に関する基礎知識が得られるでしょう。</p> -<h3 id=".E7.9B.AE.E6.AC.A1" name=".E7.9B.AE.E6.AC.A1">目次</h3> -<ol> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Prerequisites">必要条件</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Tinderbox">Tinderbox</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Making_a_Mozilla_installation_modifiable">修正可能な Mozilla を作成</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Finding_the_file_to_modify">修正対象のファイルを探す</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Finding_the_code_to_modify">修正するコードを見つける</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Adding_the_structure">構造を加える</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Specifying_the_appearance">外見を指定する</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Enabling_the_behavior_-_retrieving_tinderbox_status">機能を有効にする - Tinderbox のステータスを取得する</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Enabling_the_behavior_-_updating_the_status_bar_panel">機能を有効にする - ステータスバーパネルを更新する</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Enabling_the_behavior_-_updating_the_status_periodically">機能を有効にする - 定期的にステータスを更新する</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Making_it_into_a_static_overlay">静的オーバーレイに作り直す</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution">動的オーバーレイに作り直し、配布用にパッケージングする</a></li> - <li><a href="/ja/docs/Creating_a_Mozilla_Extension/Conclusion">終わりに</a></li> -</ol> -<p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/ja/docs/Creating_a_Mozilla_Extension:Prerequisites">次のページ »</a></p> -</div><p></p> -<div class="originaldocinfo"> - <h2 id=".E5.8E.9F.E6.96.87.E6.9B.B8.E3.81.AE.E6.83.85.E5.A0.B1" name=".E5.8E.9F.E6.96.87.E6.9B.B8.E3.81.AE.E6.83.85.E5.A0.B1">原文書の情報</h2> - <ul> - <li>著者: Myk Melez</li> - <li>最終更新日: September 19, 2006</li> - <li>著作権: Portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a Creative Commons license | <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">詳細</a></li> - </ul> -</div> diff --git a/files/ja/creating_a_mozilla_extension/making_a_mozilla_installation_modifiable/index.html b/files/ja/creating_a_mozilla_extension/making_a_mozilla_installation_modifiable/index.html deleted file mode 100644 index 373f88c3fc..0000000000 --- a/files/ja/creating_a_mozilla_extension/making_a_mozilla_installation_modifiable/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: Making a Mozilla installation modifiable -slug: Creating_a_Mozilla_Extension/Making_a_Mozilla_installation_modifiable -tags: - - Add-ons - - Extensions -translation_of: >- - Archive/Mozilla/Creating_a_Mozilla_extension/Making_a_Mozilla_installation_modifiable ---- -<p> -</p><p>Mozilla の UI は、<a href="ja/XUL">XUL</a> (後述)、<a href="ja/XBL">XBL</a> (他のチュートリアルのトピック)、<a href="ja/JavaScript">JavaScript</a>、<a href="ja/CSS">CSS</a>、そしてイメージファイルで構成されています。XUL、XBL、JavaScript、CSS はテキスト形式のファイルで、テキストエディタがあれば編集できます。イメージファイルは GIF か JPG か PNG フォーマットのファイルで、編集するには画像編集プログラムが必要です。 -</p><p>次に、UI を構成するファイルは JAR アーカイブにまとめられます。これはただの ZIP ファイルの拡張子を変えたもので、「manifest」というファイルを含んでいます。これは、アーカイブの内容について書いてある特別なフォーマットのファイルで、Mozilla はこのファイルを読んで行うべき処理を決定します。 -</p><p>JAR アーカイブはバイナリファイルですが、Mozilla の UI はマシンコードにコンパイルされるわけではありません。Mozilla は、起動する度にその UI をアーカイブ中のファイルからビルドします。そのため、アーカイブ中のファイルを変更してアプリを再起動するだけで、変更点の確認ができます。このため、Mozilla の UI はコンパイルベースのアプリケーションより修正が簡単になっています。 -</p><p>Mozilla の UI ファイルは通常 JAR アーカイブに格納されていますが、代わりにアーカイブされていない形の UI ファイルを使うこともできます。これは、コードを修正する前にアーカイブからファイルを取り出したり、修正した後にアーカイブへファイルを追加したりする必要がないので、拡張機能の開発者にとってとても有効な手段です。最初に一度だけアーカイブを解凍する必要がありますが、それだけで後は好きなだけ変更ができます。 -</p><p>Mozilla を修正可能にするには、まず最初に unzip ユーティリティを使って アーカイブから UI ファイルを取り出します。次に Mozilla の UI ファイルのレジストリを修正し、オリジナルの JAR アーカイブの代わりに、取り出したファイルを使うように設定します。もし以下の説明でうまく動かない場合は、Patch Maker を試してください。このツールは、アーカイブからファイルを取り出し、Mozilla のレジストリを書き換えるパッチを作ってくれます。 -</p><p>アーカイブは Mozilla がインストールされているディレクトリの <code>chrome</code> サブディレクトリに格納されています。unzip ユーティリティを使って、ディレクトリにある .jar 拡張子のファイルをすべて解凍しましょう。<code>.jar</code> ファイルが配置されているのと同じディレクトリ (<code>chrome</code> ディレクトリ) に解凍したか確かめてください。bash ライクなシェルがある Unix ライクな OS では、<code>chrome</code> ディレクトリで次のコマンドを実行すれば、この作業は完了します。 -</p> -<pre class="eval">for file in *.jar; do unzip $file; done -</pre> -<p>DOS のようなシェルを持つ OS では、次のコマンドを実行すれば作業完了です。 -</p> -<pre class="eval">for %file in (*.jar); do unzip %file -</pre> -<p><span style="color: darkgreen; background: #ef9;">【訳注: 】</span> そのディレクトリにあるプラットフォーム固有のファイル — <code>en-mac.jar</code>、<code>en-unix.jar</code>、そして <code>en-win.jar</code> — については、使っているプラットフォームに対応した物だけ解凍してください。<span style="color: darkgreen; background: #ef9;">【訳注: 上記のコマンドを実行した場合は、自分の使っているプラットフォームに対応した .jar ファイルをもう一度解凍して、ファイルを上書き (プロンプトに A と答える) してください】</span> -</p><p>ファイルを解凍したら、オリジナルの JAR アーカイブの代わりに 解凍されたファイルを使うように Mozilla chrome レジストリを修正します。chrome レジストリとは、主要な Mozilla コンポーネントとその UI ファイルが <code>chrome</code> ディレクトリのどこに配置されているかが書かれているファイルです。これは <code>chrome</code> ディレクトリの <code>chrome.rdf</code> と <code>installed-chrome.txt</code> のどちらか (または両方) にあたります。 -</p><p>このレジストリには、JAR アーカイブ内のディレクトリを指す <code>jar:resource:/chrome/SOMETHING.jar!/SOMETHING-ELSE...</code> という形の URL がいくつも含まれています。この URL が解凍したファイルを指すように、まず先頭の <code>jar:</code> を取り除き、次に真ん中ぐらいの <code>SOMETHING.jar!</code> という部分を取り除きます。もし Perl が使えるなら、次のコマンドで行うことができます。 -</p> -<pre class="eval">perl -pi.orig -e 's/(jar:)|(\/[^.\/]+\.jar!)//g' chrome.rdf installed-chrome.txt -</pre> -<p>例えば、<code>jar:resource:/chrome/comm.jar!/content/necko/</code> という URL は <code>resource:/chrome/content/necko/</code> に変更されます。 -</p><p>ここまできたら、修正した Mozilla を起動してみましょう。元々入っている Mozilla ではなく、新しくインストールして修正した Mozilla を起動していること、もし Windows を使っていて「高速起動」機能を有効にしているのなら、それを終了させたことを確認してください。Mozilla が立ち上がり、普通の Web ブラウザウインドウが出てきたなら、Mozilla を修正できるようになりました！ <span>[mention that if you have Perl, you can also do this with Patch Maker]</span> -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Tinderbox">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Finding_the_file_to_modify">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution/index.html b/files/ja/creating_a_mozilla_extension/making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution/index.html deleted file mode 100644 index 2afc1fe0ed..0000000000 --- a/files/ja/creating_a_mozilla_extension/making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution/index.html +++ /dev/null @@ -1,115 +0,0 @@ ---- -title: Making it into a dynamic overlay and packaging it up for distribution -slug: >- - Creating_a_Mozilla_Extension/Making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution -tags: - - Add-ons - - Extensions -translation_of: >- - Archive/Mozilla/Creating_a_Mozilla_extension/Making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution ---- -<p> -</p><p>これで静的なオーバーレイができました。次に XPI パッケージを作成します。XPI パッケージによって、拡張機能は動的オーバーレイとして Mozilla にインストールされます。XPI は UI レイヤーを別々に切り分けることができるように設計されています。まず、XPI に含めるファイルを入れるディレクトリを作ります。次に、ファイル中の URL を変更して、XPI を使ってインストールしたときにファイルが置かれる場所を指すようにします。次に、tinderstatus コンポーネントについて記述した <code>contents.rdf</code> と、インストールを実行する <code>install.js</code> スクリプトを作成します。最後に、構成ファイルを zip アーカイブへ圧縮します。 -</p><p>まず、適当な場所に <code>tinderstatus-installer</code> ディレクトリを作成します。次に <code>tinderstatus</code> サブディレクトリをその中に作成し、さらにその中に <code>content</code> サブ-サブディレクトリを作成してください。作成したら、次のファイルを <code>content</code> ディレクトリにコピーしてください。 -</p> -<ul><li> tinderstatusOverlay.xul -</li><li> tinderstatus.js -</li><li> tinderstatus.css -</li><li> tb-busted.png -</li><li> tb-nostatus.png -</li><li> tb-success.png -</li><li> tb-testfailed.png -</li></ul> -<p>これらは XPI に入れるファイルです。次に、コピーした <code>tinderstatusOverlay.xul</code> 中の URL を、XPI を使ってインストールしたときにファイルが置かれる場所を指すように変更します。 -</p> -<pre class="eval"><?xml version="1.0"?> - -<?xml-stylesheet - href="<span><a class=" external">chrome://tinderstatus/content/tinderstatus.css</a></span>" - type="text/css"?> - -<overlay id="tinderstatusOverlay" - xmlns="<span>http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"> - -<script type="application/x-javascript" - src="<span><a class=" external">chrome://tinderstatus/content/tinderstatus.js</a></span>" /> - -<statusbar id="status-bar"> - <statusbarpanel class="statusbarpanel-iconic" - id="tinderbox-status" - insertbefore="offline-status" - status="none"/> -</statusbar> - -</overlay> -</pre> -<p><code>tinderstatus.css</code> も同様に URL を変更します。 -</p> -<pre class="eval">statusbarpanel#tinderbox-status { - list-style-image: url("<span><a class=" external">chrome://tinderstatus/content/tb-nostatus.png</a></span>"); -} - -statusbarpanel#tinderbox-status[status="success"] { - list-style-image: url("<span><a class=" external">chrome://tinderstatus/content/tb-success.png</a></span>"); -} - -statusbarpanel#tinderbox-status[status="testfailed"] { - list-style-image: url("<span><a class=" external">chrome://tinderstatus/content/tb-testfailed.png</a></span>"); -} - -statusbarpanel#tinderbox-status[status="busted"] { - list-style-image: url("<span><a class=" external">chrome://tinderstatus/content/tb-busted.png</a></span>"); -} -</pre> -<p>次に、2 つのファイルを作成します。1 つは <code>contents.rdf</code> という名前で、インストールするコンポーネントの情報が記述されており、chrome レジストリにインストールされます。もう 1 つは <code>install.js</code> という名前で、コンポーネントをインストールするためのコードです。<code>contents.rdf</code> は <code>content</code> ディレクトリに入れます。 -</p> -<pre class="eval"><?xml version="1.0"?> -<RDF:RDF xmlns:RDF="<span>http://www.w3.org/1999/02/22-rdf-syntax-ns#</span>" - xmlns:chrome="<span>http://www.mozilla.org/rdf/chrome#</span>"> - -<RDF:Seq about="urn:mozilla:package:root"> - <RDF:li resource="urn:mozilla:package:tinderstatus"/> -</RDF:Seq> - -<RDF:Description about="urn:mozilla:package:tinderstatus" - chrome:displayName="Mozilla Tinderstatus Extension" - chrome:author="Myk Melez" - chrome:name="tinderstatus" - chrome:extension="true" - chrome:description="Displays tinderbox status for the Mozilla codebase."> -</RDF:Description> - -<RDF:Seq about="urn:mozilla:overlays"> - <RDF:li resource="<a class=" external">chrome://navigator/content/navigator.xul</a>"/> -</RDF:Seq> - -<RDF:Seq about="<a class=" external">chrome://navigator/content/navigator.xul</a>"> - <RDF:li><a class=" external">chrome://tinderstatus/content/tinderstatusOverlay.xul</a></RDF:li> -</RDF:Seq> - -</RDF:RDF> -</pre> -<p><code>install.js</code> は <code>tinderstatus-installer</code> ディレクトリに入れます。 -</p> -<pre class="eval">initInstall( - "Mozilla Tinderstatus Extension", - "/mozdev/tinderstatus", - "0.1"); -var installDir = getFolder("Chrome","tinderstatus"); -setPackageFolder(installDir); - -addDirectory("tinderstatus"); -registerChrome( - CONTENT | DELAYED_CHROME, - getFolder(installDir, "content")); -var result = performInstall(); - -if ( result != SUCCESS ) cancelInstall(result); -</pre> -<p>すべてのファイルの配置が終わったら、<code>tinderstatus-installer</code> ディレクトリで zip を使い、<code>install.js</code> と <code>tinderstatus/</code> ディレクトリの内容をすべて含んだ ZIP アーカイブを作り、その名前を <code>tinderstatus.xpi</code> にします。アーカイブのトップレベルにファイルとディレクトリがあることを確かめてください。 -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Making_it_into_a_static_overlay">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Conclusion">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/making_it_into_a_static_overlay/index.html b/files/ja/creating_a_mozilla_extension/making_it_into_a_static_overlay/index.html deleted file mode 100644 index 29fd454882..0000000000 --- a/files/ja/creating_a_mozilla_extension/making_it_into_a_static_overlay/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: Making it into a static overlay -slug: Creating_a_Mozilla_Extension/Making_it_into_a_static_overlay -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Making_it_into_a_static_overlay ---- -<p> -</p><p>これで Tinderbox のステータスを表示する拡張機能が完成しました、次はこれを他のユーザに配布できるようにします、やり方としては、Mozilla のコードに統合する方法 (この場合、我々の作ったものは拡張機能ではなく、デフォルトの Mozilla 配布物の一部になります) と、拡張機能を Mozilla から実行可能なインストーラパッケージにして、ユーザが拡張機能を使用中の Mozilla に追加するようにする方法があります。 -</p><p>ほとんどの拡張機能はインストーラパッケージとして配布されているので、我々も同様にしましょう。なお、拡張機能を Mozilla のコードベースに統合する方法はこのチュートリアルの範疇ではありませんが、mozilla.org の <a class="external" href="http://www.mozilla.org/hacking/">hacking documentation</a> に多くの情報があります、 -</p><p>Mozilla のインストーラーパッケージは <a href="ja/XPI">XPIs</a> (「ジッピーズ」と発音します) と呼ばれます。これはクロスプラットフォームインストーラ (cross-platform installer) の略です。パッケージはただの ZIP アーカイブで、インストールされるファイルに加えて、インストールを実行する JavaScript スクリプトと、chrome レジストリ用の、インストールされるコンポーネントについて記述した <a href="ja/RDF">RDF</a> ファイルを含んでいます。 -</p><p>この拡張機能は、インストールすると Mozilla 中のファイルを変更します、動的 <a href="ja/XUL_Overlays">XUL オーバーレイ</a> を使って拡張機能の内容をインストール済みの Mozilla に書き加えるようにするためには、拡張機能をパッケージ化する前に、変更部分を別のファイルに分ける必要があります、 -</p><p>XUL オーバーレイは XUL ファイルの一種で、他の XUL ファイルに挿入されるべき要素を含んでいます、挿入は、挿入先の XUL ファイルがアプリケーションの UI へレンダリングされる時に行なわれます、静的オーバーレイでは、XUL ファイルの先頭に記述された XUL ファイルへの参照によって挿入が行なわれます (スタイルシートや JavaScript スクリプトと同様です)、動的オーバーレイでは、chrome レジストリに XUL ファイルへの参照を追加することで挿入が行なわれます。 -</p><p>コードの可読性、保守性、拡張性を高めるために、オーバーレイを使って巨大な XUL ファイルをいくつかのファイルへ分割することができます、(ひとつのファイルがアプリケーションウィンドウ全体の構造を記述し、それ以外がウィンドウの特定の部分を実装する) 、動的オーバーレイは、変更したい XUL ファイル自体に変更を加えずに、その XUL ファイルを変更したのと同じ効果を得るためにも使われます、この機能は拡張機能をインストールするときに使われます、では、まず始めにファイルを静的オーバーレイにし、次にそれを動的オーバーレイにしていきましょう。 -</p><p>ファイルを静的オーバーレイにするには、<code>navigator.xul</code> と同じディレクトリに <code>tinderstatusOverlay.xul</code> というファイルを作り、<code>navigator.xul</code> に追加していたコードをすべてそこに移します。 -</p> -<pre class="eval"><?xml version="1.0"?> - -<?xml-stylesheet - href="<a class=" external">chrome://navigator/content/tinderstatus.css</a>" - type="text/css"?> - -<overlay id="tinderstatusOverlay" - xmlns="<span>http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"> - -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/tinderstatus.js</a>" /> - -<statusbar id="status-bar"> - <statusbarpanel class="statusbarpanel-iconic" - id="tinderbox-status" - insertbefore="offline-status" - status="none"/> -</statusbar> - -</overlay> -</pre> -<p><code>tinderstatusOverlay.xul</code> は、そのファイルが XML であることを示す XML 宣言から始まります (すべての XUL ファイルは XML 宣言を含む必要があります) 、次の行は、以前 <code>navigator.xul</code> に追加したスタイルシートへの参照です、次は XUL の <code><a href="ja/XUL/overlay">overlay</a></code> 要素です。この要素は XUL オーバーレイファイルのトップレベル要素で、これによりファイルがオーバーレイであることが分かります、その中身は前に <code>navigator.xul</code> に追加したスクリプトへの参照です、その次には <code><a href="ja/XUL/statusbarpanel">statusbarpanel</a></code> 要素を含む <code><a href="ja/XUL/statusbar">statusbar</a></code> 要素があります。 -</p><p>このオーバーレイの中の <code>statusbar</code> 要素の <code><a href="ja/XUL/Attribute/id">id</a></code> 属性の値は、<code>navigator.xul</code> の <code>statusbar</code> 要素の <code>id</code> 属性と同じです。<code>navigator.xul</code> がレンダリングされてブラウザの UI になるとき、オーバーレイファイルの <code>statusbar</code> 要素のすべての属性と子要素が UI の DOM に追加されます、これにより、オーバーレイファイルで定義した要素が、あたかも <code>navigator.xul</code> で定義されているかのような UI が表示されます、 -</p><p><code>statusbarpanel</code> 要素に属性 <code><a href="ja/XUL/Attribute/insertbefore">insertbefore</a></code> を追加したのに注意してください。この属性では、<code>statusbar</code> の中の、我々の要素の次に現れる <code>statusbarpanel</code> 要素を指定しています。これにより、我々の要素が <code>statusbar</code> の中でどの要素の前にくるかという、他の <code>statusbarpanel</code> に対する相対的な位置を指定することができます。 -</p><p><code>insertbefore</code> を省略すると、要素は <code>statusbar</code> の 最後に追加され、通常は resizer grippy <span style="color: darkgreen; background: #ef9;">【訳注: ウィンドウ右下の、ウィンドウのサイズを変えるのに使う部分】</span> の前に来るでしょう、また、<code>insertbefore</code> の代わりに <code><a href="ja/XUL/Attribute/insertafter">insertafter</a></code> を使えば、他の要素の後ろに要素を配置することもできます。 -</p><p>我々が <code>navigator.xul</code> に対して行った変更の代わりにこのオーバーレイを使うには、今までの変更を元に戻し、オーバーレイへの参照を <code>navigator.xul</code> の先頭に追加します、 -</p> -<pre class="eval">... - -<?xml-stylesheet href="<a class=" external">chrome://navigator/skin/</a>" type="text/css"?> -<span><?xml-stylesheet - href="<a class=" external">chrome://navigator/content/tinderstatus.css</a>" - type="text/css"?></span> - -<?xul-overlay href="<a class=" external">chrome://navigator/content/navigatorOverlay.xul</a>"?> -<?xul-overlay href="<a class=" external">chrome://navigator/content/navExtraOverlay.xul</a>"?> -<?xul-overlay href="<a class=" external">chrome://navigator/content/linkToolbarOverlay.xul</a>"?> -<span><?xul-overlay href="<a class=" external">chrome://navigator/content/tinderstatusOverlay.xul</a>"?></span> -<?xul-overlay href="<a class=" external">chrome://communicator/content/conten...extOverlay.xul</a>"?> -<?xul-overlay href="<a class=" external">chrome://communicator/content/sideba...barOverlay.xul</a>"?> -<?xul-overlay href="<a class=" external">chrome://communicator/content/communicatorOverlay.xul</a>"?> -<?xul-overlay href="<a class=" external">chrome://communicator/content/bookma...rksOverlay.xul</a>"?> - -... - -<!-- Navigator --> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/browser.js</a>"/> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/navigator.js</a>"/> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/navigatorDD.js</a>"/> -<script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/sessionHistoryUI.js</a>"/> - -<span><script type="application/x-javascript" - src="<a class=" external">chrome://navigator/content/tinderstatus.js</a>"/></span> - -<!-- hook for stringbundle overlays --> - -... - -<statusbar id="status-bar" class="chromeclass-status" - ondragdrop="nsDragAndDrop.drop(event, contentAreaDNDObserver);"> - <statusbarpanel id="component-bar"/> - <statusbarpanel id="statusbar-display" label="&statusText.label;" flex="1"/> - <statusbarpanel class="statusbarpanel-progress"> - <progressmeter class="progressmeter-statusbar" - id="statusbar-icon" mode="normal" value="0"/> - </statusbarpanel> - <span><statusbarpanel class="statusbarpanel-iconic" - id="tinderbox-status" status="none"/></span> - <statusbarpanel class="statusbarpanel-iconic" id="offline-status"/> - <statusbarpanel class="statusbarpanel-iconic" id="security-button" - onclick="BrowserPageInfo(null, 'securityTab')"/> -</statusbar> -... -</pre> -<p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/ja/docs/Creating_a_Mozilla_Extension:Enabling_the_behavior_-_updating_the_status_periodically" style="float: left;">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Making_it_into_a_dynamic_overlay_and_packaging_it_up_for_distribution">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/prerequisites/index.html b/files/ja/creating_a_mozilla_extension/prerequisites/index.html deleted file mode 100644 index 758c2ba0b0..0000000000 --- a/files/ja/creating_a_mozilla_extension/prerequisites/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: Prerequisites -slug: Creating_a_Mozilla_Extension/Prerequisites -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Prerequisites ---- -<p> -</p><p>このチュートリアルを修了するには、次に挙げるプログラムが必要です。 -</p> -<ul><li> インストール済み Mozilla -</li><li> 圧縮、展開ユーティリティ -</li><li> テキストエディタ -</li></ul> -<p>前提知識として、<a href="ja/HTML">HTML</a> のようなタグベースの言語に加え、基本的な <a href="ja/JavaScript">JavaScript</a>、<a href="ja/CSS">CSS</a>、<a href="ja/DOM">DOM</a> についても理解しているべきです。また、このチュートリアルの過程では Mozilla を何度もインストールすることになるので、インストーラを手元に置いておくと便利でしょう。 -</p><p>もし今すでに Mozilla を使っているのなら、このチュートリアルのデモ用の Mozilla を、今インストールされているのとは別の場所にもうひとつインストールするべきです。このチュートリアルでは、インストールした Mozilla を使えなくしてしまうかもしれない方法を紹介します。このチュートリアルで普段使っている Mozilla を変更しないでください！ -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Tinderbox">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/specifying_the_appearance/index.html b/files/ja/creating_a_mozilla_extension/specifying_the_appearance/index.html deleted file mode 100644 index dbd3dae45f..0000000000 --- a/files/ja/creating_a_mozilla_extension/specifying_the_appearance/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: Specifying the appearance -slug: Creating_a_Mozilla_Extension/Specifying_the_appearance -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Specifying_the_appearance ---- -<p> -</p><p>では、CSS を使って表示するアイコンを定義しましょう。まずは Tinderbox の状態 (none、success、test failed、and busted) を示すアイコンを作成し、Tinderbox の状態に対応するアイコンを表示する CSS のルールを作ります。 -</p> -<pre class="eval">statusbarpanel#tinderbox-status { - list-style-image: url("<a class=" external">chrome://navigator/content/tb-nostatus.png</a>"); -} - -statusbarpanel#tinderbox-status[status="success"] { - list-style-image: url("<a class=" external">chrome://navigator/content/tb-success.png</a>"); -} - -statusbarpanel#tinderbox-status[status="testfailed"] { - list-style-image: url("<a class=" external">chrome://navigator/content/tb-testfailed.png</a>"); -} - -statusbarpanel#tinderbox-status[status="busted"] { - list-style-image: url("<a class=" external">chrome://navigator/content/tb-busted.png</a>"); -} -</pre> -<p>Mozilla は外観を管理するスタイルシートの組み合わせを複数持つことができますが、それらの既存のスタイルシートの組み合わせすべてにいちいちルールを追加するのは面倒です (そして、新しいスタイルシートがインストールされた時にこの拡張機能が <span style="color: darkgreen; background: #ef9;">【訳注: 上書きされて？】</span> 壊れてしまうことも避けなければなりません)。そのために、このスタイルシートを <code>tinderstatus.css</code> という名前で <code>navigator.xul</code> と同じディレクトリに配置し、<code>navigator.xul</code> の先頭のグローバルスタイルシート参照のすぐ下で <code>tinderstatus.css</code> を参照するようにします。 -</p> -<pre class="eval"><?xml-stylesheet href="<a class=" external">chrome://navigator/skin/</a>" type="text/css"?> -<span><?xml-stylesheet - href="<a class=" external">chrome://navigator/content/tinderstatus.css</a>" - type="text/css"?></span> -</pre> -<p>我々のステータスパネル の <code>status</code> 属性に値が設定されたときに表示される画像を、CSS ルールの <code><a href="ja/CSS/list-style-image">list-style-image</a></code> プロパティを使って定義します。Tinderbox の状態ひとつごとに <code>id</code> 属性を定義し、ルールを作ります。 -</p><p>4 つの状態を示すアイコンを作るか、次のアイコンを使ってください。no status <img alt="Image:tb-nostatus.png">、success <img alt="Image:tb-success.png">、test failed <img alt="Image:tb-testfailed.png">、busted <img alt="Image:tb-busted.png"> -</p><p>もし今 Mozilla を再起動したら、「no status」アイコンが ブラウザのステータスバーに表示されているでしょう。<span style="color: darkgreen; background: #ef9;">【訳注: Mozilla を一旦終了した後、プロファイルディレクトリの XUL.mfl (Windows) XUL FastLoad File (Mac) もしくは XUL.mfasl (Unix) を削除する必要があるかもしれません】</span> -</p><p></p><div style="text-align: right;" class="prevnext"> - <p><a style="float: left;" href="/ja/docs/Creating_a_Mozilla_Extension:Adding_the_structure">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Enabling_the_behavior_-_retrieving_tinderbox_status">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> diff --git a/files/ja/creating_a_mozilla_extension/tinderbox/index.html b/files/ja/creating_a_mozilla_extension/tinderbox/index.html deleted file mode 100644 index caf0aa826b..0000000000 --- a/files/ja/creating_a_mozilla_extension/tinderbox/index.html +++ /dev/null @@ -1,18 +0,0 @@ ---- -title: Tinderbox -slug: Creating_a_Mozilla_Extension/Tinderbox -tags: - - Add-ons - - Extensions -translation_of: Archive/Mozilla/Creating_a_Mozilla_extension/Tinderbox ---- -<p> -</p><p><a class="external" href="http://tinderbox.mozilla.org/">Tinderbox</a> は Mozilla のソースコードの状態を追跡する Web ツールです。これは Mozilla のビルドとテストを連続して行い、結果をサーバに渡すクライアントマシンと、その結果を Web ページで見られるようにするサーバから構成されています。このツールによって、コンパイルや実行ができなくなるような (あるいは、妥協できるパフォーマンスやフットプリント <span style="color: darkgreen; background: #ef9;">【訳注: 割り当てられた後、解放されないメモリ領域の大きさのこと】</span> が得られなくなるような) コードへの変更はすぐに mozilla.org に通知され、問題を解決したり変更を元に戻したりしてもらうようにすることができます。 -</p><p>Mozilla エンジニアたちは、コードを変更する前に定期的に Tinderbox をチェックします。コードベースが壊れている間は、コードベースへの変更が禁止されているためです。Mozilla 保安官 (コードを監視し、破損箇所を修復してくれるエンジニアを探す交代制の役職) は、もっと定期的に Tinderbox をチェックしています。Tinderbox のページや Tinderbox サイドバーを開くのが難しいということはありませんが、Web ページを開く、サイドバーを切り替える、あるいはサイドバー自体を開くということすらなしに、Tinderbox がチェックできたら便利になるでしょう。 -</p><p>様々な Tinderbox クライアントマシンが様々な種類のビルド (各種のプラットフォーム向け) を行っていますが、ほとんどの人は、失敗したクライアントがないかどうかしか気にしません。まずビルドの失敗、次にテストの失敗をチェックすることで、失敗したクライアントがあるかどうかを確実にユーザに示すことができます。もしビルドに失敗しているクライアントがあれば、赤いアイコンを表示することにします。すべてのクライアントがビルドに成功していても、テストに失敗したクライアントがあれば、それを知らせるオレンジ色のアイコンを表示することにします。すべてのクライアントがビルドに成功し、テストにも成功したと報告した場合に限り、コードがすべて良好であることを知らせる緑色のアイコンを表示することにします。 -</p><p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/ja/docs/Creating_a_Mozilla_Extension:Prerequisites" style="float: left;">« 前のページ</a><a href="/ja/docs/Creating_a_Mozilla_Extension:Making_a_Mozilla_installation_modifiable">次のページ »</a></p> -</div> -<p></p> -<div class="noinclude"> -</div> |