Сайты, сайты, сайты требуют систему управления контентом, внутри которой, пользователю необходимо предоставить инструмент для создания/редактирования текстового контента. Не секрет, что существуют самые различные "готовые" визуальные редакторы текста, "бери — не хочу". Пишется админка, в состав которой вводятся "готовые" опенсорсовые визуальные редакторы текста.
А если Flash — сайт ? Тут можно пойти двумя путями: классическая CMS или CMS на Flex. Flex — хороший инструмент и запросто справиться с задачей, но в его состав входит визуальный редактор с малыми возможностями. Так например, картинку/swf в нем вставить нельзя, но получится отформатировать HTML текст пригодный для отображения в текстовых полях Flash. Еще одно "но"! Flex-разработчик это еще один специалист которого надо оплачивать. Намного привлекательнее классическая CMS, с которой справится обычный серверный программист. Заканчиваю перехожу к делу.
Настройка
По умолчанию "тини" имеет расширенные настройки и пишет HTML который, способны обработать только браузеры. Flash - не браузер и нам необходимо настроить редактор, таким образом, что бы редактор делал разметку текста строго определенными тегами.
После такой настройки наш TInyMCE начинает вставлять только те HTML теги, которые поддерживает Flash. Описание и перечень этих тегов приведен ниже.
HTML теги поддерживаемые Flash
№
Тег
Описание
Атрибуты
1
<textformat>
Позволяет использовать в текстовых полях подгруппу свойств форматирования абзаца класса TextFormat, включая межстрочный интервал, отступы, поля и точки табуляции.
blockindent: задает отступ блока текста в точках;
indent: задает отступ от левого поля для первого символа абзаца;
leading: задает величину интервала (пробела по вертикали) между строками;
leftmargin: задает левое поле абзаца в точках;
rightmargin: задает правое поле абзаца в точках;
tabstops: задает пользовательские точки табуляции в качестве массива неотрицательных целых чисел;
2
<span>
Доступен только при использовании вместе со стилями текста CSS.
class: задает класс стиля CSS
3
<u>
Подчеркивает заключенный в него текст
4
<p>
Создает новый абзац
align: задает выравнивание текста в абзаце. Допускаются следующие значения: left, right, justify и center
class: задает класс стиля CSS
5
<li>
Помещает маркер перед заключенным в него текстом. Примечание. Так как проигрыватель Flash Player не распознает теги упорядоченного и неупорядоченного списка (<ol> и <ul>), они не модифицируют визуализацию списка. Все списки являются неупорядоченными, и для всех элементов списка используются маркеры.
6
<i>
Отображает заключенный в него текст курсивом. Для используемого шрифта должно быть доступно курсивное начертание.
7
<img>
Позволяет встраивать в текстовые поля внешние файлы изображений (JPEG, GIF, PNG), SWF-файлы и фрагменты роликов. Текст автоматически обтекает изображения, встроенные в текстовые поля. Необходимо определить текстовое поле как многострочное, чтобы текст обтекал изображение.
src: задает URL-ссылку на изображение или SWF-файл, либо идентификатор связи для символа фрагмента ролика в библиотеке. Это обязательный атрибут, все остальные атрибуты — необязательные.
width: ширина в пикселах вставляемого изображения, SWF-файла или фрагмента ролика.
height: высота в пикселах вставляемого изображения, SWF-файла или фрагмента ролика.
align: задает для встраиваемого изображения выравнивание по горизонтали в текстовом поле. Допускаются значения left (по левому краю) и right (по правому краю). Значение по умолчанию — left.
hspace: задает величину пробела по горизонтали, окружающего изображение, где не отображается текст. Значение по умолчанию 8.
vspace: задает величину пробела по вертикали, окружающего изображение, где не отображается текст. Значение по умолчанию 8.
id: задает имя экземпляра фрагмента ролика (созданного проигрывателем Flash Player), который содержит встраиваемое изображение SWF-файл или фрагмент ролика. Этот подход используется для управления встроенным содержимым с помощью ActionScript.
checkPolicyFile: предписывает проигрывателю Flash Player проверять файл политик для URL на сервере, связанном с доменом изображения. Если файл политики существует, SWF-файлы в указанном в нем домене могут обращаться к данным загруженного изображения, например путем вызова метода BitmapData.draw() в котором данное изображение указано в качестве параметра source. Дополнительную информацию см. в главе "Безопасность Flash Player" руководства Программирование на ActionScript 3.0.
8
<font>
Задает шрифт или список шрифтов для отображения текста.
color: поддерживаются только шестнадцатеричные значения цветов (#FFFFFF).
face: задает имя используемого шрифта. Как показано в следующем примере, можно задать список разделенных запятыми имен шрифтов, тогда проигрыватель Flash Player выбирает первый доступный шрифт. Если заданный шрифт не установлен в локальной компьютерной системе или не встроен в SWF-файл, проигрыватель выбирает подстановочный шрифт.
size: задает размер шрифта. Можно использовать абсолютные размеры в пикселах, такие как 16 или 18, либо относительные кегли, такие как +2 или -4.
9
<br>
Создает разрыв строки в текстовом поле. Чтобы использовать этот тег, определите текстовое поле как многострочное.
10
<b>
Изменяет начертание текста на полужирное. Для используемого шрифта должно быть доступно полужирное написание.
11
<a>
Создает гипертекстовую ссылку
target: указывает имя целевого окна, где загружается страница. Возможные значения: _self, _blank, _parent и _top. Вариант _self задает текущий фрейм текущего окна, _blank задает новое окно, _parent задает предка текущего фрейма, а _top задает фрейм верхнего уровня текущего окна.
href: указывает URL-адрес или событие link в ActionScript. URL-адрес может быть абсолютным или указываться относительно местоположения SWF-файла, загружающего страницу. Абсолютная ссылка на URL выглядит так: http://www.adobe.com. А вот пример относительной ссылки: /index.html. Абсолютные URL должны иметь префикс http://, иначе проигрыватель Flash воспримет их как относительные. Можно использовать событие link, чтобы ссылка выполняла функцию ActionScript в SWF-файле, а не открывала URL. Для определения события link используйте схему событий, а http в атрибуте href. То есть, href="event:myText" вместо href="http://myURL". Когда пользователь щелкает гипертекстовую ссылку, содержащую схему события, текстовое поле отправляет объект TextEvent с именем link, свойство text которого имеет значение myText. После этого можно создать функцию ActionScript, которая будет выполняться при отправке события TextEvent с именем link. Также для тегов привязки можно определить стили a:link, a:hover и a:active с помощью таблиц стилей.
4 Responses to “Настройка TinyMCE для редактирования HTML текста во Flash”
У меня почему-то не работает это редактирование. Не могу от TinyMCE добится того, чтобы редактирование возможно было без тега . Даже с добавлением в админку строки convert_fonts_to_spans:false ничего не получается. Текст не центрируется и не меняется размер, т.к. флэш не поддерживает добавления стилей в сами теги, например – Hello world.
Буду благодарен, если чем-то поможете.
7 марта, 2009 в 1:01
Спасибо! Создал flash сайт с админкой на Drupal. И как раз вчера встал вопрос как непонимающим в html людям форматировать текст.
3 февраля, 2010 в 22:03
Ребят, я может немного не в тему…, подскажите плиз, как php ming с кириллицей подружить? Делаю:
$f = new SWFFont( ‘_sans’ );
$t = new SWFTextField();
$t->setFont( $f );
$t->setColor( 0, 0, 0 );
$t->setHeight( 16 );
$t->addString( ‘Текст’ );
$m = new SWFMovie();
$m->setDimension( 500, 800 );
$m->add( $t );
header(‘Content-type: application/x-shockwave-flash’);
$m->output();
А на выходе абракадабра, преобразовывал через iconv, пробовал разные варианты, ничего не помогло, подскажите куда копать?
19 марта, 2010 в 18:01
Добрый день.
А вы можете помочь встроить редактор на работающем сайте разработанном на FlashDevelop? Очень нужна помощь и консультация.
16 августа, 2010 в 18:49
У меня почему-то не работает это редактирование. Не могу от TinyMCE добится того, чтобы редактирование возможно было без тега . Даже с добавлением в админку строки convert_fonts_to_spans:false ничего не получается. Текст не центрируется и не меняется размер, т.к. флэш не поддерживает добавления стилей в сами теги, например – Hello world.
Буду благодарен, если чем-то поможете.