scrapbox-cursor-position
scrapboxのcursorの縦棒の位置を取得する関数
返り値
tstype Return = {
left?: Char; // cursorの左側
right?: Char; // cursorの右側
line: Line; // cursorのいる行
};
cursorの縦棒の位置が特定できなかったら line
以外 undefined
となる
dependencies
script.jsimport {char as c} from '../scrapbox-char-accessor/script.js';
import {line as l} from '../scrapbox-line-accessor/script.js';
import {getBorder} 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)
+ parseInt(scrapboxDOM.cursor.style.height) / 2; // 誤検出を防ぐために、縦棒の真ん中辺りを指定しておく
return getBorder({x, y});
};
test code
jsimport('/api/code/programming-notes/scrapbox-cursor-position/test1.js');
test1.jsimport {cursor} from './script.js';
document.addEventListener('keydown', () => {
const c = cursor();
if (!c.left && !c.right) throw Error(`[test:scrapbox-cursor-position] Both char DOMs are undefined: ${c.message}`);
console.log('[test:scrapbox-cursor-position] ', c.left?.text, c.right?.text, c);
});