Flex и RIA блоги

Постоянно эволюционирующий Wallop переписывают на AS3 / Flex. В связи с этим Wallop уже довольно давно разыскивает Flash/Flex-разработчиков.

Интересно, что Wallop вырос из лаборатории Microsoft (это один из проектов их Social Computing Group—сейчас Microsoft остается со-инвестором этого стартапа), но они не спешат искать для этого проекта программистов под Silverlight / .NET / C#. Это странно, ведь Валлоп — отличная платформа для испытаний новой технологии на реальных пользователях.

Причем не только на конечных пользователях, но и на флэш-моддерах, которым давно предложена схама монетизации модов — флэш-плагинов для Wallop. Официальный пресс-релиз почти годовой давности гласит, что уже на тот момент на Вэллопе было произведено 17 тысяч денежных транзакций. Имея работающую схему монетизации контента для флэш-разработчиков, значительно легче конвертировать их в сильвер-программистов, так как они уже привязаны к работающей системе заработка на своем контенте. Тормозят или партизанят?

Facebook делает всех

Внимание Microsoft сейчас нацелено на Facebook, доминирование которого над остальными соц-сетями стало очевидным:

Иными словами, думайте о флэш-виджетах для Facebook :-)

Увидела свет новая версия любимого многими (за что его любят) инструмента Flash Development Tool 3.0. Сейчас для скачивания доступны две версии плагина: Basic и Professional. Обычная версия отличается от профессиональной отсутствием следующих возможностей:

(more…)

Как ни странно, но сегодня официальный релиз FDT 3. Релиз появился с немецкой точностью (как и было обещано). Пока впечатлениями поделится не могу, так как еще не скачал, но как только, так сразу.

Ну чтож, если FDT 3 работает с ActionScript 3, также как и предыдущие версии с ActionScript 2, то нас можно только поздравить.

UPD: Цитирую Nox Noctis:

Новая версия ФДТ поддерживает AS2.0 и AS3.0, и доступна в трех видах:
+ FDT 3.0 Basic (299 eur)
+ FDT 3.0 Professional (399 eur)
+ FDT 3.0 Enterprise (599 eur)
(апгрейд с FDT 1.5 — дешевле)

Для разработчиков опенсорсных проектов по-прежнему представляются бесплатные ключи.

Описание фич по ссылке: http://fdt.powerflasher.com/index.php?page=download

Корпоративная версия отличается от остальных тем, что
+ будет доступен продвинутый дебаггер
+ будет доступен продвинутый рефакторинг
(который в остальных вариантах комплектации присутствует только
на уровне переименования классов и пакетов)
+ будет доступен MXML парсер
+ будет предоставлен саппорт для разработчиков

На сегодняшний день эти фичи еще не реализованы, находятся в разработке.

UPD++ Для тех, кто хочет получить ключи к FDT бесплатно. Цитата из RuFlash

>> Если мне не изменяет память, Иван( Iv ) пробивал бесплатный FDT по проекту bezier.ru.Был ли получен ожидаемый результат?
> - нет, видимо они опенсорсными проектами считают только те, что живут на указанных ими доменах.

Нет, с доменами это не связано. Есть ряд правил, по которым они проверяют, что проект подходит.

Цитирую:

Для всех запросов мы проверяем:
- Насколько проект связан с флэш сообществом
- Действительно ли это опенсорсный проект?
Как распространяются исходники?
- В случае проектов osflash.org - как мы может идентифицировать юзера?
- Указан ли почтовый адрес разработчика на сайте проекта.
- Не является ли проект подставой для получения халявного ключа ;)

Если вы отправляете запрос на получение опенсорсного ключа, пожалуйста, постарайтесь облегчить нам эту проверку насколько возможно (прямые ссылки очень помогают).

Пожалуйста, отправляйте запросы только на fdt@powerflasher.com с внятным сабжем - “Open Source Project FDT Licence Key”. Пожалуйста, не присылайте реквесты на другие адреса.

Пожалуйста, учитывайте, что на обработку запроса уходит порядка недели. Оригинал: http://www.powerflasher.com/fdt/forum/viewtopic.php?t=139

Вышел релиз FDT 3.0 читать тут. Поделили продукт на 3 части, для маленьких, для средненньких и обещают для взрослых(с поддержкой mxml). Но что-то с ценами они намутили - для взрослыж 600-1 евро немного кусается, хотя если все что они заявили будте работать отлично я пожалуй скажу: “гудбай билдер”.

Я недавно щупал бетту FDT 3.0 была очень сырая и глючная, причем эти глюки лезли просто толпами, успели ли они поправить все это? вот вчем вопрос. Нужно побыстрее пощупать релиз может там все оки.

