ajax-обновление кол-ва новых сообщений.
16
В продолжение полезных трудов skif'a хотелось бы добавить еще один ajax-tip
Внимание, в IE были замечены глюки. Сегодня вечером пофикшу
Итак, автоматическое обновление кол-ва новых сообщений.

Описание: У пользователя открыта любая страничка livestreet, на которой отображается сколько непрочитанных сообщений находится в почтовом ящике. Данный tip автомтически обновляет этот блок каждые 5 секунд. После 60 запросов, если страница не была обновлена скрипт останавливается (после 5 минут). Это сделано для того чтобы если пользователь забыл закрыть браузер на ночь, неделю, не было лишних запросов. После загрузки страницы скрипт опять запускается.
1. Загружаем и кидаем его в /include/ajax/
Данный файл будет делать запрос к базе данных и возвращать кол-во новых сообщений для авторизированного пользователя
2. Добавляем javascript. Открываем main.js и вставляем в самый конец код:
Данный код создает объект request, который при вызове обрабатывает ответ (если новые собщения есть, блок new_message становится видимым и в new_msg_count вставляется кол-во новых сообщений.
3. Редактируем header.tpl: после куска кода, где устанавливается переменная DIR_WEB_ROOT:
вставялем следующий код:
Тут мы задаем функцию reqMessages(), которая вызывает наш объект requestMessages и задаем периодичность вызова (5 секунд)
4. Редактируем html-шаблон в header.tpl
Открываем строку и заменяем блок
Всё.
Внимание, в IE были замечены глюки. Сегодня вечером пофикшу
Итак, автоматическое обновление кол-ва новых сообщений.

Описание: У пользователя открыта любая страничка livestreet, на которой отображается сколько непрочитанных сообщений находится в почтовом ящике. Данный tip автомтически обновляет этот блок каждые 5 секунд. После 60 запросов, если страница не была обновлена скрипт останавливается (после 5 минут). Это сделано для того чтобы если пользователь забыл закрыть браузер на ночь, неделю, не было лишних запросов. После загрузки страницы скрипт опять запускается.
1. Загружаем и кидаем его в /include/ajax/
Данный файл будет делать запрос к базе данных и возвращать кол-во новых сообщений для авторизированного пользователя
2. Добавляем javascript. Открываем main.js и вставляем в самый конец код:
var requestMessages = new JsHttpRequest();
requestMessages.onreadystatechange = function() {
if (requestMessages.readyState == 4) {
if (requestMessages.responseJS.bStateError) {
msgErrorBox.alert('Ошибка','Возникли технические проблемы при получении сообщений');
} else {
if (requestMessages.responseJS.iCountTalkNew>0) {
$('new_message').style.display="block";
$('no_messages').style.display="none";
$('new_msg_count').innerHTML = requestMessages.responseJS.iCountTalkNew;
}
else
{
$('new_message').style.display="none";
$('no_messages').style.display="block";
}
}
}
};
Данный код создает объект request, который при вызове обрабатывает ответ (если новые собщения есть, блок new_message становится видимым и в new_msg_count вставляется кол-во новых сообщений.
3. Редактируем header.tpl: после куска кода, где устанавливается переменная DIR_WEB_ROOT:
<script>var DIR_WEB_ROOT='{$DIR_WEB_ROOT}';</script>
вставялем следующий код:
{literal}
<script>
var reqCount = 60;
function reqMessages() {
reqCount -= 1;
if(reqCount>1) {
requestMessages.open(null, DIR_WEB_ROOT+'/include/ajax/requestNewMessages.php', true);
requestMessages.send();
}
};
reqMessages.periodical(5000);
</script>
{/literal}
Тут мы задаем функцию reqMessages(), которая вызывает наш объект requestMessages и задаем периодичность вызова (5 секунд)
4. Редактируем html-шаблон в header.tpl
Открываем строку и заменяем блок
{if $iUserCurrentCountTalkNew}
<nobr><IMG vspace="0" title="Проверьте почту!" align="middle" height=12 alt="" src="{$DIR_STATIC_SKIN}/img/mail.gif" width=12 border=0> <A class=hello_exit href="{$DIR_WEB_ROOT}/talk/">{$aLang.user_privat_messages_new}({$iUserCurrentCountTalkNew})</a></nobr>
{else}
<nobr><A class=hello_exit href="{$DIR_WEB_ROOT}/talk/">{$aLang.user_privat_messages}</a></nobr>
{/if}
на
<span id="new_messages" {if !$iUserCurrentCountTalkNew} style="display:none" {/if}>
<nobr>
{$aLang.user_privat_messages_new_1}
<IMG vspace="0" title="Проверьте почту!" align="middle" height=12 alt="" src="{$DIR_STATIC_SKIN}/i/mail.gif" width=12 border=0>
<A class="login_m_link" href="{$DIR_WEB_ROOT}/talk/">
{$aLang.user_privat_messages_new}
(<span id="new_msg_count">{$iUserCurrentCountTalkNew}</span>)
</a>
</nobr>
</span>
<span id="no_messages" {if $iUserCurrentCountTalkNew} style="display:none" {/if}>
<nobr>
{$aLang.user_privat_messages_1}
<A class="login_m_link" href="{$DIR_WEB_ROOT}/talk/">
{$aLang.user_privat_messages}
</a>
</nobr>
</span>
.Всё.
- +18
- 28 ноября 2008, 09:48
- benone
я тоже могу парить мульку и умничать что у меня проект с 8к топиков и 40к коментов, простите это всё напарсеное или просто подразнить людей… уж извините за офф топ, надоело. и эти понты что юзать что не юзать. Вот решение! Оно оптимально! Не нравиться? — проходите мимо! Меня больше всего бесят эти обстракции: Я недоумеваю почему вы не юзаете mootools? Где конкретные факты? где статья с подробным описанием и примерами? — БРЕД!
Сколько желчи.
Про 8к постов было не здесь сказано, да и просто перенесли всё из БД старого движка. Сейчас создается дизайн, за основу был взят .
Где примеры? Да вот же. , , , . Свои конкретные рецепты выложу как только до них дойду. Обещать не стану, но постараюсь не забыть.
Про 8к постов было не здесь сказано, да и просто перенесли всё из БД старого движка. Сейчас создается дизайн, за основу был взят .
Где примеры? Да вот же. , , , . Свои конкретные рецепты выложу как только до них дойду. Обещать не стану, но постараюсь не забыть.
requestMessages.responseJS.iCountTalkNew; Дошло.Через mootools я возвращал бы JSON объект. Это сложнее на пару строчек. Просто я в начале своего JS пути очень долго не понимал почему нельзя совместо юзать JQuery и Mootools. Я почти их скрестил, и до меня начало доходить ЧЕМ я всё это время занимался. :) Буквально прочел весь код обоих библиотек. Теперь стойкое отторжение к таким скрещиваниям, плюс осознанный выбор Моотулса и неплохое его понимание :)
автор забыл отметить что при определенном кол-ве онлайн данный скрипт положит сервер.
извините, но это же не чат, чтоб каждые 5 секунд проверять личные сообщения.
извините, но это же не чат, чтоб каждые 5 секунд проверять личные сообщения.
выставите любой нужное вам время в миллисекундах.
reqMessages.periodical(5000);
можете поставить минуту
reqMessages.periodical(60000);
Комментарии (24)
RSS свернуть / развернуть