working clicking on side div line number to set line number hash and then on visiting scrolling back into view

scroll-to-line-with-scroll.js
John McLear 2020-12-08 15:36:06 +00:00
parent d25010d5d7
commit ea2c2949c1
2 changed files with 30 additions and 1 deletions

View File

@ -101,6 +101,7 @@ body.mozilla, body.safari {
font-size: 9px; font-size: 9px;
padding: 0 14px 0 10px; padding: 0 14px 0 10px;
font-family: monospace; font-family: monospace;
cursor: pointer;
} }
.plugin-ep_author_neat #sidedivinner.authorColors .line-number { .plugin-ep_author_neat #sidedivinner.authorColors .line-number {
padding-right: 10px; padding-right: 10px;

View File

@ -1,3 +1,4 @@
'use strict';
/** /**
* This code is mostly from the old Etherpad. Please help us to comment this code. * This code is mostly from the old Etherpad. Please help us to comment this code.
* This helps other people to understand this code better and helps them to improve it. * This helps other people to understand this code better and helps them to improve it.
@ -29,7 +30,7 @@ const padeditor = (function () {
let pad = undefined; let pad = undefined;
let settings = undefined; let settings = undefined;
var self = { const self = {
ace: null, ace: null,
// this is accessed directly from other files // this is accessed directly from other files
viewZoom: 100, viewZoom: 100,
@ -41,6 +42,33 @@ const padeditor = (function () {
function aceReady() { function aceReady() {
$('#editorloadingbox').hide(); $('#editorloadingbox').hide();
if (readyFunc) { if (readyFunc) {
// If a number is in the URI IE #L124 go to that line number
const lineNumber = window.location.hash.substr(1);
if (lineNumber) {
if (lineNumber[0] === 'L') {
const lineNumberInt = parseInt(lineNumber.replace('L', ''));
const $inner = $('iframe[name="ace_outer"]').contents().find('iframe')
.contents().find('#innerdocbody');
const line = $inner.find(`div:nth-child(${lineNumberInt})`);
if (line.length !== 0) {
let offsetTop = line.offset().top;
const $outerdoc = $('iframe[name="ace_outer"]').contents().find('#outerdocbody');
offsetTop += parseInt($outerdoc.css('padding-top').replace('px', ''));
offsetTop += parseInt($inner.css('padding-top').replace('px', ''));
const $outerdocHTML = $('iframe[name="ace_outer"]').contents()
.find('#outerdocbody').parent();
$outerdoc.css({top: `${offsetTop}px`}); // Chrome
$outerdocHTML.animate({scrollTop: offsetTop}); // needed for FF
}
}
}
const $outerdoc = $('iframe[name="ace_outer"]').contents().find('#outerdocbody');
// Listen for clicks on sidediv items
$outerdoc.find('#sidedivinner').on('click', 'div', function() {
const lineNumber = $(this).index() + 1;
window.location.hash = 'L' + lineNumber;
})
readyFunc(); readyFunc();
} }
} }