scrapbox-cursor-position

/icons/hr.icon

scrapboxのcursorがいる行と列を返す関数

ScrapVimなどで使う

引数

cursor: div.cursorを入れる

cursorの縦棒

lines: div.linesを入れる

scrapboxの行が入っているやつ

返り値

cursorがある場合

{id, column}

id:cursorがいる行のid

columncursorの右側の文字の位置

先頭を0とする

最後の文字のindex+1は改行文字を表す

ない場合

{error: 'The cursor doesn\'t has a focus.'}

code:getCursorInfo.js

export function getCursorInfo({lines, cursor}) {

// cursorのいる行を取得する

const cursorLine = lines.getElementsByClassName('cursor-line')?.0;

if (!cursorLine) return {error: 'The cursor doesn\'t has a focus.'};

// 行内の文字を<span>のまま取得する

const chars = [...cursorLine.querySelectorAll('spanclass^="c-"')];

// cursorのいる<span>を検索する

const cursorLeft = Math.round(cursor.getBoundingClientRect().left);

const targetChar = chars.find(char => {

const {left, right} = char.getBoundingClientRect();

return Math.round(left) <= cursorLeft && cursorLeft < Math.round(right);});

return {

id: cursorLine.id,

column: targetChar?

parseInt(targetChar.className.replace(/c-(\d+)/,'$1')) :

chars.length, // 改行文字として、最後の文字より一つ後ろの番号を返す

};

}