diff --git a/src/General/Config.coffee b/src/General/Config.coffee
index dcd25a563..35f1b349b 100755
--- a/src/General/Config.coffee
+++ b/src/General/Config.coffee
@@ -124,6 +124,11 @@ Config =
'Auto-embed Linkify Embeds.'
2
]
+ 'Floating Embeds': [
+ false
+ 'Embedded content will scroll with page.'
+ 2
+ ]
'Link Title': [
true
'Replace the link of a supported site with its actual title. Currently Supported: YouTube, Vimeo, SoundCloud, and Github gists'
@@ -717,7 +722,7 @@ vp-replace
]
'Close': [
'Esc'
- 'Close Settings/Notifications/QR/Gallery.'
+ 'Close topmost dialog or notification.'
]
'Spoiler tags': [
'Ctrl+s'
diff --git a/src/General/css/style.css b/src/General/css/style.css
index 8d3a47623..c4822a31c 100755
--- a/src/General/css/style.css
+++ b/src/General/css/style.css
@@ -158,6 +158,9 @@ audio.controls-added {
#qr {
z-index: 20;
}
+#embedding {
+ z-index: 11;
+}
#thread-watcher {
z-index: 10;
}
@@ -1505,6 +1508,25 @@ div.boardTitle {
padding-left: 18px;
}
+/* Embedding */
+#embedding {
+ padding: 1px 4px 1px 4px;
+ position: fixed;
+}
+#embedding.empty {
+ display: none;
+}
+#embedding > div:first-child {
+ display: flex;
+}
+#embedding .move {
+ flex: 1;
+}
+#embedding .jump {
+ margin: -1px 4px;
+ text-decoration: none;
+}
+
/* Gallery */
#a-gallery {
position: fixed;
diff --git a/src/General/html/Features/Embed.html b/src/General/html/Features/Embed.html
new file mode 100644
index 000000000..dbf93db1f
--- /dev/null
+++ b/src/General/html/Features/Embed.html
@@ -0,0 +1,6 @@
+
+
diff --git a/src/Linkification/Embedding.coffee b/src/Linkification/Embedding.coffee
index c8777052a..86bc92e2f 100644
--- a/src/Linkification/Embedding.coffee
+++ b/src/Linkification/Embedding.coffee
@@ -4,6 +4,12 @@ Embedding =
@types = {}
@types[type.key] = type for type in @ordered_types
+ if Conf['Floating Embeds']
+ @dialog = UI.dialog 'embedding', 'top: 50px; right: 0px;',
+ <%= importHTML('Features/Embed') %>
+ @media = $ '#media-embed', @dialog
+ $.one d, '4chanXInitFinished', @ready
+
if Conf['Link Title']
$.on d, '4chanXInitFinished PostsInserted', ->
for key, service of Embedding.types when service.title?.batchSize
@@ -49,10 +55,35 @@ Embedding =
$.on embed, 'click', Embedding.cb.toggle
$.after link, [$.tn(' '), embed]
- if Conf['Auto-embed'] and !post.isFetchedQuote
+ if Conf['Auto-embed'] and !Conf['Floating Embeds'] and !post.isFetchedQuote
$.asap (-> doc.contains embed), ->
Embedding.cb.toggle.call embed
+ ready: ->
+ $.addClass Embedding.dialog, 'empty'
+ $.on $('.close', Embedding.dialog), 'click', Embedding.closeFloat
+ $.on $('.move', Embedding.dialog), 'mousedown', Embedding.dragEmbed
+ $.on $('.jump', Embedding.dialog), 'click', ->
+ Header.scrollTo Embedding.lastEmbed if doc.contains Embedding.lastEmbed
+ $.add d.body, Embedding.dialog
+
+ closeFloat: ->
+ delete Embedding.lastEmbed
+ $.addClass Embedding.dialog, 'empty'
+ $.replace Embedding.media.firstChild, $.el 'div'
+
+ dragEmbed: ->
+ # only webkit can handle a blocking div
+ {style} = Embedding.media
+ if Embedding.dragEmbed.mouseup
+ $.off d, 'mouseup', Embedding.dragEmbed
+ Embedding.dragEmbed.mouseup = false
+ style.visibility = ''
+ return
+ $.on d, 'mouseup', Embedding.dragEmbed
+ Embedding.dragEmbed.mouseup = true
+ style.visibility = 'hidden'
+
title: (data) ->
{key, uid, options, link, post} = data
return unless service = Embedding.types[key].title
@@ -79,6 +110,12 @@ Embedding =
cb:
toggle: (e) ->
e?.preventDefault()
+ if Conf['Floating Embeds']
+ return unless div = Embedding.media.firstChild
+ $.replace div, Embedding.cb.embed @
+ Embedding.lastEmbed = Get.postFromNode(@).nodes.root
+ $.rmClass Embedding.dialog, 'empty'
+ return
if $.hasClass @, "embedded"
$.rm @previousElementSibling unless $.hasClass @previousElementSibling, 'linkify'
@previousElementSibling.hidden = false
diff --git a/src/Miscellaneous/Keybinds.coffee b/src/Miscellaneous/Keybinds.coffee
index 50d484f37..016c3bca5 100755
--- a/src/Miscellaneous/Keybinds.coffee
+++ b/src/Miscellaneous/Keybinds.coffee
@@ -45,11 +45,13 @@ Keybinds =
else if (notifications = $$ '.notification').length
for notification in notifications
$('.close', notification).click()
- else if QR.nodes and !QR.nodes.el.hidden
+ else if QR.nodes and !QR.nodes.el.hidden and window.getComputedStyle(QR.nodes.form).display isnt 'none'
if Conf['Persistent QR']
QR.hide()
else
QR.close()
+ else if Embedding.lastEmbed
+ Embedding.closeFloat()
else
return
when Conf['Spoiler tags']