JavaScript микро-фреймворки. Часть 3.
Сегодня у нас в выпуске очень интересные микро-фреймворки. Каждый из них позволяет использовать возможности HTML5 не думая об обратной совместимости со старыми браузерами.
Небольшое отвлечение: вы наверное думаете, как же с таким большим количеством микро-фреймворков справится, следить за всем, подключать кучу файлов, у каждого к тому же свое API — для этого есть отличное решение, о нем я напишу завтра ;)
Автор, Ryan Seddon, описывает свое творение:
H5F добавляет поддержку HTML5 форм для браузеров без таких возможностей. Это новые поля, новые атрибуты, часть нового API для работы с формами.
Вам нравятся новые возможности форм, добавленные в HTML5? Если вы хотите активно их использовать, то этот микро-фреймворк обеспечит вам обратную совместимость со старыми браузерами. Вам больше не придется отдельно описывать на JavaScript’е логику обязательных полей, валидацию, авто-фокусировки и так далее. Крайне полезная вещь.
Используя новые возможности, код форм может выглядеть следующим образом:
<form id="signup"><label>Электронный адрес *</label><input type="email" name="email" placeholder="alexey@simonenko.su" required><label>Телефон</label><input type="tel" name="phone" pattern="\d{10}"><label>Индекс *</label><input type="number" name="postcode" min="1001" max="8000" required><input type="submit"></form>
Автор Marcus Westin
localStorage для всех браузеров (в том числе старых) без использования cookie или flash.
О плюсах работы с localStorage я уже рассказывал. В данном случае лишь скажу что этот микро-фреймворк исправляет совместимость с браузерами в которых нет localStorage. И работает надо сказать очень хорошо.
Автор Jay Salvat
Мощный микро-фреймворк для работы с HTML5 Audio. Так же добавляет обратную совместимость в старых браузерах.
Первое что приходит на ум, а причем здесь Google Buzz — немного разобравшись понимаешь что абсолютно не причем ;) Отличная работа Джея, теперь можно не думать о Flash-проигрывателях и смело использовать новые возможности HTML 5 Audio. Так же мы получаем богатое API для управления проигрывателем.
Пример работы с Audio API:
var audio = new buzz.sound( "/files/myfile", {formats: ["ogg", "mp3", "acc"]});audio.play();audio.fadeIn();audio.loop();audio.bind("timeupdate", function() {var timer = buzz.toTimer(this.getTime());document.getElementById("timer").innerHTML = timer;});