// #require MooTools
// main
var fontChanger;
var styleSheets;

function getStyleSheets() {
	return (styleSheets = styleSheets || $$("link[rel*=style]"));
}

function setActiveStyleSheet(title) {
	if (fontChanger) {
		if (!fontChanger.titles.contains(title)) {
			title = fontChanger.defTtl;
		}
	}
	getStyleSheets().each(function (el, idx) {
		if (el.getAttribute("title")) {
			el.disabled = true;
			if (el.getAttribute("title") == title)	el.disabled = false;
		}
	});
	if (fontChanger)	fontChanger.setActiveButton(title);
	if (window.opera)	createCookie("style", title, 365);
}

function getActiveStyleSheet() {
	var els = getStyleSheets().filter(function (el, idx) {
		return (el.getAttribute("title") && !el.disabled);
	});
	return ((els && els.length > 0) ? els[0].getAttribute("title") : null);
}

function getPreferredStyleSheet() {
	var els = getStyleSheets().filter(function (el, idx) {
		return (el.getAttribute("title") && !el.getAttribute("rel").contains("alt"));
	});
	return ((els && els.length > 0) ? els[0].getAttribute("title") : null);
}

function createCookie(name, value, days) {
	var expires = "";
	if (days) {
		var date = new Date();
		date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
		expires = "; expires=" + date.toGMTString();
	}
	document.cookie = name + "=" + value + expires + "; path=/";
}

function readCookie(name) {
	var regexp = new RegExp('^ *' + name + '=(.+)$');
	var ca = document.cookie.split(';');
	for(var i = 0; i < ca.length; i++) {
		if (ca[i].match(regexp))	return RegExp.$1;
	}
	return null;
}

function readCookieOnWindowLoad(event) {
	var cookie = readCookie("fontsize");
	var title = cookie ? cookie : getPreferredStyleSheet();
	setActiveStyleSheet(title);
}
function createCookieOnWindowUnload(event) {
	var title = getActiveStyleSheet();
	createCookie("fontsize", title, 365);
}
window.addEvent(
	'load', readCookieOnWindowLoad
).addEvent(
	'unload', createCookieOnWindowUnload
);

// initialize
window.addEvent('domready', function () {
	readCookieOnWindowLoad();
	fontChanger = fontChanger || new (new Class ({
		initialize: function (titles, defTtl) {
			this.titles = titles || ['small','medium', 'large'];
			this.defTtl = defTtl || 'medium';
			var parent = $('header-top-inner');
			this.buttonImage = {
				'normal': {
					'small': "/common/images/button-fontsize-small.gif",
					'medium': "/common/images/button-fontsize-medium.gif",
					'regular': "/common/images/button-fontsize-regular.gif",
					'large': "/common/images/button-fontsize-large.gif"
				},
				'over': {
					'small': "/common/images/button-fontsize-small-on.gif",
					'medium': "/common/images/button-fontsize-medium-on.gif",
					'regular': "/common/images/button-fontsize-regular-on.gif",
					'large': "/common/images/button-fontsize-large-on.gif"
				},
				'active': {
					'small': "/common/images/button-fontsize-small-act.gif",
					'medium': "/common/images/button-fontsize-medium-act.gif",
					'regular': "/common/images/button-fontsize-regular-act.gif",
					'large': "/common/images/button-fontsize-large-act.gif"
				}
			};
			this.buttonStatus = {
				'small': 'normal',
				'medium': 'normal',
				'regular': 'normal',
				'large': 'normal'
			}
			this.buttonSize = {
				'small': { 'width': 23, 'height': 15 },
				'medium': { 'width': 27, 'height': 17 },
				'regular': { 'width': 33, 'height': 17 },
				'large': { 'width': 33, 'height': 21 }
			};
			this.buttonStatus[getActiveStyleSheet() || this.defTtl] = 'active';
			var div_box = new Element('div', {
				id: 'font-changer'
			});
			var p_caption = new Element('p', {
				'class': 'font-changer-caption',
				'text': '\u6587\u5b57\u30b5\u30a4\u30ba'
			});
			var alts = {
				'small':  '[\u5c0f]',
				'medium': '[\u4e2d]',
				'regular': '[\u6a19\u6e96]',
				'large':  '[\u5927]'
			};
			var obj = this;
			var buttons = $$(this.titles.map(function (title, idx) {
				return new Element('input', {
					id: 'button-font_changer-' + title,
					type: 'image',
					src: this.buttonImage[this.buttonStatus[title]][title],
					width: this.buttonSize[title].width,
					height: this.buttonSize[title].height,
					alt: alts[title]
				}).addEvent('click', function () {
					setActiveStyleSheet(title);
				}).addEvent('mouseenter', function () {
					if (obj.buttonStatus[title] != 'normal')	return;
					this.src = obj.buttonImage.over[title];
				}).addEvent('mouseleave', function () {
					this.src = obj.buttonImage[obj.buttonStatus[title]][title];
				});
			}, this));
			p_caption.inject(div_box);
			buttons.inject(div_box);
			div_box.inject(parent);
			this.buttons = buttons.associate(this.titles);
		},
		setActiveButton: function (title) {
			$each(this.buttons, function(button, idx) {
				var status = (
					(title == idx)
					  ? 'active'
					  : 'normal'
				);
				this.buttonStatus[idx] = status;
				this.buttons[idx].src = this.buttonImage[status][idx];
			}, this);
		}
	}))(['regular', 'large'], 'regular');
});
//readCookieOnWindowLoad();
