Недавно я писал, что Greensock, прекрасная библиотека для скриптовой анимации на Flash, теперь поддерживает и JavaScript. В этой статье я продемонстрирую основы работы с GSAP v12 (beta). Результат будет примерно таким:
Сразу оговорюсь, что графику и идею для примера я взял из документации $fx(), ведь кто из нас откажется
В статье рассказывается о возможностях собственной реализации прогрессивной загрузки изображений на сайте без использования Flash. Интерактивное рисование реализуется через элемент: canvas из HTML5. Алгоритмическая основа процесса является дискретное вейвлет-преобразование.
Пообщавшись в комментариях к посту, я понял, что не все до конца понимают принцип работы SIP в браузере. Поэтому, решил экспромтом написать небольшую статью, где в общих чертах раскрыть эту тему.
22 ноября 2011 года JiLiZART всем нам сообщил, что есть на свете полезная библиотека JSZip с открытым исходным кодом, написанная на джаваскрипте и умеющая создавать zip-архивы (и даже, если это необходимо — с подкаталогами) из скормленных ей текстовых и двоичных данных.
Первым же комментарием к его сообщению стали мои слова:
— Прекрасно.
— Теперь ему бы ещё распаковывать уметь.
Прошло полгода с тех пор, и можно видеть, что это естественное пожелание сбылось: очевидно, оно пришло на ум не одному мне, так что программисты принялись за дело — и в открытый на Гитхабе исходный код JSZip добавили методы, способные служить ещё и распаковке zip-архивов, а не только составлению их. (Подробности употребления новинок API смотрите в документации.)
В открытом коде всегда приятно видеть, как другие люди действуют в направлении твоих мыслей.
Поклонникам же джаваскриптового движка Node.js будет наверняка не менее приятно узнать о появлении модуля node-zip, содержащего весь код JSZip, оформленный в качестве модуля Node. Стало быть, теперь JSZip можно запускать не только во браузере, но и на сервере, а равно и у себя на компьютере.
Modernizr — это JavaScript-библиотека, которая узнаёт, что из HTML5 и CSS3 умеет браузер пользователя. Определяя возможности браузера, разработчик может сделать откат некоторых функций для старых версий браузеров. Создатели Modernizr называют такую проверку feature detection, и это гораздо эффективнее, чем просто определить браузер, его версию и ОС.
Я был премного удивлён факту отсутствия развёрнутой статьи об этой JS-библиотеке (анонс не в счёт). Статья составлена из перевода официальной документации проекта, переводов нескольких статей и собственных дополнений.
Первый шаг
Для начала нужно получить свежую версию библиотеки с её официального сайта: Modernizr Download Builder.
Укажи галочками те технологии, тесты которых собираешься проводить, затем создай свою персональную версию библиотеки кнопкой «Generate». Если проставить все галочки, получившегося кода хватит на пару экранов небольшого ноутбука – всего 15 КБ.
Затем просто подключи его к своей странице и проверь, как оно. Если всё работает, у элемента HTML должны появиться многочисленные классы:
Сегодня у меня две причины пробежаться по клавишам.
Во-первых, после того, как на прошлой неделе я перевёл документацию по jParser (после ознакомления с RReverserовским примером применения jParser при анализе BMP-файлов), мне представляется уместным перейти к напрашивающемуся последующему шагу: развить тему, поделиться с читателями моим собственным примером применения jParser для анализа несколько более сложной структуры данных. (Отчасти это станет ответом на вопрос, который alekciy задал, интересуясь дальнейшими примерами практического использования jParser.)
Во-вторых, ≈полгода назад (26 ноября 2011 года)ertaquo поинтересовался, зачем мне хочется использовать Node.js в Фидонете. Тогда я сообщил, что мне просто нравится название (помню те времена, когда термин «node» или «нóда», если употреблялся без уточнения, в российском околокомпьютерном мире по умолчанию означал узел Фидонета), но не мог привести никакого наглядного примера работающего кода, а сейчас приведу.
Итак, пример будет двойным. Предлагаю вашему вниманию анализ заголовков писем фидонетовской эхопочты, хранимой в формате JAM. Этот формат популярен в Фидонете со времён далёких и незапамятных (в Википедии говорится, что появление JAM относится к 1993 году). Сразу скажу, что давно предпочитаю JAM другому популярному формату (Squish), потому что этот последний хранит в заголовке у письма идентификаторы не более чем девяти откликов на него, тогда как JAM вместо массива ограниченной длины использует более гибкую структуру данных (связный список), так что позволяет выстроить полное дерево ответов даже в самых оживлённых и разветвлённых обсуждениях.
Обновляя недавно дизайн своего хомяка, подумал – а не сделать ли мне какую-нибудь необычную страницу с 404-й ошибкой? Поскольку в детстве я был впечатлен Жизнью Конуэя (как возможно и многие из читателей), решил её на JS и реализовать.
Казалось бы, что сложного в Жизни: если у занятой клетки 2 или 3 соседа – она остается, если у пустой ровно 3 – рождается? В этой статье я расскажу о своей оптимизации алгоритма и отрисовки на canvas-е, некоторых не очевидных моментах целочисленной/бинарной арифметики в JavaScript.
Забегая вперед, конечный результат можно увидеть тут, исходники видны там же (да еще и по лицензии CC BY).
Ну что же плывем дальше, а на очереди следующие 4 функций, связанные с путешествием по Антоновке. Для начала определимся с понятием «чего надобно». Итак, я хочу:
Сейчас почти не осталось препятствий для создания полноценного SIP клиента в браузере. Необходимый для видео конференций WebRTC уже можно протестировать, например, в Chrome Canary. Существует draft-ibc-sipcore-sip-websocket, который добавляет WebSocket в качестве еще одного транспорта для SIP. И уже появляются первые реализации SIP клиентов:
К сожалению, автор представленного на видео клиента еще не определился будет ли открывать исходники и под какой лицензией. Под катом альтернативные решения с демонстрацией передачи видео…
Удивительно, но факт: на хабре практически нет статей о Greensock — великолепной библиотеке для скриптовой анимации на Flash. Возможно, это связано с тем, что Flash-разработчиков тут меньше, чем веб-разработчиков?
Впрочем, теперь уже не важно: Greensock v12 (он же Greensock Animation Platform или GSAP) умеет анимировать на JavaScript. Любое свойство любого объекта можно проанимировать десятками способов, соединить анимации в таймлайн, поставить этот таймлайн на паузу или развернуть задом наперёд. Всего парой строчек.
Более того, Greensock работает значительно быстрее jQuery, YUI, MooTools или Dojo. Разработчики говорят о тысячах процентов, но зачем верить на слово, когда есть animation speed test.
Подробности на английском: www.greensock.com/v12/, а под катом — краткое изложение на русском языке.