webapp/bookstack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-28 17:02:04 +03:00
Code Activity

Adds edit icon to each header in the page.

Browse Source 
Towards #618

Signed-off-by: Abijeet <abijeetpatro@gmail.com>
This commit is contained in:
Abijeet
2018-06-03 13:47:07 +05:30
parent 86f43c8a65
commit 134a96fa32
5 changed files with 71 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
resources/assets/js/components/page-display.js
View File

@ -11,6 +11,7 @@ class PageDisplay {
this.setupPointer();
this.setupStickySidebar();
this.setupNavHighlighting();
this.setupEditOnHeader();
// Check the hash on load
if (window.location.hash) {
@ -219,7 +220,31 @@ class PageDisplay {
}
}
}
setupEditOnHeader() {
const headingEditIcon = document.querySelector('.heading-edit-icon');
if (headingEditIcon.length === 0) {
// user does not have permission to edit.
return;
}
// Create a clone of the edit icon without the hidden class
const visibleHeadingEditIcon = headingEditIcon.cloneNode(true);
visibleHeadingEditIcon.style.display = '';
const headings = document.querySelector('.page-content').querySelectorAll('h1, h2, h3, h4, h5, h6');
// add an edit icon to each header.
for (let i = 0; i !== headings.length; ++i) {
const currHeading = headings[i];
const headingId = currHeading.id;
let editIcon = visibleHeadingEditIcon.cloneNode(true);
editIcon.href += `#${headingId}`;
currHeading.appendChild(editIcon);
}
}
}
module.exports = PageDisplay;
module.exports = PageDisplay;