lint: caretPosition linting

src/static/js/caretPosition.js

@@ -1,18 +1,20 @@
+'use strict';
+
 // One rep.line(div) can be broken in more than one line in the browser.
 // This function is useful to get the caret position of the line as
 // is represented by the browser
-exports.getPosition = function () {
+exports.getPosition = () => {
   let rect, line;
-  const editor = $('#innerdocbody')[0];
   const range = getSelectionRange();
-  const isSelectionInsideTheEditor = range && $(range.endContainer).closest('body')[0].id === 'innerdocbody';
+  const isSelectionInsideTheEditor = range &&
+      $(range.endContainer).closest('body')[0].id === 'innerdocbody';
 
   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
     const selectionIsInTheBeginningOfLine = range.endOffset > 0;
     if (selectionIsInTheBeginningOfLine) {
-      var clonedRange = createSelectionRange(range);
+      const clonedRange = createSelectionRange(range);
       line = getPositionOfElementOrSelection(clonedRange);
       clonedRange.detach();
     }
@@ -20,7 +22,7 @@ exports.getPosition = function () {
     // 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) {
-      var clonedRange = createSelectionRange(range);
+      const clonedRange = createSelectionRange(range);
 
       // as we can't get the element height, we create a text node to get the dimensions
       // on the position
@@ -36,8 +38,8 @@ exports.getPosition = function () {
   return line;
 };
 
-var createSelectionRange = function (range) {
+const createSelectionRange = (range) => {
-  clonedRange = range.cloneRange();
+  const clonedRange = range.cloneRange();
 
   // we set the selection start and end to avoid error when user selects a text bigger than
   // the viewport height and uses the arrow keys to expand the selection. In this particular
@@ -48,7 +50,7 @@ var createSelectionRange = function (range) {
   return clonedRange;
 };
 
-const getPositionOfRepLineAtOffset = function (node, offset) {
+const getPositionOfRepLineAtOffset = (node, offset) => {
   // it is not a text node, so we cannot make a selection
   if (node.tagName === 'BR' || node.tagName === 'EMPTY') {
     return getPositionOfElementOrSelection(node);
@@ -66,7 +68,7 @@ const getPositionOfRepLineAtOffset = function (node, offset) {
   return linePosition;
 };
 
-function getPositionOfElementOrSelection(element) {
+const getPositionOfElementOrSelection = (element) => {
   const rect = element.getBoundingClientRect();
   const linePosition = {
     bottom: rect.bottom,
@@ -74,15 +76,15 @@ function getPositionOfElementOrSelection(element) {
     top: rect.top,
   };
   return linePosition;
-}
+};
 
 // here we have two possibilities:
-// [1] the line before the caret line has the same type, so both of them has the same margin, padding
+// [1] the line before the caret line has the same type, so both of them has the same margin,
-// height, etc. So, we can use the caret line to make calculation necessary to know where is the top
+// padding height, etc. So, we can use the caret line to make calculation necessary to know
-// of the previous line
+// where is the top 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) {
+exports.getPositionTopOfPreviousBrowserLine = (caretLinePosition, rep) => {
   let previousLineTop = caretLinePosition.top - caretLinePosition.height; // [1]
   const isCaretLineFirstBrowserLine = caretLineIsFirstBrowserLine(caretLinePosition.top, rep);
 
@@ -91,13 +93,14 @@ exports.getPositionTopOfPreviousBrowserLine = function (caretLinePosition, rep)
   if (isCaretLineFirstBrowserLine) { // [2]
     const lineBeforeCaretLine = rep.selStart[0] - 1;
     const firstLineVisibleBeforeCaretLine = getPreviousVisibleLine(lineBeforeCaretLine, rep);
-    const linePosition = getDimensionOfLastBrowserLineOfRepLine(firstLineVisibleBeforeCaretLine, rep);
+    const linePosition =
+      getDimensionOfLastBrowserLineOfRepLine(firstLineVisibleBeforeCaretLine, rep);
     previousLineTop = linePosition.top;
   }
   return previousLineTop;
 };
 
-function caretLineIsFirstBrowserLine(caretLineTop, rep) {
+const caretLineIsFirstBrowserLine = (caretLineTop, rep) => {
   const caretRepLine = rep.selStart[0];
   const lineNode = rep.lines.atIndex(caretRepLine).lineNode;
   const firstRootNode = getFirstRootChildNode(lineNode);
@@ -105,37 +108,28 @@ function caretLineIsFirstBrowserLine(caretLineTop, rep) {
   // to get the position of the node we get the position of the first char
   const positionOfFirstRootNode = getPositionOfRepLineAtOffset(firstRootNode, 1);
   return positionOfFirstRootNode.top === caretLineTop;
-}
+};
 
 // find the first root node, usually it is a text node
-function getFirstRootChildNode(node) {
+const getFirstRootChildNode = (node) => {
   if (!node.firstChild) {
     return node;
   } else {
     return getFirstRootChildNode(node.firstChild);
   }
-}
+};
 
-function getPreviousVisibleLine(line, rep) {
+const getDimensionOfLastBrowserLineOfRepLine = (line, rep) => {
-  if (line < 0) {
-    return 0;
-  } else if (isLineVisible(line, rep)) {
-    return line;
-  } else {
-    return getPreviousVisibleLine(line - 1, rep);
-  }
-}
-
-function getDimensionOfLastBrowserLineOfRepLine(line, rep) {
   const lineNode = rep.lines.atIndex(line).lineNode;
   const lastRootChildNode = getLastRootChildNode(lineNode);
 
   // we get the position of the line in the last char of it
-  const lastRootChildNodePosition = getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
+  const lastRootChildNodePosition =
+    getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
   return lastRootChildNodePosition;
-}
+};
 
-function getLastRootChildNode(node) {
+const getLastRootChildNode = (node) => {
   if (!node.lastChild) {
     return {
       node,
@@ -144,39 +138,42 @@ function getLastRootChildNode(node) {
   } else {
     return getLastRootChildNode(node.lastChild);
   }
-}
+};
 
 // here we have two possibilities:
 // [1] The next line is part of the same rep line of the caret line, so we have the same dimensions.
 // 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
+// [2] the next line is part of another rep line.
-// have to get the exactly dimension of it
+// It's possible this line has different dimensions, so we have to get the exactly dimension of it
-exports.getBottomOfNextBrowserLine = function (caretLinePosition, rep) {
+exports.getBottomOfNextBrowserLine = (caretLinePosition, rep) => {
   let nextLineBottom = caretLinePosition.bottom + caretLinePosition.height; // [1]
-  const isCaretLineLastBrowserLine = caretLineIsLastBrowserLineOfRepLine(caretLinePosition.top, rep);
+  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]
     const nextLineAfterCaretLine = rep.selStart[0] + 1;
     const firstNextLineVisibleAfterCaretLine = getNextVisibleLine(nextLineAfterCaretLine, rep);
-    const linePosition = getDimensionOfFirstBrowserLineOfRepLine(firstNextLineVisibleAfterCaretLine, rep);
+    const linePosition =
+      getDimensionOfFirstBrowserLineOfRepLine(firstNextLineVisibleAfterCaretLine, rep);
     nextLineBottom = linePosition.bottom;
   }
   return nextLineBottom;
 };
 
-function caretLineIsLastBrowserLineOfRepLine(caretLineTop, rep) {
+const caretLineIsLastBrowserLineOfRepLine = (caretLineTop, rep) => {
   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
-  const lastRootChildNodePosition = getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
+  const lastRootChildNodePosition =
+    getPositionOfRepLineAtOffset(lastRootChildNode.node, lastRootChildNode.length);
   return lastRootChildNodePosition.top === caretLineTop;
-}
+};
 
-function getPreviousVisibleLine(line, rep) {
+const getPreviousVisibleLine = (line, rep) => {
   const firstLineOfPad = 0;
   if (line <= firstLineOfPad) {
     return firstLineOfPad;
@@ -185,10 +182,12 @@ function getPreviousVisibleLine(line, rep) {
   } else {
     return getPreviousVisibleLine(line - 1, rep);
   }
-}
+};
+
+
 exports.getPreviousVisibleLine = getPreviousVisibleLine;
 
-function getNextVisibleLine(line, rep) {
+const getNextVisibleLine = (line, rep) => {
   const lastLineOfThePad = rep.lines.length() - 1;
   if (line >= lastLineOfThePad) {
     return lastLineOfThePad;
@@ -197,31 +196,28 @@ function getNextVisibleLine(line, rep) {
   } else {
     return getNextVisibleLine(line + 1, rep);
   }
-}
+};
 exports.getNextVisibleLine = getNextVisibleLine;
 
-function isLineVisible(line, rep) {
+const isLineVisible = (line, rep) => rep.lines.atIndex(line).lineNode.offsetHeight > 0;
-  return rep.lines.atIndex(line).lineNode.offsetHeight > 0;
-}
 
-function getDimensionOfFirstBrowserLineOfRepLine(line, rep) {
+const getDimensionOfFirstBrowserLineOfRepLine = (line, rep) => {
   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
   const firstRootChildNodePosition = getPositionOfRepLineAtOffset(firstRootChildNode, 1);
   return firstRootChildNodePosition;
-}
+};
 
-function getSelectionRange() {
+const getSelectionRange = () => {
-  let selection;
   if (!window.getSelection) {
     return;
   }
-  selection = window.getSelection();
+  const selection = window.getSelection();
   if (selection.rangeCount > 0) {
     return selection.getRangeAt(0);
   } else {
     return null;
   }
-}
+};