Chrome拡張機能で、ブラウザ最小化ボタンの挙動をカスタマイズする

2015年12月17日

先日以下のようなご相談がありました。

「Chrome拡張機能を使って、Chrome を最小化するときに、ある特定の処理を行いたい」

Chrome拡張機能というのは、Chrome ウェブストア からインストールできる Chrome 専用のアプリケーションのことです。

弊社では以前「Chrome拡張機能「クーポンチェッカー」」でご紹介した内容で開発を行ったことがあり、おそらくこの記事をご覧になってのご相談だったようです。

 

ご相談の内容


ご相談の内容は、主に2点ありました。

1.Chrome 最小化時に、本来の最小化を行わず、ウィンドウを特定のサイズ・位置に移動したい
2.Chrome 起動時に、Chrome のウィンドウを特定のサイズ・位置に表示したい

本記事では、これらの実現プログラム(JavaScript、Chrome API)について記載いたしますが、
Chrome 拡張機能に必要な実行環境(manifestファイルなど)、デバッグ方法、ウェブストアへの申請方法、などについては記載しません。

 

Chrome 最小化処理を横取りする


Chrome 拡張機能のバックグラウンド用 JavaScript ファイルに処理を記述します。

もし可能であれば、Chrome の各ウィンドウごと(というのは複数 Chrome が起動するケースもあるので)の「最小化した」というイベントをキャッチできればよいのですが、そこまで直接的なイベントは Chrome API には用意されていないようでした。

そこで、Chromeウィンドウの状態が変わったら(chrome.windows.onFocusChanged イベント)
すべての Chromeウィンドウのウィンドウの状態が最小化状態かどうかをチェックする、というように実現します。

var MIN_CHROME_TOP = 0;
var MIN_CHROME_LEFT = 0;
var MIN_CHROME_WIDTH = 400;
var MIN_CHROME_HEIGHT = 130;

chrome.windows.onFocusChanged.addListener(function(fwid){
	//console.log('onFocusChanged='+fwid);
	chrome.windows.getAll(function(windows){ ※1
		for(var w = 0; w<windows.length; w++){
			var window = windows[w];
			//console.log(window.state+" "+window.type+" "+window.focused+" "+window.top);
			if(window.state == "minimized"){
				chrome.windows.update(window.id, {
					top: MIN_CHROME_TOP, 
					left: MIN_CHROME_LEFT, 
					width: MIN_CHROME_WIDTH, 
					height: MIN_CHROME_HEIGHT, 
					state:"normal", 
					focused: true
				});
			}
		}
	});
});

※1 chrome.windows.onFocusChanged イベントでは、該当のウィンドウID(この例では fwid)が取得できるので
本来ならばそのウィンドウが最小化しているかどうかだけを調べればよいはずなのですが、ここではすべての Chrome ウィンドウの状態を調べるようにしています。

 

Chrome ウィンドウ起動時にウィンドウ位置、サイズを固定する


Chrome ウィンドウが起動するタイミングで発生するイベント(chrome.windows.onCreated イベント)で、ウィンドウの位置・サイズを変更するようにすれば容易に実現可能です。(※1)

ただ、デバッグ環境特有の問題なのか、なぜか Chrome ウィンドウを起動しても、chrome.windows.onCreated イベントが発生しないケースがありました。

このため、※2のように、chrome.windows.getCurrent で現在のウィンドウを取得する処理も追加しました。

var NEW_CHROME_TOP = 100;
var NEW_CHROME_LEFT = 100;
var NEW_CHROME_WIDTH = 800;
var NEW_CHROME_HEIGHT = 600;

chrome.windows.onCreated.addListener(function(win){ ※1
	show_initial_window(win.id);
});

setTimeout(function main(){
	chrome.windows.getCurrent(function(win){ ※2
		if ( win ){
			show_initial_window(win.id);
		} else {
			setTimeout(main, 10);
		}
	});
	
}, 10);

function show_initial_window(window_id){
	chrome.windows.update(window_id, { 
		top: NEW_CHROME_TOP, 
		left: NEW_CHROME_LEFT, 
		width: NEW_CHROME_WIDTH, 
		height: NEW_CHROME_HEIGHT, 
		focused: true,
		state: "normal" 
	}, function(){
		chrome.windows.update(window_id, { ※3
			focused: false,
			state: "normal"
		}, function(){
			chrome.windows.update(window_id, { 
				focused: true,
				state: "normal"
			});
		});
	});
}

※3 この部分では、一度ウィンドウの位置・サイズを指定のものに変更したあとに、Chromeウィンドウが取得したフォーカスを強制的に失わせて再取得しています。
なぜこんなことをしているか、といいますと、このように再取得させないと、初めての chrome.windows.onFocusChanged イベントが起動しないためです。

どうやら、Chrome ウィンドウの初回起動直後、Chrome API 内部的にはそのウィンドウには「フォーカスがない」状態になっているようです。フォーカスがない=別ウィンドウにフォーカスが移動しても、フォーカスが変更された(onFocusChanged)と認識されない、ということです。

そのため、わざわざフォーカスを失って再取得することで、内部的にも、そのウィンドウに「フォーカスがある」状態になるようにしています。

 

お問い合わせ

本記事(Chrome拡張機能で、ブラウザ最小化ボタンの挙動をカスタマイズする)にかかわること、 中小企業様さま向けの社内向け業務ウェブシステムにかかわることなど ご相談、ご質問などがありましたら何なりとお問い合わせください。





captcha

この記事の著者

イルカシステム(株) イルカシステム株式会社

イルカシステム(株)は、以下のような業務用ウェブシステムのご提案、受託開発、運用を行っております。

1.中小企業さま向けの社内向け業務ウェブシステム(営業支援、顧客管理、受注管理、請求入金管理、在庫管理、経営数値管理など)

2.医療業界向けの業務改善システム

※業務ウェブシステムの開発を効率化するための自社サービス「イルカベーカリー」をご提供しております。
※医療業界向けに、臨床研究の無作為割付自動化のための自社サービス「ムジンワリ」をご提供しております。

お問合せはお気軽に、こちらからどうぞ! → イルカシステム株式会社へ問合せ

著者:イルカシステム株式会社