Вчера Рост писал о том что сегодня будет еще один ништяк под именем Saffron UML Tool. Я просто мечтаю запустить свои руки в это приложение, очень интересует - это всего лишь одна из красивых утилиток или же очень удобный инструмент.

А вообще нас жестоко … с редакторами, плюшки которые в остальных средах считаются необходимым минимумом для существования программера, нам выдют по одной и говорят, что мол мы придумали именно ту фичу которую вы хотели, посмотрите какие мы крутые.
Я долго думал каким же должен быть идеальный редактор, многое придумал ). Никто не хочет купить идею идеально редактора ? дорого отдам!

Вышел релиз FDT 3.0 читать тут. Поделили продукт на 3 части, для маленьких, для средненньких и обещают для взрослых(с поддержкой mxml). Но что-то с ценами они намутили - для взрослыж 600-1 евро немного кусается, хотя если все что они заявили будте работать отлично я пожалуй скажу: “гудбай билдер”.

Я недавно щупал бетту FDT 3.0 была очень сырая и глючная, причем эти глюки лезли просто толпами, успели ли они поправить все это? вот вчем вопрос. Нужно побыстрее пощупать релиз может там все оки.

Вчера Рост писал о том что сегодня будет еще один ништяк под именем Saffron UML Tool. Я просто мечтаю запустить свои руки в это приложение, очень интересует - это всего лишь одна из красивых утилиток или же очень удобный инструмент.

А вообще нас жестоко … с редакторами, плюшки которые в остальных средах считаются необходимым минимумом для существования программера, нам выдют по одной и говорят, что мол мы придумали именно ту фичу которую вы хотели, посмотрите какие мы крутые.
Я долго думал каким же должен быть идеальный редактор, многое придумал ). Никто не хочет купить идею идеально редактора ? дорого отдам!

Не шутите с евангелистами. В эту субботу Райан Стюарт признался, что ему надоела война "RiA vs. RIA" и в шутку заметил, что Скотт Барнс упорно настаивает на новой расшифровке акронима RIA как "Rich interactive Application", хотя еще год назад использовал классическую трактовку "Rich Internet Application" (ей уже 5 лет).

Райан отметил, что Барнс — практически единственный в Microsoft, кто настаивает именно на такой трактовке. Совершенно в шутку, с субботнем посте, Райан предположил, что Скотт просто нагоняет себе трафа на личный блог по словам "rich interactive application", а гугл подтвердил. А Скотт обиделся и ответил весьма жестко. Райан комментировать отказался и так глубоко засожалел о непонятой Скоттом шутке, что в следующем посте подарил автору первого комментария Photoshop CS3, без шуток.

Эд Финклер создатель AIR Spaz Twitter Client и победивший на AIR Developer Derby в номинации “Best HTML Community Application”. Дал интервью для arc technica, в интервью Эд рассказывает почему он выбрал AIR, и с чем он столкнулся в процессе разработки. Также Эд рассказывает о нововведениях Beta 2 при работе с HTML / JavaScript Security.

Текст легко читабелен, надеюсь кому-то будет полезен.

"Компании MAKOOLSOFT требуется WEB-DEVELOPER со знанием PHP, MYSQL, а также знание AJAX, JAVASCRIPT, зарплата от 200 у.е.

Сервис dpaste.com существует с одной целью: чтобы разработчики могли показать друг другу подсвеченный код. Поэтому дизайн сайта выполнен в концептуально серой гамме. База кода регулярно самоочищается: если никто не смотрел код более месяца, он удаляется. Никакого списка свежих поступлений: спамеры отдыхают. Заточеность проекта под удобство конкретного пользователя можно считать образцовой.

Проект изначально создан Python-программистами для обмена кодом HTML-шаблонов Django web framework. Затем была добавлена подсветка синтаксиса для Python, SQL, diffs, XML, CSS, JavaScript, конфигов Apache, bash-скриптов, Ruby, и RHTML. А тут уже и до ActionScript недалеко. Расцветка кода реализована на библиотеке Pygments (Python).

UPDATE: мой ActionSсript тоже выглядит на Dpaste.

Вот, например, реализация списка друзей в классе UserProfile сервиса Pownce. Это новый проект Кевина Роуза, автора Digg.com. Цель сервиса—точно такая же как у Digg: делиться лучшим. Но концепция пересмотрена: делитесь лучшим с друзьями. На Дигге мы делимся сразу со всеми, а друзья там стоят как доп. возможность создать клан. На Powncе клан создается изначально, а делиться можно не только ссылками, но также сообщениями, событиями и файлами до 100 Мб (бесплатно).

