Jun 11
Сергей опубликовал замечательный пост про сервисы поиска программного кода. Если честно - я такие никогда в жизни не использовал, так что если начну - только благодаря этому посту.
Jun 03
После релиза jQuery 1.2.6 долгое время раздел Release Notes пустовал. Сегодня вот заметил, что его наконец заполнили.
Из улучшений:
- Глобальное ускорение
- работа с событиями ускорена более чем в два раза
- селекторы ускорены на 13%
- .offset() ускорен на 21%
- работа с CSS (.css()) ускорена на четверть
- Кое-что улучшено, кое-что добавлено, вроде в API ничего не изменено
Jun 03
Как сообщает нам наш официальный источник - вышел первый релиз-кандидат jQuery UI - набора виджетов и визуальных эффектов для известного в узких кругах JS-фреймворка jQuery.
Как утверждает источник, RC1 довольно стабилен, а точнее - это самая стабильная версия из тех, которые вообще выпускались. :) Так что - спешите обновляться.
Ах да, чуть не забыл - в некоторых местах поменялось API (в draggable и resizable модулях так точно поменялось), так что будьте всё же осторожны и предусмотрительны.
May 29
Авось, кто-то еще не догадался… :)
Самый простой способ использования своих скриптов совместно с Google AJAX Libraries API:
google.load("jquery", "1");
google.setOnLoadCallback(function() {
$('<script type="text/javascript" src="_url_вашего_скрипта_"></script>').appendTo('head');
$('<script type="text/javascript" src="_url_вашего_другого_скрипта_"></script>').appendTo('head');
// ...
});Аналогичным образом подключаются, например, плагины для jQuery.
May 23
Цель статьи - показать, что из себя представляет “ненавязчивый JavaScript”, для чего он нужен, и чем он лучше “навязчивого” JavaScript. В рунете я подобных статей не встречал (может они и есть, но мне на глаза не попадались и немного погуглив, я тоже ничего не нашел), а как показывает практика - очень многие не знают, что это такое и как этим пользоваться.
Что такое Unobtrusive JavaScript
Unobtrusive JavaScript - это техника программирования на языке JavaScript, которая состоит из следующих принципов:
- разделения структуры (HTML) / оформления (CSS) и поведения (JavaScript)
- использование JavaScript для повышения удобства использования уже рабочего приложения
- применения техники Graceful degradation - если браузер не поддерживает те или иные функции, которые мы добавляем в приложение с помощью JavaScript - приложение всё равно остается рабочим
Зачем?
Это удобно, это практично, это легко реализуемо и это помогает Вам увеличить аудиторию вашего сайта за счет пользователей, пользующихся старыми браузерами, отключающими JavaScript, пользователей, которые пользуются интернетом с мобильных устройств.
Как?
Легче всего показать это на примере. За ним далеко идти не нужно - возьмем всеми любимый Хабрахабр:
<div class="text_comments">
<div class="comment_item" style="margin-left: 0px;">
<div class="service_text_comments_holder">
<a href="http://fxposter.habrahabr.ru/" class="comments_nickname">fxposter</a>
...
</div>
<div class="comment_text">...</div>
<div class="comments_reply">
<div class="reply_word_holder" id="reply_link866650">(<a href="javascript:saw(866650);">ответить</a>)</div>
<div style="display: none" id="reply866650">
<!-- форма отправки комментария -->
</div>
</div>
</div>
</div>Это код комментариев, которые показываются на страничке о посте. Для наглядности ненужные фрагменты были убраны.
Что плохо в этом фрагменте кода?
- JavaScript идет вперемешку с HTML (
<a href="javascript:saw(866650);">ответить</a>) - У людей с отключенным JavaScript’ом ответить на комментарий не получится в принципе
Как его можно улучшить?
- Вынести “навешивание” событий в отдельный файл
- Сделать так, чтобы при отключенном JavaScript’е пользователь перебрасывался на отдельную страницу, где бы он мог ответить на выбранный комментарий
Сказано - сделано. Преобразуем HTML к следующему виду:
<div class="text_comments">
<div class="comment_item" style="margin-left: 0px;">
<div class="service_text_comments_holder">
<a href="http://fxposter.habrahabr.ru/" class="comments_nickname">fxposter</a>
...
</div>
<div class="comment_text">...</div>
<div class="comments_reply">
<div class="reply_word_holder" id="reply_link866650">(<a href="reply.php?comment_id=866650" class="show_reply_form" id="show_reply_form_866650">ответить</a>)</div>
<div style="display: none" id="reply866650">
<!-- форма отправки комментария -->
</div>
</div>
</div>
</div>Как видите - я изменил тег <a> (присвоил ему “нормальный” href, добавил id и class). Теперь при нажатии на ссылку “ответить” пользователя будет перебрасывать на страницу ответа на выбранный вопрос. Этим я выполнил второй пункт в списке улучшений. Теперь давайте взглянем на первый пункт: для того, чтобы у пользователей, у которых включен JavaScript вместо редиректа выполнялось открытие формы под самим комментарием мне нужно выбрать все элементы с классом “show_reply_form” и каждому из них назначить на событие onclick функцию, которая бы “открывала” соответствующую форму.
Напишем соответствующую функцию:
function showForm(event) {
var id = parseInt(this.id.replace('show_reply_form_', ''));
saw(id);
return false;
}Она берет this.id (т.е. id текущего обьекта), убирает из него “фразу” “show_reply_form_“, тем самым получая номер элемента, который нам нужно открыть и вызывает функцию saw, которая присутствовала изначально в HTML-коде. Для того, чтобы не произошел редирект после клика на ссылку - функция возвращает false.
Осталось только связать эту функцию с нашими ссылками.
В jQuery это делается так:
$('.show_reply_form').click(showForm);В PrototypeJS - так:
$$('.show_reply_form').each(function(element) {
element.onclick = showForm;
});После присвоения нашей функции элементу - this.id станет относится к id этого элемента (да, это “магия JavaScript” :) ).
Весь JavaScript-код теперь можно вынести в отдельный файл:
function showForm(event) {
var id = parseInt(this.id.replace('show_reply_form_', ''));
saw(id);
return false;
}
window.onload = function(event) {
$$('.show_reply_form').each(function(element) {
element.onclick = showForm;
});
}Здесь мы вызываем “связывание” наших ссылок с функцией показа формы при событии window.onload (при загрузке страницы).
Таким образом я выполнил и первый пункт в списке улучшений.
Выводы
На мой взгляд, такое использование JavaScript, а именно - вынос всех функций на JS в отдельный файл и связывание этих функций с элементами страницы с помощью различных событий (здесь мы видели события window.onload и element.onclick) - это на данный момент - единственно правильное использование JavaScript.
Дерзайте, господа. :)
PS. Я прекрасно знаю, что можно использовать событие не window.onload, а DOMContentLoaded. Но я считаю, что для примера понятнее будет всё же использование window.onload.
May 18
Столкнулся с багом в WordPress’е при выводе постов, а точнее в “применении” к ним “типографики”:
Как видите, кавычки в некоторых словах расставлены абсолютно не так, как нужно. В поисках решения проблемы обнаружил следующее - в WordPress’е на каждый блок выходных данных, будь то заголовок, сам пост, его комментарии или что-либо еще, навешиваются фильтры, которые определенным образом изменяют блок - убирают теги, заменяют одни символы на другие и т. д.
В данном случае меня интересовал блок the_content (в данном случае понятие “блок” можно интерпретировать как “функция WP, которая возвращает некий контент”), который выводит содержимое поста. В файле wp-includes/default-filters.php можно увидеть, какие фильтры применяются к этому блоку:
add_filter('the_content', 'wptexturize');
add_filter('the_content', 'convert_smilies');
add_filter('the_content', 'convert_chars');
add_filter('the_content', 'wpautop');
add_filter('the_content', 'prepend_attachment');Методом проб и ошибок было установлено, что найденный мной баг “создает” фильтр wptexturize (в WP “фильтр” - это функция, которая принимает 1 аргумент - входящий текст, и возвращает обработанный текст). Функция нашлась в файле wp-includes/formatting.php. Она выполняет “типографскую” работу, при этом пропуская всё, что находится между тегами pre, code, kbd, style и script. В теории… На практике - нихрена она не пропускает, если внутри одного из этих тегов будет какой-либо другой тег (что, в принципе, возможно, но встречается редко, а случай pre > code система хавает на ура), либо если внутри какого-нибудь из этих тегов встретится \[.*\] - вот такой кусок (у меня этим куском был ['comment_post_ID'], например). Почему так - не могу знать (мне вообще непонятно зачем наряду с тегами <.*> рассматривать еще и \[.*\]), но факт остается фактом. Улучшенная версия этого файла находится здесь (у меня WP 2.5.1, если что).
May 18
May 18
Совершенно случайно обнаружил, что у меня нифига не работает WP’шный плагин Subscribe to Comments, хотя раньше проблем с ним вроде не было. Проверка того “что не так” и исправление этого всего у меня заняла добрые два часа…
Сначала грешил на WP 2.5, несовместимость таблиц и прочее - нифига, в бд всё, что нужно есть, но вот только сам факт подписки на комментарий туда заноситься не хотел ну вообще никак. Debug показал, что обработчику subscribe’ов вместо данных, введенных в форму коммента приходит “пустота” - абсолютно пустой $_POST. Глянув в строку адреса - обнаружил там длиннющую строку со всякими не сильно понятными значениями. Что ж, смотрим $_GET…
После просмотра, стало понятно, в чем затык - виной всему был OpenID-плагин, который для аутентификации пользователя выполнял всякие редиректы на другие сайты, после чего поток управления возвращался обратно в WP, однако все POST-данные оказывались потерянными. Нужные, по мнению OpenID-плагина, данные передавались теперь через GET, но OpenID, к сожалению, ничего не знал о плагине Subscribe to Comments и никаких данных о том, подписался ли пользователь на текущий пост, не передавал.
Решить проблему получилось с двух подходов. В первом я пытался сделать так, чтобы проверки OpenID выполнялись после того, как добавится подписка. После некоторых раздумий и просмотра того, как реализовывается подписка, стало понятно, что из этого способа ничего не выйдет. Поэтому пришлось лезть в исходники OpenID-плагина и искать то место, где создаются данные, хранимые в “сессии OpenID-аутентификации” и которые передаются обратно на сайт.
Довольно быстро это место нашлось - функция comment_tagging в файле logic.php:
$this->start_login( $openid_url, '/wp-login.php', 'commentopenid',
array(
'wordpressid' => $comment['comment_post_ID'],
'redirect_to' => get_permalink( $comment['comment_post_ID'] ),
)
);Добавляем сюда нужные нам поля, а именно поле subscribe:
$this->start_login( $openid_url, '/wp-login.php', 'commentopenid',
array(
'wordpressid' => $comment['comment_post_ID'],
'redirect_to' => get_permalink( $comment['comment_post_ID'] ),
'subscribe' => isset($_POST['subscribe']) ? $_POST['subscribe'] : null,
)
);После чего лезем в плагин Subscribe to Comments, находим функцию add_subscriber и меняем следующую строку:
if (($_POST['subscribe'] == 'subscribe' && is_email($email)) || $previously_subscribed) {На такую:
if (($_REQUEST['subscribe'] == 'subscribe' && is_email($email)) || $previously_subscribed) {После чего работоспособность подписки на комментарии восстановится.
PS. Так что, если вы задавали вопросы, подписались на комментарии и не получили ответа - зайдите на страничку поста - может быть я вам уже ответил. :)
May 06
За последнее время набрел на несколько отличных блогов и статей, которыми бы хотелось с вами поделиться.
Начну, пожалуй с блога моего “знакомого” (он меня, наверное, в лицо и не помнит), с которым я познакомился на Exception #07, организатором которой он собственно и является - “Иван Пирог в режиме онлайн“. Он открыл его буквально несколько дней назад и пока что там находятся только несколько статей по “самомотивации”. Может эта тема и не особенно интересна как таковая, но блог почитать очень советую - по-моему пишет Ваня просто замечательно. Кстати, у Юры Артюха эта тема тоже недавно поднималась, сговорились что ли. :)
Следующим будет блог, на который я попал как раз таки из блога Вани - Мурк дотком. Автор пишет о разном. Статьи очень интересны, особенно мне понравились последние статьи об agile-методологиях программирования. Я о методологиях в принципе никогда ничего не читал, но после этих двух статей я очень заинтересовался этой темой. Да и вообще - всегда приятно почитать умного человека.
Третьей, и последней “интересностью” будет не блог, а статья, ссылку на которую я почерпнул у Алёны Сагалаевой - статья называется “Редкая профессия” и повествует о разработке компилятора C++, которую проводила наша, отечественная комманда разработчиков в составе всего двух человек. Рекомендую. Настоятельно рекомендую!
UPDATE: Да, кстати, совсем забыл - теперь я регулярно заношу всякие интересные статьи себе в del.icio.us. Можете подписываться.
May 06
В последнее время очень хочется написать что-нибудь на Symfony - для себя, для других, что-то открытое и интересное - наподобии материала о создании askeet’а, который я, к сожалению, до конца дочитать еще не успел (но я близок к завершению!), и чтение которого приносит мне реальное удовольствие.
Причем хочется сделать что-то подобное не только потому, что я “хочу показать, что symfony - это круто”, “хочу показать, что я крутой программист” - нет, скорее даже наоборот. Текущий мой проект на работе сейчас усиленно мной допиливается до состояния, в котором его хоть как-то можно будет показать людям, но внутренний код проекта сейчас пребывает, как мне кажется, в плачевном состоянии - кардинально его рефакторить времени и (если уж честно) опыта нет, а тот код, который сейчас там есть мне кажется абсолютно неоптимальным (и некрасивым). У меня в последнее время стало появляться сильное ощущение того, что у меня просто не хватает опыта для того, чтобы реально расставить в рабочем проекте все по полочкам, а помогать мне в этом никто не будет, к сожалению. Поэтому я и хочу сделать какой-нибудь небольшой, несложный (по крайней мере, для начала) проект, смотря на разработку которого, вы, мои читатели, показывали бы мне на что мне стоит обратить внимание, что получается вообще плохо, какие части следует полностью пересмотреть. Я знаю, среди вам есть люди, имеющие гораздо больше опыта в разработке веб-приложений, чем я.
Сейчас для меня самый главный вопрос - что именно делать. Есть варианты:
- Блог - нужен, скорее всего, будет только мне, да и… сколько людей уже строило свои блоги… я, конечно, могу быть одним из них, но… в общем, если других вариантов не будет - возьмусь за блог
- Простенькую социальную сеть. Даже не знаю, на какую тему, и что там вообще должно быть…
- Может, что-нибудь еще… Хочу адекватные по сложности (и по времени разработки!) варианты услышать от вас. Что бы вы хотели, или что бы мне, на ваш взгляд, могло бы быть наиболее полезно.
Последние комментарии