Заметки веб-разработчика*

Копируем таблицу MySQL из консоли

2015-07-21T13:51:00.001+03:00

CREATE TABLE newtable LIKE oldtable;
INSERT newtable SELECT * FROM oldtable;

Как в Ubuntu запустить виртуальные хосты Apache под разными пользователями

2013-11-19T07:33:00.001+02:00

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

По-умолчанию Apache работает “от имени и по поручению” юзера www-data. Это значит что для веб-сервера будут доступны только те ресурсы (файли и каталоги), которые доступны для юзера www-data, соответственно и изменить он сможет только их. Как правило, на одном веб-сервере может располагаться сразу несколько виртуальных хостов (несколько сайтов), по-умолчанию все они будут доступны для юзера www-data и в случае взлома или поражения одного из ресурсов, остальные также могут быть поражены. Поэтому с целью обеспечения дополнительной безопастности существет возможность запуска виртуальных хостов от имени разных юзеров.

Как запустить виртуальные хосты от имени разных юзеров в Apache2?

Организовать работу виртуальных хостов под разными пользователями достаточно просто.
Для начала установим дополнительный модуль для апача apache2-mpm-itk. Так как этот модуль скомпилирован внутри apache2, во время установки появляется сообщение о том, чтотекущая версия apache и некоторые установленные модули могут быть удалени. Для установки запускаем следующую команду:

$ sudo apt-get install apache2-mpm-itk

В последующем перезапуске веб-сервера необходимости нет.

Теперь создадим новую группу

$ sudo addgroup GROUP_NAME

и юзера, под которыми будет работать один из наших виртуальных хостов

$ sudo useradd -g GROUP_NAME USER_NAME

$ sudo passwd USER_NAME

Далее открываем файл конфигурации виртуального хоста и добавляем туда диррективы:

<IfModule mpm_itk_module>

     AssignUserId USER_NAME GROUP_NAME

</IfModule>

Перед перезагрузкой apache установим соответствующие права на каталоги и файлы для нашего виртуального хоста

$ sudo chown USER_NAME:GROUP_NAME /var/www/some-virtualhost/ -R

Осталось только перезагрузить веб-сервер:

$ sudo service apache2 restart

Источник

Отключаем глобальное меню в Ubuntu 12.04

2012-12-10T12:14:00.000+02:00

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

И скорее всего, не у меня одного, появилась мысль его отключить :) Сделать это, к счастью, очень просто. Достаточно зайти в терминал и выполнить не хитрую комманду:

sudo apt-get autoremove appmenu-gtk appmenu-gtk3 appmenu-qt

В результате было:

стало:

Улучшаем производительность веб-ресурса. Установка mod_pagespeed в Ubuntu

2012-11-01T13:47:00.000+02:00

Для начала загружаем пакет с сайта Google

wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-beta_current_amd64.deb

или для 32-битной системы

wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-beta_current_i386.deb

Терь устанавливаем пакет (обезательно с правами root):

dpkg -i mod-pagespeed-*.deb
apt-get -f install

Настройка модуля осуществляется в файле /etc/apache2/mod-available/peagespeed.conf

Как сделать редирект черз .htaccess если браузер IE6

2012-10-05T14:38:00.002+03:00

Иногда приходится разрабатывать проекты, работающий с ограниченным количеством браузеров, либо же без потдержки старых версий (IE6 к примеру). В таких случаях логично организовать редирект на страницу с соответствующим текстом. Сделать это можно как при помощи Javasript-а, так и на стороне PHP. Но как по мне, более элегантным решением будет редирект на стороне веб-сервера Apache, а точнее при помощи фала .htaccess. Создаем файл .htaccess в корне сайта либо же открываем существующий, и добписываем следующие директивы:

RewriteCond %{REQUEST_FILENAME} !^.png [nc]
RewriteCond %{REQUEST_FILENAME} !^.css [nc]
RewriteCond %{REQUEST_FILENAME} !^.jpg [nc]
RewriteCond %{REQUEST_FILENAME} !^.js [nc]
RewriteCond %{REQUEST_FILENAME} !^.gif [nc]
RewriteCond %{HTTP_USER_AGENT} "Firefox/2" [or]
RewriteCond %{HTTP_USER_AGENT} "Firefox/1" [or]
RewriteCond %{HTTP_USER_AGENT} "Flock/1" [or]
RewriteCond %{HTTP_USER_AGENT} "Camino/1" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/9" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/8" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/7" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/6" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/5" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/4" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/3" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/2" [or]
RewriteCond %{HTTP_USER_AGENT} "Opera/1" [or]
RewriteCond %{HTTP_USER_AGENT} "Safari/4" [or]
RewriteCond %{HTTP_USER_AGENT} "Safari/3" [or]
RewriteCond %{HTTP_USER_AGENT} "Safari/2" [or]
RewriteCond %{HTTP_USER_AGENT} "Safari/1" [or]
RewriteCond %{HTTP_USER_AGENT} "Navigator/" [or]
RewriteCond %{HTTP_USER_AGENT} "MSIE 6" [or]
RewriteCond %{HTTP_USER_AGENT} "MSIE 5" [or]
RewriteCond %{HTTP_USER_AGENT} "MSIE 4" [or]
RewriteCond %{HTTP_USER_AGENT} "MSIE 3" [or]
RewriteCond %{HTTP_USER_AGENT} "MSIE 2" [or]
RewriteCond %{HTTP_USER_AGENT} "MSIE 1"
RewriteRule . upgrade.html [L]

Конечно же работать все это будет только при условии подключеного модуля mod_rewrite.

Как правильно установить NetBeans на Ubuntu 12.04

2012-08-20T13:42:00.002+03:00

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

Если устанавливать NetBeans сразу после установки системы, а я именно так всегда и делаю, то для начала понадобится установить JDK. Я много встречал негативных комментариев и "камней" в сторону дефолтного JDK, что решил воспользоваться альтернативным, а точнее Oracle JDK.

Порядок установки Oracle JDK следующий:

1. Удаляем OpenJDK:

sudo apt-get purge openjdk*

2. Открываем терминал и запускаем следующую последовательность комманд:

sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-get install oracle-java7-installer

3. После успешной установки проверяем версию JDK

java -version

Теперь идем на сайт NetBeans и качаем последнюю версию IDE:
http://netbeans.org/downloads/index.html

Находим сохраненный файл (я обычно сохраняю его на Рабочий стол), открываем свойсва файла, находим вкладку Permissions и ставим галочку в поле Allow executing file as programm. Закрываем окно, запускаем файл и устанавливаем NetBeans.

Если после первого запуска IDE вы заметили что главное меню сливается с заголовком окна, то необходимо еще выполнить следующее: ищем файлик /usr/share/themes/Ambiance/gtk-2.0/gtkrc, открываем его для редактирования от имени админа

sudo gedit /usr/share/themes/Ambiance/gtk-2.0/gtkrc

... находим строку 338 с текстом

