Категории: JavaScript

jQuery: Специальные события

Владимир | | JavaScript, Web разработка.

Этот пост — перевод статьи Брэндона Аарона (Brandon Aaron) Special Events, в котором он рассказывает об использовании специальных событий jQuery и приводит пример создания обработчика тройного клика мышкой.

jQuery, начиная с версии 1.2.2, имеет API для создания "специальных событий". Эти события называются специальными, потому что позволяют выполнять некоторые дополнительные действия при их возникновении, а также имеют опцию, позволяющую обходить внутреннею систему событий jQuery. Используя эти специальные события вы можете создавать пользовательские события, которые требуют выполнения каких-то действий перед началом работы (при установке) или должны переопределять поведение встроенных событий.

Мы использовали специальные события jQuery для создания событий “mouseenter” и “mouseleave”, а также для создания события “ready” и для нормализации события “mousewheel” в плагине mouse wheel.

Специальное событие: “tripleclick” (тройной клик).
Читать дальше

Bug Tracker: ответы на комментарии (часть десятая)

Владимир | | CodeIgniter, HTML, JavaScript, MySQL, PHP, Web разработка.

В предыдущих частях (1, 2, 3, 4, 5, 6, 7, 8, 9) мы создали практически работоспособную систему отслеживания ошибок.

«Практически» в данном случае означает, что на данный момент у пользователя отсутствует возможность отвечать на комментарии. Т.е. можно оставить только комментарий 1-ого уровня (комментарий к багу).

Сегодня мы исправим этот недостаток.

Напомню, что на стороне сервера поддержка вложенных комментариев уже реализована. В базе данных (таблица comments) есть поле parent_id в котором хранится id родительского комментария.

Кроме того, метод addComment (модели mcomments) принимает массив с данными комментария, одним из полей которого является parent_id.

И, наконец, метод addcomment контроллера читает этот параметр из массива $_POST и передает его модели.

Таким образом, нам остается обеспечить возможность посетителю указывать на какой комментарий он хочет ответить.
Читать дальше

Bug Tracker: установка фреймворка и создание базы данных (часть вторая)

Владимир | | Ajax, CodeIgniter, htaccess, JavaScript, MySQL, PHP, Web разработка.

Сегодня я продолжаю рассказывать о разработке собственной системы отслеживания ошибок. В прошлой статье только вкратце была описана общая идея и возможности, а также показан предварительный эскиз приложения.

Но прежде чем переходить к основной теме, хочу поблагодарить всех комментаторов и особенно AmdY, Big_Shark и Алексея Качаева за советы!

Первоначально я планировал доделать приложение полностью, и только потом опубликовать этот цикл постов. Но так получается даже лучше. Всегда есть шанс, что читатели найдут недостатки, и мне не придется переделывать все приложение чтобы их исправить 😉

В прошлый раз с инструментами мы определились (используем PHP, фреймворк CodeIgniter, MySQL и jQuery).

Сейчас нам нужно их установить и настроить.
Читать дальше

Создаем собственную систему отслеживания ошибок на PHP

Владимир | | Ajax, CodeIgniter, JavaScript, MySQL, PHP, Web разработка.

Приветствую всех!

Это первая статья о создании полнофункционального web приложения, которое будет представлять собой систему отслеживания ошибок (bug tracking system).

О том, что представляют собой такие системы и какие они бывают можно рассказывать долго, но пока я ограничусь только определением из википедии.

Система отслеживания ошибок (англ. bug tracking system) — прикладная программа, разработанная с целью помочь разработчикам программного обеспечения (программистам, тестировщикам и др.) учитывать и контролировать ошибки (баги), найденные в программах, пожелания пользователей, а также следить за процессом устранения этих ошибок и выполнения или невыполнения пожеланий.

Почему именно баг трекер?

Очень хороший вопрос 🙂 Вообще-то, причин две.

Первая – это приложение не «hello world». И на его примере можно показать совместное использование PHP, JavaScript, AJAX, работу с базой данных и т.д.

Вторая – такое web приложение можно сделать достаточно простым (реализовать минимум функций), но в то же время вполне работоспособным. Ведь основная задача этого цикла статей – показать пример создания полноценного приложения, но в тоже время хотелось бы удержать его объем в каких-то разумных рамках 😉

Постановка задачи.
Читать дальше

XSS с использованием JSONP и jQuery

Владимир | | Ajax, JavaScript, PHP, Web разработка.

В прошлый раз я рассказывал о своих экспериментах по выполнению межсайтовых запросов и вскользь упомянул о JSONP. Сегодня я хочу подробнее рассказать об этом формате передачи данных и том, как с ним работать.

Как несложно догадаться, JSONP представляет собой расширение формата JSON. Расшифровывается эта аббревиатура так — JavaScript Object Notation with Padding, т.е. JSON с дополнением.

