JQuery и ACE-Editor плохо работают вместе

Я создаю несколько модулей, чтобы обучать некоторых моих студентов основам программирования http://jsbin.com/pacaxoza/3/edit

Когда пользователь пишет свою собственную функцию, я хочу, чтобы редактор, который выделяет каждую строку по мере ее поступления, переходил к функции при ее вызове, чтобы пользователь мог видеть, что их функция читается при ее вызове. Все это есть в jsbin выше (холста с анимацией на основе кода нет в jsbin для наглядности).

В режиме Javascript Ace Editor окружает любые пользовательские функции в диапазоне с классом 'ace_function'. Я не смог найти простой способ найти и сохранить значения из созданных пользователем функций в методах ace, поэтому вместо этого я использую JQuery для поиска каждого диапазона с классом 'ace_function'. Я использую индекс JQuery, чтобы найти, в каких строках находятся эти функции, а затем передаю эту информацию методам ace для рендеринга.

Проблема в том, что если редактор прокручивается вверх, все работает нормально, но если вы прокручиваете что-либо в редакторе и нажимаете «Отправить», индексация редактора кажется отключенной на пару строк кода, и все ломается.

У кого-нибудь есть предложения по лучшему способу решения этой проблемы или что может быть причиной неустойчивого поведения?

Спасибо


person RyanY    schedule 23.05.2014    source источник


Ответы (1)


Ace использует виртуальную область просмотра и создает элементы dom только для видимых строк, поэтому использование jquery не сработает.
Вместо этого вам нужно использовать API Ace, session.getLine(number)->string, session.getTokens(number)->[{type, value}, ...].
tokenIterator также может быть полезен, см. https://github.com/ajaxorg/ace/blob/master/lib/ace/edit_session/bracket_match.js#L34 для примера

person a user    schedule 23.05.2014
comment
Итак, мне нужно найти каждую определяемую пользователем функцию, получить ее имя, начальную и конечную строки. Если я просто ищу слово, функция ace api не возвращает номер строки результатов поиска. Не существует метода поиска токенов, которые являются определяемыми пользователем функциями. Как лучше всего найти и получить информацию из функций, созданных пользователем? - person RyanY; 23.05.2014
comment
Как я уже сказал, используйте итератор токенов. См. jsbin.com/pacaxoza/5/edit, где я изменил обработчик кликов, getCode должен быть изменился аналогичным образом. - person a user; 23.05.2014