Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', '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('^' + ".*" + ' Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, '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" + ' Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, '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('^' + ".*" + ' Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, '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); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent
, 'i'); if (__m === '*' || __re.test(location.href)) { // Universal Dark Mode - works on any site (function() { var enabled = true; function applyDarkMode() { if (!enabled) return; // Create style element if it doesn't exist var style = document.getElementById('universal-dark-mode-style'); if (!style) { style = document.createElement('style'); style.id = 'universal-dark-mode-style'; document.head.appendChild(style); } // Dark mode CSS - inverts colors but preserves images/video style.textContent = ' /* Invert everything except media */ html { filter: invert(1) hue-rotate(180deg) !important; background: #1a1a2e !important; } /* Restore images, videos, iframes, canvas */ img, video, iframe, canvas, svg, picture, [style*="background-image"] { filter: invert(1) hue-rotate(180deg) !important; } /* Preserve specific elements that should not be inverted */ .no-dark-mode, .no-dark-mode *, [data-theme="light"], [data-theme="light"], .ace_editor, .ace_editor *, .CodeMirror, .CodeMirror *, .monaco-editor, .monaco-editor *, .markdown-body pre, .markdown-body pre *, .highlight, .highlight *, pre code, pre code * { filter: none !important; } /* Fix common UI elements */ .modal, .popup, .dropdown-menu, .tooltip, .popover { filter: invert(1) hue-rotate(180deg) !important; background: #2d2d44 !important; border-color: #444 !important; } /* Scrollbars */ ::-webkit-scrollbar { background: #1a1a2e !important; } ::-webkit-scrollbar-thumb { background: #444 !important; } ::-webkit-scrollbar-thumb:hover { background: #555 !important; } /* Selection */ ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; } ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; } '; } function removeDarkMode() { var style = document.getElementById('universal-dark-mode-style'); if (style) style.remove(); } // Toggle with Alt+Shift+D document.addEventListener('keydown', function(e) { if (e.altKey && e.shiftKey && e.key === 'D') { e.preventDefault(); enabled = !enabled; if (enabled) { applyDarkMode(); console.log('[Universal Dark Mode] Enabled'); } else { removeDarkMode(); console.log('[Universal Dark Mode] Disabled'); } } }); // Apply on load applyDarkMode(); // Re-apply on dynamic content var observer = new MutationObserver(function(mutations) { if (enabled && !document.getElementById('universal-dark-mode-style')) { applyDarkMode(); } }); observer.observe(document.head, { childList: true }); console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle'); })(); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })(); Fix anchors for panel headers by jamos-tay · Pull Request #454 · MarkBind/markbind · GitHub
Skip to content

Fix anchors for panel headers - #454

Merged
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel
Nov 6, 2018
Merged

Fix anchors for panel headers#454
yamgent merged 3 commits into
MarkBind:masterfrom
jamos-tay:anchor-in-panel

Conversation

@jamos-tay

Copy link
Copy Markdown
Contributor

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

• [X] Bug fix

Fixes#442

What is the rationale for this request?

Anchors were not being generated for panel headers, and in a previous version do not redirect to the page when clicked.

What changes did you make? (Give an overview)

Anchors should now be generated for panel headers correctly.

The panel headers are stored in the panel's header attribute and rendered by vue, so headings weren't being picked up by Page. I worked around this by checking all panels for the header attribute and adding the anchor html there.

As for the links not working previously (see #442 (comment)), I added some code to setup.js to manually redirect the page when an anchor is clicked, it seems to be working as expected now.

@jamos-tay
jamos-tayforce-pushed the anchor-in-panel branch 3 times, most recently from e45d2b9 to c002fc2CompareOctober 15, 2018 12:35
@jamos-tay

jamos-tay commented Oct 15, 2018

Copy link
Copy Markdown
ContributorAuthor

The tests are passing locally on my machine (windows) but for some reason Travis seems to be failing.

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /. Here's a diff (expected | actual):

image

Could I get some help on this?

Comment threadtest/test_site/testUtil/diffHtml.js Outdated
}

if (isDiff(part) && !insidePath) {
if (isDiff(part) && !insidePath && !isPathSeparatorDiff(part.value)) {

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.

The change here allows for this situation to pass:
expected.html

<div> \ </div>

actual.html

<div> / <div>

@nicholaschuayunzhi

nicholaschuayunzhi commented Oct 16, 2018

Copy link
Copy Markdown
Contributor

Somehow when rendered on Travis the block of code I added causes the src attribute of panels to change, all the \ are converted to /.

The reason is because Travis is running a unix env and the path separator generated will be / whereas on Windows, it will be \.

As for the diff that is being shown, I would think my diffing code will account for that and not trigger an error. Sorry about that 🙏. I will help to look into the matter.

Also see my comment about your fix!

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

I found the bug:

its found in endsWithOpeningTag in diffHTML

The fragment that causes this is (note i've formatted it for readability)

<panel header="## Panel with src from another Markbind site header<a class='fa fa-anchor' href='#panel-with-src-from-another-markbind-site-header'></a>" src="/test_site
+/-\
sub_site/index._include_.html" expanded=""></panel>

To decide if the diff \ is found in a path, it checks if the diff

  1. is within a path - checking if there is a preceding src=" (yes)
  2. fragment is within a html tag
    • here i check if i find a > or < first.
      • if < is found its within a html tag - diff is in path
      • if > is found assume not within html tag - diff is not in path (and this is incorrect for the case above)

Would a good solution be to check the parity of the < and > ?

@jamos-tay

jamos-tay commented Oct 17, 2018

Copy link
Copy Markdown
ContributorAuthor

@nicholaschuayunzhi Nice! I'll go ahead and remove that line. Will wait for your PR to be merged first.

@nicholaschuayunzhi

Copy link
Copy Markdown
Contributor

@jamos-tay The fix has been merged to master, you can go ahead and rebase on master and also drop commits d6e6851 and eb2f83a

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Sure, updated 👍

@yamgent

Copy link
Copy Markdown
Member

Seems OK, but user-usability wise, I actually expected the anchor to have appeared when the mouse is inside the panel's header box, but as of now you must hover the mouse inside the header text in order to reveal it.

anchor

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Yeah... the dimensions of the header seems to be different for headers in panels.

I'll try and find a fix

@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

@yamgent Hey, think it should be fixed now.

There's still a minor nit where the anchor will disappear if the user hovers over the header text first, then moves the mouse right until the empty space (basically mouseleave gets triggered for the header), but fixing it would be quite troublesome and I think it's small enough to ignore.

@yamgent
yamgent self-requested a review October 31, 2018 03:04

@yamgentyamgent left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Awesome 👍

Just one minor nit left:

Comment threadtest/test_site/expected/markbind/js/setup.js
@jamos-tay

Copy link
Copy Markdown
ContributorAuthor

Changes made

@yamgentyamgent added this to the v1.14.1 milestone Nov 6, 2018
@yamgent
yamgent merged commit 91cdc98 into MarkBind:masterNov 6, 2018
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show anchor icons for heading inside panels

3 participants

@jamos-tay@nicholaschuayunzhi@yamgent