Convert editor to TypeScript

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

src/editor/caret.ts

@@ -0,0 +1,163 @@
+/*
+Copyright 2019 New Vector Ltd
+Copyright 2019 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import {needsCaretNodeBefore, needsCaretNodeAfter} from "./render";
+import Range from "./range";
+import EditorModel from "./model";
+import DocumentPosition, {IPosition} from "./position";
+import {BasePart} from "./parts";
+
+export type Caret = Range | DocumentPosition;
+
+export function setSelection(editor: HTMLDivElement, model: EditorModel, selection: Range | IPosition) {
+    if (selection instanceof Range) {
+        setDocumentRangeSelection(editor, model, selection);
+    } else {
+        setCaretPosition(editor, model, selection);
+    }
+}
+
+function setDocumentRangeSelection(editor: HTMLDivElement, model: EditorModel, range: Range) {
+    const sel = document.getSelection();
+    sel.removeAllRanges();
+    const selectionRange = document.createRange();
+    const start = getNodeAndOffsetForPosition(editor, model, range.start);
+    selectionRange.setStart(start.node, start.offset);
+    const end = getNodeAndOffsetForPosition(editor, model, range.end);
+    selectionRange.setEnd(end.node, end.offset);
+    sel.addRange(selectionRange);
+}
+
+export function setCaretPosition(editor: HTMLDivElement, model: EditorModel, caretPosition: IPosition) {
+    const range = document.createRange();
+    const {node, offset} = getNodeAndOffsetForPosition(editor, model, caretPosition);
+    range.setStart(node, offset);
+    range.collapse(true);
+
+    const sel = document.getSelection();
+    if (sel.rangeCount === 1) {
+        const existingRange = sel.getRangeAt(0);
+        if (
+            existingRange.startContainer === range.startContainer &&
+            existingRange.startOffset === range.startOffset &&
+            existingRange.collapsed === range.collapsed
+        ) {
+            // If the selection matches, it's important to leave it alone.
+            // Recreating the selection state in at least Chrome can cause
+            // strange side effects, like touch bar flickering on every key.
+            // See https://github.com/vector-im/riot-web/issues/9299
+            return;
+        }
+    }
+    sel.removeAllRanges();
+    sel.addRange(range);
+}
+
+function getNodeAndOffsetForPosition(editor: HTMLDivElement, model: EditorModel, position: IPosition) {
+    const {offset, lineIndex, nodeIndex} = getLineAndNodePosition(model, position);
+    const lineNode = editor.childNodes[lineIndex];
+
+    let focusNode;
+    // empty line with just a <br>
+    if (nodeIndex === -1) {
+        focusNode = lineNode;
+    } else {
+        focusNode = lineNode.childNodes[nodeIndex];
+        // make sure we have a text node
+        if (focusNode.nodeType === Node.ELEMENT_NODE && focusNode.firstChild) {
+            focusNode = focusNode.firstChild;
+        }
+    }
+    return {node: focusNode, offset};
+}
+
+export function getLineAndNodePosition(model: EditorModel, caretPosition: IPosition) {
+    const {parts} = model;
+    const partIndex = caretPosition.index;
+    const lineResult = findNodeInLineForPart(parts, partIndex);
+    const {lineIndex} = lineResult;
+    let {nodeIndex} = lineResult;
+    let {offset} = caretPosition;
+    // we're at an empty line between a newline part
+    // and another newline part or end/start of parts.
+    // set offset to 0 so it gets set to the <br> inside the line container
+    if (nodeIndex === -1) {
+        offset = 0;
+    } else {
+        // move caret out of uneditable part (into caret node, or empty line br) if needed
+        ({nodeIndex, offset} = moveOutOfUneditablePart(parts, partIndex, nodeIndex, offset));
+    }
+    return {lineIndex, nodeIndex, offset};
+}
+
+function findNodeInLineForPart(parts: BasePart[], partIndex: number) {
+    let lineIndex = 0;
+    let nodeIndex = -1;
+
+    let prevPart = null;
+    // go through to parts up till (and including) the index
+    // to find newline parts
+    for (let i = 0; i <= partIndex; ++i) {
+        const part = parts[i];
+        if (part.type === "newline") {
+            lineIndex += 1;
+            nodeIndex = -1;
+            prevPart = null;
+        } else {
+            nodeIndex += 1;
+            if (needsCaretNodeBefore(part, prevPart)) {
+                nodeIndex += 1;
+            }
+            // only jump over caret node if we're not at our destination node already,
+            // as we'll assume in moveOutOfUneditablePart that nodeIndex
+            // refers to the node  corresponding to the part,
+            // and not an adjacent caret node
+            if (i < partIndex) {
+                const nextPart = parts[i + 1];
+                const isLastOfLine = !nextPart || nextPart.type === "newline";
+                if (needsCaretNodeAfter(part, isLastOfLine)) {
+                    nodeIndex += 1;
+                }
+            }
+            prevPart = part;
+        }
+    }
+
+    return {lineIndex, nodeIndex};
+}
+
+function moveOutOfUneditablePart(parts: BasePart[], partIndex: number, nodeIndex: number, offset: number) {
+    // move caret before or after uneditable part
+    const part = parts[partIndex];
+    if (part && !part.canEdit) {
+        if (offset === 0) {
+            nodeIndex -= 1;
+            const prevPart = parts[partIndex - 1];
+            // if the previous node is a caret node, it's empty
+            // so the offset can stay at 0
+            // only when it's not, we need to set the offset
+            // at the end of the node
+            if (!needsCaretNodeBefore(part, prevPart)) {
+                offset = prevPart.text.length;
+            }
+        } else {
+            nodeIndex += 1;
+            offset = 0;
+        }
+    }
+    return {nodeIndex, offset};
+}