C#: Как сделать свой текстовый редактор, на примере редактора кода C#, JS - видео HD

C#: Как сделать свой текстовый редактор, на примере редактора кода C#, JS - видео
00:17:32
Обнаружено блокирование рекламы на сайте

Для существования нашего сайта необходим показ рекламы. Просим отнестись с пониманием и добавить сайт в список исключений вашей программы для блокировки рекламы (AdBlock и другие).

12n.ru 18787 роликов

Как сделать свой текстовый редактор, на примере редактора кода C#, JS - видео.

В этом видео расскажу об очень интересной теме. Редактирование документов, в браузере. Многие из вас видели всякие реализации редакторов прямо в браузере. Я расскажу как сделать свой.

github.com/AlexanderZhelnin/angular-code-editor
RSS
Архитектор ПО. Александр Желнин
06:33
+2
function GetCursorPosition(context: any): number
{
const selection = window.getSelection();
if (!selection) return 0;
const range = selection.getRangeAt(0);
range.setStart(context, 0);
return range.toString().length;
}

function setCursorPosition(context: any, len: number): void
{
const selection = window.getSelection();
if (!selection) return;
const pos = getTextNodeAtPosition(context, len);
selection.removeAllRanges();
const r = new Range();
r.setStart(pos.node, pos.position);
selection.addRange®;
}

function getTextNodeAtPosition(root: any, index: number): { node: any, position: number }
{
const treeWalker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT,
{
acceptNode: (elem: Node): number =>
{
const l = elem?.textContent?.length ?? 0;
if (index > l)
{
index -= l;
return NodeFilter.FILTER_REJECT;
}
return NodeFilter.FILTER_ACCEPT;
}
});

return { node: treeWalker.nextNode() ?? root, position: index };
}
Команда Дельта
10:21
+1
Спасибо большое!
FaVaKu
18:30
+1
Большое спасибо!!!
FaVaKu
11:57
+1
А можно ли сделать полноценный компилятор с выводом в консоль?
FaVaKu
20:26
+1
А есть полноценный код которое указан в видео?
Artem_Ka
14:40
+1
Спасибо, полезное видео!

Новости

«Портовый Альянс» перевел учет 10 тыс. ИТ-активов в SimpleOne ITAM RED Security ускорит переход на криптошлюзы «С-Терра» 5.0 благодаря новой аккредитации ИИ-Ассистент в «СёрчИнформ КИБ» поддержал пользовательские промпты Защита информации в финсекторе: технические меры по ГОСТ 57580.1 СЭД «Дело» 26.0: поддержка МЭДО 3.0 и другие улучшения

«Портовый Альянс» перевел учет 10 тыс. ИТ-активов в SimpleOne ITAM


13 часов назад
«Портовый Альянс» перевел учет 10 тыс. ИТ-активов в SimpleOne ITAM
«Портовый Альянс» перевел учет 10 тыс. ИТ-активов в SimpleOne ITAM
RED Security ускорит переход на криптошлюзы «С-Терра» 5.0 благодаря новой аккредитации
RED Security ускорит переход на криптошлюзы «С-Терра» 5.0 благодаря новой аккредитации
ИИ-Ассистент в «СёрчИнформ КИБ» поддержал пользовательские промпты
ИИ-Ассистент в «СёрчИнформ КИБ» поддержал пользовательские промпты
Защита информации в финсекторе: технические меры по ГОСТ 57580.1
Защита информации в финсекторе: технические меры по ГОСТ 57580.1
СЭД «Дело» 26.0: поддержка МЭДО 3.0 и другие улучшения
СЭД «Дело» 26.0: поддержка МЭДО 3.0 и другие улучшения