Search
Write a publication
Pull to refresh
12
0
Павел Аксютин @webboy

User

Send message

Iterators & Generators

Reading time12 min
Views20K
Обработка элементов коллекции/массива обычная и частая операция. В JavaScript есть несколько способов обхода коллекции начиная с простого for(;;) и for a in b

var divs = document.querySelectorAll('div');
for (var i = 0, c = divs.length; i < c; i++) {
    console.log(divs[i].innerHTML);
}

var obj = {a: 1, b: 2, c: 3};
for (var i in obj) {
    console.log(i, obj[i]);
}

У объекта Array есть методы обхода всех элементов map(), filter()
var numbers = [1, 2, 3, 4, 5];
var doubled = numbers.map(function (item) {
    return item * 2;
});
console.log(doubled);

В Firefox есть "заполнитель массива" (Array comprehensions)
var numbers = [1, 2, 3, 4];
var doubled = [i * 2 for each (i in numbers)];
console.log(doubled); // [2, 4, 6, 8]

Итераторы и Генераторы появились в JavaScript 1.7 (по версии Mozilla) они есть пока в Firefox 2+ (в статье будет упомянут способ как их можно «эмулировать» почти во всех браузерах с костылем) Итераторы и Генераторы вносят механизм, позволяющий управлять поведением for in и инкапсулировать процесс получения следующего элемента в списке объектов.

Часто для обхода и обработки элементов массива мы пишем большие конструкции, часто копипастим их части. Задача Генераторов и Итераторов усовершенствовать этот процесс, добавив синтаксический сахар.
Читать дальше →

Инвертирование страницы только средствами CSS

Reading time2 min
Views7.4K
Я недавно увидела jQuery-плагин Paul Irish для инвертирования страницы. Он инвертирует каждый цвет на странице, включая изображения и CSS. Это мне напомнило о существовании ключевого слова invert для цвета контуров (outline) (к сожалению, поддерживаемом только в Opera и IE9+). В общем, я задумалась, как можно добиться такого же эффекта только средствами CSS.

Оказалось, что это достаточно просто:
Читать дальше →

«Переезжаем» в офлайн: Web Storage, Application Cache и WebSQL

Reading time11 min
Views28K
Чтобы делать приложения, которые могут работать в полностью автономном режиме, нам нужно познакомиться со следующими технологиями: HTML5 Application Cache, Web Storage и WebSQL.
Мной уже были опубликованы вводные статьи, касающиеся Web Storage и HTML5 Application Cache. Рекомендую их к прочтению если вы еще не знакомы с основными понятиями. В данной статье будут пересмотрены эти технологии, в том числе и WebSQL, и описаны варианты их совместного эффективного использования. Все эти технологии поддерживаются настольной версией браузера Opera 11.10, Opera Mobile 11, браузерами на движке WebKit (в iOS и Google Android).
Читать дальше →

Наглядная демонстрация алгоритмов сортировки

Reading time1 min
Views34K
Трансильванский университет Sapientia представил свой новый обучающий курс по алгоритмам сортировки. Стоит отметить талант создателей и высокую наглядность пособия.



Под катом есть еще видео
Читать дальше →

Chartwell — шрифт-диаграмма

Reading time1 min
Views6.4K
Недавно на свет появился Chartwell — набор OpenType шрифтов, позволяющих в интерактивном режиме создавать аккуратную инфографику.

Вы набираете необходимые числа, а диаграммы рисуются сами. Доступно три начертания: Pies, Bars, Lines. Диаграмму можно раскрасить по собственному вкусу — цвет числа определяет цвет соответствующей ему части диаграммы.

image

Шрифт в работе

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

HTML5 как победа научного материализма

Reading time15 min
Views6.3K
Стандарт HTML5 уже почти готов к использованию. Где-то все еще идут жаркие споры по конкретным секциям DOM, видеокодекам, анимации и прочим 3D, но основа HTML5 — его синтаксис, атрибуты и теги — уже устаканились. Эти разделы стандарта не меняются уже многие месяцы; окончательно и по факту их зафиксируют релизы IE9 и FF4, после чего какие-либо их изменения в рамках пятой версии станут невозможны.
Так как костыли для старых версий IE уже созданы и обкатаны, то уже совсем-совсем скоро, начиная новый проект, можно будет открыть свой любимый редактор и, не скрывая наслаждения, написать

<!doctype html>

Сначала, конечно, html5 появится скорее в бложиках энтузиастов, чем на серьезных сайтах, но — вот увидите — через несколько лет в каждой региональной газете появятся объявления типа «ремонт и настройка ПК, заправка принтеров, 1С, сайты на HTML5».

В IT, как и в других областях техники, спецификации бывают хорошие, как у Страуструпа, а бывают плохие и даже отвратительные, как спецификация ECMAScript. По моему скромному мнению, спецификация HTML5 обещает стать воистину великой, просто-таки образцовой вершиной этого бюрократического жанра.
Пролистывая на выходных свежую версию черновика стандарта (от 5-ого марта), я в очередной раз не мог не восхититься изящностью принятых решений и филигранной точностью формулировок родившейся в тяжелых муках спецификации.

