Merge ihavenoface's Floating Embeds. #47

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'

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;

src/General/html/Features/Embed.html

@@ -0,0 +1,6 @@
+<div>
+  <div class="move"></div>
+  <a href="javascript:;" class="jump" title="Jump to post">→</a>
+  <a href="javascript:;" class="close" title="Close">×</a>
+</div>
+<div id="media-embed"><div></div></div>

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

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']