The bad news is you have to be the maintainer of said site first *but you can join me in trying to convince them to do so*.
I would like to see this in [hive.blog](https://hive.blog/videos/@leprechaun/embedding-videos-in-posts), [peakd](https://peakd.com/videos/@leprechaun/embedding-videos-in-posts), [ecency](https://ecency.com/videos/@leprechaun/embedding-videos-in-posts).
For a limited time only see it at [http://test.steemfiles.com](http://test.steemfiles.com:8080//videos/@leprechaun/embedding-videos-in-posts).
Over [here](/videos/@leprechaun/embedding-videos-in-posts) I made a test page where I put URL for several video sites and tried to convince you guys that we ought to support more video platforms. Embed from Bitchute, Brightreon and Banned.Video. Let's show them what we think of the censorship, by making sure we add the first they banned.
Below is a patch that allows this. I had it running on my cheap VPS and it seems to actually work. :)
Who is curating hive.blog's source code? There are so many forks of steemit's source code. Is it @roelandp? Always was an active coder? Was it @roadscape? @netuso?
```
diff --git a/src/app/components/cards/MarkdownViewer.jsx b/src/app/components/cards/MarkdownViewer.jsx
index dda1913..dad8169 100644
--- a/src/app/components/cards/MarkdownViewer.jsx
+++ b/src/app/components/cards/MarkdownViewer.jsx
@@ -139,7 +139,7 @@ class MarkdownViewer extends Component {
// HtmlReady inserts
for (let section of cleanText.split('
const match = section.match(
- /^([A-Za-z0-9\?\=\_\-\/\.]+) (youtube|vimeo|twitch|dtube|threespeak)\s?(\d+)? ~~~/
+ /^([A-Za-z0-9\?\=\_\-\/\.]+) (youtube|vimeo|twitch|dtube|threespeak|bannedvideo|bitchute|brightreon|lbry|rumble|thedailymotion|ultimedia)\s?(\d+)? ~~~/
);
if (match && match.length >= 3) {
const id = match[1];
@@ -148,7 +148,49 @@ class MarkdownViewer extends Component {
const w = large ? 640 : 480,
h = large ? 360 : 270;
- if (type === 'youtube') {
+ if (type === 'bannedvideo') {
+ sections.push(
+ <div>
+ <div className="ifw-player" data-video-id={id} />
+ <script
+ src="https://infowarsmedia.com/js/player.js"
+ async="async"
+ />
+ </div>
+ );
+ } else if (type === 'bitchute') {
+ const url = `https://www.bitchute.com/embed/${id}`;
+ sections.push(
+ <div className="videoWrapper" key={id}>
+ <iframe
+ src={url}
+ width={w}
+ height={h}
+ frameBorder="0"
+ webkitallowfullscreen="true"
+ mozallowfullscreen="true"
+ allowFullScreen
+ title={`Bitchute video ${id}`}
+ />
+ </div>
+ );
+ } else if (type === 'brightreon') {
+ const url = `https://www.brighteon.com/embed/${id}`;
+ sections.push(
+ <div className="videoWrapper" key={id}>
+ <iframe
+ src={url}
+ width={w}
+ height={h}
+ frameBorder="0"
+ webkitallowfullscreen="true"
+ mozallowfullscreen="true"
+ allowFullScreen
+ title={`Brightreon video ${id}`}
+ />
+ </div>
+ );
+ } else if (type === 'youtube') {
sections.push(
<YoutubePreview
key={id}
diff --git a/src/app/utils/Links.js b/src/app/utils/Links.js
index 1642557..3198d05 100644
--- a/src/app/utils/Links.js
+++ b/src/app/utils/Links.js
@@ -30,6 +30,9 @@ export const remote = (flags = 'i') =>
);
export const youTube = (flags = 'i') =>
new RegExp(urlSet({ domain: '(?:(?:.*.)?youtube.com|youtu.be)' }), flags);
+export const bannedVideo =(flags = 'i') =>
+ new RegExp(urlSet({ domain: '(?:(?:.*.)?(electionnight.news|2020electioncenter.com|banned.video))' }), flags);
+
export const image = (flags = 'i') =>
new RegExp(urlSet({ path: imagePath }), flags);
export const imageFile = (flags = 'i') => new RegExp(imagePath, flags);
@@ -38,21 +41,29 @@ export const imageFile = (flags = 'i') => new RegExp(imagePath, flags);
export default {
any: any(),
- local: local(),
- remote: remote(),
+ bannedVideo: /(https?:\/\/(?:2020electioncenter.com|electionnight.news)\/watch\?id=([0-9a-f]+))/,
+ bannedVideoId: /https?:\/\/(?:2020electioncenter.com|electionnight.news)\/watch\?id=([0-9a-f]+)/,
+ bitchute: /\b(https?:\/\/www.bitchute.com\/video\/([A-Za-z0-9]+)\/?)/,
+ brightreon: /\b(https?:\/\/www.brighteon.com\/([0-9a-f-]+)\/?)/,
+ dtube: /https:\/\/(?:emb\.)?(?:d.tube\/\#\!\/(?:v\/)?)([a-zA-Z0-9\-\.\/]*)/,
+ dtubeId: /(?:d\.tube\/#!\/(?:v\/)?([a-zA-Z0-9\-\.\/]*))+/,
image: image(),
imageFile: imageFile(),
- youTube: youTube(),
- youTubeId: /(?:(?:youtube.com\/watch\?v=)|(?:youtu.be\/)|(?:youtube.com\/embed\/))([A-Za-z0-9\_\-]+)/i,
- vimeo: /https?:\/\/(?:vimeo.com\/|player.vimeo.com\/video\/)([0-9]+)\/?(#t=((\d+)s?))?\/?/,
- vimeoId: /(?:vimeo.com\/|player.vimeo.com\/video\/)([0-9]+)/,
- // simpleLink: new RegExp(`<a href="(.*)">(.*)<\/a>`, 'ig'),
ipfsPrefix: /(https?:\/\/.*)?\/ipfs/i,
- twitch: /https?:\/\/(?:www.)?twitch.tv\/(?:(videos)\/)?([a-zA-Z0-9][\w]{3,24})/i,
- dtube: /https:\/\/(?:emb\.)?(?:d.tube\/\#\!\/(?:v\/)?)([a-zA-Z0-9\-\.\/]*)/,
- dtubeId: /(?:d\.tube\/#!\/(?:v\/)?([a-zA-Z0-9\-\.\/]*))+/,
+ lbry: /https?:\/\/lbry.tv\/\$\/embed\/([/?a-z0-9@:=-]+)/,
+ local: local(),
+ remote: remote(),
+ rumble: /https?:\/\/rumble.com\/embed\/([a-z0-9]+)(\/\?.*)/,
+ // simpleLink: new RegExp(`<a href="(.*)">(.*)<\/a>`, 'ig'),
threespeak: /(?:https?:\/\/(?:(?:3speak.online\/watch\?v=)|(?:3speak.online\/embed\?v=)))([A-Za-z0-9\_\-\/]+)(&.*)?/i,
threespeakImageLink: /<a href="(https?:\/\/3speak.online\/watch\?v=([A-Za-z0-9\_\-\/]+))".*<img.*?><\/a>/i,
+ theDailyMotion: /https?:\/\/dai.ly\/([a-z0-9]+)/,
+ twitch: /https?:\/\/(?:www.)?twitch.tv\/(?:(videos)\/)?([a-zA-Z0-9][\w]{3,24})/i,
+ ultimedia: /https?:\/\/www.ultimedia.com\/default\/index\/videogeneric\/id\/([a-z0-9]+)/,
+ vimeo: /https?:\/\/(?:vimeo.com\/|player.vimeo.com\/video\/)([0-9]+)\/?(#t=((\d+)s?))?\/?/,
+ vimeoId: /(?:vimeo.com\/|player.vimeo.com\/video\/)([0-9]+)/,
+ youTube: youTube(),
+ youTubeId: /(?:(?:youtube.com\/watch\?v=)|(?:youtu.be\/)|(?:youtube.com\/embed\/))([A-Za-z0-9\_\-]+)/i,
};
//TODO: possible this should go somewhere else.
diff --git a/src/shared/HtmlReady.js b/src/shared/HtmlReady.js
index 1436f65..525b27d 100644
--- a/src/shared/HtmlReady.js
+++ b/src/shared/HtmlReady.js
@@ -183,8 +183,11 @@ function iframe(state, child) {
const url = child.getAttribute('src');
if (url) {
const { images, links } = state;
+ const bv = getBannedVideoId(url);
const yt = youTubeId(url);
- if (yt && images && links) {
+ if (bv && links) {
+ links.add(url);
+ } else if (yt && images && links) {
links.add(yt.url);
images.add('https://img.youtube.com/vi/' + yt.id + '/0.jpg');
}
@@ -245,11 +248,19 @@ function linkifyNode(child, state) {
const { mutate } = state;
if (!child.data) return;
- child = embedYouTubeNode(child, state.links, state.images);
+
+ child = embedBannedVideoNode(child, state.links, state.images);
+ child = embedBitchuteVideoNode(child, state.links, state.images);
+ child = embedBrightreonVideoNode(child, state.links, state.images);
+ child = embedLBRYVideoNode(child, state.links, state.images);
+ child = embedRumbleVideoNode(child, state.links, state.images);
+ child = embedTheDailyMotionNode(child, state.links, state.images);
+ child = embedUltimedia(child, state.links, state.images);
child = embedVimeoNode(child, state.links, state.images);
child = embedTwitchNode(child, state.links, state.images);
child = embedDTubeNode(child, state.links, state.images);
child = embedThreeSpeakNode(child, state.links, state.images);
+ child = embedYouTubeNode(child, state.links, state.images);
const data = XMLSerializer.serializeToString(child);
const content = linkify(
@@ -371,6 +382,78 @@ function youTubeId(data) {
}
/** @return {id, url} or <b>null</b> */
+function getBannedVideoId(data) {
+ if (!data) return null;
+
+ const m = data.match(linksRe.bannedVideo);
+ const url = m ? m[1] : null;
+ if (!url) return null;
+ const id = m[2];
+ if (!id) return null;
+
+ return {
+ id,
+ url,
+ startTime: 0,
+ thumbnail: null,
+ };
+}
+
+/** @return {id, url} or <b>null</b> */
+function getBitchuteVideoId(data) {
+ if (!data) return null;
+
+ const m = data.match(linksRe.bitchute);
+ const url = m ? m[1] : null;
+ if (!url) return null;
+ const id = m[2];
+ if (!id) return null;
+
+ return {
+ id,
+ url,
+ startTime: 0,
+ thumbnail: null,
+ };
+}
+
+/** @return {id, url} or <b>null</b> */
+function getBittubeVideoId(data) {
+ if (!data) return null;
+
+ const m = data.match(linksRe.bitchute);
+ const url = m ? m[1] : null;
+ if (!url) return null;
+ const id = m[2];
+ if (!id) return null;
+
+ return {
+ id,
+ url,
+ startTime: 0,
+ thumbnail: null,
+ };
+}
+
+/** @return {id, url} or <b>null</b> */
+function getBrightreonVideoId(data) {
+ if (!data) return null;
+
+ const m = data.match(linksRe.brightreon);
+ const url = m ? m[1] : null;
+ if (!url) return null;
+ const id = m[2];
+ if (!id) return null;
+
+ return {
+ id,
+ url,
+ startTime: 0,
+ thumbnail: null,
+ };
+}
+
+/** @return {id, url} or <b>null</b> */
function getThreeSpeakId(data) {
if (!data) return null;
@@ -388,6 +471,77 @@ function getThreeSpeakId(data) {
};
}
+function embedBannedVideoNode(child, links, images) {
+ try {
+ // If child is not a string, we are processing plain text
+ // to replace a bare URL
+ let data = child.data;
+ const bannedVideoId = getBannedVideoId(data);
+ if (!bannedVideoId) return child;
+
+ child.data = data.replace(
+ bannedVideoId.url,
+ `
+ );
+
+ if (links) links.add(bannedVideoId.url);
+ } catch (error) {
+ console.log(error);
+ }
+
+ return child;
+}
+
+function embedBitchuteVideoNode(child, links, images) {
+ try {
+ // If child is not a string, we are processing plain text
+ // to replace a bare URL
+ let data = child.data;
+ const matchResults = getBitchuteVideoId(data);
+ if (!matchResults) return child;
+
+ child.data = data.replace(
+ matchResults.url,
+ `
+ );
+
+ if (links) links.add(matchResults.url);
+ } catch (error) {
+ console.log(error);
+ }
+
+ return child;
+}
+
+function embedBrightreonVideoNode(child, links, images) {
+ try {
+ // If child is not a string, we are processing plain text
+ // to replace a bare URL
+ let data = child.data;
+ const matchData = getBrightreonVideoId(data);
+ if (!matchData) return child;
+
+ child.data = data.replace(
+ matchData.url,
+ `
+ );
+
+ if (links) links.add(matchData.url);
+ } catch (error) {
+ console.log(error);
+ }
+
+ return child;
+}
+
+function embedLBRYVideoNode(child, links, images) {
+ return child;
+}
+
+function embedRumbleVideoNode(child, links, images) {
+ return child;
+}
+
function embedThreeSpeakNode(child, links, images) {
try {
if (typeof child === 'string') {
@@ -422,6 +576,14 @@ function embedThreeSpeakNode(child, links, images) {
return child;
}
+function embedTheDailyMotionNode(child, links, images) {
+ return child;
+}
+
+function embedUltimedia(child, links, images) {
+ return child;
+}
+
function embedVimeoNode(child, links /*images*/) {
try {
const data = child.data;
diff --git a/src/shared/HtmlReady.test.js b/src/shared/HtmlReady.test.js
index 71da0dc..6910501 100644
--- a/src/shared/HtmlReady.test.js
+++ b/src/shared/HtmlReady.test.js
@@ -271,4 +271,55 @@ describe('htmlready', () => {
const res = HtmlReady(testString).html;
expect(res).toEqual(htmlified);
});
+
+ it('should not omit text on same line as banned video link', () => {
+ const testString =
+ '<html><p>before text https://electionnight.news/watch?id=5f9b6d9e57b3de0a553c18b3 after text</p></html>';
+ // why is this proper HTML but in the d-tube case we get "embed:" + gibberish?
+ const htmlified =
+ '<html xmlns="http://www.w3.org/1999/xhtml"><p>before text ~~~embed:5f9b6d9e57b3de0a553c18b3 bannedvideo after text</p></html>';
+ const res = HtmlReady(testString).html;
+ expect(
+ res.indexOf('before text') != -1 && res.indexOf('after text') != -1
+ ).toEqual(true);
+ });
+
+ it('should handle banned video URL #1', () => {
+ const testString =
+ '<html><p>https://electionnight.news/watch?id=5f9b6d9e57b3de0a553c18b3</p></html>';
+ const embedcode =
+ '<html xmlns="http://www.w3.org/1999/xhtml"><p>
+
+ const res1 = HtmlReady(testString).html;
+ expect(res1).toEqual(embedcode);
+ });
+
+ it('should handle banned video embed', () => {
+ const testString =
+ '<html><div class="ifw-player" data-video-id="5f9b6d9e57b3de0a553c18b3"></div><script src="https://infowarsmedia.com/js/player.js" async></script></html>';
+ const htmlified =
+ '<html xmlns="http://www.w3.org/1999/xhtml"><div class="ifw-player" data-video-id="5f9b6d9e57b3de0a553c18b3"></div><script src="https://infowarsmedia.com/js/player.js" async="async"></script></html>';
+ const res = HtmlReady(testString).html;
+ expect(res).toEqual(htmlified);
+ });
+
+ it('should handle bitchute video URL #1', () => {
+ const testString =
+ '<html><p>https://www.bitchute.com/video/KhQkI5w4kL0/</p></html>';
+ const embedcode =
+ '<html xmlns="http://www.w3.org/1999/xhtml"><p>
+
+ const res1 = HtmlReady(testString).html;
+ expect(res1).toEqual(embedcode);
+ });
+
+ it('should handle bitchute video URL #2', () => {
+ const testString =
+ '<html><p>https://www.bitchute.com/video/VAhOKZ2w270/</p></html>';
+ const embedcode =
+ '<html xmlns="http://www.w3.org/1999/xhtml"><p>
+
+ const res1 = HtmlReady(testString).html;
+ expect(res1).toEqual(embedcode);
+ });
});
``