Есть к сервису Pownce и десктоп-клиент, выполнен на Adobe AIR. Официально Pownce работает по инвайтам — если что, у меня там есть 6 штук приглашений...

Сделал для себя небольшой RSS-аггрегатор английских Flex-блогов: http://flexen.janvarev.ru/

В основном меня интересовали новости про новые компоненты с bytearray и прочие, на полноту не претендую. Вот список более полных английских аггрегаторов:

• http://www.fullasagoog.com/
• http://weblogs.macromedia.com/mxna/

Как вы уже знаете, AIRApps.net ищет новое имя и дает за таковое Adobe Creative Suite 3 Master Collection (=$2,499). Напоминаю, что прием вариантов заканчивается завтра, в Воскресенье, 14 Октября 2007 года, в 11:59 p.m. (Eastern Time, US — посчитайте время для себя). Победитель будет объявлен через неделю, 21 октября 2007 г.

Важно: правила изменены, теперь можно предлагать несколько вариантов.

Удачи лучшему!

По дизайнерской части. Почти одновременно в главной студии дизайна:

1. Артемий Лебедев пишет о том, что строчные никогда не разрежаются (08.10.2007).
2. Студия Лебедева публикует фирстиль Хроноса, построенный на логотипе из разреженных строчных (09.10.2007).

Высший пилотаж дизайнерской самоиронии, а может просто синхронистичность.

Компания ABBYY, ведущий мировой разработчик программного обеспечения в области лингвистики, семантики, оптического распознавания и обработки текстов, представила название компании на китайском языке – (Tai Bi Technologies).

«Это очень важный шаг для ABBYY. Экспортируя наши высокие технологии, мы выражаем не только желание стать ближе к китайским пользователям, но также стремление содействовать росту экономического потенциала России. Мы надеемся, что это событие позволит повысить конкурентоспособность нашей страны в сфере IT на мировом рынке», – отметил Давид Ян, основатель компании ABBYY.

В ближайшее время компания ABBYY начнёт оказывать услуги технической поддержки своим китайским пользователям от нового имени.

Источник - ixbt.com

На самом деле он (движок для создания сайтов Quick Start) развивается. Просто руки не доходят до того, чтобы оформить его, как релиз.

Последние изменения были связаны с достаточно крупным проектом в стиле Web 2.0, о котором я еще напишу, как только он откроется. Кроме того, в команде появился приличный дизайнер, благодаря чему движок стал выглядеть по умолчанию не хуже своих старших собратьев.

Изменения в основном касаются:

• Производительности - добились ускорения до 3 раз, а то страница генерировалась очень медленно для посещаемого ресурса;
• Внешнего вида - из-за энтузиазма в разработке и желания “сделать не хуже, чем у людей”
• Разделения кода и вида с разработкой движка шаблонов Smarty - из-за того, что в проекте работал дизайнер и потребовалось усилить разделение функций.
• Обновления библиотеки JsHttpRequest - потребовался некоторый AJAX с продвинутыми функциями
• Много-много мелких правок и вылавливания багов - чтобы сайт был “чистеньким”

Вообще все стало намного лучше

Дистрибутивы Quick Start | Список изменений

Saffrom AIR UML Tool — это инструмент для UML-моделирования, созданный во Flash / Flex / AIR дизайнером, инженером, поэтом, музыкантом и просто Афросамураем Сэмюэлем Аглесиасом Пастелем.

Краткая характеристика Saffron UML:

• Дизайнер и разработчик могут вместе работать над каркасом приложения (Saffron Wireframe Editor).
• Полный цикл работы (round-trip) с AS2-AS3, будет Java.
• Встроен контроль версий.
• В нем все является плагином: от меню приложения, до конкретного вида.
• Разработчики могут расширять его, создавая свои перспективы.
• Saffron соответсвует спецификации UML по возможности максимально, но есть моменты. Ведь UML-спека составлялась программистами, не дизайнерами. Бывший дизайнер пытается освежить технологию. Например, визуально представляя пакеты в виде плиток (tiles).
• Изначально создается версия для Adobe AIR, в будущем возможен перенос в браузер.
• Для повышения производительности: отображаются только объекты, реально попавшие в окно приложения: все остальные исключаются из дисплей-листа (подход, аналогичный Google Maps. Так нужно делать в любом приложении, оперирующем огромным набором объектов).
• Используется масса Флэш-компонентов. Для облегчения головной боли при доступе из флекс-приложения к объектам Flash, используется свойство associatedClass—флекс-класс, являющийся оберткой флэшового.
• При разработке Saffron использована собственная библиотека Elemental SDK, помогающая качественно отделять вид от данных.
• Cairngorm не используется: многа букав, трудное имя. Но из Cairngorm взяты уроки, в том числе и паттерн Command.
• Saffron это красиво.
• Выходит завтра.

