FFをもっと便利にする方法-ボタンを書く

前文



私はかなり前にIEでFFに切り替えました-これは私の主な作業ツールであるため、自分で完全に設定できる便利な開発およびデバッグツールを備えたブラウザが必要でした-ツールは便利なはずです。



そしてFFはその任務に完全に対処しました-誰かには奇妙に思えるかもしれませんが-追加してサイトを読んで、それらのための最高のセット、設定などを見つけるのに約2ヶ月費やしました

その結果、私は自分のニーズに合った強力で適切に調整されたプログラムを手に入れました。



画像



私はJSを知っているという事実にもかかわらず、1つの簡単な理由でffの下に拡張子を書くことは決してありませんでした-私はしたくない-それは既に拡張子の保管所にあった。 これは昨日まで続いた:)





昨日、私はこれについて考えました-作業中は常に切り替えて、現在のプロジェクトでApacheが回転しているlocalhostに移動する必要があり、プロジェクトの現在のリリースがインターネットに投稿されているアドレスに移動します-これは標準的な状況です。 解決するための多くのオプションがあります-あなたはマウスジェスチャーにこのことを掛けることができます(そして私はそれをやった方法)が、問題は私が同時に1つのプロジェクトではなく数十を実施していることです。



お気に入りを使用することができます...しかし、どういうわけか私はそこに仕事に関連していないものがたくさんあります...そこにフォルダもオプションがあります-しかし、どういうわけかそれが好きではありません。



検索...



そして、私はそれをすべて美しく便利に行う方法を探し始めました。

休憩を開始するために、特定の拡張機能を備えたサイトが見つかりませんでしたx_X少しショック状態でしたが、World Wide Webのレスラーが決して落胆しないので、ffで拡張機能を作成する瞬間がついに到着したことを理解し、常に進行中のエンジンに失敗しました-すなわち怠laz。



パッケージ化の方法、ローカライズ版のインストールおよび作成方法を理解することはまったく望みませんでしたが、解決策がすぐに見つかりました-多くのカスタムボタンプログラマがおそらく持っている素晴らしい拡張機能があり、 カスタムボタン2のさらに洗練されたバージョンがあります -複数のエンティティがあなたのニーズを等しく満たす場合は原則に基づいているため、最初のものを選択しました-最も単純なものを使用してください-はい、私は-あなたはあなたの原則に基づいて選択できます



その後、すべてがシンプルになります。これらの拡張機能は、ツールバーに独自のボタンを作成し、独自の機能を実装できるようにするバインディングです。 JSで記述され、内部FFオブジェクトによって拡張されます。



つまり 特に好奇心itive盛なhabralyudiはまだ登ってドキュメントを読む必要があります :)



ボタンを追加するアルゴリズムは簡単です: ツールバーを右クリック -> ボタンを追加し、必要なすべてのフィールドに入力してボタンを保存した後、 右クリックツールバーを使用して目的のツールバーに引き出す必要があります -> configure 、そしてボタンドラッグを見つける彼女を正しい場所に。



画像



フィールドに関して:

名前 -ボタンの名前

ピクチャは、ボタンになるピクチャへのパスです(パスを指定することでbase64を指定できます-ピクチャへのパスに対してdataURLが形成され、ピクチャはボタン自体に保存されます)



次のタブ

コード -クリックして実行されるコード

初期化 -ブラウザーのロード時に1回実行されるコード



それぞれ、FFのすべての力はあなたの手にあります。あなたは何でもできます:)

たとえば、お気に入りを呼び出すための別のボタンを作成するには、これを追加します。

コード:

if ( ! this .lastChild ) {

var mc = document .getElementById( "bookmarksMenuPopup" );

var mcc = mc.cloneNode( true );

this .appendChild( mcc );

}



var bo = document .getBoxObjectFor( this );

this .lastChild.showPopup ( this , -1, -1, "popup" , "bottomleft" , "topleft" );




* This source code was highlighted with Source Code Highlighter .








if ( ! this .lastChild ) {

var mc = document .getElementById( "bookmarksMenuPopup" );

var mcc = mc.cloneNode( true );

this .appendChild( mcc );

}



