From 32694f5a1dfa1e2d1fbafe5a58ca93d08355f571 Mon Sep 17 00:00:00 2001
From: undefined <i@undefined.moe>
Date: Mon, 13 Sep 2021 22:57:33 +0800
Subject: [PATCH] ui: limit video tag usage (#199)

---
 .../backendlib/markdown-it-media.js           | 23 ++++++++++++++++---
 packages/ui-default/package.json              |  2 +-
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/packages/ui-default/backendlib/markdown-it-media.js b/packages/ui-default/backendlib/markdown-it-media.js
index ba77ce744..5126b28f2 100644
--- a/packages/ui-default/backendlib/markdown-it-media.js
+++ b/packages/ui-default/backendlib/markdown-it-media.js
@@ -1,6 +1,7 @@
 /* eslint-disable max-len */
 /* eslint-disable prefer-destructuring */
 
+const { randomUUID } = require('crypto');
 const { escapeHtml } = require('vj/../../node_modules/markdown-it/lib/common/utils');
 
 /* eslint-disable no-restricted-properties */
@@ -118,9 +119,25 @@ module.exports = function videoPlugin(md) {
         + `render?url=https://osf.io/${videoID}/?action=download%26mode=render");`
         + '    }); </script>';
     }
-    if (service === 'pdf') return `<iframe src="${videoID}?noDisposition=on#view=fit" width="100%" style="min-height: 100vh;border: none;"></iframe>`;
-    if (options[service]) {
-      return `<div class="embed-responsive embed-responsive-16by9"><iframe class="embed-responsive-item ${service}-player" type="text/html" width="${options[service].width || 640
+    if (service === 'pdf') {
+      return `\
+        <object classid="clsid:${randomUUID().toUpperCase()}">
+          <param name="SRC" value="${videoID}" >
+          <embed width="100%" style="min-height: 100vh;border: none;" fullscreen="yes" src="${videoID}">
+            <noembed></noembed>
+          </embed>
+        </object>`;
+    }
+    if (['url', 'video'].includes(service)) {
+      return `\
+        <video width="100%" controls>
+          <source src="${videoID}" type="${videoID.endsWith('ogg') ? 'video/ogg' : 'video/mp4'}">
+          Your browser doesn't support video tag.
+        </video>`;
+    }
+    if (options[service]?.width) {
+      return `<div class="embed-responsive embed-responsive-16by9">
+      <iframe class="embed-responsive-item ${service}-player" type="text/html" width="${options[service].width || 640
         }" height="${options[service].height || 390
         }" src="${options.url(service, videoID, tokens[idx].url, options)
         }" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>`;
diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json
index 871e1b849..fa4cec8f9 100644
--- a/packages/ui-default/package.json
+++ b/packages/ui-default/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.20.2",
+  "version": "4.20.3",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",