Теперь вы знаете, почему не нужно бояться за любимую технологию: поэты, музыканты и просто афросамураи играют за наших. Я на полном серьезе: все дело в этом. Просто подумайте сами.

На DZone люди могут постить линки-новости и голосовать за них, совсем как на Digg.com. А фишка в том, что там никогда не напишут о новых приключениях Пэрис Хилтон и даже о ее русской локализации по фамилии Собчак, разве только эти дамы не станут выдающимися программистками (боже, пусть этого не случится).

На Dzone — только лучшее, и только о Разработке и Программировании. Что делает его для нас очень полезным: категория Flash там уже есть, как есть и хорошие новости. Например, о построенном на PV3D движке Paradox.

А поскольку Дзон ввиду своей специфики лишен SEO-спама, это делает его еще ценнее.

Поток шустрых наноновостей

Кто ждал Саффрона? Я ждал.

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

Ходят слухи, что в понедельник 15 октября грядет релиз FDT3, а что-то не верится, так как мы недавно писали про бэту FDT3 (кстати сложно ее назвать бэтой - точнее это было что-то вроде альфа) и что за столь короткое время все успели поправить. Не верится.

Но посмотрим…

Открылся haxe.ru. Пишут:

haXe - универсальный объектно-ориентированный язык программирования высокого уровня.

Универсальность в том, что код можно компилировать для нескольких платформ:
* Flash (swf версий 7,8 или 9 использующие API языка ActionScript 2 или ActionScript 3)
* JavaScript (клиентские скрипты в т.ч. использующие технологию Ajax)
* Neko (компилированные программы, исполняемые виртуальной машиной neko, которые могут использоваться как серверные файлы для веб-приложений или как основа программ для desktop).

Кроме того язык является открытым (open source) и кросс-платформенным. С помощью haXe и связанных с ним технологий (Neko, SWHX, SysTools, SPOD и т.д.) можно создавать приложения, способные работать под Windows, Mac OS или Linux.

Я же вам говорил :-)

Adobe делает 3D-камеру с распознаванием объектов по глубине фокуса—вы знаете.

Продолжаю обзор Flex Skin Design Extension, на этот раз буду повествовать об extension под Adobe Photosop CS3. Часть первая, об extension в целом и его версии под Adobe Flash CS3, находится тут.

Flex Skin Design Extension под Photoshop представляет собой набор PSD шаблонов и два скрипта (экспорт скина и мастер создания скина).

Установка крайне простая, копируем содержимое архива в папку “\Program Files\Adobe\Adobe Photoshop CS3\Presets“. Теперь можно запускать Photoshop и начинать зверский акт вандализма над стандартными скинами

Запускаем Photoshop и запускаем мастер создания скина (File -> Scripts -> New Flex Skin…). Первое отличие, от extension под Flash, это наличие выбора создания скина для нескольких компонент или для одного выбранного компонента. При выборе опции создание скина для единичного компонента, активируется возможность выбрать диапазон применимости скина (для всех виджетов этого типа в приложении или только для тех у кого заданный styleName ).

Рассмотрим создание скина для кнопки у которой styleName=”customButton”. После выбора нужных значений и ввода styleName в мастере создание скина, жмем ок и получаем новый документ с импортированными в него заготовками для состояний кнопок (название все дано в виде Button_customButton_overSkin и т.д., по состояниям виджета), а также хитрая папка с декором фоновым и пояснениями к шаблону (ее нужно скрывать перед экспортом скина, она так и называется - “_HIDE BEFORE EXPORTING”, но об этом потом).

После того как вдоволь поиздевавшись над скином, прячем папку с названием _HIDE BEFORE EXPORTING, и запускаем скрипт экспорта (File -> Scripts -> Export Flex Skins…). Скрипт попросит вас указать куда будем создавать скины, и после нажатия OK начинает танцы с бубнами, т.е. сохранять скин. (Фотошоп желательно оставить в покое так как, скрипт устраивает всяческие махинации с создаванием документов и т.д.)

После того как скрипт закончит злодеяния, заходим в выбранный каталог для экспорта, и смотрим что создалось. А создалось, вопреки ожиданиям на чудо css или что-то в этом духе, папка assets с четырьмя PNG-24 файлами. Теперь настал час “Ч”, импортировать весь этот artwork в Flex приложение.

