Hatena::Groupmoz-addon

Ci.nsIZIGOROu

2008-05-01謎は全て解けたが既にd:id:kazuhookuの通った道

Sidebarのtoggle対象にオレオレxulを指定する

| 19:54 |  Sidebarのtoggle対象にオレオレxulを指定する - Ci.nsIZIGOROu を含むブックマーク はてなブックマーク -  Sidebarのtoggle対象にオレオレxulを指定する - Ci.nsIZIGOROu

Firefoxサイドバーですが、toggleSidebar()と言う関数にて、切り替えを行う事が出来ます。

toggleSidebar('viewBookmarksSidebar');

この辺りの事は、Sidebar - Mozilla | MDNに詳しく書いています。

sidebar自体のwindowオブジェクトは簡単に取得出来て、

var sidebarWindow = document.getElementById("sidebar").contentWindow;

で取れます。sidebarWindow.location.href で実際の表示をオレオレxulに切り替える、、、で終了なんだけどここまではさっきのMDCのドキュメントに書いてある通り。

で、今回は何が言いたいかと言えば、toggleSidebar()の第一引数です。これなんだよwww

で早速ソース見てみよう。

toggleSidebar() のソースコード

function toggleSidebar(commandID, forceOpen) {

  var sidebarBox = document.getElementById("sidebar-box");
  if (!commandID)
    commandID = sidebarBox.getAttribute("sidebarcommand");

  var sidebarBroadcaster = document.getElementById(commandID);

broadcaster って何だろうと思ったら XUL TutorialBroadcasters and Observers で説明されている broadcaster要素でした。

broadecaster要素の説明はMDCに譲るとして、簡単にかいつまんで言えばxul属性値を保管する為の要素で、broadcaster要素をobserveすると、値をそのまま引き継ぐ事が出来たりします。

でtoggleSidebar()関数はこのbroadcaster要素のid名を第一引数に取り、対応するbroadcaster要素の属性値からSidebarタイトル変更したり、実際に表示するコンテンツURLを取得したりをやってるようです。*1

ちなみにこのtoggleSidebar()関数でtoggle出来るようにしたいならば、overlayで、

<broadcasterset id="mainBroadcasterSet">
  <broadcaster
    id="viewBookmarksSidebar"
    autoCheck="false" label="ブックマーク"
    type="checkbox"
    group="sidebar"
    sidebarurl="chrome://browser/content/bookmarks/bookmarksPanel.xul" oncommand="toggleSidebar('viewBookmarksSidebar');
  "/>
  <!-- 以下略 -->
</broadcasterset> 

のように指定する感じです。

なるほどねー。

*1:どうも純粋に値の保管用途で使っているみたいで、observers指定してないっぽぃ

LennaLenna2011/08/08 03:40This website makes tnhgis hella easy.

xndviznyuxndviznyu2011/08/09 03:55GQGzvz <a href="http://agjlmyyhirbd.com/">agjlmyyhirbd</a>

njydwgnjydwg2011/08/09 21:57DASY3e , [url=http://namibcrrpmuh.com/]namibcrrpmuh[/url], [link=http://msrwuvgwdgzr.com/]msrwuvgwdgzr[/link], http://tnzezkwwuxhh.com/

nepvnlitcgnepvnlitcg2011/08/11 00:50Migv43 <a href="http://yktlgtadiclc.com/">yktlgtadiclc</a>

ptfcidmkbuwptfcidmkbuw2011/08/15 01:26zu8N8N , [url=http://hdsuokliwwbx.com/]hdsuokliwwbx[/url], [link=http://oyhswchuwlmi.com/]oyhswchuwlmi[/link], http://ybiryyvqumxj.com/

2007-12-04

OSXでのprefwindowでapply, cancelボタンを出す

| 17:02 |  OSXでのprefwindowでapply, cancelボタンを出す - Ci.nsIZIGOROu を含むブックマーク はてなブックマーク -  OSXでのprefwindowでapply, cancelボタンを出す - Ci.nsIZIGOROu

アドオンの設定画面にprefwindowダイアログを使って書くと色々と簡単に済みます。

prefwindowってなんだよ

を参考に簡単に説明すると、通常nsIPrefServiceから目的の設定値のBranchを切り出したりしてやり取りする訳ですが、prefwindowを使ったときに使えるpreferenceを使うと、checkboxなどのフォーム要素のpreference属性と結びつける事によって、フォームの入力値を設定値に直接結びつける事が出来ます。

prefwindowをOSXで使ったときの話

dlgbuttons属性

prefwindowは概ねdialogと同じような構成になっているようなので、OK/キャンセルボタンがあると思いたいのですが、僕の手元のOSXだと出ませんでした。

Twitterにてぼやいてたらnorahさんが教えてくれました。

norah
@zigorou で、真面目な話ですが dlgbuttons 属性を手動設定してもだめ?
Twitter / norah: @zigorou で、真面目な話ですが dlgbutt...

おお、dlgbuttons属性って確かにprefwindowのドキュメントにあったなぁと思い出し、MDCを見る。

dlgbuttons
Same as the dialog element.
Preference System:prefwindow#Attributes

ちょwwww そりゃ幾らなんでも略し過ぎだろw

で、どうもdialogのbuttons属性と同じ設定方法みたい。

カンマ区切りで以下の設定値が使える。

  • accept
  • cancel
  • help
  • disclosure
  • extra1
  • extra2

ただこれを指定してみても解決しなかった。

設定値 browser.preferences.instantApply

今度はd:id:nanto_viさんに教えて貰った。

nanto_vi
@zigorou about:configのbrowser.preferences.instantApplyは無関係?
Twitter / TOYAMA Nao: @zigorou about:configのbrows...

ビンゴでした。

OSXではこれがtrueになっている為、そもそもOK/キャンセルの必要は無いと。

falseに設定したらちゃんと出て来ました。

OK/キャンセルボタンの有無

確かにprefwindowは便利なんだけど、この設定値に左右されるのは少し嫌だなと思います。

しかもopenDialog()で開いて、ウィンドウを閉じたい場合に多分Escで消すんだと思うんだけど、どういう状況下か分からないけど、閉じて開いての無限ループになった事がある。

やっぱりdialogで書くべきなんじゃないかなと。

2007-11-09xulむつかすぃー

flex属性を使ったレイアウト

| 15:37 |  flex属性を使ったレイアウト - Ci.nsIZIGOROu を含むブックマーク はてなブックマーク -  flex属性を使ったレイアウト - Ci.nsIZIGOROu

そもそも

なんかXULだとCSSでの値の指定、例えばemとか%とかautoが効かなかったり、*1独自のCSSプロパティがあったりとかで何かと難しい。

@zigorou XULは最低限使うだけにしてHTMLで組んじゃうのが賢い気がしてきました。その方が自由度高いし。パフォーマンスよくないだろうけどGUI部分でパフォーマンスが必要なことはあまりないし。Firebug wayってことで自信も出てきました。 Twitter / KUMAGAI⌘ku0522: @zigorou XULは最低限使うだけにしてHTML...

分かる分かる!w

でもまだ全然やってないからまだXULから逃げないぞ!

@zigorou XUL層にHTMLでOverlayかけると不具合起きるからおすすめできない。 Twitter / norah: @zigorou XUL層にHTMLでOverlayか...

ギャフン><

@zigorou XULでの大きさの指定はFlexで制御する方が確実かと。 *

むほ、flexってなんだろ。。。

miniturboの発言
あ、flex便利ですよー

と言う訳で調べてみたよ。

まずはサンプル

サンプル
http://sample.art-code.org/xul/flex.xul
実行結果
f:id:ZIGOROu:20071109153348p:image

flex属性とは

付けるとその数値を割合として画面一杯*2割り当てる属性で、整数値を指定するみたいです。

サンプルのソースと結果見れば一目瞭然ですな。

Example3を例にとれば下記のような感じ。

<hbox>
  <button label="Foo" flex="1" />
  <button label="Bar" flex="2" />
  <button label="Baz" flex="3" />
</hbox>

1:2:3で幅いっぱいに割り当ててくれる様が良く分かる。

XULはハマる人が多そうだから、激しく既出感が拭えませんが敢えて書いてみました。

誰かの参考になれば幸いでござる。

参考リンク

*1:この部分はまったく効かない訳じゃないので、訂正。

*2:正確には親要素のwidth or heightに対して

takenspctakenspc2007/11/09 18:39XUL でも CSS の width や height プロパティに em は使えますよ。

ZIGOROuZIGOROu2007/11/11 23:12width, heightは試してないかもです><
padding, margin辺りの挙動が怪しくないですかね?

2007-11-08最近の若い人たちは○×△

namespace付きのスタイルの挙動が謎くなかったw

| 16:10 |  namespace付きのスタイルの挙動が謎くなかったw - Ci.nsIZIGOROu を含むブックマーク はてなブックマーク -  namespace付きのスタイルの挙動が謎くなかったw - Ci.nsIZIGOROu

謎いママん。

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="data:text/css,
img#test1-icon {
  display: none
}
" type="text/css"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml">
<hbox>
  <vbox id="test1">
    <html:img id="test1-icon" src="http://moz-addon.g.hatena.ne.jp/images/b_entry_wh.gif" />
  </vbox>
  <vbox id="test2">
    <label control="test2-title" value="title"/>
    <description control="test2-title" value="desc"/>
  </vbox>
</hbox>
</window>

これ、正しくimg部分はdisplay: noneになるんですけど、正しくは、

@namespace html url("http://www.w3.org/1999/xhtml");

html¥:img#test1-icon {
  display: none;
}

だと思うんだけど、これだとどういう訳か動かない。

僕の解釈が間違ってる?

追記1 (2007-11-08T17:05:38+09:00)

d:id:cho45先生に教えて貰ったです。「|」かぁー。

って事で追試してみる。

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="data:text/css,
@namespace html url(http://www.w3.org/1999/xhtml);
html|img#test1-icon {
  display: none
}
" type="text/css"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml">
<hbox>
  <vbox id="test1">
    <html:img id="test1-icon" src="http://moz-addon.g.hatena.ne.jp/images/b_entry_wh.gif" />
  </vbox>
  <vbox id="test2">
    <label control="test2-title" value="title"/>
    <description control="test2-title" value="desc"/>
  </vbox>
</hbox>
</window>

だめぽ><

上手くいったお!d:id:cho45先生ありが㌧

cho45cho452007/11/08 16:18CSSでは : じゃなくて | (パイプ) で名前空間プリフィックスを指定するます。

html|img#test1-icon {
}

とかいうことでは、なくてでしょうか

ZIGOROuZIGOROu2007/11/08 17:02> id:cho45

おお、オイラの勘違いでしたか。
先生有りが豚。

cho45cho452007/11/08 17:10namespace のところのダブルクオーテーションを変えないとw

ZIGOROuZIGOROu2007/11/08 17:13あわわw
ほんとだ
鬱氏。

amachangamachang2007/11/08 17:34さすが、我らが cho45 先生だー!!

PepperPepper2011/08/07 05:34Thank God! Someone with bnaris speaks!

wqpelkswqpelks2011/08/08 01:22WA0THS , [url=http://gkzsyuamgblm.com/]gkzsyuamgblm[/url], [link=http://mwcximfdtiqh.com/]mwcximfdtiqh[/link], http://edwjdsjmwaow.com/