VideoJS: Upgrade and stuff

* Upgrade to the latest stable version 6.2.8
* Move JS files to blender-cloud
* Introducing Hotkeys support (a'la YouTube)
* Introducing Loop button (and a way to easily add new buttons)
* Minor style tweaks to work with the latest update

src/templates/nodes/custom/asset/video/view_embed.pug

@@ -51,23 +51,61 @@
 
 script(type="text/javascript").
 	{% if node.video_sources %}
-	videojs(document.getElementById('videoplayer'), {
-			controlBar: {
-				volumeMenuButton: {
-					inline: false,
-					vertical: true
-				}
-			},
-			loop: true,
-		},
-		function(){
-			this.ga({
-				'eventLabel' : '{{ node._id }} - {{ node.name }}',
-				'eventCategory' : '{{ node.project }}',
-				'eventsToTrack' : ['start', 'error', 'percentsPlayed']
-			});
+
+	var videoPlayer = document.getElementById('videoplayer');
+
+	var options = {
+		controlBar: {
+			volumePanel: { inline: false }
 		}
-	);
+	};
+
+	videojs.registerPlugin('analytics', function() {
+		this.ga({
+			'eventLabel' : '{{ node._id }} - {{ node.name }}',
+			'eventCategory' : '{{ node.project }}',
+			'eventsToTrack' : ['start', 'error', 'percentsPlayed']
+		});
+	});
+
+	videojs(videoPlayer, options).ready(function() {
+		this.hotkeys();
+	});
+
+	function addVideoPlayerButton(data) {
+
+		var controlBar,
+				newButton = document.createElement('button'),
+				buttonContent = document.createElement('span');
+
+		newButton.className = 'vjs-control vjs-button ' + data.class;
+		buttonContent.className = 'vjs-icon-placeholder';
+
+		newButton.appendChild(buttonContent);
+		controlBar = document.getElementsByClassName('vjs-control-bar')[0];
+		insertBeforeButton = document.getElementsByClassName('vjs-fullscreen-control')[0];
+		controlBar.insertBefore(newButton, insertBeforeButton);
+
+		return newButton;
+	}
+
+	var videoPlayerLoopButton = addVideoPlayerButton({
+		player: videoPlayer,
+		class: 'vjs-loop-button',
+		icon: "pi-replay"
+	});
+
+	videoPlayerLoopButton.onclick = function() {
+		if (videoPlayer.loop){
+			videoPlayer.loop = false;
+			$(this).removeClass('vjs-control-active');
+
+		} else {
+			videoPlayer.loop = true;
+			$(this).addClass('vjs-control-active');
+		}
+	};
+
 	{% endif %}
 
 	$(function(){