From 1ae89bddcdd899b6491ba9d491bb350e86021235 Mon Sep 17 00:00:00 2001
From: lain <lain@soykaf.club>
Date: Tue, 2 Jun 2020 14:04:34 +0000
Subject: [PATCH] Merge branch 'feature/embeddable-posts' into 'develop'

Add embeddable posts

Closes #1288

See merge request pleroma/pleroma!2319
---
 priv/static/embed.css | 115 ++++++++++++++++++++++++++++++++++++++++++
 priv/static/embed.js  |  43 ++++++++++++++++
 2 files changed, 158 insertions(+)
 create mode 100644 priv/static/embed.css
 create mode 100644 priv/static/embed.js

diff --git a/priv/static/embed.css b/priv/static/embed.css
new file mode 100644
index 000000000..cc79ee7ab
--- /dev/null
+++ b/priv/static/embed.css
@@ -0,0 +1,115 @@
+body {
+  background-color: #282c37;
+  font-family: sans-serif;
+  color: white;
+  margin: 0;
+  padding: 1em;
+  padding-bottom: 0;
+}
+
+.avatar {
+  cursor: pointer;
+}
+
+.avatar img {
+  float: left;
+  border-radius: 4px;
+  margin-right: 4px;
+}
+
+.activity-content {
+  padding-top: 1em;
+}
+
+.attachment {
+  margin-top: 1em;
+}
+
+.attachment img {
+  max-width: 100%;
+}
+
+.date a {
+  text-decoration: none;
+}
+
+.date a:hover {
+  text-decoration: underline;
+}
+
+.date a,
+.counts {
+  color: #666;
+  font-size: 0.9em;
+}
+
+.counts dt,
+.counts dd {
+  float: left;
+  margin-left: 1em;
+}
+
+a {
+  color: white;
+}
+
+.h-card {
+  min-height: 48px;
+  margin-bottom: 8px;
+}
+
+.h-card a {
+  text-decoration: none;
+}
+
+.h-card a:hover {
+  text-decoration: underline;
+}
+
+.display-name {
+  padding-top: 4px;
+  display: block;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  color: white;
+}
+
+/* keep emoji from being hilariously huge */
+.display-name img {
+  max-height: 1em;
+}
+
+.display-name .nickname {
+  padding-top: 4px;
+  display: block;
+}
+
+.nickname:hover {
+  text-decoration: none;
+}
+
+.pull-right {
+  float: right;
+}
+
+.collapse {
+  margin: 0;
+  width: auto;
+}
+
+a.button {
+  box-sizing: border-box;
+  display: inline-block;
+  color: white;
+  background-color: #419bdd;
+  border-radius: 4px;
+  border: none;
+  padding: 10px;
+  font-weight: 500;
+  font-size: 0.9em;
+}
+
+a.button:hover {
+  text-decoration: none;
+  background-color: #61a6d9;
+}
diff --git a/priv/static/embed.js b/priv/static/embed.js
new file mode 100644
index 000000000..f675f6417
--- /dev/null
+++ b/priv/static/embed.js
@@ -0,0 +1,43 @@
+(function () {
+  'use strict'
+
+  var ready = function (loaded) {
+    if (['interactive', 'complete'].indexOf(document.readyState) !== -1) {
+      loaded()
+    } else {
+      document.addEventListener('DOMContentLoaded', loaded)
+    }
+  }
+
+  ready(function () {
+    var iframes = []
+
+    window.addEventListener('message', function (e) {
+      var data = e.data || {}
+
+      if (data.type !== 'setHeightPleromaEmbed' || !iframes[data.id]) {
+        return
+      }
+
+      iframes[data.id].height = data.height
+    });
+
+    [].forEach.call(document.querySelectorAll('iframe.pleroma-embed'), function (iframe) {
+      iframe.scrolling = 'no'
+      iframe.style.overflow = 'hidden'
+
+      iframes.push(iframe)
+
+      var id = iframes.length - 1
+
+      iframe.onload = function () {
+        iframe.contentWindow.postMessage({
+          type: 'setHeightPleromaEmbed',
+          id: id
+        }, '*')
+      }
+
+      iframe.onload()
+    })
+  })
+})()