markdownr 0.4.9 → 0.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 498dc869909593a83b885a1cc30de710e07b6e686434da94a49c2d2e1f473d41
-  data.tar.gz: 83c31394846d27ec2b474465dafa548494b42683e800348e752b080caeb3df42
+  metadata.gz: 03b8c1c4665231a3fb1ead89abea54e0630131743216938a1c293945c942e710
+  data.tar.gz: 004d43321fcda1b894c6481eed4b755f29a9fae14c6e0f6bbb5c1f9d82b6afd9
 SHA512:
-  metadata.gz: bf3f02fae7411669eb42765b7a65280a55d6e4dca36a77601017fd52c42e2a75adee172d173cf470033d897d75c6a18bb84277094348a3f9b1f578b3d962586e
-  data.tar.gz: 8388865e12e977a8f6ec1be0047dd4dd14981d2671bbcb3182fc77e87ccb20ee5617f6b2e8f944b2355187bdffb4a2107ac2266f171aacb848a9d010d4fca137
+  metadata.gz: 0d44c7b65617670e54d450d5d958294bd78914407cf925087f1547b551b5b91dd3b556820009aa197491bdd14bff9fc6e205a47bf6662fb5b5a495d8e5d8c71d
+  data.tar.gz: 07f03bc67cc2b668c90c1c9467eb7eafe60f2c58c4030553adbec8af4309bdbf3943c9ffdd454cdde0283619f702c6a7ef75992ed679e84983557c5ed5fc3675

data/lib/markdown_server/app.rb

@@ -491,7 +491,7 @@ module MarkdownServer
         } || ""
       end
 
