/*
* HTML 要素のクリックで他の HTML 要素に Effect.toggle を適用する。
* 要 prototype.js

window.onload = function () {
	new toggoleEffectButton(["ShowButton", "Cancel"], "Dialog", "Appear");
}
*/


var toggoleEffectButton = Class.create();

toggoleEffectButton.prototype = {
	/*
	 _switches	: array of html elements
	 _target	: target html element
	 _effect	: Effect name
	 _option	: Effect option structure
	 _callback	: the functiono which is called before toggole.
	*/
	initialize : function(_switches, _target, _effect, _option, _callback) {
		this.target		= $(_target);
		this.effectName	= _effect;
		this.option		= _option || {};
		this.callback	= _callback || function(){ return true; };

		if (this.target)
			$A(_switches).each(this.bindOnClick.bindAsEventListener(this));
	},
	bindOnClick : function(_e) {
		if ($(_e))
			Event.observe($(_e), 'click', this["switch"].bindAsEventListener(this), false);
		return this;
	},
	"switch" : function(_event) {
		if (this.callback(this, _event)) // 他の object に bind されたとき用に自分自身を渡して、callback を呼ぶ
			Effect.toggle(this.target, this.effectName, this.option);
	}
};