JavaScript

Включаем одни шаблоны Handlebars.js внутрь других шаблонов, или пишем хелпер {{include}}

Handlebars.js — это javascript-шаблонизатор, который дает отличную возможность писать простые и семантически понятные шаблоны, причем можно быть уверенным, что эти шаблоны не свалятся с ошибкой, если одна из переменных шаблона будет не определена, как, например, иногда происходит при использовании встроенного шаблонизатора из Underscore.js. Кроме того, Handlebars.js позволяет нам компилировать шаблоны заранее, не перекладывая задачу по компиляции шаблонов в браузеры пользователей.
Handlebars.js, на первый взгляд, можно назвать примитивным, поскольку он запрещает использовать сложные логические выражения в шаблонах, однако такова концепция этого шаблонизатора и его шарм — ведь шаблоны всегда останутся простыми и понятными. Всю сложную логику следует выносить в специальные функции-хелперы (helpers). Шаблонизатор содержит несколько встроенных хелперов, среди которых {{#each}}, {{#if}} и {{#unless}}, но среди них катастрофически не хватает хелпера {{include}} (наподобие {include} из Smarty), который позволил бы нам включать внутрь одних шаблонов другие шаблоны.

Читать дальше →

 

Еще раз о parseInt, или почему parseInt от ’09’ равно 0

Казалось бы тема про parseInt в javascript уже довольна избита, но до сих многие из разработчиков, как опытных, так и не очень, с поразительным упорством наступают на одни и те же грабли. Как известно, глобальный метод parseInt() в javascript используется для перевода числа из его строкового представления в целочисленное число. Этот метод имеет два параметра — собственно само строковое представление числа и необязательный параметр, который указывает основание системы счисления, в которой производится преобразование. Вот о втором параметре и пойдет сегодня речь. Если внимательно посмотреть на него, взвесить все «за» и «против», и взглянуть на пример кода из реально существующего веб-сервиса, то станет понятным, что лучше всегда явно указывать этот самый необязательный второй параметр parseInt. Иначе в некоторых частных случаях функция с parseInt может работать неправильно. В качестве живого примера рассмотрим функцию, которая проверяет контрольное число у свидетельств пенсионного страхования.

Читать дальше →

 

Вращение псевдотрехмерных цилиндрических объектов с помощью CSS и JavaScript

Как-то давно я прочитал занятную статью Романа Кортеса (Roman Cortes) об интересном эффекте, которого можно добиться используя старое-доброе css-свойство background-attachment:fixed. Основная суть этого занятного эффекта в разбиении видимой поверхности цилиндрического объекта на множество вертикальных прямоугольников и задании им фоновой картинки с background-attachment:fixed. Далее достаточно проскроллить блок с таким образом сформированным объектом и поразиться тому, что с помощью простого CSS можно добиться такого эффекта вращения цилиндрического объекта. Но в упомянутой выше статье вертикальные блоки для видимой части цилиндра, а также их настройки (в частности background-position) были подобраны вручную. Я решил написать простенький javascript-код, которой позволит собирать подобную цилиндрическую поверхность из любой прямоугольной текстуры.

Читать дальше →

 

Пишем скрипт для использования онлайн-сервиса Google Closure Compiler из командной строки UNIX

Ни для кого не секрет, что одним из важных шагов при оптимизации javascript на сайтах, является минимизация исходных скриптов. На данный момент основными инструментами для сжатия javascript являются yui-compressor (утилита для командной строки в UNIX-подобных системах), packer от Dean Edwards (онлайн-сервис) и Google Closure Compiler — наиболее продвинутый на данный момент инструмент (существует как онлайн-версия, так и свободное java-приложение, запускаемое из командной строки). Однако с запуском java-приложение не в UNIX-подобной операционной системе могут возникнуть сложности, так как для своей работы оно потребует эмуляции через Cygwin. Однако существует и альтернативный способ сделать кроссплатформенную утилиту для командной строки — это использовать онлайн-сервис Google Closure Compiler прямо из командной строки.

Читать дальше →