Merge pull request #242 from towards-a-new-leftypol/youtube_thumbs

Youtube thumbs

inc/instance-config.php

@@ -366,15 +366,18 @@ $config['additional_javascript'][] = 'js/download-original.js';
 
 $config['enable_embedding'] = true;
 
-$config['youtube_js_html'] = '<div class="video-container" data-video="$2">'.
-'<a href="https://youtu.be/$2" target="_blank" class="file">'.
-'https://youtu.be/$2'.
-'</a></div>';
+$config['youtube_js_html']
+    = '<div class="video-container" data-video="$2">'
+    . '<a href="https://youtu.be/$2" target="_blank" class="file">'
+    . '<img style="width:255px;height:190px;" src="/vi/$2/0.jpg" class="post-image"/>'
+    . '</a></div>';
 
 $config['embedding'] = array();
-$config['embedding'][0] = array(
-'/^https?:\/\/(\w+\.)?(?:youtube\.com\/watch\?v=|youtu\.be\/)([a-zA-Z0-9\-_]{10,11})(&.+)?$/i',
-$config['youtube_js_html']);
+$config['embedding'][0] =
+    array(
+        '/^https?:\/\/(\w+\.)?(?:youtube\.com\/watch\?v=|youtu\.be\/)([a-zA-Z0-9\-_]{10,11})(&.+)?$/i',
+        $config['youtube_js_html']
+    );
 $config['additional_javascript'][] = 'js/youtube.js';
 
 /*

js/youtube.js

@@ -29,16 +29,21 @@ onready(function(){
 
 	function addEmbedButton(index, videoNode) {
 		videoNode = $(videoNode);
+		var contents = videoNode.contents();
 		var videoId = videoNode.data('video');
 		var span = $("<span>[Embed]</span>");
 		var embedNode = $('<iframe style="float:left;margin: 10px 20px" type="text/html" '+
 				'width="360" height="270" src="//www.youtube.com/embed/' + videoId +
 				'?autoplay=1&html5=1" allowfullscreen frameborder="0"/>');
-		span.click(function() {
+		videoNode.click(function(e) {
+		    	e.preventDefault();
+
 			if (span.text() == ON){
+				videoNode.append(contents);
 				embedNode.remove();
 				span.text(OFF);
 			} else{
+				contents.detach();
 				videoNode.append(embedNode);
 				span.text(ON);
 			}

templates/themes/catalog/catalog.html

@@ -63,7 +63,7 @@
                                 <div class="thread grid-li grid-size-small">
                                         <a href="{{post.link}}">
 						{% if post.youtube %}
-							<img src="//img.youtube.com/vi/{{ post.youtube }}/0.jpg"
+							<img src="/vi/{{ post.youtube }}/0.jpg"
 						{% else %}
 							<img src="{{post.file}}"
 						{% endif %}