Эта статья о том, почему стандарт html5 получился именно такой, и что на самом деле скрывается за его внешне обтекаемыми формулировками.
Читать дальше →

Отправляем SMS со своего номера Мегафон без GSM-аппарата

Reading time1 min
Views26K
Приветствую!

Некоторое время назад Yastrebon опубликовал найденную фичу отправки sms\mms через шлюз Мегафона. Причем отправлять со своего номера и оплачивать со своего-же счета (включая разные бонусные программы и пакеты).

Выдалось свободное время и я решил написать библиотечку-враппер над этим сервисом.

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

Набор инструментов для построения графиков, блок-схем и диаграмм

Reading time3 min
Views180K


Есть много разных сервисов, облегчающих жизнь веб-разработчику или дизайнеру, в том числе создающих разные графики, диаграммы, блок-схемы и т.д. Ниже представлена небольшая подборка.
(Осторожно, много изображений)
Читать дальше →

Использование Deferred объектов в jQuery 1.5

Reading time6 min
Views37K
Deferred объекты появились в jQuery 1.5. Они позволяют отделить логику, которая зависит от результатов выполнения действия от самого действия. Для JavaScript Deferred объекты не новы, они уже были в MochiKit и Dojo, но с изменениями логики jQuery ajax от Julian Aubourg, внедрение Deferred объектов было неминуемо. С Deferred объектами несколько callback могут быть связаны с результатом задачи и любые из них могут быть привязаны к действию даже после начала его выполнения. Выполняемая задача может быть асинхронна, но не обязательно.

Deferred объекты теперь встроены в $.ajax() таким образом вы будете получать их автоматически. Обработчики теперь могут быть связаны с результатом следующим образом:
// $.get, ajax запрос, он асинхронный по умолчанию
var req = $.get('foo.htm')
   .success(function( response ){
      // что-нибудь делаем с ответом
   })
   .error(function(){
      // делаем что-нибудь если запрос провалился
   });
 
// это выполнится перед тем как $.get() будет выполнено
doSomethingAwesome();
 
// Делаем что-то ещё перед завершением запроса
req.success(function( response ){
   // делаем  что-то ещё с ответом
   // он будет выполнен когда запрос завершится, а если запрос завершен, то будет вызван немедленно
   // если запрос уже был выполнен
});

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

HTML5 — взгляд через призму безопасности

Reading time10 min
Views26K
HTML5 — будущий стандарт языка разметки Интернет. Пока он находится в стадии черновика, но все больше и больше его возможностей реализуются в популярных веб-браузерах. Но как это обычно бывает, новые технологии несут в себе и новые опасности, которые могут быть успешно проэксплоитованы.
Читать дальше →

10 интересных jquery плагинов

Reading time1 min
Views3.1K

Каждый веб-разработчик использует Javascript при создании веб-приложений, а когда дело доходит до отображения нескольких элементов на странице с акцентом на один элемент, без использование слайдеров не обойтись. Слайдеры можно использовать для отображения ленты новостей, изображений или продуктов в той форме, которая была бы удобна пользователям. Ниже представлены несколько интересных решений, которые помогут в создании веб-приложений.
Читать дальше →

Создание игры на Javascript Canvas

Reading time13 min
Views71K

Здравствуйте! Я предлагаю вам со мной создать небольшую казуальную игру на нескольких человек за одним компьютером на Javascript Canvas.
В статье я пошагово разобрала процесс создания такой игры при помощи MooTools и LibCanvas, останавливаясь на каждом мелком действии, объясняя причины и логику добавления нового и рефакторинга существующего кода.
Читать дальше →

Качаем торренты автоматически с помощью FlexGet+Deluge

Reading time3 min
Views14K
На написание этого опуса меня сподвиг данный пост, так как в нем некоторые моменты освещены недостаточно подробно. Ниже я опишу на собственном примере реализацию автоматической качалки торрентов с Lostfilm-а пр помощи FlexGet и Deluge. Все будет проиходить под Ubuntu 9.10
читать дальше

Подборка роликов о создании макета дизайна и сайта в Adobe Fireworks

Reading time3 min
Views18K

Что такое Fireworks и зачем он нужен


Fireworks и HabrahabrВ нашей стране данный графический редактор не снискал популярности. Так уж сложилось, что стоимость пакета Adobe Creative Suite у нас в среднем равна стоимости интернет-трафика на его скачивание, либо стоимости носителя, на который его записывают. Отчасти поэтому все используют Adobe Photoshop и Adobe Illustrator для создания веб-дизайна. Ну вот сейчас, лично для меня, пришло время задуматься о лицензионности софта.