Запускаем импорт нашего скина (File -> Import -> Skin Artwork…). Выбираем нашу папку со скином, в качестве значения для поля Folder or Bitmaps, и проект внешний вид которого мы хотим изменить (также можно выбрать папку куда все будет свалено и название CSS файла, по умолчанию стоят названия assets). Next. Выведется список из доступных PNG, в котором можем выбрать что будет импортироваться а что нет. Дополнительно в списке указывается название состояния виджета на которое будет влиять PNG.

Finish. В папке проекта создается каталог assets в который скопировались картинки и в корне создался assets.css в котором прописан стиль для нашей кнопки, а также в main MXML файл подключили наш CSS.

Fin.

Впечатления, все хорошо, но:

• В версии для Flash не хватает мультивыбора компонент и указания styleName для единичного компонента, и довольно грязный импорт во Flex, помимо скина там в списке еще масса всякого хлама, хорошо, что все что относится к скину выбрано по умолчанию, а остальное отключено;
• В версии для Photoshop не очень удобно редактировать скины, особенно полупрозрачные градиентные заливки;
• В версии для Photoshop один большой минус, это нельзя дизайнеру задать параметры для Scale-9 (это можно будет сделать только в коде, то есть подправить ручками CSS) и результат растровый;

Вроде все перечислил. Если что забыл, пишите обновлю пост.

В связи с недавним выходом Flex Builder 3 beta 2 и AIR beta 2 пришлось вновь обновлять приложение.

С одной стороны, выход AIR beta 2 безусловно порадовал, ибо в Adobe поработали над отображением картинок внутри соответствующего компонента. Результат -в приложении превьюшки фотографий создаются быстрее, при этом едят меньше памяти, и автоматически используют сглаживание.

На второе я чуть ли не разозлился (цитата из AIR beta 2 release notes):

Beta 1 applications Seamless Installation after you have installed Beta 2

Trying to install Beta 1 applications through Seamless installation once you have installed Beta 2 will fail. You will need to update your Beta 1 applications to Beta 2 for Seamless installation.

Не знаю, как вам, а мне показалось, что обновлять приложение до версии, созданной в Beta 2 придется вручную. Но практика показала, что все не так плохо, а даже хорошо - приложение просто взяло и обновилось (с версии 1.1 до 1.1.2 на сайте). Так что видимо, имелось ввиду следующее:

Вы можете плавно (seamless) обновлять приложение только, если очередная версия будет создана в Beta 2. Обновляться до версий, созданных в Beta 1, плавно нельзя.

Так что все закончилось хорошо - производительность повысилась, AIR Remote Updater обновился до совместимости с Beta 2, обновление работает. А вот и новая версия:

Apollo Desktop Photos 1.1.2

Буду краток. Грант Скинер представил миру новую либу Spelling Plus Library (SPL) - движок проверки правописания для Flash CS3, Flex 2(3), Adobe AIR.

Например во Flash CS3 проверка правописания в текстовом поле или компоненте устанавливается без единой строчки кода. Просто нужно перетащить компонент на сцену. А во Flex нужно прописать пару несложных тегов... Ах, да, проверка правописания конечно же для английского языка... пока что.

Tags: SPL, Flash_CS3, Flex_2(3), Adobe_AIR

Мы рады сообщить, что начиная с текущего, все последующие посты Garbage Collector будут транслироваться в Macromedia XML News Agregator.

Встречайте: DimZ про Flash. Читайте:

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

И еще:

"onEnterFrame обновляется с со скоростью показа кадров (fps) если у вас обновление кадров 12 раз в секунду то и onEnterFrame тоже будет обнуляться 12 раз в секунду."

i=1

onEnterFrame=function()

{

 chet=++i

}

Меня радуют такие ресурсы, будто сам заново всему учусь :-)

В комментариях к заметке о RibbitPhone прозвучало упоминание о бесплатном сервисе FlashPhone.ru—несправедливо, по словам автора комментария, малоизвестном.

"В то время, как в интернете все активнее обсуждается проект RibbitPhone, позволяющий разработчикам использовать flex-компонент для предоставления услуг VoIP через flash, мало кто знает о проекте flashphone.ru, который уже предоставляет вам возможность позвонить прямо с веб-сайта через flash, причем пока совершенно бесплатно. Так как сервис находится на этапе бета-тестирования, то возможны различные проблемы, обсудить которые можно на форуме проекта forums.flashphone.ru и заодно помочь FlashphoneTeam сделать проект лучше.

Все желающие могут посмотреть на flashphone в действии, если пройдут простую процедуру регистрации на сайте. После активации аккаунта вы можете совершать звонки. Все, что необоходимо для этого — наушники и микрофон. Также пользователи flashphone могут звонить друг другу, для этого достаточно ввести логин того, кому вы хотите позвонить. Проект будет активно развиваться в ближайшее время и должен привлечь всеобщее внимание.

