From e2fad3fe0570d4514e55a5dd15028160aa191ad2 Mon Sep 17 00:00:00 2001
From: Mikael Nordfeldth <mmn@hethane.se>
Date: Wed, 25 Feb 2015 02:11:32 +0100
Subject: [PATCH] Add HTML5 video support

Requires the underlying GNU social instance to have the VideoThumbnails
plugin and (for that) 'libav-tools' (with 'avconv') installed. Support
for ffmpeg or maybe mplayer as a fallback is considered but not planned.

If the underlying instance does _not_ support video thumbnailing there
will simply be none to fetch and none will be listed.

One bug remains and that is when the video is clicked (on the play button)
the notice closes again. I am not sure how to abort that properly.
---
 css/qvitter.css     |  3 ++-
 js/dom-functions.js | 18 +++++++++++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/css/qvitter.css b/css/qvitter.css
index a2a3386..53bd3ed 100644
--- a/css/qvitter.css
+++ b/css/qvitter.css
@@ -2189,7 +2189,8 @@ ul.queet-actions li .icon.is-mine:before {
 .stream-item .media {
 	margin-top:10px;
 	}
-.stream-item .media img {
+.stream-item .media img,
+.stream-item .media video {
     max-width: 500px;
 	}
 
diff --git a/js/dom-functions.js b/js/dom-functions.js
index 88518b2..0b2bf79 100644
--- a/js/dom-functions.js
+++ b/js/dom-functions.js
@@ -969,9 +969,25 @@ function expand_queet(q,doScrolling) {
 							else {
 								q.children('.queet').find('.expanded-content').prepend('<div class="media"><a href="' + attachment_title + '" target="_blank"><img src="' + attachment_src + '" /></a></div>');								
 								}
-							}
 						}
+					}
 					// videos
+					else if($.inArray(attachment_mimetype, ['video/mp4', 'video/ogg', 'video/quicktime', 'video/webm']) >= 0) {
+						if(q.children('.queet').find('.expanded-content').children('.media').children('a[href="' + attachment_title + '"]').length < 1) { // not if already showed
+
+							// local attachment with a thumbnail
+							if(typeof $(this).find('img').attr('data-big-thumbnail') != 'undefined') {
+								var attachment_poster = $(this).find('img').attr('data-big-thumbnail');
+								}
+
+							if(q.children('.queet').find('.expanded-content').children('.media').length > 0) {
+								q.children('.queet').find('.media').last().after('<div class="media"><video class="u-video" controls="controls" poster="' + attachment_poster + '"><source type="' + attachment_mimetype + '" src="' + attachment_title + '" /></video></div>');
+								}
+							else {
+								q.children('.queet').find('.expanded-content').prepend('<div class="media"><video class="u-video" controls="controls" poster="' + attachment_poster + '"><source type="' + attachment_mimetype + '" src="' + attachment_title + '" /></video></div>');								
+								}
+						}
+					}
 					else if(attachment_title.indexOf('youtube.com/watch?v=') > -1 || attachment_title.indexOf('://youtu.be/') > -1) {
 						var youtubeId = attachment_title.replace('http://www.youtube.com/watch?v=','').replace('https://www.youtube.com/watch?v=','').replace('http://youtu.be/','').replace('https://youtu.be/','').substr(0,11);
 						if(q.children('.queet').find('.expanded-content').children('.media').children('iframe').attr('src') != '//www.youtube.com/embed/' + youtubeId) { // not if already showed