jQuery(function ($) {
	var
		$body = $("body"),
		$content = $("#content"),
		classBlogEntryClone = "blog-entry-clone",
		classReadLess = "read-less",
		classReadMore = "read-more",
		selectorBlogBody = ".blogbody",
		selectorBlogEntry = ".blog-entry",
		selectorBlogEntryClone = "." + classBlogEntryClone,
		selectorCategory = ".cat-set",
		selectorCategoryHeader = ".cat-header",
		selectorEntryTitle = ".entrytitle",
		selectorGameIcon = ".blogbody a",
		selectorNewRating = ".new-rating",
		selectorRatingBar = ".rating_bar",
		selectorRatingText = ".rating_text",
		selectorReadLess = "." + classReadLess,
		selectorReadMore = "." + classReadMore;

	function blogEntryCloneClose($blogEntry, $clone, callback) {
		var
			durationFull = 500,
			durationStep0 = 200,
			durationStep1 = durationFull - durationStep0,
			styleEnd = {
				"left": $blogEntry.position().left,
				"width": $blogEntry.width()
			},
			styleEndBlogBody = {
				"height": 162
			},
			styleEndEntryTitle0 = {
				"marginLeft": 100
			},
			styleEndEntryTitle1 = {
				"marginLeft": 0
			},
			styleEndNewRating0 = {
				"left": 64
			},
			styleEndNewRating1 = {
				"bottom": 26
			},
			styleEndRatingBar0 = {
				"marginLeft": 65
			},
			styleEndRatingBar1 = {
				"top": 0
			},
			styleEndRatingText = {
				"top": 0
			},
			styleGameIcon = {
				"display": "block"
			},
			options = {
				complete: function () {
					callback($blogEntry, $clone);
				},
				duration: durationFull
			},
			optionsBlogBody = {
				duration: durationFull
			},
			optionsEntryTitle0 = {
				complete: animateRatingText,
				duration: durationStep0
			},
			optionsEntryTitle1 = {
				duration: durationStep1
			},
			optionsNewRating0 = {
				duration: durationStep0
			},
			optionsNewRating1 = {
				duration: durationStep1
			},
			optionsRatingBar0 = {
				duration: durationStep0
			},
			optionsRatingBar1 = {
				duration: durationStep1
			},
			optionsRatingText = {
				duration: durationStep1
			},
			$entryTitle = $(selectorEntryTitle, $clone),
			$ratingText = $(selectorRatingText, $clone);

		function animateRatingText() {
			$ratingText.animate(styleEndRatingText, optionsRatingText);
			$(selectorGameIcon, $clone).css(styleGameIcon);
		}

		$(selectorBlogBody, $clone).animate(styleEndBlogBody, optionsBlogBody);
		$entryTitle
			.animate(styleEndEntryTitle0, optionsEntryTitle0)
			.animate(styleEndEntryTitle1, optionsEntryTitle1);
		$(selectorNewRating, $clone)
			.animate(styleEndNewRating0, optionsNewRating0)
			.animate(styleEndNewRating1, optionsNewRating1);
		$(selectorRatingBar, $clone)
			.animate(styleEndRatingBar0, optionsRatingBar0)
			.animate(styleEndRatingBar1, optionsRatingBar1);
		$clone.animate(styleEnd, options);
	}

	function blogEntryCloneCreate($blogEntry) {
		var
			$clone = $blogEntry.clone(),
			data = {
				"$blogEntry": $blogEntry,
				"$clone": $clone
			};
		return $clone.find(selectorReadMore).bind("click", data, clickHandlerClone).end();
	}

	function blogEntryCloneDestroy($blogEntry, $clone) {
		$(selectorReadLess, $clone.remove()).unbind("click", clickHandlerClone);
	}

	function blogEntryCloneOpen($blogEntry, $clone) {
		var
			$category = $blogEntry.closest(selectorCategory),
			durationFull = 500,
			durationStep0 = 200,
			durationStep1 = durationFull - durationStep0,
			styleBlogBody = {
				"height": "auto",
				"position": "relative",
				"z-index": 4
			},
			styleEnd = {
				"left": 0,
				"width": $(selectorCategoryHeader, $category).width()
			},
			styleEndEntryTitle0 = {
				"marginLeft": 90
			},
			styleEndEntryTitle1 = {
				"marginLeft": 32
			},
			styleEndNewRating0 = {
				"bottom": 90
			}, 
			styleEndNewRating1 = {
				"left": 0
			}, 
			styleEndRatingBar0 = {
				"top": -64
			},
			styleEndRatingBar1 = {
				"marginLeft": 0
			},
			styleEndRatingText = {
				"top": -64
			},
			styleGameIcon = {
				"display": "inline"
			},
			options = {
				duration: durationFull
			},
			optionsEntryTitle0 = {
				complete: animateRating,
				duration: durationStep0
			},
			optionsEntryTitle1 = {
				duration: durationStep1
			},
			optionsNewRating0 = {
				duration: durationStep0
			},
			optionsNewRating1 = {
				duration: durationStep1
			},
			optionsRatingBar0 = {
				complete: animateEntryTitle1,
				duration: durationStep0
			},
			optionsRatingBar1 = {
				duration: durationStep1
			},
			optionsRatingText = {
				duration: durationStep0
			},
			$entryTitle = $(selectorEntryTitle, $clone);

		function animateRating() {
			$(selectorNewRating, $clone)
				.animate(styleEndNewRating0, optionsNewRating0)
				.animate(styleEndNewRating1, optionsNewRating1);
			$(selectorRatingBar, $clone)
				.animate(styleEndRatingBar0, optionsRatingBar0)
				.animate(styleEndRatingBar1, optionsRatingBar1);
			$(selectorRatingText, $clone).animate(styleEndRatingText, optionsRatingText);
		}

		function animateEntryTitle1() {
			$entryTitle.animate(styleEndEntryTitle1, optionsEntryTitle1);
			$(selectorGameIcon, $clone).css(styleGameIcon);
		}

		$(selectorBlogBody, $clone).css(styleBlogBody);
		$entryTitle.animate(styleEndEntryTitle0, optionsEntryTitle0);
		$clone.animate(styleEnd, options);
	}

	function blogEntryOpenReadMore($blogEntry) {
		var $clone = blogEntryCloneCreate($blogEntry);
		blogEntryPrepareCloneMarkup($blogEntry, $clone);
		blogEntryPrepareCloneStyle($blogEntry, $clone);

		blogEntryCloneOpen($blogEntry, $clone);
	}

	function blogEntryPrepareCloneMarkup($blogEntry, $clone) {
		$clone.addClass(classBlogEntryClone);
		$(selectorReadMore, $clone).removeClass(classReadMore).addClass(classReadLess).text("Close");
	}

	function blogEntryPrepareCloneStyle($blogEntry, $clone) {
		var
			$category = $blogEntry.closest(selectorCategory),
			blogEntryPosition = $blogEntry.position(),
			style = {
				"background-color": $content.css("background-color"),
				"left": blogEntryPosition.left,
				"position": "absolute",
				"top": blogEntryPosition.top,
				"z-index": 5
			}
			bodyStyle = {
				overflow: "auto"
			};

		$clone.css(style).prependTo($category);
		$(selectorBlogBody, $clone).css(bodyStyle);
	}

	function clickHandlerClone(e) {
		var
			$clone = e.data.$clone,
			$blogEntry = e.data.$blogEntry;

		e.preventDefault();
		blogEntryCloneClose($blogEntry, $clone, blogEntryCloneDestroy);
	}

	function clickHandlerReadMore(e) {
		if (!$(e.target).is(selectorReadMore)) {
			return true;
		}

		e.preventDefault();
		blogEntryOpenReadMore($(e.target).closest(selectorBlogEntry));
	}

	$body.bind("click", clickHandlerReadMore);
});