var bo = document .getBoxObjectFor( this );

this .lastChild.showPopup ( this , -1, -1, "popup" , "bottomleft" , "topleft" );




* This source code was highlighted with Source Code Highlighter .












初期化:

空です

ここでは、個別の初期化コードを使わずに、メインコードに詰めてチェックインしました。

当然、これは正しいはずです-最初のifの内容全体を初期化コードに書き直し、コードからifを削除することで分離できますが、それはそのようなものです:)



実際、ボタンの右ボタンをクリックすると、ボタンコードの編集、ボタンコードのコピーが可能なカスタムボタンメニューが表示されます-一般に、小さな拡張子を操作して変更し、左クリックするとコードを実行してお気に入りを開きます



画像



ボタンコードをコピーすると、他のFFにこのボタンを作成でき、ボタンのすべてのフィールドがそこに保存されます(もちろん、dataURLの場合は画像も)。



ここにある!



私の個人的な仕事に戻り、そのためのコードを書いている間、私はまだ小さな機能を持っていました:

  1. 特定のURLを開く機能
  2. 必要なアプリケーション(パスワードキーパーなど)をすばやく起動できるようにしたかった
  3. 任意のページで標準のJSコードを実行できると便利です(もちろん、FireBugで見ることができますが、ブックマークで実行するよりもダブルクリックする方が便利な場合があります)
  4. ある種のロボフォームがありますが、よりシンプルな機能を備えています。つまり、目的のURLを開き、特定のフィールドに特定の値を入力します


p.3-たとえば、ページ上のiframeまたはタイマーのリストなどを見るために使用します。 非常に頻繁にこれが私に起こります。



ポイント4-たとえば、フォームを含むページをデバッグする場合-フォームに記入して保存することはもちろんできます-どういうわけかFFフォームフィラーとの私の友情は成長していません:)-私はプロジェクトを終了しました-すべてが簡単です-レコードを削除してゴミはありません-すべてのフィールドはレコード自体に保存されます。 実現可能性について議論することもできますが、繰り返しますが、私にとっては便利でしょう。



ドックを読んで、拡張機能にインストールされたコードを見て、この種のものが生まれました(以前はそうではなかったので、コードの最適化に取り組みませんでした-コメントを喜んで受け入れます:)):

コード:

var bo = document.getBoxObjectFor( this );

this.lastChild.showPopup ( this, -1, -1, "popup", "bottomleft", "topleft" );









初期化:

var mitems = [

{

"label" : "localhost" ,

"tip" : "localhost" ,

"image" : "" ,

"type" : "url" ,

"val" : "localhost"

},



"separator" ,

{

"label" : "Google" ,

"tip" : "Google" ,

"image" : "" ,

"type" : "url" ,

"val" : "http://www.google.ru"

},

"separator" ,



{

"label" : "Notepad" ,

"tip" : "Notepad" ,

"image" : "" ,

"type" : "exec" ,

"val" : "c:/windows/notepad.exe"

},



"separator" ,



{

"label" : "other" ,

"tip" : "other" ,

"image" : "" ,

"type" : "submenu" ,

"val" :

[

{

"label" : "JS test" ,

"tip" : "JS test" ,

"image" : "" ,

"type" : "js" ,

"val" : "alert( 'js testing...' );"

},



{

"label" : " FF" ,

"tip" : " FF" ,

"image" : "" ,

"type" : "js" ,

"val" : "goQuitApplication();"

}

]

}

];



function createMenu( label, tip, image ) {

var m = document .createElement( "menu" );

m.setAttribute( "label" , label );

if ( image ) {

m.setAttribute( "class" , "menu-iconic" );

m.setAttribute( "image" , image );

}

if ( tip ) m.tooltipText = tip;



return m;

}



function createMenuItem( label, tip, image ) {

var mi = document .createElement( "menuitem" );

mi.setAttribute( "label" , label );

if ( image ) {

mi.setAttribute( "class" , "menuitem-iconic" ); // "menuitem-iconic bookmark-item"

mi.setAttribute( "image" , image );

}

if ( tip ) mi.tooltipText = tip;



return mi;

}



