$(function () {

	var gridView = sf.gridView,
		mediaViewer = sf.mediaViewer;

	function addGridViewListeners() {
		gridView.on("mediaItemClicked", function (mediaItem, type) {
			km.trace("mediaItemClicked");
			//alert("mediaItemClicked");
			if (type === "playlist") {
				apiHandler.getPlaylist(mediaItem.id);
				mediaViewer.display(mediaItem);
			} else {
				mediaViewer.display(mediaItem);
			}
		});
		gridView.on("playlistItemClicked", function (playlistItemId) {
			mediaViewer.playItem(playlistItemId);
		});
	}

	function addMediaViewerListeners() {
		mediaViewer.on("leftClicked", function () {
			gridView.selectPrevItem();
		});
		mediaViewer.on("rightClicked", function () {
			gridView.selectNextItem();
		});
	}

	function addCompanyProfileListeners() {
		$(".show_credits").click(function (event) {
			var id = $(this).attr("id").replace("show_credits", "");
			$("#credits" + id).show("fast");
			$("#show_credits" + id).hide();
			$("#hide_credits" + id).show();
			if (event.preventDefault) {
				event.preventDefault();
			} else {
				return false;
			}
		});

		$(".hide_credits").click(function () {
			var id = $(this).attr("id").replace("hide_credits", "");
			$("#credits" + id).hide("fast");
			$("#show_credits" + id).show();
			$("#hide_credits" + id).hide();
			if (event.preventDefault) {
				event.preventDefault();
			} else {
				return false;
			}
		});
	}

	// attach the event listeners to each of the modules
	addGridViewListeners();
	addMediaViewerListeners();
	addCompanyProfileListeners();

	// initialize the modules we are using (if required)
	gridView.init();
	mediaViewer.init();

});