用户聊天脚本javascript问题

时间:2016-07-02 10:29:29

标签: javascript jquery

我有这个用户聊天脚本,我遇到了一些问题,当我给用户写了一条消息,然后按Enter键发送'它,大多数时候消息没有显示,如果我刷新页面消息是在聊天窗口,我想我有js脚本的严重问题,我需要一些帮助人..

Js脚本:

jQuery(function(){
  var userOnline = Number(jQuery('span.user_online').attr('id'));
  var clicou = [];

  function in_array(valor, array){
    for(var i =0; i<array.length;i++){
      if(array[i] == valor){
        return true;
      }
    }

    return false;
  }

  function add_janela(id, nome, status){
    var janelas = Number(jQuery('#chats .window').length);
    var pixels = (270+5)*janelas;
    var style = 'float:none; position:absolute; bottom:0; right:'+pixels+'px';

    var splitDados = id.split(':');
    var id_user = Number(splitDados[1]);


    var janela = '<div class="window" id="janela_'+id_user+'" style="'+style+'">';
    janela += '<div class="header_window"><a href="#" class="close">X</a> <span class="name">'+nome+'</span> <span id="'+id_user+'" class="status-lista'+'"></span></div>';
    janela += '<div class="body"><div class="mensagens"><ul></ul></div>';
    janela += '<div class="send_message" id="'+id+'"><input type="text" name="mensagem" class="msg" id="'+id+'"/></div></div>';

    jQuery('#chats').append(janela);

  }



  function retorna_historico(id_conversa){
    jQuery.ajax({
      type: 'POST',
      url: 'sys/historico.php',
      data: {conversacom: id_conversa, online: userOnline},
      dataType: 'json',
      success: function(retorno){
        jQuery.each(retorno, function(i, msg){
          if(jQuery('#janela_'+msg.janela_de).length > 0){
            if(userOnline === msg.id_de){
              jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li id="'+msg.id+'" class="eu"><p>'+msg.mensagem+'</p></li>');
            }else{
              jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li id="'+msg.id+'"><div class="imgSmall"><img src="'+msg.fotoUser+'" /></div><p>'+msg.mensagem+'</p></li>');
            }
          }
        });
        [].reverse.call(jQuery('#janela_'+id_conversa+' .mensagens li')).appendTo(jQuery('#janela_'+id_conversa+' .mensagens ul'));
        jQuery('#janela_'+id_conversa+' .mensagens').animate({scrollTop: 230}, '500');
      }
    });
  }

  jQuery('body').on('click', '#users_online a', function(){
    var id = jQuery(this).attr('id');
    jQuery(this).removeClass('comecar');

    var status = jQuery(this).next().attr('class');
    var splitids = id.split(':');
    var idJanela = Number(splitids[1]);

    if(jQuery('#janela_'+idJanela).length == 0){
      var nome = jQuery(this).text();
      add_janela(id, nome, status);
      retorna_historico(idJanela);
    }else{
      jQuery(this).removeClass('comecar');
    }
  });

  jQuery('body').on('click', '.header_window', function(){
    var next = jQuery(this).next();
    next.toggle(100);
  });

  jQuery('body').on('click', '.close', function(){
    var parent = jQuery(this).parent().parent();
    var idParent = parent.attr('id');
    var splitParent = idParent.split('_');
    var idJanelaFechada = Number(splitParent[1]);

    var contagem = Number(jQuery('.window').length)-1;
    var indice = Number(jQuery('.close').index(this));
    var restamAfrente = contagem-indice;

    for(var i = 1; i <= restamAfrente; i++){
      jQuery('.window:eq('+(indice+i)+')').animate({left:"-=275"}, 200);
    }
    parent.remove();
    jQuery('#users_online li#'+idJanelaFechada+' a').addClass('comecar');
  });

  jQuery('body').on('keyup', '.msg', function(e){
    if(e.which == 13){
      var texto = jQuery(this).val();
      var id = jQuery(this).attr('id');
      var split = id.split(':');
      var para = Number(split[1]);

      jQuery.ajax({
        type: 'POST',
        url: 'sys/submit.php',
        data: {mensagem: texto, de: userOnline, para: para},
        success: function(retorno){
          if(retorno == 'ok'){
            jQuery('.msg').val('');
          }else{
            alert("Ocorreu um erro ao enviar a mensagem");
          }
        }
      });
    }
  });

  jQuery('body').on('click', '.mensagens', function(){
    var janela = jQuery(this).parent().parent();
    var janelaid = janela.attr('id');
    var idConversa = janelaid.split('_');
    idConversa = Number(idConversa[1]);

    jQuery.ajax({
      url: 'sys/ler.php',
      type: 'POST',
      data: {ler: 'sim', online: userOnline, user: idConversa},
      success: function(retorno){}
    });
  });

  function verifica(timestamp, lastid, user){
    var t;
    jQuery.ajax({
      url: 'sys/stream.php',
      type: 'GET',
      data: 'timestamp='+timestamp+'&lastid='+lastid+'&user='+user,
      dataType: 'json',
      success: function(retorno){
        clearInterval(t);
        if(retorno.status == 'resultados' || retorno.status == 'vazio'){
          t =setTimeout(function(){
            verifica(retorno.timestamp, retorno.lastid, userOnline);
          },1000);

          if(retorno.status == 'resultados'){
            jQuery.each(retorno.dados, function(i, msg){
              if(msg.id_para == userOnline){
                jQuery.playSound('sys/effect');
              }

              if(jQuery('#janela_'+msg.janela_de).length == 0){
                jQuery('#users_online #'+msg.janela_de+' .comecar').click();
                clicou.push(msg.janela_de);
              }

              if(!in_array(msg.janela_de, clicou)){
                if(jQuery('.mensagens ul li#'+msg.id).length == 0 && msg.janela_de > 0){
                  if(userOnline == msg.id_de){
                    jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li class="eu" id="'+msg.id+'"><p>'+msg.mensagem+'</p></li>');
                  }else{
                    jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li id="'+msg.id+'"><div class="imgSmall"><img src="'+msg.fotouser+'" border="0"/></div><p>'+msg.mensagem+'</p></li>');
                  }
                }
              }
            });
            jQuery('.mensagens').animate({scrollTop: 230}, '500');
            console.log(clicou);
          }

        }else if(retorno.status == 'erro'){
          alert('Ficamos confusos, atualize a pagina');
        }
      },

    });
  }

  verifica(0,0,userOnline);
});

