Подсветка кода в textarea

Наткнулся на один очень интересный проект, под названием CodeMirror. Он позволяет подсвечивать большинство популярных языков программирования. Все подробности ниже.И так, поддерживаемые языки:

JavaScript
XML/HTML
CSS
SPARQL
HTML mixed-mode
HTML+PHP mixed-mode
Python
Lua
Ruby
SQL
PLSQL
diff
Groovy
C#

Как он выглядит в работе можно посмотреть на странице проекта выбрав интересующий язык.

А теперь о использовании.

Работает все довольно просто, для начала нужно скачать скрипт, на момент написания статьи это 0,67 (обновления смотрим на страничке проекта). Из архива нам необходимы лишь папочки JS и CSS. Разбор полета приведу на примере HTML «mixed-mode».
<textarea id="code" cols="120" rows="30">
<!-- произвольный html/css код -->
</textarea>

Чуть пониже:
<script type="text/javascript">
  var editor = CodeMirror.fromTextArea(&apos;code&apos;, {
    height: "350px",
    parserfile: ["parsexml.js", "parsecss.js", "tokenizejavascript.js", "parsejavascript.js", "parsehtmlmixed.js"],
    stylesheet: ["css/xmlcolors.css", "css/jscolors.css", "css/csscolors.css"],
    path: "js/"
  });
</script>

Как видно из кода, в JS задаются такие параметры как высота textarea а так же какие именно мы хотим подсвечивать языки (parserfile и stylesheet). Как видите все очень просто и понятно, удачи!
Добавлено: 01 Января 2015 11:39:46 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...