Адресная строка — не приговор.
Deep linking у Flash, Silverlight, Ajax и их друзей
В Киеве есть ужасная развязка. Съезжая с Южного моста на правый берег, лучше ехать прямо, чтобы, проехав развязку, сориентироваться, куда попал. Или, может быть, следует сразу свернуть направо? Головоломная развязка. Даже если я заранее разбираю все съезды на карте, все равно выезжаю совсем не туда, куда изо всех сил старался попасть. Она кажется мне запутаннее, чем Harbor Freeway Interchange — самая крупная развязка в Калифорнии, фотографией которой и проиллюстрирован этот пост. Для того, чтобы эта красота вызывала иррациональное чувство ужаса, поверх фотографии наложена схема развязки Южного моста.
До недавнего времени флеш-сайты представляли собой подобные развязки. Если требовалось насладиться красотой сайта и работ, то никаких проблем не возникало. Когда же судьба подбрасывала задание добраться до какого-то определенного фрагмента сайта, то без опытного проводника, GPS и запаса провизии на несколько суток нечего было и набирать адрес в строке броузера.
Тяжелая судьба сайтов с динамическим контентом
Потом появились все эти уловки с Аяксом и Сильверлайтом, о чем я писал раньше. Призванные сделать сайты удобнее, они по-прежнему не могли совладать с адресной строкой броузера. Она тупо указывала на ту страницу, с которой началась загрузка. Мало того, адресная строка не хотела принимать никакого участия в вакханалии, творящейся внутри окна до тех пор, пока не перегружалась вся страница. Это ограничение не только мешало сослаться на конкретную страницу, но и не давало посетителю воспользоваться кнопками броузера Back/Next. О том, какой это был удар по пронырам-поисковикам нечего и говорить. Рыщущие агенты не могли проиндексировать динамические страницы и назначить каждому фрагменту свой url. Я думаю, что многие из них сходили с ума.
В попытках улучшить возможности навигации, разработчики шли на разные уловки. Например, на сайте дизайн-студии Bleed норвежцы используют <iframe /> для того, чтобы сохранялась история похождений по сайту. Сослаться на конкретную работу по-прежнему не удастся, но хотя бы можно вдоволь понажимать на кнопки Back и Next. На genn.org я пытался реализовать все, используя связку modrewrite + php, но сдался перед более изящным приемом.
Эволюция пролинкованности
Нельзя сказать, что предложенное компанией Asual решение революционно. Уже не меньше пары лет все, кто занимался проблемой deep-linking`а динамических страниц, поняли, что надо использовать якоря. Возможно, использование тяжелых чугунных предметов в приложении к разработчикам броузеров помогло бы больше, но речь о других якорях. Anchors — все, что идет после знака диеза в адресе страницы. Они служат для перемещения в пределах одной страницы без послания новых запросов серверу. Например, на страничке Валерки можно щелкнуть на пункт меню, и сайт будет промотан до необходимого места. Эти же якоря должны помогать сослаться у меня в блоге на конкретный комментарий, но я стер что-то лишнее в шаблоне, и оно, в отличие от повествований о ненаучном популярно, не работает ;)
Ребята из Asual собрали все коллективные знания и облекли их в набор скриптов с названием swfaddress. Работу с броузером обеспечивает яваскрипт, а уж к нему обращается или скрипт из Флеша/Флекса, или из Сильверлайта, или вообще из аякс-наворотов. Таки образом, ядро остается прежним, а общаться с ним можно отовсюду, откуда есть возможность достучаться до яваскрипта.
Как пользоваться swfaddress
Использовать swfaddress очень легко. Главное — не переименовывать .js файлы и прописывать их подключение после подключения скриптов для встраивания флеша (например, swfobject). На своем сайте я вообще подключаю swfaddress.js самым последним:
<script src="/js/swfaddress.js" type="text/javascript" />
Использование во флеше с actionscript 2.0 выглядит совсем просто.
Сначала импортируем все необходимое для работы:
import SWFAddressimport SWFAddressEvent
Затем обрабатываем изменения адресной строки:
SWFAddress.onChange = function() {trace(SWFAddress.getValue()); // выводит текущий URL}
И в нужных местах (например, при нажатии на кнопку) меняем адресную строку броузера и, при желании, заголовок окна:
SWFAddress.setValue("patapon"); // адрес преобразуется во что-то вида http://yourdomain.com/#/patapon/SWFAddress.setTitle("Don Dodon Dodon"); // заголовок окна броузера станет «Don Dodon Dodon»
Иногда по непонятным причинам не происходит взаимодействие при обработке полученного от броузера адреса. Я еще не разобрался почему, но мне все равно придется это сделать ;) На странице разработчиков есть примеры для других версий AS, Flex, Silverlight, Ajax и иже с ними. Если возникнут проблемы, то можно спросить в комментариях, и я постараюсь помочь.
Скептикам
Можно легко возразить, что у тех, кто умудрился отключить в приступе паранойи яваскрипт, ничего не сработает. У этих несчастных в лучшем случае половина сайтов работает не так, как задумано разработчиками. Посочувствуем им и перестанем оглядываться ;)
***
Я с радостью использую swfaddress для genn.org и рекомендую его всем. Теперь можно сослаться на любой раздел и любую работу в моем портфолио. Написав благодарность разработчикам, я получил приятное письмо на русском языке и попал в их showcase (где-то в самом-самом низу). Как я понял из номеров телефонов, скрипты написали и собрали вместе болгарские разработчики и разработчицы. Хочется их еще раз поблагодарить.