Я сам не являюсь веб-дизайнером, я программист. Основные задачи, которые я решаю с помощью графического редактора — это минимальная модификация растровой и векторной графики, нарезка готового дизайна, оптимизация изображений, создание прототипов и т.п. Photoshop и Illustrator без проблем решают эти задачи, однако их в состоянии решить и Fireworks. А теперь вспомним про стоимость Photoshop + Illustrator (700$ + 600$) и сравним со стоимостью Fireworks (300$).

Частенько бывает, что Fireworks не справляется с отображение родных файлов Photoshop и Illustrator. Возникают глюки с отображением некоторых эффектов. В таких случаях обычно помогает эталонный скриншот, который позволяет понять где проблема и при возможности исправить ее. Также есть альтернативные редакторы (Gimp, Pixelmator), которые открывают исходный файл, но уже со своими глюками, которых нет в Fireworks.

Таким образом, вряд ли Fireworks заинтересует дизайнеров, уже работающих в Photoshop, его основные пользователи — это программисты, верстальщики, проектировщики и небольшая часть дизайнеров (во всяком случае в России).

Подборка роликов о Fireworks


Покопавшись в рунете на предмет наличия видео о Fireworks на русском языке я наткнулся на некий вакуум. Все имеющиеся ссылки вели на Youtube. Вот к нему я обратился, а результаты поиска под хабракатом. Кому будут интересны эти ролики? Прежде всего программистам, отчасти верстальщикам, которые хотят понять как создается веб-дизайн и почему им не всегда нужен Photoshop.
Читать дальше →

Создание программ для Mac OS X. Часть 3: Apple Script

Reading time4 min
Views35K
В этой части я расскажу про еще одно интересное средство разработки приложений для Mac OS X — скриптового языка Apple Script.

Apple Script разрабатывался чтобы применяться конечными пользователями, а не программистами, и позволить им контролировать приложения и документы, с которыми они работают. Например, с помощью Apple Script можно открыть фотографию в редакторе изображений, обрезать до нужного размера, записать ссылку на фото в текстовый файл и т.п.
Читать дальше →

Создание программ для Mac OS X. Часть 2: средства разработки и создание простого приложения

Reading time5 min
Views26K
В этой части я расскажу вам о средствах разработки приложений под Mac OS X Leopard. Скажу сразу, что буду рассматривать только те, которые предоставляются самой Apple. Другие IDE существуют, но они обычно кроссплатформенные (например Code::Blocks), так что рассказывать о них лучше не в этой статье.

Так вот, на диске с Лео идет инструментарий разработчика Mac OS X — набор необходимых программ и фреймворков для создания приложений. Устанавливается все это дело(приложения, документация, куча примеров, разные полезные утилиты, etc.) в папку /Developer.

После установки имеет 4 основных приложения для разработки:
1. XCode — основная IDE
2. Interface Builder — программа для создания интерфейсов прораммы, хотя ее возможности куда шире
3. Instruments — средство для слежения за программой
4. Dashcode — программа для создания виджетов для Dashboard
Читать дальше →

Создание программ для Mac OS X. Часть 1: вступление и Objective-C

Reading time10 min
Views74K

Вступление


Я думаю все слышали про Mac OS X как операционную систему для дизайнеров и домохозяек. Но хочется рассказать про средства разработки для OS X, а то хорошие программы пишут, а на чем — никто не знает.

Сразу скажу, что не буду рассказывать про кроссплатформенные фреймворки и тулкиты(такие как Qt) или про создание консольных приложений, я расскажу про то, что в плане создания приложений отличает Mac OS X от других операционных систем, а именно — фреймворк Cocoa. Оговорюсь сразу, что буду стараться избегать сравнений с другими фреймворками, я хочу просто рассказать про Cocoa.
Читать дальше →

Список Javascript библиотек для рисования графиков и диаграмм 2

Reading time2 min
Views37K
Продолжаем тему визуализации данных в интернете.

Предыдущие топики:
Читать дальше →

Список Javascript библиотек для рисования графиков и диаграмм

Reading time1 min
Views22K
О визуализация графов в вебе говорили здесь, навеяно этой статьей.

Под катом обзор JavaScript библиотек для рисования графов, диаграмм и прочей красоты.
Читать дальше →

Highcharts: Красивые, динамические чарты за 5 минут!

Reading time2 min
Views67K
image
Highcharts — библиотека для создания чартов написанная на JavaScript, позволяет легко добавлять интерактивные, анимированные графики на сайт или в веб-приложение. На данный момент чарты поддерживают большое количество диаграмм линейных, круговых, колоночных рассеивающих и многих других типов.

Чарты работают со всеми популярными браузерами, включая Safari на iPhone.
Минимальная версия для IE составляет 6+. Также браузеры поддерживающие Canvas элемент, и в некоторых случаях SVG для графического рендеринга.
Читать дальше →

Information

Rating
Does not participate
Location
Санкт-Петербург и область, Россия
Date of birth
Registered
Activity