') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); })(); Fix anchor navigation in panel headers by le0tan · Pull Request #1187 · MarkBind/markbind · GitHub
Skip to content

Fix anchor navigation in panel headers - #1187

Closed
le0tan wants to merge 3 commits into
MarkBind:masterfrom
le0tan:issue-1104-v3
Closed

Fix anchor navigation in panel headers#1187
le0tan wants to merge 3 commits into
MarkBind:masterfrom
le0tan:issue-1104-v3

Conversation

@le0tan

@le0tanle0tan commented Apr 10, 2020

Copy link
Copy Markdown
Contributor

What is the purpose of this pull request? (put "X" next to an item, remove the rest)

• [X] Documentation update
• [X] Bug fix

Replaces #1145
Fixes#1104Fixes#1071

What changes did you make? (Give an overview)

Move span generation to a plugin during build time. Add ::before to panel card containers to make navigation work properly on panel headers.

Provide some example code that this change will affect:

na

Is there anything you'd like reviewers to focus on?

Test if the panel functions are broken in any way.

Testing instructions:

na

Proposed commit message: (wrap lines at 72 characters)

To avoid dynamically injecting lots of dummy spans in a document with
many headings, let's generate these spans using a plugin, post
rendering.

To make anchor navigation function properly on panel headers, let's
introduce ::before element to card-container to make space for the
fixed top nav.

@le0tan
le0tan requested review from alyip98 and ang-zeyuApril 10, 2020 12:34
ang-zeyu
ang-zeyu reviewed Apr 10, 2020
View reviewed changes
Comment threadsrc/plugins/fixedHeader.js Outdated
@@ -0,0 +1,19 @@
const cheerio = module.parent.require('cheerio');

module.exports = {

@ang-zeyuang-zeyuApr 10, 2020

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

don't think we should do this as a plugin since it is a core markbind feature.
You could look to insertHeaderFile and _parse to integrate this directly

@le0tanle0tanApr 10, 2020

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can do that in postRender - the same place where plugins are applied. Will there be extra concerns by doing that?

@ang-zeyuang-zeyuApr 10, 2020

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mainly of code organization and performance secondly ( as putting it there means you are parsing the entire content one more time, keeping the number of parses to a minimum would be nice )

Unless absolutely necessary ( like in the case of id resolution in popovers ), I think each stage of page generation should maintain a single unit of functionality as is currently. postRender is for plugins - you could certainly add it immediately outside of postRender, but adding one entire stage of parsing just for fixed navbars seems a little bit of waste, and there is already similar parsing going on in _parse/insertHeaderFile. Would make sense to put it there from both standpoints

@le0tanle0tanApr 10, 2020

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we're to implement this inside _parse, fixed header would be a config option in site.json I suppose?

@ang-zeyuang-zeyuApr 10, 2020

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

you could still 'detect' it during insertHeaderFile - though just to confirm the current implementation is <header class="header-fixed"> right? 😮

This was referenced Apr 11, 2020
Closed
Merged
@le0tanle0tan closed this Apr 11, 2020
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ang-zeyuang-zeyuang-zeyu left review comments
@alyip98alyip98Awaiting requested review from alyip98

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Heading hidden when clicking pageNav Anchor navigation in panel not working properly with fixed header

2 participants

@le0tan@ang-zeyu