function getClientWidth() {
  return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth;
}

function getClientHeight() {
  return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientHeight:document.body.clientHeight;
}

$(function() {
	$('.js-video').live('click', function() {
		var id = $(this).attr('rel');
		loadVideo(id);
		document.location.hash = "translation"+id;
		
		return false;
	});

	var url = document.location + "";
	url = url.split("#translation");
	if (url[1]) {
		url = url[1] + "";
		url = url.split("|");

		loadVideo(parseInt(url[0].replace('translation', "")), parseInt(url[1]));
	}
	
	var videoPopup = $(".b-video-popup");
	
	$(".b-video-popup").draggable({ 
		handle: ".b-video-popup__top-bar, .b-video-popup__bottom-bar", 
		containment: "document"
	});
	$(".b-video-popup__content .l").resizable({
		handles: 'se',
		minHeight: $(".b-video-popup__content .l").height(),
		minWidth: 966
	});
	
	if ($.browser.msie)
	{
		$(".b-video-popup__content .l").resizable('option', 'resize', function(event, ui)
		{
			videoPopup.width(ui.size.width+14);
		});
	}
	
	
});

function loadVideo(translation_id, timestamp) {
	$('#overlay').show();
	$('#popup').show().css('top', $(window).scrollTop() + 100);
	
	$('#overlay, #close_popup').click(function() {
		TM_Player.closePlayer();
	});
	
	TM_Player.config.options.longterm_anchors = true;
	TM_Player.config.options.fetch_path = '/' + lang + "/tm";

	TM_Player.params.translation_id = translation_id;
	TM_Player.params.language = lang;
	
	if (typeof prefix != 'undefined' && prefix) {
		TM_Player.params.prefix = prefix;	
	}
	
	
	if (timestamp)
		TM_Player.params.timestamp = timestamp;

	if (debug)
		TM_Player.config.options.debug = true;

	var anchor ='<div class="time">{hour}:{minute}</div>' +
				'<div class="action" rel="#translation{translation_id}|{time}" onclick="TM_Player.anchors.select({id}, \'{time}\'); document.location.hash = this.getAttribute(\'rel\')">' +
					//'<a class="mp4" href="#"></a>' +
						'<p class="title">{name}</p>' +
						'<p>{author}</p>' +
						'<p>{description}</p>' +
					'{participiants}' +
				'</div>';
	
	TM_Player.config.options.anchor_content = anchor;
	
	TM_Player.callbacks.web.sessionStart = function(data) {
		$('#episodes').html('');
		$('#session_description').html('');
		$('#mp4_link').hide();
		
		$('#session_name').html(data.content.name);
		$('#session_time').html(data.content.time + ' ' + data.content.type);
		
		if (data.content.description)
			$('#session_description').html(data.content.description);
		
		if (data.content.mp4)
			$('#mp4_link').attr("href", data.content.mp4).show();
		
		$('#session_description').ready(function()
		{
			$(".b-video-popup__content .l").css({height: 'auto'}).resizable('option', 'minHeight', $(".b-video-popup__content .l").height());
			if ($.browser.msie)
			{
				//$(".b-video-popup").width(980);
			}
		});		
	};
	
	TM_Player.callbacks.web.sessionClose = function(data) {
		$('#overlay').hide();
		$('#popup').hide();
	};

	TM_Player.init();
}

