mirrors/etherpad-lite
1
0
Fork 0
mirror of https://github.com/ether/etherpad-lite.git synced 2025-04-20 23:46:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

lint: Run eslint --fix on src/

Browse source
This commit is contained in:
Richard Hansen 2020-11-23 13:24:19 -05:00 • committed by John McLear
parent b8d07a42eb
commit 8e5fd19db2
109 changed files with 9061 additions and 10572 deletions
Download patch file Download diff file Expand all files Collapse all files

137
src/static/js/caretPosition.js
View file

@ -2,39 +2,39 @@
// This function is useful to get the caret position of the line as
// is represented by the browser
exports.getPosition = function () {
var rect, line;
var editor = $('#innerdocbody')[0];
var range = getSelectionRange();
var isSelectionInsideTheEditor = range && $(range.endContainer).closest('body')[0].id === 'innerdocbody';
let rect, line;
const editor = $('#innerdocbody')[0];
const range = getSelectionRange();
const isSelectionInsideTheEditor = range && $(range.endContainer).closest('body')[0].id === 'innerdocbody';
if(isSelectionInsideTheEditor){
if (isSelectionInsideTheEditor) {
// when we have the caret in an empty line, e.g. a line with only a <br>,
// getBoundingClientRect() returns all dimensions value as 0
var selectionIsInTheBeginningOfLine = range.endOffset > 0;
const selectionIsInTheBeginningOfLine = range.endOffset > 0;
if (selectionIsInTheBeginningOfLine) {
var clonedRange = createSelectionRange(range);
line = getPositionOfElementOrSelection(clonedRange);
clonedRange.detach()
clonedRange.detach();
}
// when there's a <br> or any element that has no height, we can't get
// the dimension of the element where the caret is
if(!rect || rect.height === 0){
if (!rect || rect.height === 0) {
var clonedRange = createSelectionRange(range);
// as we can't get the element height, we create a text node to get the dimensions
// on the position
var shadowCaret = $(document.createTextNode("|"));
const shadowCaret = $(document.createTextNode('|'));
clonedRange.insertNode(shadowCaret[0]);
clonedRange.selectNode(shadowCaret[0]);
line = getPositionOfElementOrSelection(clonedRange);
clonedRange.detach()
clonedRange.detach();
shadowCaret.remove();
}
}
return line;
}
};
var createSelectionRange = function (range) {
clonedRange = range.cloneRange();
@ -46,9 +46,9 @@ var createSelectionRange = function (range) {
clonedRange.setStart(range.endContainer, range.endOffset);
clonedRange.setEnd(range.endContainer, range.endOffset);
return clonedRange;
}
};
var getPositionOfRepLineAtOffset = function (node, offset) {
const getPositionOfRepLineAtOffset = function (node, offset) {
// it is not a text node, so we cannot make a selection
if (node.tagName === 'BR' || node.tagName === 'EMPTY') {
return getPositionOfElementOrSelection(node);
@ -58,21 +58,21 @@ var getPositionOfRepLineAtOffset = function (node, offset) {
node = node.nextSibling;
}
var newRange = new Range();
const newRange = new Range();
newRange.setStart(node, offset);
newRange.setEnd(node, offset);
var linePosition = getPositionOfElementOrSelection(newRange);
const linePosition = getPositionOfElementOrSelection(newRange);
newRange.detach(); // performance sake
return linePosition;
}
};
function getPositionOfElementOrSelection(element) {
var rect = element.getBoundingClientRect();
var linePosition = {
const rect = element.getBoundingClientRect();
const linePosition = {
bottom: rect.bottom,
height: rect.height,
top: rect.top
}
top: rect.top,
};
return linePosition;
}
@ -82,67 +82,66 @@ function getPositionOfElementOrSelection(element) {
// of the previous line
// [2] the line before is part of another rep line. It's possible this line has different margins
// height. So we have to get the exactly position of the line
exports.getPositionTopOfPreviousBrowserLine = function(caretLinePosition, rep) {
var previousLineTop = caretLinePosition.top - caretLinePosition.height; // [1]
var isCaretLineFirstBrowserLine = caretLineIsFirstBrowserLine(caretLinePosition.top, rep);
exports.getPositionTopOfPreviousBrowserLine = function (caretLinePosition, rep) {
let previousLineTop = caretLinePosition.top - caretLinePosition.height; // [1]
const isCaretLineFirstBrowserLine = caretLineIsFirstBrowserLine(caretLinePosition.top, rep);
// the caret is in the beginning of a rep line, so the previous browser line
// is the last line browser line of the a rep line
if (isCaretLineFirstBrowserLine) { //[2]
var lineBeforeCaretLine = rep.selStart[0] - 1;
var firstLineVisibleBeforeCaretLine = getPreviousVisibleLine(lineBeforeCaretLine, rep);
var linePosition = getDimensionOfLastBrowserLineOfRepLine(firstLineVisibleBeforeCaretLine, rep);
if (isCaretLineFirstBrowserLine) { // [2]
const lineBeforeCaretLine = rep.selStart[0] - 1;
const firstLineVisibleBeforeCaretLine = getPreviousVisibleLine(lineBeforeCaretLine, rep);
const linePosition = getDimensionOfLastBrowserLineOfRepLine(firstLineVisibleBeforeCaretLine, rep);
previousLineTop = linePosition.top;
}
return previousLineTop;
}
};
function caretLineIsFirstBrowserLine(caretLineTop, rep) {
var caretRepLine = rep.selStart[0];
var lineNode = rep.lines.atIndex(caretRepLine).lineNode;
var firstRootNode = getFirstRootChildNode(lineNode);
const caretRepLine = rep.selStart[0];
const lineNode = rep.lines.atIndex(caretRepLine).lineNode;
const firstRootNode = getFirstRootChildNode(lineNode);
// to get the position of the node we get the position of the first char
var positionOfFirstRootNode = getPositionOfRepLineAtOffset(firstRootNode, 1);
const positionOfFirstRootNode = getPositionOfRepLineAtOffset(firstRootNode, 1);
return positionOfFirstRootNode.top === caretLineTop;
}
// find the first root node, usually it is a text node
function getFirstRootChildNode(node) {
if(!node.firstChild){
if (!node.firstChild) {
return node;
}else{
} else {
return getFirstRootChildNode(node.firstChild);
}
}
function getPreviousVisibleLine(line, rep) {
if (line < 0) {
return 0;
}else if (isLineVisible(line, rep)) {
} else if (isLineVisible(line, rep)) {
return line;
}else{
} else {
return getPreviousVisibleLine(line - 1, rep);
}
}
function getDimensionOfLastBrowserLineOfRepLine(line, rep) {
var lineNode = rep.lines.atIndex(line).lineNode;
var lastRootChildNode = getLastRootChildNode(lineNode);
const lineNode = rep.lines.atIndex(line).lineNode;
const lastRootChildNode = getLastRootChildNode(lineNode);
// we get the position of the line in the last char of it
var lastRootChildNodePosition = getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
const lastRootChildNodePosition = getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
return lastRootChildNodePosition;
}
function getLastRootChildNode(node) {
if(!node.lastChild){
if (!node.lastChild) {
return {
node: node,
length: node.length
node,
length: node.length,
};
}else{
} else {
return getLastRootChildNode(node.lastChild);
}
}
@ -152,50 +151,50 @@ function getLastRootChildNode(node) {
// So, we can use the caret line to calculate the bottom of the line.
// [2] the next line is part of another rep line. It's possible this line has different dimensions, so we
// have to get the exactly dimension of it
exports.getBottomOfNextBrowserLine = function(caretLinePosition, rep) {
var nextLineBottom = caretLinePosition.bottom + caretLinePosition.height; //[1]
var isCaretLineLastBrowserLine = caretLineIsLastBrowserLineOfRepLine(caretLinePosition.top, rep);
exports.getBottomOfNextBrowserLine = function (caretLinePosition, rep) {
let nextLineBottom = caretLinePosition.bottom + caretLinePosition.height; // [1]
const isCaretLineLastBrowserLine = caretLineIsLastBrowserLineOfRepLine(caretLinePosition.top, rep);
// the caret is at the end of a rep line, so we can get the next browser line dimension
// using the position of the first char of the next rep line
if(isCaretLineLastBrowserLine){ //[2]
var nextLineAfterCaretLine = rep.selStart[0] + 1;
var firstNextLineVisibleAfterCaretLine = getNextVisibleLine(nextLineAfterCaretLine, rep);
var linePosition = getDimensionOfFirstBrowserLineOfRepLine(firstNextLineVisibleAfterCaretLine, rep);
if (isCaretLineLastBrowserLine) { // [2]
const nextLineAfterCaretLine = rep.selStart[0] + 1;
const firstNextLineVisibleAfterCaretLine = getNextVisibleLine(nextLineAfterCaretLine, rep);
const linePosition = getDimensionOfFirstBrowserLineOfRepLine(firstNextLineVisibleAfterCaretLine, rep);
nextLineBottom = linePosition.bottom;
}
return nextLineBottom;
}
};
function caretLineIsLastBrowserLineOfRepLine(caretLineTop, rep) {
var caretRepLine = rep.selStart[0];
var lineNode = rep.lines.atIndex(caretRepLine).lineNode;
var lastRootChildNode = getLastRootChildNode(lineNode);
const caretRepLine = rep.selStart[0];
const lineNode = rep.lines.atIndex(caretRepLine).lineNode;
const lastRootChildNode = getLastRootChildNode(lineNode);
// we take a rep line and get the position of the last char of it
var lastRootChildNodePosition = getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
const lastRootChildNodePosition = getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
return lastRootChildNodePosition.top === caretLineTop;
}
function getPreviousVisibleLine(line, rep) {
var firstLineOfPad = 0;
const firstLineOfPad = 0;
if (line <= firstLineOfPad) {
return firstLineOfPad;
}else if (isLineVisible(line,rep)) {
} else if (isLineVisible(line, rep)) {
return line;
}else{
} else {
return getPreviousVisibleLine(line - 1, rep);
}
}
exports.getPreviousVisibleLine = getPreviousVisibleLine;
function getNextVisibleLine(line, rep) {
var lastLineOfThePad = rep.lines.length() - 1;
const lastLineOfThePad = rep.lines.length() - 1;
if (line >= lastLineOfThePad) {
return lastLineOfThePad;
}else if (isLineVisible(line,rep)) {
} else if (isLineVisible(line, rep)) {
return line;
}else{
} else {
return getNextVisibleLine(line + 1, rep);
}
}
@ -206,23 +205,23 @@ function isLineVisible(line, rep) {
}
function getDimensionOfFirstBrowserLineOfRepLine(line, rep) {
var lineNode = rep.lines.atIndex(line).lineNode;
var firstRootChildNode = getFirstRootChildNode(lineNode);
const lineNode = rep.lines.atIndex(line).lineNode;
const firstRootChildNode = getFirstRootChildNode(lineNode);
// we can get the position of the line, getting the position of the first char of the rep line
var firstRootChildNodePosition = getPositionOfRepLineAtOffset(firstRootChildNode, 1);
const firstRootChildNodePosition = getPositionOfRepLineAtOffset(firstRootChildNode, 1);
return firstRootChildNodePosition;
}
function getSelectionRange() {
var selection;
let selection;
if (!window.getSelection) {
return;
return;
}
selection = window.getSelection();
if (selection.rangeCount > 0) {
return selection.getRangeAt(0);
return selection.getRangeAt(0);
} else {
return null;
return null;
}
}