Если Вы заметили ошибку, выделите ее и нажмите Ctrl+Enter

Для разработчиков

Материал из OrthoWiki

Перейти к: навигация, поиск

Содержание

Чего интересного уже есть:

В процессе разработки словаря было реализовано ряд полезных скриптов, которые могли бы быть использованы разработчиками в других проектах.

Стили

Перед тем как начать работу с церковнославянским текстом, необходимо установить некоторые стили. В orthodic.org используются следующие классы стилей:

  • cs - для отображения текста церковнославянскими шрифтами.
  • draw-cs - тот же церковнославянский текст, но в дальнейшем будет преобразован в изображения слов, если у посетителя не установлены церковнославянские шрифты.
<style type="text/css">
    .cs, .draw-cs {font-family:"Triodion ieUcs","OrthodoxTT ieUcs8","Orthodox.tt ieUcs8","StaroUspenskaya ieUcs","Pochaevsk ieUcs","Feofan ieUcs","Evangelie ieUcs","Orthodox ieUcs8","OrthodoxT1 ieUcs8","Irmologion ieUcs" !important;}
    .draw-cs img{border:none}
</style>

Особенности работы

Следует отметить, что подключать скрипт лучше в <head>:

<script type="text/javascript" src="http://www.orthodic.org/scripts/orthodic_org.js"></script>

А вот использовать различные его методы в <body>. Иначе, если их тоже расположить в <head> они работать не будут.

Установлен ли церковнославянский шрифт у посетителя


Возвращает true иди false в зависимости от того найдены ли были в системе у посетителя шрифты из следующего списка:

  • OrthodoxTT ieUcs8
  • Orthodox.tt ieUcs8
  • Triodion ieUcs
  • Irmologion ieUcs
  • StaroUspenskaya ieUcs
  • Pochaevsk ieUcs
  • Feofan ieUcs
  • Evangelie ieUcs
  • Orthodox ieUcs8
  • OrthodoxT1 ieUcs8

Пример использования:

<!-- подключаем библиотеку (желательно в head) -->
<script type="text/javascript" src="http://www.orthodic.org/scripts/orthodic_org.js"></script>

<!-- .... -->

<!-- А этот скрипт уже в body: -->
<script type="text/javascript">
    // Пример работы:
    if (orthodic_org.hasAnyFont()){
        alert('В Вашей системе церковнославянские шрифты установлены');
    }else{
        alert('В Вашей системе церковнославянские шрифты не установлены');
    }
</script>

Установлен ли в системе у посетителя заданный шрифт?

В качестве параметра принимает имя шрифта, который ищем в системе Возвращает true или false

Пример использования:

<!-- подключаем библиотеку (желательно в head) -->
<script type="text/javascript" src="http://www.orthodic.org/scripts/orthodic_org.js"></script>

<script type="text/javascript">
    // Пример работы:
    // Установлен ли шрифт Triodion ieUcs?
    alert('В вашей системе шрифт "Triodion ieUcs" ' + (orthodic_org.hasFont("Triodion ieUcs")?'':'НЕ ') + 'установлен');

    // Установлен ли шрифт Arial?
    alert('В вашей системе шрифт "Arial" ' + (orthodic_org.hasFont("Arial")?'':'НЕ ') + 'установлен');
</script>

Отображение церковнославянского текста посетителю, у которого не установлены церковнославянские шрифты

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

С помощью этого метода производится поиск церковнославянского текста в тегах, которые имеют класс "draw-cs" (данный класс можно сменить) и замена их на набор изображений. Параметрами может быть передано:

  • node - узел в котором производится поиск тегов с классом draw-cs. Если параметр не передан, производится поиск по всему документу
  • tag - тег, который должен содержать церковнославянский текст. Помогает ускорить поиск и преобразование текста. По умолчанию ищется по всех тегах узла node

Пример использования:

