﻿var Graphittie = {};

Graphittie.Menu = Class.create({
	initialize: function() {
		this.selected = null;
	},
	
	run: function() {
		var menu = $('menu');
		this.contextual = menu.select('ul').first();
		this.contextual.toggleClassName('hidden');
		
		var selector = menu.select('p').first();
		selector.observe('click', this.toggle.bind(this))
		
		this.contextual.select('a').invoke('observe', 'focus', this.rollover.bind(this));
		
		this.contextual.observe('mouseout', function(event) {
			var target = event.relatedTarget || event.toElement;
			
			if (!!target && !target.descendantOf('menu')) {
				this.contextual.toggleClassName('hidden');
				
				if (this.selected)
					this.selected.removeClassName('selected');
			}
			
			event.stop();
		}.bind(this));
	},
	
	toggle: function(event) {
		if (this.contextual.hasClassName('visible'))
			this.contextual.toggleClassName('hidden');
		else
			this.contextual.toggleClassName('visible');
		
		event.stop();
	},
	
	rollover: function(event) {
		var item = $(event.element());
		
		if (this.selected)
			this.selected.removeClassName('selected');
		
		item.addClassName('selected');
		this.selected = item;
	}
});

Graphittie.Corrector = Class.create({
	run: function() {
		// for heading elements
		Graphittie.Corrector.processHeading($$('.dummy-title, .entry-title, h2, h3, h4, h5, h6'));
		
		// for search
		if (Prototype.Browser.WebKit)
			$$('#search input.text').first().removeClassName('search');
		
		$$('#search input[type=submit]').first().hide();
		
		$('search').observe('submit', function() {
			$('q').value = $F('q') + '+site:www.graphittie.org/blog/';
		});
		
		// for footnote
		if (navigator.userAgent.include('Windows') && $$('.footnote').length)
			$$('.footnote dl.commentArea')[0].setStyle({letterSpacing: '-1px'});
		
		// for entry date
		if (navigator.userAgent.include('Windows') && !Prototype.Browser.WebKit) {
			var date = $$('#layoutHead dl.info dd.date');
			
			if (!!date.length) {
				date = date[0];
				date.setStyle({fontSize: '11px', letterSpacing: '-1px'});
				date.update(date.innerHTML.replace(/(\/|:)/g, ' $1 '));
			}
		}
		
		if (navigator.userAgent.include('Windows') && $$('.comments form dl').length) {
			$$('.comments form button[type=submit]')[0].setStyle({letterSpacing: '-1px'});
			
			if (Prototype.Browser.IE6)
				$$('.comments form dl dd.secret')[0].setStyle({paddingTop: '2px'})
			else if (Prototype.Browser.IE7)
				$$('.comments form dl dd.secret')[0].setStyle({paddingTop: '1px'})
		}
		
		// code
		if (Prototype.Browser.WebKit && $$('#layoutBody .content code .syntaxhighlighter, #layoutBody .content p code').length) {
			$$('#layoutBody .content code .syntaxhighlighter, #layoutBody .content p code').each(function(item) {
				item.setStyle({fontSize: '1.28em'});
			});
		}
		
		// for opacity header
		if (Prototype.Browser.IE6) {
			var head = $$('#layoutHead .section')[0];

			head.setStyle({
				height: head.getHeight() - parseInt(head.getStyle('paddingTop')) - parseInt(head.getStyle('paddingBottom')) + 'px'
			});
		}
		
		$$('.tt-input-btn-comment span').each(function(item) {
			item.update('댓글을 등록합니다');
		});
		
		$$('.tt-input-option label').each(function(item) {
			item.update('비밀글로 등록');
			
			var contents = $$('.tt-input-content');
			
			$$('.tt-input-option').each(function(item, index) {
				Element.insert(contents[index], {before:item});
			});
		});
	}
});

Graphittie.Corrector.processHeading = function(targets) {
	if (!!targets) {
		targets.each(function(item) {
			var target = item;
			var hasA = false;

			if (item.down('a')) {
				target = item.down('a');
				hasA = true;
			}

			var html = target.innerHTML;

			if (hasA) {
				var temp = html.match(/^(.+)\((.+)\)$/);
				
				if (!!temp) {
					target.update(temp[2]);
					target.writeAttribute({'lang':'en', 'xml:lang':'em'});

					item.insert('<span class="translated">' + temp[1] + '</span>');
				}
			} else {
				target.update(html.replace(/^(.+)\((.+)\)$/, '<span lang="en" xml:lang="en">$2</span><span class="translated">$1</span>'));
			}
		});
	}
	
	$$('.translated').each(function(item) {
		item.update(item.innerHTML.replace(/^\(|\)$/g, ''));
	});
}