Об этом дополнении чуть ниже, а сейчас, напомню, что представляет собой формат JSON и зачем он нужен.

Если не вникать в нюансы, JSON представляет собой формат записи JavaScript объектов в виде обычной текстовой строки. Т.е. вы можете отправить такую строку в ответ на AJAX запрос, а затем преобразовать её на стороне клиента в объект с данными.

Конечно, JSON не единственный формат, но он один из самых удобных. Библиотеки для работы с ним есть практически во всех языках, а само преобразование выполняется с помощью одного вызова функции.
Читать дальше

XSS и Same Origin Policy

Владимир | | Ajax, HTML, JavaScript, Web разработка.

Прошлый пост «Как обойти запрет на XSS» вызвал довольно интересное обсуждение. Я сначала пробовал сразу отвечать на комментарии, но потом понял, что развернутые ответы больше напоминают статьи, а краткие – только всё запутывают.

И, что хуже всего, я почувствовал, что не могу внятно ответить на часть комментариев, а значит нужно подробнее разобраться в ситуации 🙂

В общем, я провел небольшую серию экспериментов и хочу рассказать о результатах.

На всяких случай напомню, что в прошлый раз речь шла об использовании XSS (cross site scripting), т.е. межсайтовых запросах.

В первую очередь я решил проверить, как работают самые простые запросы. Для этого создал простенькую тестовую страничку на локальном сервере (localhost) и подключил библиотеку jQuery.
Читать дальше

Отмечаем место нахождения посетителя на Яндекс.Карте

Владимир | | HTML, JavaScript, PHP, Web разработка.

Эта статья о совместном использовании двух web сервисов: IPLoc и Яндекс.Карты.

Прежде всего, разберемся зачем нужны одновременно два сервиса.

С Яндекс.Картами, все просто. Этот сервис позволяет разместить на странице спутниковую или обычную карту. При этом карта будет интерактивной, т.е. посетитель сможет перемещать её, изменять масштаб, тип, измерять расстояния и т.д.

Сервис IPLoc, в свою очередь, позволяет определить географические координаты указанного IP адреса, т.е. широту и долготу. А это как раз те данные, которые нужны чтобы указать точку на Яндекс.Карте.

Примечание. Вместо Яндекс.Карт можно использовать Google Maps, о которых я уже рассказывал. В этот раз я выбрал Яндекс.Карты потому что они содержат более подробные карты с названиями улиц для городов СНГ.

Таким образом, используя оба сервиса одновременно мы можем определить место нахождения посетителя и показать его на карте.

Принцип работы.
Читать дальше

Сравнение PHP IDE

Владимир | | CSS, Eclipse, HTML, JavaScript, PHP, Web разработка.

Приветствую всех! Тема прошлого поста неожиданно получила развитие 🙂

В прошлый раз Oleg Lobach попросил сделать сравнительную таблицу PHP IDE, а Александр Макаров предложил сделать это совместными усилиями. И не просто предложил, а сделал большую часть работы 🙂

Сам бы я, наверное, браться за такую таблицу не стал, т.к., например, с NetBeans я не работал. Точнее я им раньше пользовался, но только для Java.

В результате совместных усилий получилась

acrobat-reader

Сравнительная таблица основных PHP IDE.

Есть и HTML версия.

В нее вошли:
Читать дальше

Новое расширение к FireFox для web разработчиков

Владимир | | JavaScript, Web разработка.

Буквально на днях появился очень полезный инструмент для JavaScript разработчиков под названием Fireunit.

Он представляет собой фреймворк для тестирования JavaScript кода и выполнен в виде плагина к браузеру FireFox. Написан он в виде надстройки над другим плагином — FireBug. И, как вы понимаете, работать без установленного FireBug не будет.

Кстати, авторы плагина: John Resig и Jan Odvarko.

Рассмотрим основные возможности Fireunit.

Интерфейс

Тут все просто. После установки плагина в окне Firebug появляется новая вкладка «Test» в которой выводятся результаты выполнения тестов.

Создание собственных тестов.

Каких-то специальных требований к оформлению тестов Fireunit не выдвигают. Насколько я понял, тестом считается вызов методов объекта fireunit (правда не всех).

Рассмотрим небольшой пример.
Читать дальше

Операционная система на JavaScript

Владимир | | JavaScript, Web разработка.

На днях я наткнулся на одну очень интересную разработку на JavaScript. Представляет она собой пользовательский интерфейс, похожий на интерфейс операционных систем.

Конечно, о полноценной замене ОС речь не идет, но, тем не менее, некоторые возможности присутствуют.

Например, можно менять оформление рабочего стола (цвета фона, шрифтов, обои и т.п.).

Расскажу немного подробнее об основных возможностях.
Читать дальше