Merge pull request #1817 from MaxLeiter/videos

Support video file previews
thelounge · Dec 14, 2017 · 8b52825 · 8b52825
2 parents b67e7ee + d4ad60c
commit 8b52825
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 17 deletions.
diff --git a/client/views/msg_preview.tpl b/client/views/msg_preview.tpl
@@ -4,23 +4,29 @@
 		<a class="toggle-thumbnail" href="{{link}}" target="_blank" rel="noopener">
 			<img src="{{thumb}}">
 		</a>
-	{{else}}
-		{{#equal type "audio"}}
-			<audio controls preload="metadata">
-				<source src="{{link}}" type="{{res}}">
-				Your browser does not support the audio element.
-			</audio>
-		{{else}}
-			{{#if thumb}}
-				<a class="toggle-thumbnail" href="{{link}}" target="_blank" rel="noopener">
-					<img src="{{thumb}}" class="thumb">
-				</a>
-			{{/if}}
-			<a class="toggle-text" href="{{link}}" target="_blank" rel="noopener">
-				<div class="head" title="{{head}}">{{head}}</div>
-				<div class="body" title="{{body}}">{{body}}</div>
+	{{/equal}}
+	{{#equal type "audio"}}
+		<audio controls preload="metadata">
+			<source src="{{link}}" type="{{res}}">
+			Your browser does not support the audio element.
+		</audio>
+	{{/equal}}
+	{{#equal type "video"}}
+		<video width="320" height="240" preload="metadata" controls>
+			<source src="{{link}}" type="{{res}}">
+			Your browser does not support the video element.
+		</video>
+	{{/equal}}
+	{{#equal type "link"}}
+		{{#if thumb}}
+			<a class="toggle-thumbnail" href="{{link}}" target="_blank" rel="noopener">
+				<img src="{{thumb}}" class="thumb">
 			</a>
-		{{/equal}}
+		{{/if}}
+		<a class="toggle-text" href="{{link}}" target="_blank" rel="noopener">
+			<div class="head" title="{{head}}">{{head}}</div>
+			<div class="body" title="{{body}}">{{body}}</div>
+		</a>
 	{{/equal}}
 </div>
 {{/preview}}
diff --git a/src/plugins/irc-events/link.js b/src/plugins/irc-events/link.js
@@ -120,6 +120,18 @@ function parse(msg, preview, res, client) {
 		}
 		preview.type = "audio";
 		preview.res = res.type;
+
+		break;
+
+	case "video/webm":
+	case "video/ogg":
+	case "video/mp4":
+		if (!preview.link.startsWith("https://")) {
+			break;
+		}
+		preview.res = res.type;
+		preview.type = "video";
+
 		break;
 
 	default:
@@ -186,7 +198,7 @@ function fetch(uri, cb) {
 				if (contentLength > limit) {
 					req.abort();
 				}
-			} else if (/^audio\/.+/.test(res.headers["content-type"])) {
+			} else if (/^(audio|video)\/.+/.test(res.headers["content-type"])) {
 				req.abort(); // ensure server doesn't download the audio file
 			} else {
 				// if not image, limit download to 50kb, since we need only meta tags