scrapbox-cursor-position-3
scrapboxのcursorの縦棒の位置を取得する関数
返り値
tstype Return = {
left?: HTMLSpanElement; // cursorの左側のDOM
right?: HTMLSpanElement; // cursorの右側のDOM
line: HTMLDivElement; // cursorのいる行
index?: number; // cursorの縦棒がいる位置
};
cursorの縦棒の位置が特定できなかったら line
以外 undefined
となる
縦棒の左側のDOMを取得するようにしていたので、行頭に縦棒が来たときエラーになる不具合があった
2021-05-08
15:32:44 コピペしやすいように相対パスに変えた
2020-12-29
10:22:18 cursorが見えないときでも座標を取得できるようにした
dependencies
script.jsimport {char as c} from '../scrapbox-char-info/script.js';
import {getCharBorder} from '../scrapbox-position/script.js';
import {scrapboxDOM} from '../scrapbox-dom-accessor/script.js';
export const cursor = () => {
const origin = scrapboxDOM.editor.getBoundingClientRect();
const x = origin.left + parseInt(scrapboxDOM.cursor.style.left);
const y = origin.top + parseInt(scrapboxDOM.cursor.style.top);
2020-12-29
10:22:18 cursorが見えないときでも座標を取得できるようにした
script.js const {left, right, line, message} = getCharBorder({x, y});
if (message) return {line, message};
const index = right ? c(right).index : c(left).index + 1;
↑ right === undefined
のときは常に行末である
折返し地点においたcursorは常に先頭に表示されるので、折り返し地点の末尾である可能性はない
script.js return {left, right, line, index};
}
テストコード
test.jsimport {cursor} from '../scrapbox-cursor-position-3/script.js';
document.addEventListener('keydown', () => {
const c = cursor();
if (!c.left && ! c.right) throw Error('[test:scrapbox-cursor-position-3] Both char DOMs are undefined.');
console.log('[test:scrapbox-cursor-position-3] %o', c);
});