Имена переменных в JavaScript

JavaScript очень интересный язык, позволяет даже такое:

var π = Math.PI;

var ಠ_ಠ = 111;

var привет = 222;

и при этом - это всё будут корректные идентификаторы, которые в дальнейшем можно использовать. Кстати IE6 понимает названия переменных на русском в UTF-8, но это не значит, что нужно сразу использовать это =)

Подробнее об именах идентификаторов в js можно прочитать здесь

Простая и красивая PHP капча на сайт

А вот и реализация одной очень простой и легкой капчи на php:

 //path to font:
 $font = '/var/www/font.ttf';

 session_start();
 
 // generate random number and store in session
 
 $randomnr = rand(1000, 9999);
 $_SESSION['randomnr2'] = md5($randomnr);
 
 //generate image
 $im = imagecreatetruecolor(100, 38);
 
 //colors:
 $white = imagecolorallocate($im, 255, 255, 255);
 $grey = imagecolorallocate($im, 128, 128, 128);
 $black = imagecolorallocate($im, 0, 0, 0);
 
 imagefilledrectangle($im, 0, 0, 200, 35, $black);
  
 //draw text:
 imagettftext($im, 35, 0, 22, 24, $grey, $font, $randomnr);
 
 imagettftext($im, 35, 0, 15, 26, $white, $font, $randomnr);
 
 // prevent client side  caching
 header("Expires: Wed, 1 Jan 1997 00:00:00 GMT");
 header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
 header("Cache-Control: no-store, no-cache, must-revalidate");
 header("Cache-Control: post-check=0, pre-check=0", false);
 header("Pragma: no-cache");
 
 //send image to browser
 header ("Content-type: image/gif");
 imagegif($im);
 imagedestroy($im);

Только нужно лишь таскать с собой какой-нибудь шрифт в TTF. И, поигравшись с параметрами, можно кастомизировать капчу как угодно на своё усмотрение - свой набор символов/слов, цвета символов, цвет фона сделать такой же, как на сайте - вообщем всё, что угодно.

Base64 quirks

Оказывается Base64 разные версии бывают. И вот на одном проекте всплыла особенность этого стандарта кодирования, заключающаяся в том, что по-умолчанию, в результирующей закодированной строке могут содержаться символы '+' и '/', которые, при передаче, например, через GET - преобразовываются веб-сервером в '+' → '%2B', '/' → '%2F'.
В данном случае можно либо преобразовывать сущности обратно в нормальный вид, либо использовать Base64 для URL, в котором '+' и '/' заменены на '-' и '_' соответственно, которые уже затем нормально можно использовать в дальнейших целях без дополнительных обработок.

iPad и гарантия Apple

Хочу выразить огромную благодарность сервисному центру М.Тайм (авторизованный Apple AASP), который взял и починил мне iPad 2. Хоть это длилось месяц, но зато я получил полностью новое заменённое устройство из Америки и чертовски доволен :)
Оказывается на айпад, как и на некоторые другие устройства от Apple действует международная ограниченная гарантия, по которой любой iPad можно обменять по гарантии в течение года, если, конечно, в нём обнаружился заводской брак.
У меня как раз это и произошло - для того, чтобы в скайпе тебя услышал собеседник - нужно было наклониться над микрофоном и громко кричать туда:)

Кстати, проверить оставшуюся гарантию на устройство Apple можно на этой странице

AjaxUpload через AJAX не работает?

Если кнопка AjaxUpload, загруженная через аякс (например показывающаяся  в jQuery UI dialog) не работает - то одной из причин может служить неправильный z-index!
Лечится с помощью:

$('input[name=uploadfile]').css('z-index', '20000');

JSONP для начального отображения страницы

Если на страницах используются динамические данные, списки (загружаемые, через AJAX), то возникает вопрос, заключающийся в том, чтобы изначально загрузить эти данные.
Повсеместно везде используется практика дополнительного "дублированного" JavaScript кода на странице, но есть хорошая статья о том, как можно использовать JSONP для инициализации начальных данных на странице.

SPLIT в JavaScript а также в JScript и IE6-8

Оказывается в методе String.split(), реализованном в JavaScript (по сравнению с реализацией этого метода в JScript и в IE6-8) есть отличие, заключающееся в том, что если в качестве разделителя задать регулярное выражение и обрамить разделитель в скобки, то он добавится в качестве элемента в выходной массив:

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

А для того, чтобы в JScript и Internet Explorer'ах разделители добавлялись в массив, можно переопределить метод String.prototype.split, который будет корректно работать везде (в соответствии со спецификацией ECMA-262 v3)

О том как это сделать можно прочитать тут -
http://blog.stevenlevithan.com/archives/cross-browser-split

Бешенный скролл jCarousel Lite.

Есть такая очень удобная js библиотека 
jCarousel Lite, которая позволяет очень просто делать анимации и карусели. И вот после очередного обновления сервера карусель начала бешено двигаться то вперёд, то назад.

А дело заключалось в том, что случайно в шапке сайта два раза подгружался скрипт инициализации и в том числе инициализации карусели. И таким образом заместо одной карусели появляется две - и обе листают практически одинаково и незаметно что их две. Но стоит переключиться на другую вкладку в браузере или свернуть - как карусель бешено крутится.
Отпишусь создателю библиотеки об этом issue.

Ширина макета с фиксированным контентом

Если макет веб-страницы фиксирован и должен корректно вписываться по ширине в окно браузера при разрешении 1024x768, то максимальная ширина для wrapper'а (или обёртки контента) должна быть 996px или меньше. При указании ширины больше этого числа (1000px например) в некоторых недобраузерах появляется горизонтальный скролл.

Пример макета - http://dl.dropbox.com/u/1218489/web/markup_996.html

Javascript — полезняшки и хелперы

1. jQuery фильтр :random для получения случайного элемента из набора: (взять отсюда)

jQuery.jQueryRandom = 0;
jQuery.extend(jQuery.expr[":"],
{
    random: function(a, i, m, r) {
        if (i == 0) {
            jQuery.jQueryRandom = Math.floor(Math.random() * r.length);
        };
        return i == jQuery.jQueryRandom;
    }
});

2. Работа с датами на javascript. Класс Date можно расширить замечательным свойством .format(...), которое позволит получать дату в нужном формате.

var now = new Date();

now.format("mm.dd.yyyy");
// Возвращает, например, "06.09.2010"

// Можно использовать как отдельную функцию
dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");
// Saturday, June 9th, 2007, 5:46:21 PM

// Или можно использовать некоторые заранее определённые
// маски, или определить свою маску.
now.format("isoDateTime");
// 2007-06-09T17:46:21

// Функция без аргументов возвращает текущую дату с дефолтной маской
dateFormat();
// Sat Jun 09 2007 17:46:22

Скачать и посмотреть примеры использования можно тут

3. Правильный typeof - возвращает тип JS объекта

Object.prototype.toType = function() {
  return Object.prototype.toString.call(this).slice(8, -1).toLowerCase();
}

Пример использования: http://jsfiddle.net/nerevar/sfq4L/
.....

4. Placeholder - подсказка в текстовом поле, которая пропадает при переходе в это поле, реализуется следующим скриптом:

 $('input[placeholder], textarea[placeholder]').each(function(){
  var $input = $(this);
  var value = $input.attr('placeholder');
  $input.removeAttr('placeholder').val(value);
  $input.bind({
   blur: function() {if (this.value=='') this.value=value;},
   focus: function() {if (this.value==value) this.value='';}
  });
 });

Кстати нативно поддерживается многими браузерами.