Для владельцев карманных компьютеров с установленным flash player для pocket pc существует мобильная версия сервиса flashphone. Теперь вы можете звонить со своих КПК и смартфонов, если поблизости есть wifi."

Я оставил текст как есть: можно считать его пресс-релизом сервиса. Грядет небольшая статья про VoIP во Flash.

UPD: Похоже, у FlashPhone.ru в связи с наплывом посетителей лег сервис. Даже на форум не смог зайти...

Появился ресурс, который будет полезен для фанатов и начинающий путешественников по тропам Cairngorm. Cairngorm Creator, пока правда Beta, от Tyler Beck, помогает облегчить жизнь, путем визуального создания структуры, или ее части вашего приложения, основанного на Cairnrogm.

Заявленные фишки:

• Настраиваемые имена пакетов;
• Настраиваемые имена папок;
• Настраиваемые build файлы;
• Сохранение и загрузка структур (XML);
• Редактируемый XML;
• Превью классов / файлов, которые будут генерироватся;
• Возможность скачать все содеянное в zip;

ShaggySmile перестал помещаться в главный сайт и разродился еще одним: Life.Flex. Там он публикует статьи по разным аспектам Flex-технологии: от настройки вида Flex-приложения на фазе предзагрузки до примера загрузки потокового MP3 с помощью Flex 2 и Flash Media Server. Разрастаемся... :)

Как внедрить Flash контент с помощью совместимой со стандартами html-разметки? (1 способ)

ШАГ 1: Внедрение Flash контента и альтернативного контента с помощью совместимой со стандартами html-разметки

