Javenue logo

Javenue

Программирование на Java

Информационные технологии

Подсветка синтаксиса - javascript syntax highlighter

[Disclamer: статья устарела и скоро будет переписана]

Надеюсь, данная статья поможет сэкономить время владельцам веб-ресурсов, посвященным 1С Бухгалтерии и 1С Предприятию.

Проблема заключалась в том, что в интернете отсутствует какая-либо библиотека для подсвтеки синтаксиса кода. Как ни странно, она была мне очень нужна. В итоге я принял единственно правильное решение: найти любую открытую библиотеку (желательно pure javascript) и создать для нее 1С скин.

Такая библиотека была найдена - это Syntax Highliter.

Для начала несколько слов о самой библиотеке.

Syntax Highliter - это библиотека, написанная на javascript, которая позволяет постить куски кода с подсветкой синтаксиса на интернет-ресурсах. Реализована библиотека на основе регулярных выражений, поэтому не стоит ею злоупотреблять (50-100 строк кода будет рендериться достаточно быстро). В данный момент поддерживаются следующие языки - C++, C#, Delphi, Java, Javascript, Php, Python, Ruby, Sql, Visual Basic, Xml, CSS. Для каждого языка выделен свой модуль, например для Java - shBrushJava.js.

Для того, чтобы заставить это работать, необходимо написать следующее у себя на странице:

    <link type='text/css' rel='stylesheet' href='css/SyntaxHighlighter.css'></link>
    <script language='javascript' src='js/shCore.js'></script>
    <script language="javascript" src='js/shBrushJava.js'></script>
    <script language='javascript'>
        dp.SyntaxHighlighter.ClipboardSwf = '/flash/clipboard.swf';
        dp.SyntaxHighlighter.HighlightAll('code');
    </script>

Автор библиотеки рекомендует располагать код скриптов как можно ниже на странице (это связано с тем, что библиотека делает необходимые замены в DOMe HTML уже после загрузки страницы).

Код, который необходимо подсветить, нужно обрамить в тег pre (или textarea), а также указать ему имя (name) и класс (class):

    <pre name="code" class="java">
    ... some code here ...
    </pre>

Как раз по name метод HighlightAll и найдет куски кода, синтаксис которых нужно подсветить. В общем, ничего сложного.

Помучившись с регулярными выражениями, мне удалось сделать бета-версию модуля подсветки синтаксиса для 1С Бухгалтерии и 1С Предприятия. Вот что получается при его использовании:

Пример подсветки синтаксиса для 1С Предприятия

Не пытайтесь найти смысл в приведенном выше фрагменте кода.

В модуле есть недостатки:

1. если после знака пунктуации сразу же идет ключевое слово без пробела, то знак пунктуации дублируется. Обход - всегда ставить пробел после знаков (даже после открывающих и закрывающих скобок).

Баг связан с тем, что в javascript отсутствует positive lookbehind. Так как я не являюсь большим специалистом ни в javascript, ни в regexp, проблему решить я так и не смог. В конце статьи вы найдете ссылку, которая может натолкнуть вас на мысли о решении этого бага.

2. вы наверное обратили внимание, что подсветка синтаксиса сделана на другой странице. Проблема в том, что блог Javenue использует UTF-8 в качестве кодировки, но опять же в связи с отсутствием знаний укротить javascript мне удалось только для кодировки windows-1251 (смотрите значение charset).

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

Ссылки:


Комментариев: 0

  Выйти

  * для публикации комментариев нужно