style "menu" {

и меняем ее на

style "menu" = "dark" {

Сохраняем и перезапускаем NetBeans (если он был запущен)...

Велосипеды на Javascript и jQuery

2012-08-09T11:02:00.000+03:00

Интересная статья с habra. Полезно знать каждому.

"В очередной раз открыв код коллег и ужаснувшись, я решил написать эту статью. Надеюсь для кого-нибудь это будет полезным, заодно и мне будет проще новичкам объяснять что у них в коде не так, просто кинув ссылку на эту статью.
Безусловно количество таких вещей очень и очень велико, поэтому в статье ограничусь лишь некоторыми."

http://habrahabr.ru/post/149237/

Elgg: mod-rewrite для NGINX

2012-08-06T13:42:00.001+03:00

Сегодня развернул Elgg на веб-сервере NGINX, и первая проблема с которой столкнулся - это небходимость замены mod-rewrite директив, которые содержатся в файле .htaccess, на соответсвующие правила для NGINX (rewrite-rules).

И первый вопрос, который у меня возник: куда нужно писать эти правила?
Rewrite-rules для Nginx указываются внутри секции server в файле настройки виртуального хоста, например /etc/nginx/sites-available/default.

Следующий вопрос был: что же туда писать?
Если подумать логически, то задача не совсем сложная, необходимо всего лишь конвертировать директивы из htaccess в соответвующие правила для nginx. Спасибо Томасу Делингу, который уже провел иследования в этом вопросе и успешно конвертировал директивы файла htaccess для Elgg 1.8.2. Все что мне осталось, это скопировать набор правил и обновить файл настройки виртуального хостинга, в результате он выглядел приблизительно так:

server {
 listen     80;
 server_name elgg.domain.com;
 root        /var/www-nginx/elgg/htdocs/;

 error_log /var/log/nginx/error.log;
 access_log /var/log/nginx/access.log;

 index         index.php index.html;
 fastcgi_index index.php;
 
 client_max_body_size      8M;
 client_body_buffer_size 256K;

 rewrite ^/pg\/([A-Za-z0-9\_\-]+)$ /engine/handlers/page_handler.php?handler=$1&$args;
 rewrite ^/pg\/([A-Za-z0-9\_\-]+)\/(.*)$ /engine/handlers/page_handler.php?handler=$1&page=$2&$args;
 rewrite ^/tag\/(.+)\/?$ /engine/handlers/page_handler.php?handler=search&page=$1;
 rewrite ^/action\/([A-Za-z0-9\_\-\/]+)$ /engine/handlers/action_handler.php?action=$1&$args;
 rewrite ^/cache\/(.*)$ /engine/handlers/cache_handler.php?request=$1&$args;
 rewrite ^/services\/api\/([A-Za-z0-9\_\-]+)\/(.*)$ /engine/handlers/service_handler.php?handler=$1&request=$2&$args;
 rewrite ^/export\/([A-Za-z]+)\/([0-9]+)\/?$ /engine/handlers/export_handler.php?view=$1&guid=$2;
 rewrite ^/export\/([A-Za-z]+)\/([0-9]+)\/([A-Za-z]+)\/([A-Za-z0-9\_]+)\/$ /engine/handlers/export_handler.php?view=$1&guid=$2&type=$3&idname=$4;
 rewrite /xml-rpc.php /engine/handlers/xml-rpc_handler.php;
 rewrite /mt/mt-xmlrpc.cgi /engine/handlers/xml-rpc_handler.php;
 rewrite ^/rewrite.php$ /install.php;
 if (!-d $request_filename){
  set $rule_11 1$rule_11;
 }
 if (!-f $request_filename){
  set $rule_11 2$rule_11;
 }
 if ($rule_11 = "21"){
  rewrite ^/([A-Za-z0-9\_\-]+)$ /engine/handlers/page_handler.php?handler=$1;
 }
 if (!-d $request_filename){
  set $rule_12 1$rule_12;
 }
 if (!-f $request_filename){
  set $rule_12 2$rule_12;
 }
 if ($rule_12 = "21"){
  rewrite ^/([A-Za-z0-9\_\-]+)\/(.*)$ /engine/handlers/page_handler.php?handler=$1&page=$2;
 }
 
 location ~ \.php$ {
  include fastcgi_params;

  # Assuming php-fastcgi running on localhost port 9000
  fastcgi_pass 127.0.0.1:9000;
  fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;

  fastcgi_connect_timeout 60;
  fastcgi_send_timeout 180;
  fastcgi_read_timeout 180;
  fastcgi_buffer_size 128k;
  fastcgi_buffers 4 256k;
  fastcgi_busy_buffers_size 256k;
  fastcgi_temp_file_write_size 256k;
  fastcgi_intercept_errors on;
 }
 
 # Do not put CSS there or it will break simplecache
 location ~* \.(bmp|js|gif|ico|jpg|jpeg|png)$ {
  expires max;
  # log_not_found off;
 }
}

Как установить и настроить NGINX+PHP+XDebug на Ubuntu 12.04

2012-08-06T12:59:00.000+03:00

1. Установка NGINX-сервера:

sudo add-apt-repository ppa:nginx/stable 
sudo apt-get update 
sudo apt-get install nginx

2. Установка PHP:

Если на вашем сервере php еще не установлен, то необходимо выполнить следующее:

sudo apt-get install php5-cli php5-cgi php5-fpm php5-mcrypt php5-mysql

В противном же случае достаточно установить пакет php5-fpm:

sudo apt-get install php5-fpm

3. Настройка виртуального хоста в NGINX

Открываем и редактируем файл /etc/nginx/sites-available/default:

sudo gedit  /etc/nginx/sites-available/default

Для начала поменяем параметры root и index в секции server:

server{
...
    root: /var/www;

    index: index.php
...
}

Если вы уже пользуетесь веб-сервером apache, то для правильной работы nginx нужно будет поменять номер порта с 80 на 8000:

server{ 
 listen: 8000;
...
}

Убираем комментарии со следующих строк:

 location ~ \.php$ {
 fastcgi_pass 127.0.0.1:9000;
 fastcgi_index index.php;
 include fastcgi_params;
  }

4. Запускаем NGINX

sudo service nginx start

Также запускаем сервис, отвечающий за работу php:

sudo service php5-fpm start

5. Установка и настройка XDebug

Устанавливаем точно так же как описано в первой части статьи "Как настроить NetBeans для работы с XDebug"

Далее небходимо отредактировать файл /etc/php5/fpm/php.ini.

sudo gedit /etc/php5/fpm/php.ini

Перед тегом Date добавляем следующий код:

zend_extension="/usr/lib/php5/20090626/xdebug.so"

xdebug.default_enable = On
xdebug.var_display_max_depth=6
xdebug.remote_enable=on
xdebug.remote_host=127.0.0.1
xdebug.remote_port=9900
xdebug.remote_handler=dbgp
xdebug.idekey=netbeans-xdebug
xdebug.remote_autostart=1
xdebug.remote_log=/tmp/xdebug.log
xdebug.profiler_enable_trigger=1
xdebug.profiler_enable=0
xdebug.profiler_output_dir=/tmp/profiler
xdebug.show_local_vars=1
xdebug.overload_var_dump=1

... перезагружаем сервер

sudo service nginx restart

так как при перезагрузке сервера параметры php.ini автоматически не обновляются, необходимо также перезагрузить сервис php5-fpm:

sudo service php5-fpm restart

6. Настройка NetBeans

Открываем NetBeans Tools>Options>PHP>Debugging и в строке Debugger Port вводим значение 9900, нажимаем Ok.

На этом настройка завершена.

Осталось только поместить в /var/www тестовый файл index.php с кодом:

   

echo phpinfo();

NetBeans: Что делать если цвет меню сливается с заголовком окна в Ubuntu 12.04

2012-06-26T13:07:00.000+03:00

В Ubuntu 12.04 столкнулся с проблемой, когда меню моей любимой идешки сливается с цветом заголвка окна. Изза этого очень не удобно стало работать. Нашел простое решение данной проблемы, достаточно отредактировать файл netbeans.conf, который находится в директории установки netbeans (например: /home/user/netbeans7.2/etc)

В конец файл добавляем следующую диррективу:

-J-Dswing.aatext=true -J-Dawt.useSystemAAFontSettings=lcd --laf Metal

Более детальную информацию о решении проблмемы см:

http://hanynowsky.wordpress.com/2012/04/27/netbeans-ide-look-feel-under-ubuntu-12-04/

Не помогло?

Тогда ищем файлик /usr/share/themes/Ambiance/gtk-2.0/gtkrc, открываем его для редактирования от имени админа

sudo gedit /usr/share/themes/Ambiance/gtk-2.0/gtkrc

Находим строку 338 с текстом

style "menu" {

и меняем ее на

style "menu" = "dark" {

Сохраняем и перезапускаем NetBeans (если он был запущен)...

Что делать если в Ubuntu пропали все заголовки окон?

2012-04-04T11:49:00.001+03:00

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

metacity --replace

Виджеты для Ubuntu: где искать и как устанавливать

2012-02-21T12:26:00.000+02:00

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

Будни буржуйского сисадмина

2011-12-29T16:52:00.001+02:00

Добавляем Gmail в апплет уведомлений Ubuntu

2011-12-23T09:40:00.000+02:00

Добавить Gmail в апплет уведомлений на самом деле оказалось очень просто – нужно лишь найти те приложения, которые своевременно перешли на новшества Ubuntu. Например, CheckGMail еще не умеет работать с апплетом уведомлений. Спасибо блогу OMGUbuntu, нашедшему два приложения, годящихся для этих целей: gm-notify и gmail-notifier.

gm-notify

Первый товарищ под названием gm-notify, который позволит нам проверять почту Gmail прямо из апплета уведомлений, живет на Launchpad в одном из ppa-репозиториев. Установим его:

sudo add-apt-repository ppa:gm-notify-maintainers/ppa
sudo apt-get update && sudo apt-get install gm-notify

Экран настроек достаточно простой – особо не забалуешь. Логин, пароль, способ, которым мы собираемся непосредственно просматривать почту: либо web-интерфейс, либо почтовый клиент по умолчанию, а также более широкие настройки, касающиеся автозапуска и добавления звуковых уведомлений о новых письмах.
Вот так выглядит все это хозяйство в работе: например, в ящике Gmail есть новые сообщения:

Получено новое сообщение в ящик Gmail, чем область уведомлений честно предупреждает, показывая от кого оно пришло и какая тема у сообщения:

gmail-notifier

Второе приложение под названием gmail-notifier практически не отличается от первого, есть лишь незначительный нюанс – если в ящике есть непрочитанные сообщения, gmail-notifier показывает автора и тему письма при обращении к самому аплету, однако сообщение в области уведомлений не содержит автора и тему, а лишь текст «You have new mail». То есть действительно получается, что тут выбор «на вкус и цвет».

Скачать его можно здесь.

Источник материала: IT-Блог про Ubuntu Linux, Windows и немного про SEO

Солнце всходит и над старыми "девайсами"

2011-12-12T10:57:00.001+02:00

Не спешите списывать старые девайсы, они еще могу сыграть, при чем в прямом смысле, что-нибудь для вас....

Вы же профессионал!

2011-11-22T18:48:00.001+02:00

Оригинал взят у alex_aka_jj в Совещание

Петров пришел во вторник на совещание. Ему там вынули мозг, разложили по блюдечкам и стали есть, причмокивая и вообще выражая всяческое одобрение. Начальник Петрова, Недозайцев, предусмотрительно раздал присутствующим десертные ложечки. И началось.

— Коллеги, — говорит Морковьева, — перед нашей организацией встала масштабная задача. Нам поступил на реализацию проект, в рамках которого нам требуется изобразить несколько красных линий. Вы готовы взвалить на себя эту задачу?

— Конечно, — говорит Недозайцев. Он директор, и всегда готов взвалить на себя проблему, которую придется нести кому-то из коллектива. Впрочем, он тут же уточняет: — Мы же это можем?

Начальник отдела рисования Сидоряхин торопливо кивает:

— Да, разумеется. Вот у нас как раз сидит Петров, он наш лучший специалист в области рисования красных линий. Мы его специально пригласили на совещание, чтобы он высказал свое компетентное мнение.

— Очень приятно, — говорит Морковьева. — Ну, меня вы все знаете. А это — Леночка, она специалист по дизайну в нашей организации.

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

— Так вот, — говорит Морковьева. — Нам нужно нарисовать семь красных линий. Все они должны быть строго перпендикулярны, и кроме того, некоторые нужно нарисовать зеленым цветом, а еще некоторые — прозрачным. Как вы считаете, это реально?

— Нет, — говорит Петров.

— Давайте не будем торопиться с ответом, Петров, — говорит Сидоряхин. — Задача поставлена, и ее нужно решить. Вы же профессионал, Петров. Не давайте нам повода считать, что вы не профессионал.

— Видите ли, — объясняет Петров, — термин «красная линия» подразумевает, что цвет линии — красный. Нарисовать красную линию зеленым цветом не то, чтобы невозможно, но очень близко к невозможному…

— Петров, ну что значит «невозможно»? — спрашивает Сидоряхин.

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

— То есть, в принципе, это возможно, мы правильно вас понимаем, Петров? — спрашивает Морковьева.

Петров осознает, что переборщил с образностью.

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

— Петров, вы нас не путайте, пожалуйста. Только что вы говорили, что это возможно.

Петров молча проклинает свою болтливость.

— Нет, вы неправильно меня поняли. Я хотел лишь сказать, что в некоторых, крайне редких ситуациях, цвет линии не будет иметь значения, но даже и тогда — линия все равно не будет красной. Понимаете, она красной не будет! Она будет зеленой. А вам нужна красная.

Наступает непродолжительное молчание, в котором отчетливо слышится тихое напряженное гудение синапсов.

— А что если, — осененный идеей, произносит Недозайцев, — нарисовать их синим цветом?

— Все равно не получится, — качает головой Петров. — Если нарисовать синим — получатся синие линии.

Опять молчание. На этот раз его прерывает сам Петров.

— И я еще не понял… Что вы имели в виду, когда говорили о линиях прозрачного цвета?

Морковьева смотрит на него снисходительно, как добрая учительница на отстающего ученика.

— Ну, как вам объяснить?.. Петров, вы разве не знаете, что такое «прозрачный»?

— Знаю.

— И что такое «красная линия», надеюсь, вам тоже не надо объяснять?

— Нет, не надо.

— Ну вот. Вы нарисуйте нам красные линии прозрачным цветом.

Петров на секунду замирает, обдумывая ситуацию.

— И как должен выглядеть результат, будьте добры, опишите пожалуйста? Как вы себе это представляете?

— Ну-у-у, Петро-о-ов! — говорит Сидоряхин. — Ну давайте не будем… У нас что, детский сад? Кто здесь специалист по красным линиям, Морковьева или вы?

— Я просто пытаюсь прояснить для себя детали задания…

— Ну, а что тут непонятного-то?.. — встревает в разговор Недозайцев. — Вы же знаете, что такое красная линия?

— Да, но…

— И что такое «прозрачный», вам тоже ясно?

— Разумеется, но…

— Так что вам объяснять-то? Петров, ну давайте не будем опускаться до непродуктивных споров. Задача поставлена, задача ясная и четкая. Если у вас есть конкретные вопросы, так задавайте.

— Вы же профессионал, — добавляет Сидоряхин.

— Ладно, — сдается Петров. — Бог с ним, с цветом. Но у вас там еще что-то с перпендикулярностью?..

— Да, — с готовностью подтверждает Морковьева. — Семь линий, все строго перпендикулярны.

— Перпендикулярны чему? — уточняет Петров.

Морковьева начинает просматривать свои бумаги.

— Э-э-э, — говорит она наконец. — Ну, как бы… Всему. Между собой. Ну, или как там… Я не знаю. Я думала, это вы знаете, какие бывают перпендикулярные линии, — наконец находится она.

— Да конечно знает, — взмахивает руками Сидоряхин. — Профессионалы мы тут, или не профессионалы?..

— Перпендикулярны могут быть две линии, — терпеливо объясняет Петров. — Все семь одновременно не могут быть перпендикулярными по отношению друг к другу. Это геометрия, 6 класс.

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

— Петров, давайте без вот этого: «6 класс, 6 класс». Давайте будем взаимно вежливы. Не будем делать намеков и скатываться до оскорблений. Давайте поддерживать конструктивный диалог. Здесь же не идиоты собрались.

— Я тоже так считаю, — говорит Сидоряхин.

Петров придвигает к себе листок бумаги.

— Хорошо, — говорит он. — Давайте, я вам нарисую. Вот линия. Так?

Морковьева утвердительно кивает головой.

— Рисуем другую… — говорит Петров. — Она перпендикулярна первой?

— Ну-у…

— Да, она перпендикулярна.

— Ну вот видите! — радостно восклицает Морковьева.

— Подождите, это еще не все. Теперь рисуем третью… Она перпендикулярна первой линии?..

Вдумчивое молчание. Не дождавшись ответа, Петров отвечает сам:

— Да, первой линии она перпендикулярна. Но со второй линией она не пересекается. Со второй линией они параллельны.

Наступает тишина. Потом Морковьева встает со своего места и, обогнув стол, заходит Петрову с тыла, заглядывая ему через плечо.

— Ну… — неуверенно произносит она. — Наверное, да.

— Вот в этом и дело, — говорит Петров, стремясь закрепить достигнутый успех. — Пока линий две, они могут быть перпендикулярны. Как только их становится больше…

— А можно мне ручку? — просит Морковьева.

Петров отдает ручку. Морковьева осторожно проводит несколько неуверенных линий.

— А если так?..

Петров вздыхает.

— Это называется треугольник. Нет, это не перпендикулярные линии. К тому же их три, а не семь.

Морковьева поджимает губы.

— А почему они синие? — вдруг спрашивает Недозайцев.

— Да, кстати, — поддерживает Сидоряхин. — Сам хотел спросить.

Петров несколько раз моргает, разглядывая рисунок.

— У меня ручка синяя, — наконец говорит он. — Я же просто чтобы продемонстрировать…

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

— Получится то же самое, — уверенно говорит Петров.

— Ну, как то же самое? — говорит Недозайцев. — Как вы можете быть уверены, если вы даже не попробовали? Вы нарисуйте красные, и посмотрим.

— У меня нет красной ручки с собой, — признается Петров. — Но я могу совершенно…

— А что же вы не подготовились, — укоризненно говорит Сидоряхин. — Знали же, что будет собрание…

— Я абсолютно точно могу вам сказать, — в отчаянии говорит Петров, — что красным цветом получится точно то же самое.

— Вы же сами нам в прошлый раз говорили, — парирует Сидоряхин, — что рисовать красные линии нужно красным цветом. Вот, я записал себе даже. А сами рисуете их синей ручкой. Это что, красные линии по-вашему?

— Кстати, да, — замечает Недозайцев. — Я же еще спрашивал вас про синий цвет. Что вы мне ответили?

Петрова внезапно спасает Леночка, с интересом изучающая его рисунок со своего места.

— Мне кажется, я понимаю, — говорит она. — Вы же сейчас не о цвете говорите, да? Это у вас про вот эту, как вы ее называете? Перпер-чего-то-там?

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

— Все, вы меня запутали окончательно, — говорит Недозайцев, переводя взгляд с одного участника собрания на другого. — Так у нас с чем проблемы? С цветом или с перпендикулярностью?

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

— И с тем, и с другим, — тихо говорит Петров.

— Я ничего не могу понять, — говорит Недозайцев, разглядывая свои сцепленные в замок пальцы. — Вот есть задача. Нужно всего-то семь красных линий. Я понимаю, их было бы двадцать!.. Но тут-то всего семь. Задача простая. Наши заказчики хотят семь перпендикулярных линий. Верно?

Морковьева кивает.

— И Сидоряхин вот тоже не видит проблемы, — говорит Недозайцев. — Я прав, Сидоряхин?.. Ну вот. Так что нам мешает выполнить задачу?

— Геометрия, — со вздохом говорит Петров.

— Ну, вы просто не обращайте на нее внимания, вот и все! — произносит Морковьева.

Петров молчит, собираясь с мыслями. В его мозгу рождаются одна за другой красочные метафоры, которые позволили бы донести до окружающих сюрреализм происходящего, но как назло, все они, облекаясь в слова, начинаются неизменно словом «Б@#$ть!», совершенно неуместным в рамках деловой беседы.

Устав ждать ответа, Недозайцев произносит:

— Петров, вы ответьте просто — вы можете сделать или вы не можете? Я понимаю, что вы узкий специалист и не видите общей картины. Но это же несложно — нарисовать какие-то семь линий? Обсуждаем уже два часа какую-то ерунду, никак не можем прийти к решению.

— Да, — говорит Сидоряхин. — Вы вот только критикуете и говорите: «Невозможно! Невозможно!» Вы предложите нам свое решение проблемы! А то критиковать и дурак может, простите за выражение. Вы же профессионал!

Петров устало изрекает:

— Хорошо. Давайте я нарисую вам две гарантированно перпендикулярные красные линии, а остальные — прозрачным цветом. Они будут прозрачны, и их не будет видно, но я их нарисую. Вас это устроит?

— Нас это устроит? — оборачивается Морковьева к Леночке. — Да, нас устроит.

— Только еще хотя бы пару — зеленым цветом, — добавляет Леночка. — И еще у меня такой вопрос, можно?

— Да, — мертвым голосом разрешает Петров.

— Можно одну линию изобразить в виде котенка?

Петров молчит несколько секунд, а потом переспрашивает:

— Что?

— Ну, в виде котенка. Котеночка. Нашим пользователям нравятся зверюшки. Было бы очень здорово…

— Нет, — говорит Петров.

— А почему?

— Нет, я конечно могу нарисовать вам кота. Я не художник, но могу попытаться. Только это будет уже не линия. Это будет кот. Линия и кот — разные вещи.

— Котенок, — уточняет Морковьева. — Не кот, а котенок, такой маленький, симпатичный. Коты, они…

— Да все равно, — качает головой Петров.

— Совсем никак, да?.. — разочарованно спрашивает Леночка.

— Петров, вы хоть дослушали бы до конца, — раздраженно говорит Недозайцев. — Не дослушали, а уже говорите «Нет».

— Я понял мысль, — не поднимая взгляда от стола, говорит Петров. — Нарисовать линию в виде котенка невозможно.

— Ну и не надо тогда, — разрешает Леночка. — А птичку тоже не получится?

Петров молча поднимает на нее взгляд и Леночка все понимает.

— Ну и не надо тогда, — снова повторяет она.

Недозайцев хлопает ладонью по столу.

— Так на чем мы остановились? Что мы делаем?

— Семь красных линий, — говорит Морковьева. — Две красным цветом, и две зеленым, и остальные прозрачным. Да? Я же правильно поняла?

— Да, — подтверждает Сидоряхин прежде, чем Петров успевает открыть рот.

Недозайцев удовлетворенно кивает.

— Вот и отлично… Ну, тогда все, коллеги?.. Расходимся?.. Еще вопросы есть?..

— Ой, — вспоминает Леночка. — У нас еще есть красный воздушный шарик! Скажите, вы можете его надуть?

— Да, кстати, — говорит Морковьева. — Давайте это тоже сразу обсудим, чтобы два раза не собираться.

— Петров, — поворачивается Недозайцев к Петрову. — Мы это можем?

— А какое отношение ко мне имеет шарик? — удивленно спрашивает Петров.

— Он красный, — поясняет Леночка.

Петров тупо молчит, подрагивая кончиками пальцев.

— Петров, — нервно переспрашивает Недозайцев. — Так вы это можете или не можете? Простой же вопрос.

— Ну, — осторожно говорит Петров, — в принципе, я конечно могу, но…

— Хорошо, — кивает Недозайцев. — Съездите к ним, надуйте. Командировочные, если потребуется, выпишем.

— Завтра можно? — спрашивает Морковьева.

— Конечно, — отвечает Недозайцев. — Я думаю, проблем не будет… Ну, теперь у нас все?.. Отлично. Продуктивно поработали… Всем спасибо и до свидания!

Петров несколько раз моргает, чтобы вернуться в объективную реальность, потом встает и медленно бредет к выходу. У самого выхода Леночка догоняет его.

— А можно еще вас попросить? — краснея, говорит Леночка. — Вы когда шарик будете надувать… Вы можете надуть его в форме котенка?..

Петров вздыхает.

— Я все могу, — говорит он. — Я могу абсолютно все. Я профессионал.

Как настроить NetBeans для работы с XDebug

2011-11-14T11:30:00.001+02:00

1. Для начала устанавливаем непосредственно сам XDebug:

Предполагается что Apache и PHP уже установлен (если нет, то самое время их установить). Далее устанавливаем необходимые библиотеки:

sudo apt-get install php5-dev php-pear

Теперь устанавлиеваем XDebug через PECL:

sudo pecl install xdebug

Ищем местонахождение файла xdebug.so

find / -name 'xdebug.so'

В моем случае путь к файлу был такой: /usr/lib/php5/20090626+lfs/xdebug.so

Открываетм и редактируем файл php.ini:

sudo gedit /etc/php5/apache2/php.ini

Добавляем перед тегом [Date] строку :

zend_extension="/usr/lib/php5/20090626+lfs/xdebug.so"

и перезагружаем apache:

sudo /etc/init.d/apache2 restart

2. Настраиваем ХDebug

Теперь настроим XDebug для работы с NetBeans IDE. Для начала откроем файл php.ini и добавим после строки zend_extension=... следующие параметры:

xdebug.default_enable = On
xdebug.var_display_max_depth=6
xdebug.remote_enable=on
xdebug.remote_host=127.0.0.1
xdebug.remote_port=9000
xdebug.remote_handler=dbgp
xdebug.idekey=netbeans-xdebug
xdebug.remote_autostart=1
xdebug.remote_log=/tmp/xdebug.log
xdebug.profiler_enable_trigger=1
xdebug.profiler_enable=0
xdebug.profiler_output_dir=/tmp/profiler
xdebug.show_local_vars=1
xdebug.overload_var_dump=1

... перезагружаем apache:

sudo /etc/init.d/apache2 restart

Открываем NetBeans Tools>Options>PHP

Нажимаем ОК и смело пользуемся дебагером

Как создать свой плагин для Firefox

2011-06-22T01:47:00.053+03:00

Задача: Разобраться как создавать плагины (дополнения) для Firefox.

Для начала заходим на Add-on Developer Hub и посредством формы создаем простой плагин (будем использовать его как болванку для разработки своего плагина). В качестве уникального ID можно указать собственный e-mail или что-то вроде того.

Скачав сгенерированный код сразу можно его проверить, для этого достаточно переименовать .zip на .xpi и установить как обычное расширение к Firefox (Меню > Инструменты > Дополнения, в открытом окне Файл > Установить расширения).

Распакуем полученный архив и разберемся со структурой плагина.

./chrome
/content
about.xul
ff-overlay.js
ff-overlay.xul
options.xul
overlay.js
/locale
  /en-US
about.dtd
options.dtd
overlay.dtd
overlay.properties
/skin
overlay.css
toolbat-button.png
./defaults/
  /preferences
    prefs.js
chrome.manifest
install.rdf

Начнем с файла chrome.manifest. Этот файл отвечает за привязку дополнительных объектов к базовым объектам Firefox. К примеру, базовый объект браузера описан в файле chrome://browser/content/browser.xul, для того чтобы иметь возможность использовать свои обработчики для событий браузера нам необходимо создать свой объект. В файле chrome.manifest происходит наложение (overlay) нового объекта на базовому:

overlay chrome://browser/content/browser.xul chrome://HelloWorld/content/ff-overlay.xul

Файл ff-overlay.xul имеет формат XUL (XML User Interface Language), другими словами это специфический XML-файл. В нашем случае он имеет следующий начальный вид:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="chrome://HelloWorld/skin/overlay.css" type="text/css"?>
<!DOCTYPE overlay SYSTEM "chrome://HelloWorld/locale/overlay.dtd">
<overlay id="HelloWorld-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  <script src="overlay.js"/>
  <script src="ff-overlay.js"/>

  <stringbundleset id="stringbundleset">
    <stringbundle id="HelloWorld-strings" src="chrome://HelloWorld/locale/overlay.properties"/>
  </stringbundleset>

  <menupopup id="menu_ToolsPopup">
    <menuitem id="HelloWorld-hello" label="&HelloWorld.label;"
              oncommand="HelloWorld.onMenuItemCommand(event);"/>
  </menupopup>

  <popup id="contentAreaContextMenu">
    <menuitem id="context-HelloWorld" label="&HelloWorldContext.label;"
              accesskey="&HelloWorldContext.accesskey;"
              insertafter="context-stop"
              oncommand="HelloWorld.onMenuItemCommand(event)"/>
  </popup>

  <toolbarpalette id="BrowserToolbarPalette">
  <toolbarbutton id="HelloWorld-toolbar-button" class="toolbarbutton-1 chromeclass-toolbar-additional"
    label="&HelloWorldToolbarButton.label;" tooltiptext="&HelloWorldToolbarButton.tooltip;"
    oncommand="HelloWorld.onToolbarButtonCommand()"/>
  </toolbarpalette>

</overlay>

Заглянем в файлик overlay.js.

var HelloWorld = {

    onLoad: function() {
        // initialization code
        this.initialized = true;
        this.strings = document.getElementById("HelloWorld-strings");
    },

    onMenuItemCommand: function(e) {
        var promptService = Components.classes["@mozilla.org/embedcomp/prompt-service;1"]
        .getService(Components.interfaces.nsIPromptService);
        promptService.alert(window, this.strings.getString("helloMessageTitle"),
        this.strings.getString("helloMessage"));
    },

    onToolbarButtonCommand: function(e) {
        // just reuse the function above.  you can change this, obviously!
        HelloWorld.onMenuItemCommand(e);
    }
};

window.addEventListener("load", function () { HelloWorld.onLoad(); }, false);

В этом файле находится сгенерированный класс (HelloWorld) для обработки определенных событий. Для инициализации "прослушивания" обработчиков используется метод DOM объекта Window addEventListener().

Событие "load" возникает при загрузке нового окна браузера. Согласно нашему коду, этому событию будет отвечать метод onLoad класса HelloWorld.

Создадим новый метод, который будет обрабатывать все открываемые браузером страницы и заменять их содержание на предложение "Hello World!".

onPageLoad: function(aEvent) {
   var doc = aEvent.originalTarget;
   // doc - документ, на котором произошло событие "onload"
   doc.body.innerHTML = "Hello World!";
}

К методу OnLoad добавим код, который будет "перехватывать" событие, отвечающее за загрузку страниц в окне браузера (DOMContentLoaded) и вызывать созданный нами метод:

var appcontent = document.getElementById("appcontent");   // browser
if(appcontent)
   appcontent.addEventListener("DOMContentLoaded", HelloWorld.onPageLoad, true);

Получился следующий скрипт:

var HelloWorld = {
    onLoad: function() {
        // initialization code
        this.initialized = true;
        this.strings = document.getElementById("HelloWorld-strings");

        var appcontent = document.getElementById("appcontent");   // browser
        if(appcontent)
            appcontent.addEventListener("DOMContentLoaded", HelloWorld.onPageLoad, true);
    },

    onMenuItemCommand: function(e) {
      // ...
    },

    onToolbarButtonCommand: function(e) {
        // ...
    },

    onPageLoad: function(aEvent) {
        var doc = aEvent.originalTarget;
       // doc - документ, на котором произошло событие "onload"
        doc.body.innerHTML = "Hello World!";
    }
};

window.addEventListener("load", function () { HelloWorld.onLoad(); }, false);

Теперь можем запаковать измененный код в zip-архив, поменять расширения файла на .xpi, и попробовать установить как дополнение в Firefox (см. више).

Результат работы плагина HelloWorld:

Разберемся как работают настройки плагина.

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

Все параметры настройки плагина описаны в файле /defaults/preferences/prefs.js. Для того чтобы добавить новый параметр достаточно прописать в этом файле следующую строчку:

pref("extensions.HelloWorld.counter",0);

Теперь добавим к нашему методу onLoad объекта HelloWorld код для работы с созданным параметром настройки:

    onLoad: function() {
        // initialization code
        this.initialized = true;
        this.strings = document.getElementById("HelloWorld-strings");

        //находим компонент настроек и получаем доступ к узловой ветке
        var prefs = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefService);
        //подключаемся к ветке нашего плагина
        prefs = prefs.getBranch("extensions.HelloWorld.");

        //получение значения параметра counter
        counter = prefs.getIntPref("counter");
        counter = counter+1;
       //сохранение нового значения параметра
        prefs.setIntPref("counter",counter);
       
         alert("Вы открываете Фаерфокс уже в "+counter+" раз!");    
    }

Подробнее о методах и функциях для работы с настройками можно почитать на странице nsIPrefBranch - MDC Doc.

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

Полезные ссылки по теме:

jQuery UI: Проблема отображения Datepicker в Dialog

2011-05-25T14:48:00.009+03:00

Пытаясь встроить поле для даты, используя плагин Datepicker, в диалоговое окно, создаваемое плагином Dialog библиотеки jQuery UI обнаружил проблему. После открытия диалогового окна и выбора поля Datepicker - панель для выбора даты (календарик) отображается позади диалогового окна.

Решить данную проблему можно следующим образом: в CSS файле со стилями для Datepicker находим стиль для класа .ui-datepicker и заменяем его на следующий

.ui-datepicker { 
   width: 17em; 
   padding: .2em .2em 0; 
   z-index: 9999 !important; 
}

ELGG: Создаем "скелет" плагина из коммандной строки

2011-05-19T14:23:00.000+03:00

Для того чтобы создать в ELGG новый плагин (модуль), первым делом, необходимо создать правильную структуру директорий. Помочь в этом может разработаный Оскаром Кастро (Oscar Castro) простой bash-скрипт

#!/bin/bash 
 #name: pluginSkeleton
 #Author: @Kareste
 #Installation: Put file in mod/
 #usage ./pluginSkeleton 
 if [ $# -eq 0 ]; then
 echo "Plugin Name is Missing"
 else
 echo mkdir -p "$1/actions/$1/" | bash -x
 echo mkdir -p "$1/classes/" | bash -x
 echo mkdir -p "$1/graphics/" | bash -x
 echo mkdir -p "$1/js/" | bash -x
 echo mkdir -p "$1/languages/" | bash -x
 echo mkdir -p "$1/lib/" | bash -x
 echo mkdir -p "$1/pages/$1/" | bash -x
 echo mkdir -p "$1/vendors/" | bash -x
 echo mkdir -p "$1/views/default/$1/" | bash -x
 echo mkdir -p "$1/views/default/forms/" | bash -x
 echo mkdir -p "$1/views/default/js/" | bash -x
 echo mkdir -p "$1/views/default/object/$1" | bash -x
 echo mkdir -p "$1/views/default/plugins/$1/" | bash -x
 echo mkdir -p "$1/views/default/widgets/$1_widget/" | bash -x
 echo touch "$1/start.php" | bash -x
 echo touch "$1/manifest.xml" | bash -x
 echo -e "\n\n\tExample Manifest\n\tElgg\n\t1.0\n\tThis is a simple example of a manifest file.  In this example, there are not screenshots, dependencies, or additional information about the plugin.\n\t\n\t\telgg_version\n\t\t2011010401\n\t\n" >> "$1/manifest.xml"
 fi

Источник: http://community.elgg.org/pg/pages/view/723878/plugin-skeleton-script-bash

Структура современной IT компании

2011-05-18T01:18:00.000+03:00

Внедряем в свой сайт новые шрифты от Google Font Directory

2011-05-11T10:41:00.005+03:00

В очередной раз компания Google inc. порадовала веб-разработчиков. В этот раз компания разработала так называемый Google Font Directory - каталог высококачественных шрифтов, которые по средствам Google Font API можно внедрить на свой сайт.

Преимущества использования таких шрифтов следующие:

большой выбор высококачественных веб-шрифтов для любой вашей страницы.
поддержка данных шрифтов почти всеми браузерами (в том числе Explorer 6).
невероятно легко использовать.
хранилище шрифтов продолжает увеличивается с каждым днем.

Как внедрить в свой сайт шрифты из Google Font Directory?

На пример вы хотите внедрить шрифт Ubuntu. Для этого перед тегом </head> добавляем следующий код:

<link href="http://fonts.googleapis.com/css?family=Ubuntu&amp;
subset=cyrillic,latin" rel="stylesheet" type="text/css"></link>

API будет генерировать необходимые CSS, специфичные для браузера пользователя, таким образом Вы можете использовать шрифт на странице не переживая за правильность его отображения, поэтому далее просто используйте шрифт Ubuntu в CSS, например:

h1 { font-family: 'Ubuntu', arial, serif; }

Можно также подключить и использовать сразу несколько шрифтов на вашем сайте.
Запись подключения выглядит так.

http://fonts.googleapis.com/css?family=Ubuntu|Tangerine:bold,bolditalic|Inconsolata:italic|Droid+Sans

Подсветка кода в блоге на Blogger.com (blogspot.com)

2011-04-28T11:16:00.005+03:00

При публикации на страницах блога программного кода, возникает вопрос его красивого, и главное, доступного, оформления.

Существует множество скриптов и решений данного вопроса, но как организовать подсветку в блоге, размещенном на Blogger.com. Хочу поделиться парой доступных и простых решений, возможно кому то оно окажется полезным.

1. JQuery Sintax Highlight

Первое решение это плагин для яваскриптовой библиотеки JQuery - JQuery Sintax Highlight Plugin. Чтобы подключить данный плагин, для начала, нам понадобится подключить непосредственно саму JQuery библиотеку. Для этого заходим в админку блога, выбираем вкладку "Дизайн" и "Изменить HTML". далее после тега <title><data:blog.pageTitle/></title> пишем следующее:

<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
    google.load(&quot;jquery&quot;, &quot;1.5&quot;);
</script>

Ниже добавляем код подключения плагина с сайта разработчиков:

<link href='http://webcodingstudio.com/modules/highlight/frontend/highlight.css?1282949674' media='all' rel='stylesheet' type='text/css'/>
<script src='http://webcodingstudio.com/modules/highlight/frontend/highlight.js?1268429770' type='text/javascript'/>

Теперь для подсветки синтаксиса можно использовать тег <pre class="code"></pre>. При чем для разных языков доступны свои варианты подсветки:

<pre class="code">default</pre>
<pre class="code" lang="js">js code</pre>
<pre class="code" lang="css">css code</pre>
<pre class="code" lang="html">html code</pre>
<pre class="code" lang="php">php code</pre>

2. SyntaxHighlighter

Другое решение не предполагает использование JQuery библиотеки, и на этом решении я остановил свой выбор.

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

Теперь разберемся как это подключить.

Аналогично с первым вариантом заходим в админку блога, выбираем вкладку "Дизайн" и "Изменить HTML". далее в окне редактора шаблона, после тега <title><data:blog.pageTitle/></title> пишем следующее:

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<!-- add brushes here -->
<script type='text/javascript'>
  SyntaxHighlighter.config.bloggerMode = true;
  SyntaxHighlighter.all();
</script>

После комментария "add brushes here," добавляем скрипты для обработки тех языков, подсветку которых мы хотим использовать. В следующем примере будет использована подсветка для Javascript, SQL, XML/HTML, and PHP:

<!-- add brushes here -->
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/>

Осталось только сохранить изменения шаблона и приступать к использованию. Для того чтобы скрипт автоматически "раскрашивал" и размечал код, его необходимо разместить в теги <pre class="brush:[язык подсветки]">. Например, для подсветки блока с SQL-запросом:

<pre class="brush:sql">
SELECT *
FROM users
WHERE user_id = 1212;
</pre>

Как установить SexyBookmarks на свой сайт?

2011-04-27T23:11:00.017+03:00

SexyBookmarks - очень удобный плагин для Wordpress, который позволяет пользователям делится закладками на страницы вашего сайта.

В данной заметке будет описано как установить SexyBookmarks на произвольный сайт, используя только Javascript.

Итак, для начала необходимо скачать и распаковать последнюю версию плагина.

Из всего архива нам понадобятся только несколько файлов:

js/sexy-bookmarks-public.js
css/style.css
images/shr-sprite.png

Далее, подключаем скрипт и файл стилей, перед тегом </head> добавляем следующие строчки кода:

<link rel="stylesheet" type="text/css" href="css/style.css" />
 <script type="text/javascript" src="js/sexy-bookmarks-public.js"></script>

Выбираем подходящее место на странице для размещения кнопок и добавляем следующий HTML-код:

<div class="shr-bookmarks shr-bookmarks-center shr-bookmarks-bg-sexy">
    <ul class="socials">
        <li class="shr-linkedin">
            <a class="external" title="Add this to Linkedin" rel="nofollow" href="http://www.linkedin.com" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.linkedin.com']);">Add this to LinkedIn</a>
        </li>
        <li class="shr-twitter">
            <a class="external" title="Tweet This!" rel="nofollow" href="http://twitter.com/home" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','twitter.com']);">Tweet This!</a>
        </li>
        <li class="shr-facebook">
            <a class="external" title="Share this on Facebook" rel="nofollow" href="http://www.facebook.com/share.php" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.facebook.com']);">Share this on Facebook</a>
        </li>
        <li class="shr-googlebuzz">
            <a class="external" title="Share this on Google Buzz" rel="nofollow" href="http://www.google.com/buzz/post" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.facebook.com']);">Share this on Facebook</a>
        </li>
        <li class="shr-digg">
            <a class="external" title="Digg this!" rel="nofollow" href="http://digg.com/submit" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','digg.com']);">Digg this!</a>
        </li>
        <li class="shr-reddit">
            <a class="external" title="Share this on Reddit" rel="nofollow" href="http://reddit.com/submit" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','reddit.com']);">Share this on Reddit</a>
        </li>
        <li class="shr-delicious">
            <a class="external" title="Share this on del.icio.us" rel="nofollow" href="http://del.icio.us/post" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','del.icio.us']);">Share this on del.icio.us</a>
        </li>
        <li class="shr-stumbleupon">
            <a class="external" title="Stumble upon something good? Share it on StumbleUpon" rel="nofollow" href="http://www.stumbleupon.com/submit" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.stumbleupon.com']);">Stumble upon something good? Share it on StumbleUpon</a>
        </li>
        <li class="shr-twittley">
            <a class="external" title="Submit this to Twittley" rel="nofollow" href="http://twittley.com/submit/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','twittley.com']);">Submit this to Twittley</a>
        </li>
        <li class="shr-googlebookmarks">
            <a class="external" title="Add this to Google Bookmarks" rel="nofollow" href="http://www.google.com/bookmarks/mark" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.google.com']);">Add this to Google Bookmarks</a>
        </li>
        <li class="shr-gmail">
            <a class="external" title="Share this with Gmail" rel="nofollow" href="https://mail.google.com/mail/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.google.com']);">Add this to Google Bookmarks</a>
        </li>
        <li class="shr-technorati">
            <a class="external" title="Share this on Technorati" rel="nofollow" href="http://technorati.com/faves" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','technorati.com']);">Share this on Technorati</a>
        </li>
        <li class="shr-diigo">
            <a href="http://www.diigo.com/post" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.diigo.com']);">Post this on Diigo</a>
        </li>
        <li class="shr-blinklist">
            <a class="external" title="Share this on Blinklist" rel="nofollow" href="http://www.blinklist.com/index.php" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.blinklist.com']);">Share this on Blinklist</a>
        </li>
        <li class="shr-mixx">
            <a class="external" title="Share this on Mixx" rel="nofollow" href="http://www.mixx.com/submit" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.mixx.com']);">Share this on Mixx</a>
        </li>
        <li class="shr-newsvine">
            <a class="external" title="Seed this on Newsvine" rel="nofollow" href="http://www.newsvine.com/_tools/seed&amp;save" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.newsvine.com']);">Seed this on Newsvine</a>
        </li>
        <li class="shr-yahoobuzz">
            <a class="external" title="Buzz up!" rel="nofollow" href="http://buzz.yahoo.com/submit/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','buzz.yahoo.com']);">Buzz up!</a>
        </li>
    </ul>
</div>

Осталось немного поправить Javascript. Открываем файл js/sexy-bookmarks-public.js и внутри обработчика jQuery(document).ready(function () {}) добавляем следующий код, для обработки событий, вызываемых при нажатии на каждую кнопку:

jQuery('.shr-bookmarks a.external').click(function() {

var url = encodeURIComponent(window.location.href), desc = '';

var title = document.title;
var description = $("meta[name=description]").attr("content");

switch(this.parentNode.className) {
    case 'shr-twitter':
        this.href += '?status=' + title + '+-+' + url;
        break;
    case 'shr-linkedin':
        this.href += 'shareArticle?mini=true&url='+url+'&title='+title+'&summary='+description+'&source=CEEOA';
        break;
    case 'shr-facebook':
        this.href += '?t=' + title + '&u=' + url;
        break;
    case 'shr-googlebuzz':
        this.href += '?message='+title+'%0A'+description+'&url=' +url;
        break;
    case 'shr-digg':
        this.href += '?phase=2&title=' + title + '&url=' + url + '&desc=' + description;
        break;
    case 'shr-reddit':
        this.href += '?title=' + title + '&url=' + url;
        break;
    case 'shr-delicious':
        this.href += '?title=' + title + '&url=' + url;
        break;
    case 'shr-stumbleupon':
        this.href += '?title=' + title + '&url=' + url;
        break;
    case 'shr-twittley':
        this.href += '?title=' + title + '&url=' + url + '&desc=' + description + '&pcat=Internet&tags=';
        break;
    case 'shr-googlebookmarks':
        this.href += '?op=add&title=' + title +'&desc='+description+ '&bkmk=' + url;
        break;
    case 'shr-gmail':
        this.href += '?view=cm&tf=0&to=&su='+title+'&body='+description+'%0A%0A'+url+'&fs=1';
        break;
    case 'sexy-technorati':
        this.href += '?add=' + url;
        break;
    case 'shr-diigo':
        this.href += '?title=' + title + '&url=' + url + '&desc=' + description;
        break;
    case 'shr-blinklist':
        this.href += '?Action=Blink/addblink.php&Title=' + title + '&Url=' + url;
        break;
    case 'shr-mixx':
        this.href += '?title=' + title + '&page_url=' + url + '&desc=' + description;
        break;
    case 'shr-newsvine':
        this.href += '?h=' + title + '&u=' + url;
        break;
    case 'shr-yahoobuzz':
            this.href += '?submitHeadline=' + title + '&submitUrl=' + url + '&submitSummary=' + description + '&submitCategory=science&submitAssetType=text';
            break;
}
});

Результат:

Как установить SexyBookmarks на свой сайт?

2011-04-27T15:45:00.001+03:00

SexyBookmarks - очень удобный плагин для Wordpress, который позволяет пользователям делится закладками на страницы вашего сайта.

В данной заметке будет описано как установить SexyBookmarks на произвольный сайт, используя только Javascript.

Итак, для начала необходимо скачать и распаковать последнюю версию плагина, который находится по адресу http://wordpress.org/extend/plugins/sexybookmarks/stats/.
Из всего архива нам понадобятся только несколько файлов:

js/sexy-bookmarks-public.js
css/style.css
images/shr-sprite.png

Далее, подключаем скрипт и файл стилей, перед тегом </head> добавляюм следующие строчки кода:

<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript" src="js/sexy-bookmarks-public.js"></script>

Выбираем место для размещения кнопок и добавляем HTML-код:

<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center shr-bookmarks-bg-sexy">
    <ul class="socials">
        <li class="shr-linkedin">
            <a class="external" title="Add this to Google Bookmarks" rel="nofollow" href="http://www.linkedin.com" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','www.linkedin.com']);">Add this to LinkedIn</a>
        </li>
        <li class="shr-twitter">
            <a class="external" title="Tweet This!" rel="nofollow" href="http://twitter.com/home" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','twitter.com']);">Tweet This!</a>
        </li>
    </ul>
</div>