Как уведомлять об новых сообщениях? php

143

08 сентября 2019, 10:00

В данный момент, я пишу чатик, который парсится из логов. Сделано все на php+ajax. Все работает как задумано, но вот как сделать уведомление об новых сообщениях, я так и не додумался. Я полагаю нужно ставить флаги внутри сообщений которые парсятся, но из-за того что страница обновляется раз в секунду, у файлов сбрасываются флаги на первоначальные. Куда мне копать в такой ситуации?

<!DOCTYPE html> 
<html> 
 
<head> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
    <title>Kaboom 2.0 Чат</title> 
    <link rel="stylesheet" href="chat.css" type="text/css" /> 
    <?php 
        header('Content-Type: text/html; charset=windows-1251'); 
    ?> 
        <script type="text/javascript"> 
            function mode() { 
                $.ajax({ 
                    url: 'global.php', 
                    success: function(data) { 
                        $('#gchatloader').html(data); 
                    } 
                }); 
                $.ajax({ 
                    url: 'local.php', 
                    success: function(data) { 
                        $('#lchatloader').html(data); 
                    } 
                }); 
                $.ajax({ 
                    url: 'private.php', 
                    success: function(data) { 
                        $('#pchatloader').html(data); 
 
                    } 
                }); 
            }; 
            setInterval(mode, 1000); 
        </script> 
        <script> 
            var i = 0; 
 
            function func() { 
                $("body").mouseover(function() { 
                    i = 1; 
                }); 
                $("body").mouseout(function() { 
                    i = 2; 
                }); 
                if (i != 1) { 
                    $("#pchatloader").scrollTop(99999999999999999999); 
                    $("#gchatloader").scrollTop(99999999999999999999); 
                    $("#lchatloader").scrollTop(99999999999999999999); 
                } 
            } 
            setInterval(func, 1000); 
        </script> 
 
</head> 
 
<body> 
    <div class="tabs"> 
        <input id="tab1" type="radio" name="tabs" checked> 
        <label for="tab1" title="Вкладка 1">Общий чат</label> 
 
        <input id="tab2" type="radio" name="tabs"> 
        <label for="tab2" title="Вкладка 2">Локальный чат</label> 
 
        <input id="tab3" type="radio" name="tabs"> 
        <label for="tab3" title="Вкладка 3">Личные сообщения</label> 
 
        <input id="tab4" type="radio" name="tabs"> 
        <label for="tab4" title="Вкладка 4">Запаска</label> 
 
        <section id="content-tab1"> 
            <div id="gchatloader"></div> 
        </section> 
        <section id="content-tab2"> 
            <div id="lchatloader"></div> 
        </section> 
        <section id="content-tab3"> 
            <div id="pchatloader"></div> 
        </section> 
        <section id="content-tab4"> 
            <div id="server"></div> 
        </section> 
    </div> 
</body> 
 
</html>

В результате парса, получается страница вида:

Answer 1

Разобрался, сделал как примерно и думал. При парсинге текста, добавил им class и просто считал их количество. А при нажатии на вкладку, запоминал число в скрытый див. При автоповторе скрипта, он сравнит количество сообщений с числом из дива. Все собственно просто. (особенно когда раздуплился =))

var cnt, i; 
 
function func1() { 
    var div = document.querySelectorAll('lcr'); // Получаем список все блоков документа 
    cnt = div.length; // Считаем количество блок 
    //alert(cnt); // Выводи на экран результат 
    var label = document.getElementById('mig_label'); 
    var i = document.getElementById('lcdcalc').innerHTML; 
    if (i < cnt) { 
        label.style.color = "#E81700"; 
        setTimeout(function() {}, 5000); 
    } 
} 
 
function lcd() { 
    var div = document.querySelectorAll('lcr'); // Получаем список все блоков документа 
    cnt = div.length; // Считаем количество блок 
    var label = document.getElementById('mig_label'); 
    var SummDok = document.getElementById('lcdcalc'), 
    SummSumm = cnt; 
    SummDok.innerHTML = SummSumm; 
    SummDok.style.display = "none"; 
    label.style.color = "#aaaaaa"; 
} 
setInterval(func1, 2000);

<div id="lcdcalc"></div> 
<input id="tab2" type="radio" name="tabs"> 
<label for="tab2" title="Вкладка 2"><a id='mig_label' onclick="lcd();" target="blank">Локальный чат</a></label>