Graphittie.IconCaller = Class.create({
	initialize: function(targets) {
		this.preloaded = [];
		this.mirror = new Mirror();
	},
	
	run: function(targets) {
		targets.each(function(image) {
			var image = $(image);
			var holder = new Image();
			
			holder.onload = function() {
				var mirror = this.mirror.reflex(holder, image);
				var src = image.readAttribute('icon');

				if (this.preloaded[src]) {
					image.writeAttribute('src', src);

					if (mirror.type == 'canvas')
						mirror.alias.drawImage(temp, 0, -image.getHeight(), image.getWidth(), image.getHeight());
					else
						mirror.alias.setStyle('filter', this.mirror.filter(src));
				} else {
					var temp = new Image();

					temp.onload = function() {
						image.writeAttribute('src', src);
						if (mirror.type == 'canvas')
							mirror.alias.drawImage(temp, 0, -image.getHeight(), image.getWidth(), image.getHeight());
						else
							mirror.alias.setStyle('filter', this.mirror.filter(src));

						this.preloaded[src] = image;
					}.bind(this);

					temp.src = src;
				}
			}.bind(this);
			
			holder.src = image.readAttribute('src');
			
		}.bind(this));
	}
});

Graphittie.Comment = Class.create({
	run: function(comments) {
		$(document.body).observe('mouseover', this.handle.bind(this));
		$(document.body).observe('mouseout', this.handle.bind(this));
		
		if (comments.length) {
			comments.each(function(comment) {
				comment.select('.buttons a').invoke('addClassName', 'hidden');
			});
		}
	},
	
	handle: function(event) {
		var current = $(event.element());
		
		switch (event.type.toLowerCase()) {
		case 'mouseover':
			if (current.match('li.comment') || current.up('li.comment'))
				this.showCommands(current.match('li.comment') ? current : current.up('li.comment'));
			
			break;
		case 'mouseout':
			if (current.match('li.comment') || current.up('li.comment'))
				this.hideCommands(current.match('li.comment') ? current : current.up('li.comment'));
			
			break;
		}
	},
	
	showCommands: function(element) {
		var links = element.select('.buttons a');
		links.invoke('removeClassName', 'hidden');
		links.invoke('addClassName', 'visible');
	},

	hideCommands: function(element) {
		var links = element.select('.buttons a');
		links.invoke('removeClassName', 'visible');
		links.invoke('addClassName', 'hidden');
	}
});

var Mirror = Class.create({
	initialize: function() {
		this.template = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="%s", sizingMethod="scale"); progid:DXImageTransform.Microsoft.BasicImage(mirror=1, rotation=2);';
	},
	
	reflex: function(holder, image) {
		var width = 32;
		var height = 32;
		var type = 'canvas';
		var alias = canvas = new Element('canvas');
		
		if (canvas.getContext) {
			canvas.writeAttribute('width', width);
			canvas.writeAttribute('height', height);
			$(image.parentNode).insert(canvas);
			
			var ctx = canvas.getContext('2d');
			ctx.scale(1, -1);
			ctx.drawImage(holder, 0, -height, width, height);
			
			alias = ctx;
		} else {
			type = 'filter';
			canvas = new Element('span').addClassName('canvas');
			canvas.setStyle({
				filter: this.filter(holder.src),
				width: width + 'px',
				height: height + 'px'
			});
		}
		
		var overlay = new Element('span');
		overlay.addClassName('overlay');
		$(image.parentNode).insert(overlay);
		
		$(image.parentNode).insert(canvas);
		
		return {type:type, alias:alias};
	},
	
	filter: function(src) {
		return this.template.replace('%s', src);
	}
});

var objMenu = new Graphittie.Menu();
objMenu.run();

var objCorrector = new Graphittie.Corrector();
objCorrector.run();

var objComment = new Graphittie.Comment();
objComment.run($$('.comments li.comment'));

var objIconCaller = new Graphittie.IconCaller();
objIconCaller.run($$('.comments ol li img'));
