// FontChanger
// REQUIRES: prototype.js, cookiemanager.js
FontChanger = Class.create();
FontChanger.prototype = {
	id: null,
	cookieManager: null,
	cookieName: 'body .style.fontSize',
	initialize: function(id) {
		this.id = id || 'fontChanger';
		this.cookieManager = new CookieManager();
		var fontSize = this.cookieManager.getCookie(this.cookieName);
		if (fontSize) document.body .style.fontSize = fontSize;
	},
	setCookieShelfLife: function(days) {
		this.cookieManager.cookieShelfLife = days;
	},
	change: function(fontSize) {
		document.body .style.fontSize = fontSize;
		this.cookieManager.setCookie(this.cookieName, fontSize);
	},
	reset: function() {
		document.body .style.fontSize = '';
		this.cookieManager.clearCookie(this.cookieName);
	},
	show: function() {
		var id = this.id;
		document.writeln([
'<dl id="fontsize">',
'<dt>フォントサイズ変更</dt>',
'<dd>',
'<ul>',
'<li><a href="#" id="' + id + '-large"><span>フォントサイズを拡大する</span></a></li>',
'<li><a href="#" id="' + id + '-medium"><span>フォントサイズを標準にする</span></a></li>',
'<li><a href="#" id="' + id + '-small"><span>フォントサイズを縮小する</span></a></li>',
'</ul></dd></dl>'
		].join("\n"));
		Event.observe($(id + '-small'), 'click', this.onClickSmall.bind(this));
		Event.observe($(id + '-medium'), 'click', this.onClickMedium.bind(this));
		Event.observe($(id + '-large'), 'click', this.onClickLarge.bind(this));
	},
	onClickSmall: function(e) { this.change('80%'); },
	onClickMedium: function(e) { this.change('90%'); },
	onClickLarge: function(e) { this.change('100%'); }
};
FontChanger.start = function(id) {
	var fontChanger = new FontChanger(id);
	fontChanger.setCookieShelfLife(90);
	fontChanger.show();
};