<div id="gospel">
    <h1 class="draw-cs">Н0вый завётъ ГDа нaшегw Ї}са хrтA</h1>
    <ul>
            <li class="draw-cs">T матfeа с™0е бlговэствовaніе</li>
            <li class="draw-cs">T мaрка с™0е бlговэствовaніе</li>
            <li class="draw-cs">T луки2 с™0е бlговэствовaніе</li>
            <li class="draw-cs">T їwaнна с™0е бlговэствовaніе</li>
    </ul>
</div>

Самый простой способ преобразования:

<script type="text/javascript">
    orthodic_org.draw();
</script>

Более быстрым будет, если мы укажем узел, в котором надо искать церковнославянский текст:

<script type="text/javascript">
    orthodic_org.draw(document.getElementById('gospel'));
</script>

Зачем же нам переводить текст в изображения, если у пользователя и так установлен церковнославянский шрифт?

<script type="text/javascript">
    if (!orthodic_org.hasAnyFont()){
        orthodic_org.draw(document.getElementById('gospel'));
    }
</script>

По-умолчанию рисуется черный текст на белом фоне размером 20pt. Эти и другие параметры можно изменить с помощью следующих методов:

  • setColor('#color') - установка цвета шрифта
  • setBackgroundColor('#color') - установка цвета фона
  • setFontSize(int size) - задать размер шрифта (в pt - целое число)

А так же:

  • setHeight(int h) - задать высоту изображения в px (по-умолчанию 45px)
  • setTop(int top) - задать отступ сверзу в px (по-умлочанию - 30)
  • setLeft(int left) - задать отступ слева в px (по-умолчанию - 0)

Пример: нужно отрисовать заголовок (тег h1) красным шрифтом большими буквами (24pt):

<script type="text/javascript">
    if (!orthodic_org.hasAnyFont()){
        // рисуем пункты списка
        orthodic_org.draw(document.getElementById('gospel'), 'li');

        // рисуем заголовок
        orthodic_org.setColor('#f00');
        orthodic_org.setFontSize('24');
        orthodic_org.draw(document.getElementById('gospel'), 'h1');
    }
</script>

Церковнославянский редактор

Для ввода церковнославянского текста со сходной с пакетом "Ирмологий" раскладкой клавиатуры может использоваться javascript-церковнославянский редактор. Активизация его может быть произведена следующим образом:

<!-- Подключаем скрипт (желательно в head) -->
<script type="text/javascript" src="http://www.orthodic.org/scripts/jsUcs.js"></script>

<!-- В элемент формы для ввода (imput или textarea) ставим событие onkeydown -->
<input type="text" class="cs" onkeydown="return jsUcs.main(this, event)" />

Примечания:

  • Редактор пока работает только для браузера firefox
  • Для того, что бы текст был церковнославянский текст при вводе был читабельным, надо ставить достаточно большой размер шрифта (18-20pt).
  • Для ввода церковнославянского текста в таком поле пользователям Linux надо включить английскую раскладку
  • Не забудьте стилями задать церковнославянский шрифт (в даном случае class="cs")

Открытый исходный код

Церковнославянский словарь написан на php с использованием Zend Framework. Код относительно сносно задокументирован. Использовалось автоматическое тестирование. Разработка велась в svn, исходники свободно доступны для изучения и модификации здесь: https://bitbucket.org/eugenzor/orthodic


Что еще нужно сделать

  • Научить работать церковнославянский редактор с другими популярными браузерами
  • Внедрить кеширование при отдаче страниц словаря, что бы уменьшить нагрузку на базу данных и увеличить скорость работы словаря
  • Научить работать формы редактирования и добавления церковнославянских слов (в административном интерфейсе редактора http://orthodic.org/editor) через ajax что бы ускорить работу редакторов
  • Напечатать изображение церковнославянского слова на прозрачной подложке (пока получается только на каком-либо монотонной подложке, что не дает возможности использовать слова на немонотонных фонах)
Личные инструменты
ЦС тексты
Яндекс.Метрика Rambler's Top100 Система Orphus