Twitter в блоге 3.0 Beta
Привет всем, в этот прекрасный (в некоторых частях планеты) первый день лета я хочу представить новую версию самого клёвого скрипта для вставки сообщений из твиттера под номером 3.0, не смотря на то, что он ещё Beta им уже можно вполне спокойно пользоваться :)
Из нововведений:
- Скрипт теперь плагин для jQuery
- Появились настройки
- Появилась честная возможность выводить несколько твитов
- Появился callback
А теперь подробнее. Скрипт теперь стал полноценным плагином для jQuery, а это значит, что его теперь можно вызывать так:
$(target).getTwit(options,callback)
Теперь давайте рассмотрим все параметры, так сказать, вблизи:
- name — имя пользователя в твиттере, обязательно для указания.
- num — кол-во отображаемых твитов, стандартное значение — 1.
- wrapperClass1 — класс для div-обёртки, если не указан — обёртка не выводится.
- wrapperClass2 — класс для div-обёртки чётных твитов, если не указан — для всех обёрток класс одинаков.
- deltaClass — класс для div с информацие о дате добавления, по умолчанию — deltaLnk.
- linksTarget — значение параметра target у ссылок, по умолчанию — _blank.
- showName — значение 1 или 0 (true или false), при 0 скрывает имя пользователя, которое добавляется перед сообщением. По-умолчанию — 1
- showTitles — значение 1 или 0 (true или false), при 0 убирает атрибуты title у ссылок в тексте результата.
То есть, если вы хотите поместить 3 последних твита пользователя bobuk в блоках-обёртках с классом twiWrap в блок #twitter, и в коллбеке вызвать алерт с текстом «completed!» вызов функции у вас должен быть такой:
$('#twitter').getTwit({name:'bobuk',num:3,wrapperClass1:'twiWrap'},function(){alert('completed!')})
Стандартный результат работы скрипта выглядит так:
<!--[Только если showName = 1]-->
<a href="<!--[cсылка на профиль в твиттере]-->">
<!--[имя]-->
</a>:
<!--[///]-->
<span>
<!--[текст твита]-->
</span>
<div class="<!--[значение deltaClass]-->">
<a href="<!--[ссылка на страницу твита]-->" target="<!--[Значение linksTarget]-->" >
<!--[время прошедшее с момента добавления твита]-->
</a>
</div>
Ну а если вы добавили div-обёртку и, например установили num на 2, а showName на 0 код будет выглядеть примерно следующим образом:
<div class="<!--[значение wrapperClass1]-->">
<span>
<!--[текст твита]-->
</span>
<div class="<!--[значение deltaClass]-->">
<a href="<!--[ссылка на страницу твита]-->" target="<!--[Значение linksTarget]-->" >
<!--[время прошедшее с момента добавления твита]-->
</a>
</div>
</div>
<div class="<!--[значение wrapperClass2]-->">
<span>
<!--[текст твита]-->
</span>
<div class="<!--[значение deltaClass]-->">
<a href="<!--[ссылка на страницу твита]-->" target="<!--[Значение linksTarget]-->" >
<!--[время прошедшее с момента добавления твита]-->
</a>
</div>
</div>
Сжатая версия скрипта расположена по этой ссылке.
Я успел заметить, что не все пользователи моего скрипта знакомы с CSS так же хорошо, как я. Поэтому приведу несколько примеров селекторов, которые помогут в использовании этого скрипта. За данное возьмём id блока, в который вставляется результат равный twitter- Если вам нужно выбрать все ссылки в тексте твита используйте селектор #twitter span a
- Если вам нужно выбрать ссылку на профиль в твиттере используйте и вы не используете div-обёртку — #twitter > a
- То же самое, но при использовании обёртки #twitter > div > a
- При каждом вызове функции JSON с данными загружается снова. (позднее будет настраиваемой фичей)
- Вызывать ф-ию можно только после загрузки всей страницы, чтобы запрос JSONa с данными не тормозил загрузку страницы
- Производить действия над результатом работы скрипта можно только после его полного выполнения то есть внутри сallback
- Ф-ия cntRus вынесена отдельно, что позволит вам использовать в своих скриптах. Создана она из скрипта Aleko, а как она работает предлагаю разобраться самим
Не абсурдные предложения по скрипту с радостью принимаются в комментариях.
а не так
???