From de79f1994717f0abd26f344a0b6133ce69a53a1f Mon Sep 17 00:00:00 2001
From: Jarek Radosz <jradosz@gmail.com>
Date: Fri, 17 Jul 2020 23:31:01 +0200
Subject: [PATCH] Revert "UX: Style video elements, show descriptions (#10040)"
 (#10258)

This reverts commit 7d289a4f3e9531a0c7e458a52af85d0ae5affab9.

Now that 36bad0c31f6fb1afce2d311b72f5f9661be6af97 is in and we have video previews on all platforms, the commit that's being reverted is no longer needed. In the worst case scenario, the video description is clipped under the video poster if the video aspect ratio is other than 16:9. This commit removes descriptions and the custom style for the video elements.

# Conflicts:
#	app/assets/javascripts/pretty-text/addon/engines/discourse-markdown-it.js
#	test/javascripts/lib/pretty-text-test.js
---
 .../pretty-text/addon/engines/discourse-markdown-it.js   | 8 ++------
 app/assets/javascripts/pretty-text/addon/white-lister.js | 1 -
 app/assets/stylesheets/common/base/onebox.scss           | 9 ---------
 test/javascripts/lib/pretty-text-test.js                 | 2 --
 4 files changed, 2 insertions(+), 18 deletions(-)

diff --git a/app/assets/javascripts/pretty-text/addon/engines/discourse-markdown-it.js b/app/assets/javascripts/pretty-text/addon/engines/discourse-markdown-it.js
index 3454994cecb..1a5f50a6dea 100644
--- a/app/assets/javascripts/pretty-text/addon/engines/discourse-markdown-it.js
+++ b/app/assets/javascripts/pretty-text/addon/engines/discourse-markdown-it.js
@@ -141,12 +141,11 @@ export function extractDataAttribute(str) {
 
 // videoHTML and audioHTML follow the same HTML syntax
 // as oneboxer.rb when dealing with these formats
-function videoHTML(token, opts) {
+function videoHTML(token) {
   const src = token.attrGet("src");
   const origSrc = token.attrGet("data-orig-src");
   const dataOrigSrcAttr = origSrc !== null ? `data-orig-src="${origSrc}"` : "";
   return `<div class="video-container">
-    <p class="video-description">${opts.alt}</p>
     <video width="100%" height="100%" preload="metadata" controls>
       <source src="${src}" ${dataOrigSrcAttr}>
       <a href="${src}">${src}</a>
@@ -174,11 +173,8 @@ function renderImageOrPlayableMedia(tokens, idx, options, env, slf) {
   // markdown-it supports returning HTML instead of continuing to render the current token
   // see https://github.com/markdown-it/markdown-it/blob/master/docs/architecture.md#renderer
   // handles |video and |audio alt transformations for image tags
-  const mediaOpts = {
-    alt: split[0]
-  };
   if (split[1] === "video") {
-    return videoHTML(token, mediaOpts);
+    return videoHTML(token);
   } else if (split[1] === "audio") {
     return audioHTML(token);
   }
diff --git a/app/assets/javascripts/pretty-text/addon/white-lister.js b/app/assets/javascripts/pretty-text/addon/white-lister.js
index 15ae2ae2389..0d2ded7a4d2 100644
--- a/app/assets/javascripts/pretty-text/addon/white-lister.js
+++ b/app/assets/javascripts/pretty-text/addon/white-lister.js
@@ -185,7 +185,6 @@ export const DEFAULT_LIST = [
   "span.excerpt",
   "div.excerpt",
   "div.video-container",
-  "p.video-description",
   "span.hashtag",
   "span.mention",
   "strike",
diff --git a/app/assets/stylesheets/common/base/onebox.scss b/app/assets/stylesheets/common/base/onebox.scss
index 15da415d4e0..124da3ec4b6 100644
--- a/app/assets/stylesheets/common/base/onebox.scss
+++ b/app/assets/stylesheets/common/base/onebox.scss
@@ -703,9 +703,6 @@ aside.onebox.stackexchange .onebox-body {
 // Force oneboxed videos to 16:9 aspect ratio
 .onebox.video-onebox,
 .video-container {
-  background: $primary-very-low;
-  border: 1px solid $primary-low;
-  border-radius: 2px;
   position: relative;
   padding: 0 0 56.25% 0;
   width: 100%;
@@ -717,12 +714,6 @@ aside.onebox.stackexchange .onebox-body {
   }
 }
 
-.video-description {
-  color: $primary-medium;
-  margin: 1rem;
-  position: absolute;
-}
-
 .onebox-placeholder-container {
   position: relative;
   width: 100%;
diff --git a/test/javascripts/lib/pretty-text-test.js b/test/javascripts/lib/pretty-text-test.js
index 5ab98959f82..e02e8c7e630 100644
--- a/test/javascripts/lib/pretty-text-test.js
+++ b/test/javascripts/lib/pretty-text-test.js
@@ -1029,7 +1029,6 @@ QUnit.test("video", assert => {
   assert.cooked(
     "![baby shark|video](upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp4)",
     `<p><div class="video-container">
-    <p class="video-description">baby shark</p>
     <video width="100%" height="100%" preload="metadata" controls>
       <source src="/404" data-orig-src="upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp4">
       <a href="/404">/404</a>
@@ -1056,7 +1055,6 @@ QUnit.test("video - mapped url - secure media enabled", assert => {
       lookupUploadUrls: lookupUploadUrls
     },
     `<p><div class="video-container">
-    <p class="video-description">baby shark</p>
     <video width="100%" height="100%" preload="metadata" controls>
       <source src="/secure-media-uploads/original/3X/c/b/test.mp4">
       <a href="/secure-media-uploads/original/3X/c/b/test.mp4">/secure-media-uploads/original/3X/c/b/test.mp4</a>