$(function () {
	if (!$('#WikiaArticleComments').length) return;

	var buttonTexts = {
			toggleComment: {
				true: 'Hide Post', false: 'Show Post'
			},
			toggleUser: {
				true: 'Hide User', false: 'Show User'
			},
			toggleThread: {
				true: 'Hide Thread', false: 'Show Thread'
			}
	};

	if (skin == "monobook") {
		// Set container position to relative so that absolute positioning
		// works properly for the buttons in Monobook
		$('.speech-bubble-message').css('position', 'relative');
		
		// Monobook CSS
		$('head').append(
		'<style type="text/css">' +
		'.threadButton { ' +
			' display: none; float: none !important; position: absolute; top: -9px;' +
			' margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-size: 11px;' +
			' height: 16px; width: 75px; line-height: 15px; left: 15px; cursor: pointer;' +
		'}' +
		'.toggleUser {' +
			' left: 105px;' +
		'}' +
		'.toggleThread {' +
			' left: 195px;' +
		'}' +
		'.speech-bubble-message:hover .threadButton {' +
			' display: block;' +
		'}' +
			'.threadButton:hover {' +
			' display: block; width: 81px; height: 20px; top: -11px;'+
			' line-height: 19px; margin-left: -3px' +
		'}' +
		'</style>');
	} else {
		// Oasis CSS
		$('head').append(
		'<style type="text/css">' +
		'.threadButton { ' +
			' display: none; float: none !important; position: absolute; top: -5px;' +
			' margin: 0; padding: 0; font-size: 11px; height: 16px; width: 90px;' +
			' line-height: 15px;' +
		'}' +
		'.toggleUser {' +
			' left: 115px;' +
		'}' +
		'.toggleThread {' +
			' left: 215px;' +
		'}' +
		'.speech-bubble-message:hover .threadButton {' +
			' display: block;' +
		'}' +
			'.threadButton:hover {' +
		' display: block; width: 91px; height: 20px; top: -7px;'+
			' line-height: 19px; margin-left: -3px' +
		'}' +
		'</style>');
	}
	
	// Rewritten
	function createButton (className) {
		return '<button class="threadButton ' + className + ' wikia-button secondary" type="button">'
			+ buttonTexts[className][true] +
			'</button>';
	}
	
	// Rewritten
	$('.article-comm-text', '#article-comments-ul')
	.before(createButton('toggleComment') + createButton('toggleUser') + createButton('toggleThread'));

	$('.threadButton', '#article-comments-ul')
	.data({
		on: true,
	})
	.click(function () {
		var on = !$(this).data('on');
		$(this).data('on', on)
		.text(function () {
			for (var i in buttonTexts) {
				if ($(this).hasClass(i)) {
					return buttonTexts[i][on];
				}
			}
		})
		.trigger('toggle');
	});

	$('.toggleThread', '#article-comments-ul')
	.on('toggle', function () {
		console.log(
				($(this).data('on') ? 'showing' : 'hiding') + ' thread'
		);
	});

	$('.toggleUser', '#article-comments-ul')
	.on('toggle', function () {
		console.log(
				($(this).data('on') ? 'showing' : 'hiding') + ' user'
		);
	});

	$('.toggleComment', '#article-comments-ul')
	.on('toggle', function () {
		console.log(
				($(this).data('on') ? 'showing' : 'hiding') + ' post'
		);
	});
});