流php代码:

<?php
if(isset($_GET)){
    include_once "../defines.php";
    require_once('../classes/BD.class.php');
    BD::conn();

    $userOnline = (int)$_GET['user'];
    $timestamp = ($_GET['timestamp'] == 0) ? time() : strip_tags(trim($_GET['timestamp']));
    $lastid = (isset($_GET['lastid']) && !empty($_GET['lastid'])) ? $_GET['lastid'] : 0;

    $usersOn = array();
    $agora = date('Y-m-d H:i:s');
    $expira = date('Y-m-d H:i:s', strtotime('+1 min'));
    $upOnline = BD::conn()->prepare("UPDATE `mls_users` SET `limite` = ? WHERE `id` = ?");
    $upOnline->execute(array($expira, $userOnline));

    $pegaOnline = BD::conn()->prepare("SELECT * FROM `mls_users` WHERE `id` != '$userOnline' ORDER BY `id` DESC");
    $pegaOnline->execute();
    while($onlines = $pegaOnline->fetch()){
        $photo = ($onlines['photo'] == '') ? 'default.jpg' : $onlines['photo'];
        $blocks = explode(',', $onlines['blocks']);
        if(!in_array($userOnline, $blocks)){
            if($agora >= $onlines['limite']){
                $usersOn[] = array('id' => $onlines['id'], 'nome' => utf8_encode($onlines['username']), 'foto' => $photo, 'status' => 'off');
            }else{
                $usersOn[] = array('id' => $onlines['id'], 'nome' => utf8_encode($onlines['username']), 'foto' => $photo, 'status' => 'on');
            }
        }
    }

    if(empty($timestamp)){
        die(json_encode(array('status' => 'erro')));
    }

    $tempoGasto = 0;
    $lastidQuery = '';

    if(!empty($lastid)){
        $lastidQuery = ' AND `id` > '.$lastid;
    }

    if($_GET['timestamp'] == 0){
        $verifica = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE `lido` = 0 ORDER BY `id` DESC");
    }else{
        $verifica = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE `time` >= $timestamp".$lastidQuery." AND `lido` = 0 ORDER BY `id`DESC");
    }
    $verifica->execute();
    $resultados = $verifica->rowCount();

    if($resultados <= 0){
        while($resultados <= 0){
            if($resultados <= 0){
                //durar 30 segundos verificando
                if($tempoGasto >= 30){
                    die(json_encode(array('status' => 'vazio', 'lastid' => 0, 'timestamp' => time(), 'users' => $usersOn)));
                    exit;
                }

                //descansar o script por um segundo
                sleep(1);
                $verifica = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE `time` >= $timestamp".$lastidQuery." AND `lido` = 0 ORDER BY `id`DESC");
                $verifica->execute();
                $resultados = $verifica->rowCount();
                $tempoGasto += 1;
            }
        }
    }

    $novasMensagens = array();
    if($resultados >= 1){
        $emotions = array(':)', ':@', '8)', ':D', ':3', ':(', ';)');
        $imgs = array(
            '<img src="emotions/nice.png" width="14"/>',
            '<img src="emotions/angry.png" width="14"/>',
            '<img src="emotions/cool.png" width="14"/>',
            '<img src="emotions/happy.png" width="14"/>',
            '<img src="emotions/ooh.png" width="14"/>',
            '<img src="emotions/sad.png" width="14"/>',
            '<img src="emotions/right.png" width="14"/>'
        );

        while($row = $verifica->fetch()){
            $fotouser = '';
            $janela_de = 0;

            if($userOnline == $row['id_de']){
                $janela_de = $row['id_para'];

            }elseif($userOnline == $row['id_para']){
                $janela_de = $row['id_de'];
                $pegaUsr = BD::conn()->prepare("SELECT `photo` FROM `mls_users` WHERE `id` = '$row[id_de]'");
                $pegaUsr->execute();
                while($usr = $pegaUsr->fetch()){
                    $fotouser = ($usr['photo'] == '') ? 'default.jpg' : $usr['photo'];
                }
            }
            $msg = str_replace($emotions, $imgs, $row['mensagem']);
            $novasMensagens[] = array(
                'id' => $row['id'],
                'mensagem' => utf8_encode($msg),
                'fotouser' => $fotouser,
                'id_de' => $row['id_de'],
                'id_para' => $row['id_para'],
                'janela_de' => $janela_de
            );
        }
    }

    $ultimaMsg = end($novasMensagens);
    $ultimoId = $ultimaMsg['id'];
    die(json_encode(array('status' => 'resultados', 'timestamp' => time(), 'lastid' => $ultimoId, 'dados' => $novasMensagens, 'users' => $usersOn)));
}
?>