-      def page_html(raw)
+      def page_html(raw, base_url = nil)
         w = raw.dup
         # Remove inert elements and their entire contents
         STRIP_FULL.each { |t| w.gsub!(/<#{t}[^>]*>.*?<\/#{t}>/im, " ") }
@@ -508,12 +508,30 @@ module MarkdownServer
                   w.match(/<body[^>]*>(.*?)<\/body>/im)&.[](1) ||
                   w
 
-        # Rewrite tags: keep allowed (strip attrs), block→newline, rest→empty
-        out = content.gsub(/<(\/?)(\w+)[^>]*>/) do
-          slash, tag = $1, $2.downcase
-          if ALLOWED_HTML.include?(tag)  then "<#{slash}#{tag}>"
-          elsif BLOCK_HTML.include?(tag) then "\n"
-          else ""
+        # Rewrite tags: keep allowed (strip attrs), preserve <a href>, block→newline, rest→empty
+        out = content.gsub(/<(\/?)(\w+)([^>]*)>/) do
+          slash, tag, attrs = $1, $2.downcase, $3
+          if ALLOWED_HTML.include?(tag)
+            "<#{slash}#{tag}>"
+          elsif tag == "a"
+            if slash.empty?
+              m = attrs.match(/href\s*=\s*["']([^"']*)["']/i)
+              if m && !m[1].match?(/\Ajavascript:/i)
+                href = m[1]
+                if base_url && href !~ /\Ahttps?:\/\//i && !href.start_with?("#")
+                  href = (URI.join(base_url, href).to_s rescue href)
+                end
+                %(<a href="#{h(href)}" target="_blank" rel="noopener">)
+              else
+                ""
+              end
+            else
+              "</a>"
+            end
+          elsif BLOCK_HTML.include?(tag)
+            "\n"
+          else
+            ""
           end
         end
 
@@ -533,6 +551,9 @@ module MarkdownServer
           .gsub(/<(\w+)>\s*<\/\1>/, "")  # drop empty tags
           .strip
 
+        # Strip all footer navigation after "Read full chapter" up to (but not including) copyright
+        out.gsub!(/(<a[^>]*>Read\s+full\s+chapter<\/a>)[\s\S]*?(?=©|Copyright\b)/i, "\\1\n")
+
         out.length > 10_000 ? out[0, 10_000] : out
       end
 
@@ -627,7 +648,8 @@ module MarkdownServer
       html = fetch_external_page(url)
       halt 502, '{"error":"fetch failed"}' unless html
 
-      JSON.dump({ title: page_title(html), html: page_html(html) })
+      title = page_title(html).sub(/ [-–] .*/, "").strip
+      JSON.dump({ title: title, html: page_html(html, url) })
     end
 
     get "/search/?*" do

data/lib/markdown_server/version.rb

@@ -1,3 +1,3 @@
 module MarkdownServer
-  VERSION = "0.4.9"
+  VERSION = "0.5.0"
 end

data/views/layout.erb

@@ -726,10 +726,6 @@
     .link-ctx-popup-close:hover { color: #2c2c2c; }
     .link-ctx-popup-body {
       padding: 0.75rem 1rem;
-      font-family: Georgia, "Times New Roman", serif;
-      font-size: 0.85rem;
-      line-height: 1.6;
-      color: #2c2c2c;
     }
     .link-ctx-popup-url {
       font-family: "SF Mono", Menlo, Consolas, monospace;
@@ -741,49 +737,8 @@
       border-radius: 4px;
       margin-bottom: 0.5rem;
     }
-    .link-ctx-popup-body h1, .link-ctx-popup-body h2, .link-ctx-popup-body h3,
-    .link-ctx-popup-body h4, .link-ctx-popup-body h5, .link-ctx-popup-body h6 {
-      margin: 0.7rem 0 0.3rem; color: #3a3a3a;
-    }
-    .link-ctx-popup-body h1 { font-size: 1.2rem; }
-    .link-ctx-popup-body h2 { font-size: 1.05rem; border-bottom: none; padding-bottom: 0; }
-    .link-ctx-popup-body h3 { font-size: 0.95rem; }
-    .link-ctx-popup-body p { margin: 0 0 0.5rem; }
-    .link-ctx-popup-body p:last-child { margin-bottom: 0; }
-    .link-ctx-popup-body a { color: #8b6914; text-decoration: none; border-bottom: 1px solid #d4b96a; }
-    .link-ctx-popup-body a.wiki-link { color: #6a8e3e; border-bottom-color: #6a8e3e; }
-    .link-ctx-popup-body code {
-      font-family: "SF Mono", Menlo, Consolas, monospace;
-      font-size: 0.82em;
-      background: #f0ece3;
-      padding: 0.1em 0.3em;
-      border-radius: 3px;
-    }
-    .link-ctx-popup-body pre {
-      background: #2d2d2d;
-      color: #f0f0f0;
-      padding: 0.6rem 0.8rem;
-      border-radius: 4px;
-      font-size: 0.78rem;
-      line-height: 1.4;
-      overflow-x: auto;
-      margin: 0.4rem 0;
-    }
-    .link-ctx-popup-body pre code { background: none; padding: 0; font-size: 1em; color: inherit; }
-    .link-ctx-popup-body ul, .link-ctx-popup-body ol { padding-left: 1.4rem; margin: 0.3rem 0; }
-    .link-ctx-popup-body li { margin-bottom: 0.2rem; }
-    .link-ctx-popup-body blockquote {
-      border-left: 3px solid #d4b96a;
-      margin: 0.5rem 0;
-      padding: 0.3rem 0.8rem;
-      color: #4a4a4a;
-      font-style: italic;
-    }
-    .link-ctx-popup-body table { border-collapse: collapse; font-size: 0.8rem; margin: 0.5rem 0; }
-    .link-ctx-popup-body th, .link-ctx-popup-body td { border: 1px solid #ddd; padding: 0.3rem 0.5rem; }
-    .link-ctx-popup-body th { background: #f5f0e4; }
 
-    /* Link preview popup */
+    /* Link preview popup (hover) */
     .link-tooltip-anchor { position: relative; }
     .link-preview-popup {
       position: absolute;
@@ -799,10 +754,6 @@
       border-radius: 6px;
       box-shadow: 0 4px 20px rgba(0,0,0,0.18);
       padding: 0.8rem 1rem;
-      font-family: Georgia, "Times New Roman", serif;
-      font-size: 0.85rem;
-      line-height: 1.6;
-      color: #2c2c2c;
       cursor: auto;
       -webkit-overflow-scrolling: touch;
     }
@@ -814,26 +765,36 @@
       border-bottom: 1px solid #e0d8c8;
       color: #3a3a3a;
     }
+
+    /* Shared popup content styles */
+    .link-ctx-popup-body,
+    .link-preview-popup {
+      font-family: Georgia, "Times New Roman", serif;
+      font-size: 0.85rem;
+      line-height: 1.6;
+      color: #2c2c2c;
+    }
+    .link-ctx-popup-body h1, .link-ctx-popup-body h2, .link-ctx-popup-body h3,
+    .link-ctx-popup-body h4, .link-ctx-popup-body h5, .link-ctx-popup-body h6,
     .link-preview-popup h1, .link-preview-popup h2, .link-preview-popup h3,
     .link-preview-popup h4, .link-preview-popup h5, .link-preview-popup h6 {
-      margin: 0.7rem 0 0.3rem;
-      color: #3a3a3a;
+      margin: 0.7rem 0 0.3rem; color: #3a3a3a;
     }
-    .link-preview-popup h1 { font-size: 1.2rem; }
-    .link-preview-popup h2 { font-size: 1.05rem; border-bottom: none; padding-bottom: 0; }
-    .link-preview-popup h3 { font-size: 0.95rem; }
-    .link-preview-popup p { margin: 0 0 0.5rem; }
-    .link-preview-popup p:last-child { margin-bottom: 0; }
-    .link-preview-popup a { color: #8b6914; text-decoration: none; border-bottom: 1px solid #d4b96a; }
-    .link-preview-popup a.wiki-link { color: #6a8e3e; border-bottom-color: #6a8e3e; }
-    .link-preview-popup code {
+    .link-ctx-popup-body h1, .link-preview-popup h1 { font-size: 1.2rem; }
+    .link-ctx-popup-body h2, .link-preview-popup h2 { font-size: 1.05rem; border-bottom: none; padding-bottom: 0; }
+    .link-ctx-popup-body h3, .link-preview-popup h3 { font-size: 0.95rem; }
+    .link-ctx-popup-body p, .link-preview-popup p { margin: 0 0 0.5rem; }
+    .link-ctx-popup-body p:last-child, .link-preview-popup p:last-child { margin-bottom: 0; }
+    .link-ctx-popup-body a, .link-preview-popup a { color: #8b6914; text-decoration: none; border-bottom: 1px solid #d4b96a; }
+    .link-ctx-popup-body a.wiki-link, .link-preview-popup a.wiki-link { color: #6a8e3e; border-bottom-color: #6a8e3e; }
+    .link-ctx-popup-body code, .link-preview-popup code {
       font-family: "SF Mono", Menlo, Consolas, monospace;
       font-size: 0.82em;
       background: #f0ece3;
       padding: 0.1em 0.3em;
       border-radius: 3px;
     }
-    .link-preview-popup pre {
+    .link-ctx-popup-body pre, .link-preview-popup pre {
       background: #2d2d2d;
       color: #f0f0f0;
       padding: 0.6rem 0.8rem;
@@ -843,26 +804,21 @@
       overflow-x: auto;
       margin: 0.4rem 0;
     }
-    .link-preview-popup pre code { background: none; padding: 0; font-size: 1em; }
+    .link-ctx-popup-body pre code, .link-preview-popup pre code { background: none; padding: 0; font-size: 1em; color: inherit; }
+    .link-ctx-popup-body ul, .link-ctx-popup-body ol,
     .link-preview-popup ul, .link-preview-popup ol { padding-left: 1.4rem; margin: 0.3rem 0; }
-    .link-preview-popup li { margin-bottom: 0.2rem; }
-    .link-preview-popup blockquote {
+    .link-ctx-popup-body li, .link-preview-popup li { margin-bottom: 0.2rem; }
+    .link-ctx-popup-body blockquote, .link-preview-popup blockquote {
       border-left: 3px solid #d4b96a;
       margin: 0.5rem 0;
       padding: 0.3rem 0.8rem;
       color: #4a4a4a;
       font-style: italic;
     }
-    .link-preview-popup table {
-      border-collapse: collapse;
-      font-size: 0.8rem;
-      margin: 0.5rem 0;
-    }
-    .link-preview-popup th, .link-preview-popup td {
-      border: 1px solid #ddd;
-      padding: 0.3rem 0.5rem;
-    }
-    .link-preview-popup th { background: #f5f0e4; }
+    .link-ctx-popup-body table, .link-preview-popup table { border-collapse: collapse; font-size: 0.8rem; margin: 0.5rem 0; }
+    .link-ctx-popup-body th, .link-ctx-popup-body td,
+    .link-preview-popup th, .link-preview-popup td { border: 1px solid #ddd; padding: 0.3rem 0.5rem; }
+    .link-ctx-popup-body th, .link-preview-popup th { background: #f5f0e4; }
 
     /* Footnote tooltips */
     .footnote-tooltip {
@@ -1634,10 +1590,11 @@
       document.addEventListener('keydown', function(e) {
         if (e.key === 'Escape' && popup) hidePopup();
       });
+
     })();
 
     <% if settings.link_tooltips %>
-    // Link preview popup for local markdown links
+    // Link preview popup for local markdown links and external links
     (function() {
       var content = document.querySelector('.md-content');
       if (!content) return;
@@ -1662,48 +1619,79 @@
         return /\.md$/i.test(path);
       }
 
+      function isExternalLink(a) {
+        var href = a.getAttribute('href');
+        return href && /^https?:\/\//i.test(href);
+      }
+
       function previewUrl(a) {
         var resolved = new URL(a.getAttribute('href'), location.href);
         return '/preview/' + resolved.pathname.replace(/^\/browse\//, '');
       }
 
+      // Returns true if el has an ancestor that clips overflow (prevents absolute children escaping)
+      function hasOverflowClip(el) {
+        var parent = el.parentElement;
+        while (parent && parent !== document.body) {
+          var s = window.getComputedStyle(parent);
+          if (s.overflow !== 'visible' || s.overflowX !== 'visible' || s.overflowY !== 'visible') return true;
+          parent = parent.parentElement;
+        }
+        return false;
+      }
+
       function showPopup(anchor, html) {
         hidePopup();
         var pop = document.createElement('div');
         pop.className = 'link-preview-popup';
         pop.innerHTML = html;
-        anchor.appendChild(pop);
         activePopup = pop;
         activeAnchor = anchor;
 
-        // Clamp right edge to viewport
         var vw = Math.min(window.innerWidth, document.documentElement.clientWidth);
-        var rect = pop.getBoundingClientRect();
-        if (rect.right > vw - 8) {
-          pop.style.left = Math.max(0, parseFloat(pop.style.left || 0) - (rect.right - (vw - 8))) + 'px';
-        }
-        // If top goes off screen, flip below the link instead
-        rect = pop.getBoundingClientRect();
-        if (rect.top < 8) {
-          pop.style.bottom = 'auto';
-          pop.style.top = '100%';
+        var vh = window.innerHeight;
+
+        if (hasOverflowClip(anchor)) {
+          // Anchor is inside an overflow container — use fixed positioning to escape clipping
+          pop.style.position = 'fixed';
+          pop.style.bottom = 'auto';  // override the CSS class's bottom: 100%
+          document.body.appendChild(pop);
+          var aRect = anchor.getBoundingClientRect();
+          var popH = pop.offsetHeight;
+          var popW = pop.offsetWidth;
+          // Prefer above the link, fall back to below
+          var top = aRect.top - popH - 4;
+          if (top < 8) top = aRect.bottom + 4;
+          if (top + popH > vh - 8) top = Math.max(8, vh - popH - 8);
+          var left = aRect.left;
+          if (left + popW > vw - 8) left = Math.max(8, vw - popW - 8);
+          pop.style.top = top + 'px';
+          pop.style.left = left + 'px';
+        } else {
+          // Normal anchor-attached positioning
+          anchor.appendChild(pop);
+          var rect = pop.getBoundingClientRect();
+          var shift = 0;
+          if (rect.right > vw - 8) shift = (vw - 8) - rect.right;
+          if (rect.left + shift < 8) shift = 8 - rect.left;
+          if (shift !== 0) pop.style.left = (parseFloat(pop.style.left || 0) + shift) + 'px';
+          // If top goes off screen, flip below the link instead
+          rect = pop.getBoundingClientRect();
+          if (rect.top < 8) {
+            pop.style.bottom = 'auto';
+            pop.style.top = '100%';
+          }
         }
 
         // Keep popup open while hovering over it
         pop.addEventListener('mouseenter', function() { clearTimeout(hideTimer); });
         pop.addEventListener('mouseleave', function() { hideTimer = setTimeout(hidePopup, 10); });
 
-        // Stop clicks/touches inside the popup from triggering the outer link
+        // Stop clicks inside the popup from triggering the outer link
         pop.addEventListener('click', function(e) {
           e.stopPropagation();
           if (!e.target.closest('a')) e.preventDefault();
         });
-        pop.addEventListener('touchstart', function(e) { e.stopPropagation(); }, { passive: true });
-        pop.addEventListener('touchmove', function(e) { e.stopPropagation(); }, { passive: true });
-        pop.addEventListener('touchend', function(e) {
-          e.stopPropagation();
-          if (!e.target.closest('a')) e.preventDefault();
-        });
       }
 
       function hidePopup() {
@@ -1732,36 +1720,49 @@
         }
       }
 
+      function fetchExternalAndShow(anchor) {
+        var href = anchor.getAttribute('href');
+        var key = 'ext:' + href;
+        var cached = cache[key];
+        if (cached === undefined) {
+          cache[key] = null; // in-flight
+          showPopup(anchor, '<p style="opacity:0.5;margin:0">Loading\u2026</p>');
+          fetch('/fetch?url=' + encodeURIComponent(href))
+            .then(function(r) { return r.ok ? r.json() : null; })
+            .then(function(data) {
+              if (!data || data.error) { cache[key] = false; if (activeAnchor === anchor) hidePopup(); return; }
+              var html = '<div class="link-preview-popup-title">' + escHtml(data.title) + '</div>' + data.html;
+              cache[key] = html;
+              if (activeAnchor === anchor) showPopup(anchor, html);
+            })
+            .catch(function() { cache[key] = false; if (activeAnchor === anchor) hidePopup(); });
+        } else if (typeof cached === 'string') {
+          showPopup(anchor, cached);
+        }
+      }
+
       content.querySelectorAll('a').forEach(function(a) {
-        if (!isLocalMdLink(a)) return;
+        var localMd = isLocalMdLink(a);
+        var external = isExternalLink(a);
+        if (!localMd && !external) return;
         a.classList.add('link-tooltip-anchor');
 
         var hoverTimer = null;
         a.addEventListener('click', hidePopup);
         a.addEventListener('mouseenter', function() {
-          hoverTimer = setTimeout(function() { fetchAndShow(a); }, 300);
+          hoverTimer = setTimeout(function() {
+            if (localMd) fetchAndShow(a);
+            else fetchExternalAndShow(a);
+          }, 300);
         });
         a.addEventListener('mouseleave', function() {
           clearTimeout(hoverTimer);
-          hideTimer = setTimeout(hidePopup, 10);
-        });
-
-        var touchMoved = false;
-        a.addEventListener('touchstart', function() { touchMoved = false; }, { passive: true });
-        a.addEventListener('touchmove', function() { touchMoved = true; }, { passive: true });
-        a.addEventListener('touchend', function(e) {
-          if (touchMoved) return;
-          if (activeAnchor === a && activePopup) return; // second tap → navigate
-          e.preventDefault();
-          document.querySelectorAll('.link-preview-popup').forEach(function(p) {
-            if (p.parentNode) p.parentNode.removeChild(p);
-          });
-          fetchAndShow(a);
+          hideTimer = setTimeout(hidePopup, 150);
         });
       });
 
       document.addEventListener('click', function(e) {
-        if (activePopup && activeAnchor && !activeAnchor.contains(e.target)) hidePopup();
+        if (activePopup && !activePopup.contains(e.target) && activeAnchor && !activeAnchor.contains(e.target)) hidePopup();
       });
     })();
     <% end %>

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: markdownr
 version: !ruby/object:Gem::Version
-  version: 0.4.9
+  version: 0.5.0
 platform: ruby
 authors:
 - Brian Dunn