Итак, наконец-то мой друг Виктор XternalX выпустил первую бета версию своих динамических юзербаров, с чем я его от всей души и поздравляю! :) И в этом блогпосте я постараюсь описать процесс создания юзербара отображающего списко последних пяти прослушанных мной на Last.FM композиций. Надо сказать, что родной сервис юзербаров от last.fm работает, мягко говоря, не корректно, поэтому сервис динамических юзербаров XternalX Userbars тут оказался, как нельзя кстати.
Первое, что мы делаем, регистрируем себе новый аккаунт в XternalX Userbars. Форма регистрации находится здесь. После чего войдя в XternalX Userbars под только что созданной учётной записью, мы попадаем в редактор юзербаров (Рис. 1).
Не вдаваясь в подробности описания интерфейса, опишу непосредственно сам процесс создания моего юзербарчика.
Для начала, нам необходимо зайти в "Файловый менеджер" (Рис. 2) и выбрать там основу (или фон) нашего юзербара.
В файловом менеджере уже есть несколько картинок, которые можно использовать в качестве фона, но мы загрузим свою картинку. Для этого внизу окна файлового менеджера щёлкнем ссылку "Загрузить файл". Откроется диалог изображенный на рисунке 3.
Нажмём кнопку "Обзор..." и выберем нужный нам фон, в моём случае -- это давно заготовленная картинка, которую я безуспешно пытался, в своё время, скормить сервису юзербаров last.fm. Учтите, что картинка обязательно должна быть в формате PNG!
Теперь понравившийся нам фон выбран, жмём ссылку "Загрузить" внизу диалога загрузки фонового изображения. После загрузки мы снова окажемся в Файловом менеджере. Не спешите искать в списке файлов, только что загруженный нами, его там нет (бета версия как ни как ;)). Необходимо закрыть файловый менеджер, щелчком по крестику в его верхнем правом углу, и открыть его снова. Теперь список файлов в файловом менеджере обновился и мы можем спокойно найти только что загруженный нами файл и выбрать его (Рис. 4).
Теперь закрываем файловый менеджер (да-да, я не опечатался, именно закрываем). И в панели управления XternalX Userbars щёлкаем плюсик справа от поля "Основа юзербара". Теперь в текстовом поле "Основа юзербара" образовалось название только что загруженного нами файла. Для того, чтобы выбранный нами фон отобразился в предпросмотре юзербара нажмём кнопочку "Сохранить" внизу панели упарвления XternalX Userbars. Результат на рисунке 5.
Теперь включим необходимые нам плагины. Для этого заходим в "Расширения" и приводим там всё в соответствие с рисунком 6.
Затем щёлкаем по гаечному ключу справа от расширения "Last.FM Track Feed" и настраиваем его (Рис. 7). В поле "Введите URL до Вашей RSS Ленты" вводим следующий адрес: http://ws.audioscrobbler.com/1.0/user/Akinfold/recenttracks.rss естественно, заменяя имя пользователя last.fm на своё. В поле "Формат даты и времени" вводим "H:i". И нажимаем "Сохранить".
Закрываем диалог менеджера расширений и теперь приступаем к написанию кода нашего юзербара. В листинге 1 приведён весь код, который я разберу подробно далее.
Листинг 1.
Теперь смело копируем ссылку на наш юзербар из поля "Ссылка на Ваш юзербар" и вставляем в подпись на форумах, в блогах и т.д. и т.п. кому на что фантазии хватит. ;)
Форум XternalX Userbars.
Первое, что мы делаем, регистрируем себе новый аккаунт в XternalX Userbars. Форма регистрации находится здесь. После чего войдя в XternalX Userbars под только что созданной учётной записью, мы попадаем в редактор юзербаров (Рис. 1).
Не вдаваясь в подробности описания интерфейса, опишу непосредственно сам процесс создания моего юзербарчика.
Для начала, нам необходимо зайти в "Файловый менеджер" (Рис. 2) и выбрать там основу (или фон) нашего юзербара.
В файловом менеджере уже есть несколько картинок, которые можно использовать в качестве фона, но мы загрузим свою картинку. Для этого внизу окна файлового менеджера щёлкнем ссылку "Загрузить файл". Откроется диалог изображенный на рисунке 3.
Нажмём кнопку "Обзор..." и выберем нужный нам фон, в моём случае -- это давно заготовленная картинка, которую я безуспешно пытался, в своё время, скормить сервису юзербаров last.fm. Учтите, что картинка обязательно должна быть в формате PNG!
Теперь понравившийся нам фон выбран, жмём ссылку "Загрузить" внизу диалога загрузки фонового изображения. После загрузки мы снова окажемся в Файловом менеджере. Не спешите искать в списке файлов, только что загруженный нами, его там нет (бета версия как ни как ;)). Необходимо закрыть файловый менеджер, щелчком по крестику в его верхнем правом углу, и открыть его снова. Теперь список файлов в файловом менеджере обновился и мы можем спокойно найти только что загруженный нами файл и выбрать его (Рис. 4).
Теперь закрываем файловый менеджер (да-да, я не опечатался, именно закрываем). И в панели управления XternalX Userbars щёлкаем плюсик справа от поля "Основа юзербара". Теперь в текстовом поле "Основа юзербара" образовалось название только что загруженного нами файла. Для того, чтобы выбранный нами фон отобразился в предпросмотре юзербара нажмём кнопочку "Сохранить" внизу панели упарвления XternalX Userbars. Результат на рисунке 5.
Теперь включим необходимые нам плагины. Для этого заходим в "Расширения" и приводим там всё в соответствие с рисунком 6.
Рис. 6 Менеджер расширений XternalX Userbars
Затем щёлкаем по гаечному ключу справа от расширения "Last.FM Track Feed" и настраиваем его (Рис. 7). В поле "Введите URL до Вашей RSS Ленты" вводим следующий адрес: http://ws.audioscrobbler.com/1.0/user/Akinfold/recenttracks.rss естественно, заменяя имя пользователя last.fm на своё. В поле "Формат даты и времени" вводим "H:i". И нажимаем "Сохранить".
Закрываем диалог менеджера расширений и теперь приступаем к написанию кода нашего юзербара. В листинге 1 приведён весь код, который я разберу подробно далее.
Листинг 1.
str(100,12,7,0,arial,000000,lastfm(1,date)) str(130,7,12,0,arial,000000,lastFm(1,title)) str(100,24,7,0,arial,666666,lastfm(2,date)) str(130,23,8,0,arial,666666,lastFm(2,title)) str(100,36,7,0,arial,666666,lastfm(3,date)) str(130,35,8,0,arial,666666,lastFm(3,title)) str(100,48,7,0,arial,666666,lastfm(4,date)) str(130,47,8,0,arial,666666,lastFm(4,title)) str(100,60,7,0,arial,666666,lastfm(5,date)) str(130,59,8,0,arial,666666,lastFm(5,title))Как мы видим, код юзербара разбит на 5 однотипных блоков. Каждый блок кода отвечает за вывод одной строки формата <время> <композиция>. Каждый такой блок состоит из двух вызовов функции str, которая отвечает за вывод текста в XternalX Userbars. Эта функция принимает 7 параметров:
- Горизонтальное положение левой границы надписи относительно левого края юзербара. Или, проще говоря, координата текста по оси X.
- Вертикальное положение верхней границы надписи относительно верхнего края юзербара. Или, проще говоря, координата надписи по оси Y.
- Размер шрифта в пикселях.
- Угол поворота текста.
- Шрифт, которым будет отрисовываться текст на юзербаре.
- Цвет шрифта.
- Текст. В нашем случае текст возвращает функция lastFm речь о которой пойдёт далее.
- Номер композиции в списке недавно прослушанных композиций. Последняя прослушанная композиция имеет номер 1, прослушанная до неё композиция имеет номер 2 и так далее.
- Ключевое слово, сообщающее функции, какую информацию о композиции выводить. В нашем случае мы выводим время прослушивания композиции (ключевое слово date) и название композиции (ключевое слово title).
Теперь смело копируем ссылку на наш юзербар из поля "Ссылка на Ваш юзербар" и вставляем в подпись на форумах, в блогах и т.д. и т.п. кому на что фантазии хватит. ;)
Форум XternalX Userbars.
ахуенно шикарный пиар. Спасибо, клево все расписал, у меня бы слов не хватило на такое :)
ОтветитьУдалитьСпасибо за сервис! Давно хотел себе юзербарчик такой... :)
ОтветитьУдалитьнаворотов бы побольше в твоем юзербаре :D
ОтветитьУдалитьУ мя чёрная полоса вместо юзербара.....
ОтветитьУдалитьПороверь внимательно, все ли расширения ты подключил.
ОтветитьУдалитьчтобы не было черной полосы надо включить мозг и прочитать то, что написано на розовом фоне в красной рамке блять. там ясно написано что нужно включить соответствующие расширения блять!
ОтветитьУдалитьВаш xternalx!
Но в принципе уже ок сделал, обовляется он конечно не быстро это да
ОтветитьУдалить