this.setupPointer();
this.setupStickySidebar();
this.setupNavHighlighting();
- this.setupEditOnHeader();
// Check the hash on load
if (window.location.hash) {
// Sidebar page nav click event
$('.sidebar-page-nav').on('click', 'a', event => {
- goToText(event.target.getAttribute('href').substr(1));
+ this.goToText(event.target.getAttribute('href').substr(1));
});
}
pointerShowing = false;
});
- let updatePointerContent = () => {
+ let updatePointerContent = ($elem) => {
let inputText = pointerModeLink ? window.baseUrl(`/link/${this.pageId}#${pointerSectionId}`) : `{{@${this.pageId}#${pointerSectionId}}}`;
if (pointerModeLink && inputText.indexOf('http') !== 0) inputText = window.location.protocol + "//" + window.location.host + inputText;
$pointer.find('input').val(inputText);
+
+ // update anchor if present
+ const $editAnchor = $pointer.find('#pointer-edit');
+ if ($editAnchor.length !== 0 && $elem) {
+ const editHref = $editAnchor.data('editHref');
+ const element = $elem[0];
+ const elementId = element.id;
+
+ // get the first 50 characters.
+ let queryContent = element.textContent && element.textContent.substring(0, 50);
+ $editAnchor[0].href = `${editHref}?content-id=${elementId}&content-text=${encodeURIComponent(queryContent)}`;
+ }
};
// Show pointer when selecting a single block of tagged content
// Show pointer and set link
let $elem = $(this);
pointerSectionId = $elem.attr('id');
- updatePointerContent();
+ updatePointerContent($elem);
$elem.before($pointer);
$pointer.show();
let $bookTreeParent = $sidebar.parent();
// Check the page is scrollable and the content is taller than the tree
- let pageScrollable = ($(document).height() > $window.height()) && ($sidebar.height() < $('.page-content').height());
+ let pageScrollable = ($(document).height() > ($window.height() + 40)) && ($sidebar.height() < $('.page-content').height());
// Get current tree's width and header height
let headerHeight = $("#header").height() + $(".toolbar").height();
}
}
}
- 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;