ajax-обновление кол-ва новых сообщений LS 0.3
Описание: У пользователя открыта любая страничка livestreet, на которой отображается сколько непрочитанных сообщений находится в почтовом ящике. Данный tip автомтически обновляет этот блок каждые 5 секунд. После 60 запросов, если страница не была обновлена скрипт останавливается (после 5 минут). Это сделано для того чтобы если пользователь забыл закрыть браузер на ночь, неделю, не было лишних запросов. После загрузки страницы скрипт опять запускается.
1. в папке include/ajax/ создаём файл requestNewMessages.php с содержимым:
2. в папке templates/new/js/ создаём файл new_messages.js с содержимым:
не забываем его сохранить в utf-8, так как будут проблемы в ИЕ6
3. подключаем JS в хидер. Открываем header.tpl
находим строку:
ниже неё добавляем:
далее тут же находим:
меняем на:
4. в header_top.tpl
находим:
меняем:
Классно выглядит, если картинка новых сообщений анимированная, т.е. в стиль message можно прикрутить анимашку.
1. в папке include/ajax/ создаём файл requestNewMessages.php с содержимым:
<?php
/**
* Ajax new messages (benone & Lora_GT)
*/
set_include_path(get_include_path().PATH_SEPARATOR.dirname(dirname(dirname(__FILE__))));
$sDirRoot=dirname(dirname(dirname(__FILE__)));
require_once($sDirRoot."/config/config.ajax.php");
$bStateError=false;
$sTextResult='';
if (!$oEngine->User_IsAuthorization()) {
$$bStateError = true;
}
$oUser = $oEngine->User_GetUserCurrent();
$iCountTalkNew = $oEngine->Talk_GetCountTalkNew($oUser->getId());
$GLOBALS['_RESULT'] = array(
"bStateError" => $bStateError,
"iCountTalkNew" => $iCountTalkNew,
);
?>
2. в папке templates/new/js/ создаём файл new_messages.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_messages').addClass("message");
$('new_messages').removeClass("message-empty");
$('new_messages').innerHTML = requestMessages.responseJS.iCountTalkNew;
}
else
{
$('new_messages').addClass("message-empty");
$('new_messages').removeClass("message");
}
}
}
};
не забываем его сохранить в utf-8, так как будут проблемы в ИЕ6
3. подключаем JS в хидер. Открываем header.tpl
находим строку:
<script type="text/javascript" src="{$DIR_STATIC_SKIN}/js/panel.js"></script>
ниже неё добавляем:
<script type="text/javascript" src="{$DIR_STATIC_SKIN}/js/new_messages.js"></script>
далее тут же находим:
{literal}
<script language="JavaScript" type="text/javascript">
var tinyMCE=false;
var msgErrorBox=new Roar({
position: 'upperRight',
className: 'roar-error',
margin: {x: 30, y: 10}
});
var msgNoticeBox=new Roar({
position: 'upperRight',
className: 'roar-notice',
margin: {x: 30, y: 10}
});
</script>
{/literal}
меняем на:
{literal}
<script language="JavaScript" type="text/javascript">
var tinyMCE=false;
var msgErrorBox=new Roar({
position: 'upperRight',
className: 'roar-error',
margin: {x: 30, y: 10}
});
var msgNoticeBox=new Roar({
position: 'upperRight',
className: 'roar-notice',
margin: {x: 30, y: 10}
});
var reqCount = 60;
function reqMessages() {
reqCount -= 1;
if(reqCount>1) {
requestMessages.open(null, DIR_WEB_ROOT+'/include/ajax/requestNewMessages.php', true);
requestMessages.send();
}};
</script>
{/literal}
{if $oUserCurrent}
<script language="JavaScript" type="text/javascript">
reqMessages.periodical(5000);
</script>
{/if}
4. в header_top.tpl
находим:
{if $iUserCurrentCountTalkNew}
<a href="{$DIR_WEB_ROOT}/{$ROUTE_PAGE_TALK}/" class="message" title="{$aLang.user_privat_messages_new}">{$iUserCurrentCountTalkNew}</a>
{else}
<a href="{$DIR_WEB_ROOT}/{$ROUTE_PAGE_TALK}/" class="message-empty"> </a>
{/if}
меняем:
{if $iUserCurrentCountTalkNew}
<a href="{$DIR_WEB_ROOT}/{$ROUTE_PAGE_TALK}/" title="{$aLang.user_privat_messages_new}" id="new_messages" class="message">{$iUserCurrentCountTalkNew}</a>
{else}
<a href="{$DIR_WEB_ROOT}/{$ROUTE_PAGE_TALK}/" id="new_messages" class="message-empty"> </a>
{/if}
Классно выглядит, если картинка новых сообщений анимированная, т.е. в стиль message можно прикрутить анимашку.
11 комментариев
1 запрос в 5 секунд -> 0,2 запроса в секунду только на комменты. умножаем на 1000 человек и получаем 200 запросов в секунду. +запросы на статику+...+. короче сервер таким типсам-триксам не обрадуется
О, а, кстати, теперь совсем не сложно=)
я так полагаю тоже самое… ну код конечно на другом уровне =)
или что-то в корне изменилось..?