| {% block body %}

#node-container
	#node-overlay

	section.node-preview.video
		| {% if node.video_sources %}
		video#videoplayer.video-js.vjs-fluid(
			controls,
			data-setup="{}",
			preload="auto",
			poster="{% if node.picture %}{{ node.picture.thumbnail('l', api=api) }}{% endif %}")
			| {% for source in node.video_sources %}
			source(
				src="{{ source.src }}",
				type="{{ source.type }}")
			| {% endfor %}
			p.vjs-no-js.
				To view this video please enable JavaScript, and consider upgrading to a web browser that
				<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
		| {% else %}
		.video-dummy.sorry(
			style="{% if node.picture %}background-image: url({{ node.picture.thumbnail('l', api=api) }});{% endif %}")
			.video-dummy-content
				i.pi-lock.video-dummy-content-icon
				.video-dummy-content-text
					span Only available to Blender Cloud subscribers.
					a(href="{{ url_for('cloud.join') }}") Support Blender and get awesome stuff. <em>Subscribe now!</em>
		| {% endif %}


	section.node-details-container.video

		.node-details-header
			.node-title#node-title
				| {{node.name}}

		| {% if node.description %}
		.node-details-description#node-description
			| {{node.description}}
		| {% endif %}

		include ../../_node_details

		#comments-embed
			#comments-list-items-loading
				i.pi-spin

script(type="text/javascript").
	{% if node.video_sources %}
	videojs(document.getElementById('videoplayer'), {
			fluid: true,
			controlBar: {
				volumeMenuButton: {
					inline: false,
					vertical: true
				}
			},
			loop: true,
		},
		function(){
			this.ga({
				'eventLabel' : '{{ node._id }} - {{ node.name }}',
				'eventCategory' : '{{ node.project }}',
				'eventsToTrack' : ['start', 'error', 'percentsPlayed']
			});
		}
	);
	{% endif %}

	$(function(){
		// Generate GA pageview
		ga('send', 'pageview', location.pathname);

		var content_type = $("li.node-details-meta-list-item.type").text();
		$("li.node-details-meta-list-item.type").text(content_type.substring(content_type.indexOf("/") + 1));

		{% if not node.video_sources %}
		$('.sorry').click(function() {
			$.get('/403', function(data) {
				$('#node-overlay').html(data).addClass('active');
			})
		});
		{% endif %}
	});

include ../../_scripts

| {% endblock %}