function executeFile( progPath, arg ) {

progPath = progPath.replace( /\ //gi, "\\" );

try {

var argArray = arg ? arg.split(/\s+/) : [];

var nsILocalFile = Components.classes[ "@mozilla.org/file/local;1" ].getService(Components.interfaces.nsILocalFile);

var nsIProcess = Components.classes[ "@mozilla.org/process/util;1" ].getService(Components.interfaces.nsIProcess);

nsILocalFile.initWithPath(progPath);

nsIProcess.init(nsILocalFile);

nsIProcess.run( false , argArray, argArray.length);

// nsIProcess.close();

return nsILocalFile;

}

catch ( ex ) {

alert( ex.toString() );

return null ;

}

}



function buildMenu( items ) {

var menu, i, t, mi, item;

var self = this ;



menu = document .createElement( "menupopup" );

menu.type = "menu" ;

menu.orient = "horizontal" ;

// menu.id = "myCustomMenu";



for ( i in items ) {

item = items[i];

if ( typeof ( item ) == "string" ) {

switch ( item ) {

case "separator" :

mi = document .createElement( "menuseparator" );

break ;



default :

mi = null ;

break ;

}

}

else {

switch ( item.type ) {

case "url" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = function () {

var b = getBrowser();

b.selectedTab = b.addTab( this .onclick.addr );

b.selectedTab.onload = function () {}

};

mi.onclick.addr = item.val;

break ;



case "urlForm" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = function () {

var item = this .onclick.item;

var b = getBrowser();

var tab = gBrowser.addTab( item.val.addr );

var newTabBrowser = b.getBrowserForTab( tab );

b.selectedTab = tab;

var lf = function ( event ) {

var fields = item.val.fields;

newTabBrowser.removeEventListener( 'load' , lf, true );

setTimeout(

function () {

var doc = newTabBrowser.contentDocument;

var inputs = doc.getElementsByTagName( "input" );

for ( var i in fields ) {

for ( var j = 0; j < inputs.length; j++ ) if ( inputs[j].name == i ) inputs[j].value = fields[i];

}

},

100

);

};

newTabBrowser.addEventListener( "load" , lf, true );

};

mi.onclick.item = item;

break ;



case "js" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = new Function( item.val );

break ;



case "submenu" :

mi = createMenu( item.label, item.tip, item.image );

mi.appendChild( buildMenu( item.val ) );

break ;



case "exec" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = new Function( "this.onclick.executeFile('" + item.val + "')" );

mi.onclick.executeFile = executeFile;

break ;



default :

mi = null ;

break ;

}

}



if ( mi ) menu.appendChild( mi );

}



return menu;

}



this .appendChild( buildMenu( mitems, false ) );




* This source code was highlighted with Source Code Highlighter .









var mitems = [

{

"label" : "localhost" ,

"tip" : "localhost" ,

"image" : "" ,

"type" : "url" ,

"val" : "localhost"

},



"separator" ,

{

"label" : "Google" ,

"tip" : "Google" ,

"image" : "" ,

"type" : "url" ,

"val" : "http://www.google.ru"

},

"separator" ,



{

"label" : "Notepad" ,

"tip" : "Notepad" ,

"image" : "" ,

"type" : "exec" ,

"val" : "c:/windows/notepad.exe"

},



"separator" ,



{

"label" : "other" ,

"tip" : "other" ,

"image" : "" ,

"type" : "submenu" ,

"val" :

[

{

"label" : "JS test" ,

"tip" : "JS test" ,

"image" : "" ,

"type" : "js" ,

"val" : "alert( 'js testing...' );"

},



{

"label" : " FF" ,

"tip" : " FF" ,

"image" : "" ,

"type" : "js" ,

"val" : "goQuitApplication();"

}

]

}

];



function createMenu( label, tip, image ) {

var m = document .createElement( "menu" );

m.setAttribute( "label" , label );

if ( image ) {

m.setAttribute( "class" , "menu-iconic" );

m.setAttribute( "image" , image );

}

if ( tip ) m.tooltipText = tip;



return m;

}



function createMenuItem( label, tip, image ) {

var mi = document .createElement( "menuitem" );

mi.setAttribute( "label" , label );

if ( image ) {

mi.setAttribute( "class" , "menuitem-iconic" ); // "menuitem-iconic bookmark-item"

mi.setAttribute( "image" , image );

}

if ( tip ) mi.tooltipText = tip;



return mi;

}



function executeFile( progPath, arg ) {

progPath = progPath.replace( /\ //gi, "\\" );

try {

var argArray = arg ? arg.split(/\s+/) : [];

var nsILocalFile = Components.classes[ "@mozilla.org/file/local;1" ].getService(Components.interfaces.nsILocalFile);

var nsIProcess = Components.classes[ "@mozilla.org/process/util;1" ].getService(Components.interfaces.nsIProcess);

nsILocalFile.initWithPath(progPath);

nsIProcess.init(nsILocalFile);

nsIProcess.run( false , argArray, argArray.length);

// nsIProcess.close();

return nsILocalFile;

}

catch ( ex ) {

alert( ex.toString() );

return null ;

}

}



function buildMenu( items ) {

var menu, i, t, mi, item;

var self = this ;



menu = document .createElement( "menupopup" );

menu.type = "menu" ;

menu.orient = "horizontal" ;

// menu.id = "myCustomMenu";



for ( i in items ) {

item = items[i];

if ( typeof ( item ) == "string" ) {

switch ( item ) {

case "separator" :

mi = document .createElement( "menuseparator" );

break ;



default :

mi = null ;

break ;

}

}

else {

switch ( item.type ) {

case "url" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = function () {

var b = getBrowser();

b.selectedTab = b.addTab( this .onclick.addr );

b.selectedTab.onload = function () {}

};

mi.onclick.addr = item.val;

break ;



case "urlForm" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = function () {

var item = this .onclick.item;

var b = getBrowser();

var tab = gBrowser.addTab( item.val.addr );

var newTabBrowser = b.getBrowserForTab( tab );

b.selectedTab = tab;

var lf = function ( event ) {

var fields = item.val.fields;

newTabBrowser.removeEventListener( 'load' , lf, true );

setTimeout(

function () {

var doc = newTabBrowser.contentDocument;

var inputs = doc.getElementsByTagName( "input" );

for ( var i in fields ) {

for ( var j = 0; j < inputs.length; j++ ) if ( inputs[j].name == i ) inputs[j].value = fields[i];

}

},

100

);

};

newTabBrowser.addEventListener( "load" , lf, true );

};

mi.onclick.item = item;

break ;



case "js" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = new Function( item.val );

break ;



case "submenu" :

mi = createMenu( item.label, item.tip, item.image );

mi.appendChild( buildMenu( item.val ) );

break ;



case "exec" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = new Function( "this.onclick.executeFile('" + item.val + "')" );

mi.onclick.executeFile = executeFile;

break ;



default :

mi = null ;

break ;

}

}



if ( mi ) menu.appendChild( mi );

}



return menu;

}



this .appendChild( buildMenu( mitems, false ) );




* This source code was highlighted with Source Code Highlighter .









var mitems = [

{

"label" : "localhost" ,

"tip" : "localhost" ,

"image" : "" ,

"type" : "url" ,

"val" : "localhost"

},



"separator" ,

{

"label" : "Google" ,

"tip" : "Google" ,

"image" : "" ,

"type" : "url" ,

"val" : "http://www.google.ru"

},

"separator" ,



{

"label" : "Notepad" ,

"tip" : "Notepad" ,

"image" : "" ,

"type" : "exec" ,

"val" : "c:/windows/notepad.exe"

},



"separator" ,



{

"label" : "other" ,

"tip" : "other" ,

"image" : "" ,

"type" : "submenu" ,

"val" :

[

{

"label" : "JS test" ,

"tip" : "JS test" ,

"image" : "" ,

"type" : "js" ,

"val" : "alert( 'js testing...' );"

},



{

"label" : " FF" ,

"tip" : " FF" ,

"image" : "" ,

"type" : "js" ,

"val" : "goQuitApplication();"

}

]

}

];



function createMenu( label, tip, image ) {

var m = document .createElement( "menu" );

m.setAttribute( "label" , label );

if ( image ) {

m.setAttribute( "class" , "menu-iconic" );

m.setAttribute( "image" , image );

}

if ( tip ) m.tooltipText = tip;



return m;

}



function createMenuItem( label, tip, image ) {

var mi = document .createElement( "menuitem" );

mi.setAttribute( "label" , label );

if ( image ) {

mi.setAttribute( "class" , "menuitem-iconic" ); // "menuitem-iconic bookmark-item"

mi.setAttribute( "image" , image );

}

if ( tip ) mi.tooltipText = tip;



return mi;

}



function executeFile( progPath, arg ) {

progPath = progPath.replace( /\ //gi, "\\" );

try {

var argArray = arg ? arg.split(/\s+/) : [];

var nsILocalFile = Components.classes[ "@mozilla.org/file/local;1" ].getService(Components.interfaces.nsILocalFile);

var nsIProcess = Components.classes[ "@mozilla.org/process/util;1" ].getService(Components.interfaces.nsIProcess);

nsILocalFile.initWithPath(progPath);

nsIProcess.init(nsILocalFile);

nsIProcess.run( false , argArray, argArray.length);

// nsIProcess.close();

return nsILocalFile;

}

catch ( ex ) {

alert( ex.toString() );

return null ;

}

}



function buildMenu( items ) {

var menu, i, t, mi, item;

var self = this ;



menu = document .createElement( "menupopup" );

menu.type = "menu" ;

menu.orient = "horizontal" ;

// menu.id = "myCustomMenu";



for ( i in items ) {

item = items[i];

if ( typeof ( item ) == "string" ) {

switch ( item ) {

case "separator" :

mi = document .createElement( "menuseparator" );

break ;



default :

mi = null ;

break ;

}

}

else {

switch ( item.type ) {

case "url" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = function () {

var b = getBrowser();

b.selectedTab = b.addTab( this .onclick.addr );

b.selectedTab.onload = function () {}

};

mi.onclick.addr = item.val;

break ;



case "urlForm" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = function () {

var item = this .onclick.item;

var b = getBrowser();

var tab = gBrowser.addTab( item.val.addr );

var newTabBrowser = b.getBrowserForTab( tab );

b.selectedTab = tab;

var lf = function ( event ) {

var fields = item.val.fields;

newTabBrowser.removeEventListener( 'load' , lf, true );

setTimeout(

function () {

var doc = newTabBrowser.contentDocument;

var inputs = doc.getElementsByTagName( "input" );

for ( var i in fields ) {

for ( var j = 0; j < inputs.length; j++ ) if ( inputs[j].name == i ) inputs[j].value = fields[i];

}

},

100

);

};

newTabBrowser.addEventListener( "load" , lf, true );

};

mi.onclick.item = item;

break ;



case "js" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = new Function( item.val );

break ;



case "submenu" :

mi = createMenu( item.label, item.tip, item.image );

mi.appendChild( buildMenu( item.val ) );

break ;



case "exec" :

mi = createMenuItem( item.label, item.tip, item.image );

mi.onclick = new Function( "this.onclick.executeFile('" + item.val + "')" );

mi.onclick.executeFile = executeFile;

break ;



default :

mi = null ;

break ;

}

}



if ( mi ) menu.appendChild( mi );

}



return menu;

}



this .appendChild( buildMenu( mitems, false ) );




* This source code was highlighted with Source Code Highlighter .














mitemsは、実際にはメニュー項目とメニュー自体の配列です

JSオブジェクト、フィールドによって設定:





画像



まあ、実際には拡張の準備ができているので、私は皆のために話をしませんが、それは私にとってより便利になりました。

そして、このような素晴らしいブラウザのユーザー数を少し増やしてほしいと思います(そして、何か良いこともあります-そして、そのための拡張開発者の数も:))



私の記事が誰かに役立つことを本当に願っています...



PS Full button code: こちら



All Articles