SWFObject использует в качестве разметки метод вложенных тегов object с условными комментариями, поддерживаемыми Internet Explorer [http://www.alistapart.com/articles/flashembedcagematch/] , чтобы обеспечить наиболее оптимальную кросс-браузерную поддержку, совместимость со стандартами и наличие альтернативного контента [http://www.swffix.org/testsuite/]:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject v2.0 - step 1</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  </head>
  <body>
    <div>

      <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">
        <param name="movie" value="myContent.swf" />
        <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">
        <!--<![endif]-->
          <p>Alternative content</p>
        <!--[if !IE]>-->
        </object>
        <!--<![endif]-->
      </object>

    </div>
  </body>
</html>

Заметка 1: Метод вложенных тегов object требует двойное их определение(внешний тег для Internet Explorer и внутренний для остальных браузеров), таким образом задавать все атрибуты и параметры необходимо дважды.

Заметка 2: Атрибуты id, classid, элемент param с movie используются для внешнего object. Атрибуты type и data используются только для внутреннего.

Заметка 3: Мы не рекомендуем использовать атрибут codebase для задания пути к установщику Flash плагина с серверов Adobe, потому что это запрещено согласно спецификации, которая ограничивает его доступ доменом текущего документа. Вместо этого мы предлагаем использовать альтернативный контент с сообщением о возможности загрузки плагина и соответствующей ссылкой.

Как можно использовать HTML для конфиграции Flash контента?

Можно задать следующие атрибуты [http://www.w3schools.com/tags/tag_object.asp] элементу object:

• id
• name
• class
• align

Можно задать следующие элементы param [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_12701]:

• play
• loop
• menu
• quality
• scale
• salign
• wmode
• bgcolor
• base
• swliveconnect
• flashvars
• devicefont [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_13331]
• allowscriptaccess [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_16494]
• seamlesstabbing [http://www.adobe.com/support/documentation/en/flashplayer/7/releasenotes.html]
• allowfullscreen [http://www.adobe.com/devnet/flashplayer/articles/full_screen_mode.html]
• allownetworking [http://livedocs.adobe.com/flash/9.0/main/00001079.html]

Почему необходимо использовать альтернативный контент?

Элемент object позволяет размещать альтернатиный контент, который будет показан, если Flash плеер не установлен или не поддерживается. Этот контент также виден для поисковых машин, что немаловажно для SEO.

Недостатки использования метода вложенных объектов?

При более тщательном рассмотрении кросс-браузерности приведенной выше разметки, вы увидите следующие проблемы:

• Safari 1.2.2 и ниже игнорирует все вложенныеэлемены param
• Internet Explorer 6+ под Windows XP SP2+ и Opera 9+ будут использовать механизм активации Flash контента по клику.
• Присутствует риск некорректного отображения (или неотображения вовсе) Flash контента в плеере версии ниже необходимой

Библиотека SWFObject старается решить эти проблемы.

ШАГ 2: Внедрение библиотеки SWFObject в HTML страницу

Библиотека SWFObject состоит из внешнего JavaScript файла (размер: 9.8Kb, GZIPed: 3.3Kb).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject v2.0 - step 2</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

    <script type="text/javascript" src="swfobject.js"></script>

  </head>
  <body>
    <div>
      <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">
        <param name="movie" value="myContent.swf" />
        <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">
        <!--<![endif]-->
          <p>Alternative content</p>
        <!--[if !IE]>-->
        </object>
        <!--<![endif]-->
      </object>
    </div>
  </body>
</html>

ШАГ 3: Конфигурация Flash контента через библиотеку SWFObject

Сначала необходимо задайть уникальный id внешнего тегу object. Затем добавьте метод swfobject.registerObject:

1. Первый аргумент (String, необходим) - это id объекта, заданный ранее.
2. Второй аргумент (String, необходим) определяет версию Flash плеера, под которую опубликован ваш ролик. SWFObject смотрит только на первые три цифры версии, например, "9.0.18".
3. Третий аргумент (String, опциональный) может быть использован для активации экспресс-установки плеера [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75] и задает адрес swf-файла экспресс-установки. Данный файл включен в библиотеку SWFObject.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject v2.0 - step 3</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script type="text/javascript" src="swfobject.js"></script>

    <script type="text/javascript">
    swfobject.registerObject("myId", "9.0.0", "expressInstall.swf");
    </script>

  </head>
  <body>
    <div>

      <object id="myId" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">

        <param name="movie" value="myContent.swf" />
        <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">
        <!--<![endif]-->
          <p>Alternative content</p>
        <!--[if !IE]>-->
        </object>
        <!--<![endif]-->
      </object>
    </div>
  </body>
</html>

Как внедрить несколько SWF файлов с помощью первого способа?

Просто повторите шаги 1 и 3 предыдущего радела.

Как ссылаться на активный элемент object с помощью JavaScript (используя первый способ)?

Одним из сторонних эффектов использования метода вложенных объектов является то, что на один SWF существуют два элемента object, но задавать можно только один уникальный атрибут id или name.

Разные браузеры указывают на разные элементы object:

• Internet Explorer на Windows видит только внешний object, так как внутренний закоментирован для него.
• Opera и Safari поддерживают нотацию внутреннего object [http://www.swffix.org/testsuite/], ряд: object ActiveX)
• Firefox, Mozilla and all other Gecko based browsers use the inner object

На активный объект можно сослаться через:

1. Атрибут id или name внешнего тега
2. С помощью следующего javascript-кода:

var obj = document.getElementById("myId");
var nestedObj = obj.getElementsByTagName("object")[0];
var ref = false;
if (obj) {
  if (!nestedObj || (nestedObj && typeof obj.SetVariable != "undefined")) {
    ref = obj;
  }
  else if (typeof nestedObj.SetVariable != "undefined") {
    ref = nestedObj;
  }
}
if (ref) {
  ref.doSomething(); // например, вызов external interface
}

Как с помощью SWFObject динамически внедрять Flash контент? (второй способ)

ШАГ 1: Создание алтернативного контента с помощью стандартной html-разметки

Метод динамического внедрения следует принципу постепенного улучшения[http://www.adobe.com/devnet/flash/articles/progressive_enhancement.html] и замещает альтернативный HTML контент Flash контентов, если JavaScript и Flash плагины поддержтваются. Сперва создайте альтернативный контент с уникальным id:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject v2.0 dynamic embed - step 1</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  </head>
  <body>
    
    <div id="myContent">
      <p>Alternative content</p>
    </div>
    
  </body>
</html>

ШАГ 2: Внедрение библиотеки SWFObject в HTML страницу

Библиотека SWFObject состоит из внешнего JavaScript файла (размер: 9.8Kb, GZIPed: 3.3Kb).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject v2.0 dynamic embed - step 2</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  
    <script type="text/javascript" src="swfobject.js"></script>

  </head>
  <body>
    <div id="myContent">
      <p>Alternative content</p>
    </div>
  </body>
</html>

ШАГ 3: Внедрение SWF с помощью JavaScript

swfobject.embedSWF(swfUrl, id, width, height, version, expressInstallSwfurl, flashvars, params, attributes) has five required and four optional arguments:

1. swfUrl (String, необходим) - URL SWF файла
2. id (String, необходим) - id HTML элемента, содержащего альтернативный контент, который будет замещен Flash контентом
3. width (String, необходим) - ширина SWF файла
4. height (String, необходим) - высота SWF файла
5. version (String, необходим) - версия публикации SWF файла
6. expressInstallSwfurl (String, опцианален) - адрес файла экспресс-установки необходимой версии [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75]
7. flashvars (Object, опцианален) - переменные flashvars в виде name:value пар
8. params (Object, опцианален) - параметры вложенного элемента object в виде name:value пар
9. attributes (Object, опцианален) - атрибуты object в виде name:value пар

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject v2.0 dynamic embed - step 3</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script type="text/javascript" src="swfobject.js"></script>
    
    <script type="text/javascript">
    swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
    </script>

  </head>
  <body>
    <div id="myContent">
      <p>Alternative content</p>
    </div>
  </body>
</html>

Конфигурация Flash контента

Можно задать следующие атрибуты [http://www.w3schools.com/tags/tag_object.asp] элементу object:

• id
• name
• class
• align

Можно задать следующие элементы param [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_12701]:

• play
• loop
• menu
• quality
• scale
• salign
• wmode
• bgcolor
• base
• swliveconnect
• flashvars
• devicefont [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_13331]
• allowscriptaccess [http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_16494]
• seamlesstabbing [http://www.adobe.com/support/documentation/en/flashplayer/7/releasenotes.html]
• allowfullscreen [http://www.adobe.com/devnet/flashplayer/articles/full_screen_mode.html]
• allownetworking [http://livedocs.adobe.com/flash/9.0/main/00001079.html]

Как с помощью объектов JavaScript задавать flashvars, params и атрибуты object?

Создаем соответствующие объекты:

<script type="text/javascript">

var flashvars = {};
var params = {};
var attributes = {};

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Добавляем пары name:value:

<script type="text/javascript">

var flashvars = {
  name1: "hello",
  name2: "world",
  name3: "foobar"
};
var params = {
  menu: "false"
};
var attributes = {
  id: "myDynamicContent",
  name: "myDynamicContent"
};

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Или с помощью точечной нотации:

<script type="text/javascript">

var flashvars = {};
flashvars.name1 = "hello";
flashvars.name2 = "world";
flashvars.name3 = "foobar";

var params = {};
params.menu = "false";

var attributes = {};
attributes.id = "myDynamicContent";
attributes.name = "myDynamicContent";

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Или для однострочников:

<script type="text/javascript">

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", {name1:"hello",name2:"world",name3:"foobar"}, {menu:"false"}, {id:"myDynamicContent",name:"myDynamicContent"});

</script>

Если вы не хотите использовать аргумент задайте ему значение 'null' или сотавьте пустой объект:

<script type="text/javascript">

var flashvars = null;
var params = {};
var attributes = {
  id: "myDynamicContent",
  name: "myDynamicContent"
};

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Объект flashvars можно задать внутри params:

<script type="text/javascript">

var flashvars = null;
var params = {
  menu: "false",
  flashvars: "name1=hello&name2=world&name3=foobar"
};
var attributes = {
  id: "myDynamicContent",
  name: "myDynamicContent"
};

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Как внедрить несколько SWF файлов с помощью второго способа?

Просто повторите шаги 1 и 3 предыдущего радела.

Как с помощью SWFObject получить информацию о Flash плеере через JavaScript?

swfobject.getFlashPlayerVersion() - возвращает JavaScript объект, содержащий версию (major:Number), (minor:Number), (release:Number) установленного плеера:

var playerVersion = swfobject.getFlashPlayerVersion();
var majorVersion = playerVersion.major;

swfobject.hasFlashPlayerVersion(versionNumbersString) - возвращает Boolean, показывающий установлена или нет сооветствующая версия:

if (swfobject.hasFlashPlayerVersion("9.0.18")) {
  // есть
}
else {
  // нет
}

Риски использования SWFObject?

Первый способ

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

• 4% всех пользователей не дружат с JavaScript [ http://www.thecounter.com/stats/2007/June/javas.php].

Второй способ

Пользователи, у которых выключен или не поддерживается в браузерах JavaScript, увидят альтернативный контент.

• 4% всех пользователей не дружат с JavaScript [http://www.thecounter.com/stats/2007/June/javas.php].

Поддерживает ли SWFObject MIME тип application/xhtml+xml?

Нет.

Adobe Flex Doc Team, заявляет о том, что Moxie поддерживает условную компиляцию. Которая позволяет включать или исключать определенный код при компилировании приложения.

Советуют пользоваться этим в основном при дебаге или при финальном релизе. Для того чтобы не включать какие-то части кода, классы, или библиотеки, которые использовались при разработке, но не должны попасть в релиз.

Документация по этой полезной особенности не вошла в Beta 2, так что все дружно качаем PDF (40 kb).