历史Php代码:

<?php
if(isset($_POST['conversacom'])){

    include_once "../defines.php";
    require_once('../classes/BD.class.php');
    BD::conn();

    $mensagens = array();
    $id_conversa = (int)$_POST['conversacom'];
    $online = (int)$_POST['online'];

    $pegaConversas = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE (`id_de` = ? AND `id_para` = ?) OR (`id_de` = ? AND `id_para` = ?) ORDER BY `id` DESC LIMIT 10");
    $pegaConversas->execute(array($online, $id_conversa, $id_conversa, $online));

    while($row = $pegaConversas->fetch()){
        $fotouser = '';
        if($online == $row['id_de']){
            $janela_de = $row['id_para'];

        }elseif($online == $row['id_para']){
            $janela_de = $row['id_de'];

            $pegaFoto = BD::conn()->prepare("SELECT `photo` FROM `mls_users` WHERE `id` = '$row[id_de]'");
            $pegaFoto->execute();

            while($usr = $pegaFoto->fetch()){
                $fotouser = ($usr['photo'] == '') ? 'default.jpg' : $usr['photo'];
            }
        }

        $emotions = array(':)', ':@', '8)', ':D', ':3', ':(', ';)');
        $imgs = array(
            '<img src="emotions/nice.png" width="14"/>',
            '<img src="emotions/angry.png" width="14"/>',
            '<img src="emotions/cool.png" width="14"/>',
            '<img src="emotions/happy.png" width="14"/>',
            '<img src="emotions/ooh.png" width="14"/>',
            '<img src="emotions/sad.png" width="14"/>',
            '<img src="emotions/right.png" width="14"/>'
        );
        $msg = str_replace($emotions, $imgs, $row['mensagem']);
        $mensagens[] = array(
            'id' => $row['id'],
            'mensagem' => utf8_encode($msg),
            'fotoUser' => $fotouser,
            'id_de' => $row['id_de'],
            'id_para' => $row['id_para'],
            'janela_de' => $janela_de
        );

    }
    die( json_encode($mensagens) );
}
?>

0 个答案:

没有答案