0

Rastreando os visitantes do site

[site]

1º- Javascript que faz as requisições Ajax para a captura
e inserção dos dados.

/*A o  carregar a pagina chamo a função que captura os dados do visitante*/
$(document).ready(function() {
    localizarUsuario();  
});

/*Função que pega as coordenadas do local do visitante*/
function localizarUsuario(){
  if (window.navigator && window.navigator.geolocation) {
   var geolocation = window.navigator.geolocation;
   geolocation.getCurrentPosition(sucesso, erro);
  } else {
     alert('Geolocalização não suportada em seu navegador.')
  }
 
  function sucesso(posicao){
    var latitude = posicao.coords.latitude;
    var longitude = posicao.coords.longitude;

    /*Chamo a função que faz a requisição para a inserção*/
    cadastra(latitude, longitude);
  }
  function erro(error){
    console.log(error)
  }
}
/*Função  Ajax que faz o post para a action do código a seguir*/
function cadastra(latitude, longitude) {
    $.ajax({
        url: '/index/ajax-map',
        type: 'POST',
        dataType: 'JSON',
        data: {
           latitude: latitude,
           longitude: longitude
        },
        success: function(data) {
           // alert('salvo');
          
        }
    });
}

2º- Código PHP que faz a inserção dos registros na base de dados*/


/*Action que recupera os registros do post via Ajax*/
public function ajaxMapAction() {
        /* Crio a sessão de acesso do usuário para não inserir dados duplicados */
        $acesso = new Zend_Session_Namespace("acesso");

        /*Instancio a Model*/
        $ModelAcessos = new Admin_Model_Acessos();
        
        /*Verifico se já foi inserido*/
        if ($acesso->ip == '') {

            /*Recupero os dados do POST*/
            $data = $this->_request->getPost();
            $ModelAcessos->insert($data);
        }
        die('inserido');
    }

[admin]

3º- Depois da inserção na base dados, Trabalho com os códigos a seguir para fazer
a listagem e rastreio dos dados na área administrativa do site.

/*Javascript responsável de rastrear os acesso* como: Latitude e Longitude*/
$(function () {
    /*A o clicar no botão rastrear executo as seguintes funções*/
    $(".rastrear").click(function () {
        var latitude = $(this).attr('latitude');
        var longitude = $(this).attr('longitude');

        function success(position) {

            var s = document.querySelector('#status');

            s.innerHTML = "Rastreado com Sucesso!";
            s.className = 'success';

            var mapcanvas = document.createElement('div');
            mapcanvas.id = 'mapcanvas';
            mapcanvas.style.height = '400px';
            mapcanvas.style.width = '560px';

            document.querySelector('article').appendChild(mapcanvas);

            var latlng = new google.maps.LatLng(latitude, longitude);

            var myOptions = {
                zoom: 15,
                center: latlng,
                mapTypeControl: false,
                navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

            var map = new google.maps.Map(document.getElementById("mapcanvas"), myOptions);
            var marker = new google.maps.Marker({
                position: latlng,
                map: map,
                title: "Você está aqui!"
            });

        }

        function error(msg) {
            var s = document.querySelector('#status');
            s.innerHTML = typeof msg == 'string' ? msg : "falhou";
            s.className = 'fail';
        }

        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(success, error);
        } else {
            error('Seu navegador não suporta <b style="color:black;background-color:#ffff66">Geolocalização</b>!');
        }
    });
});


/*Html da lista de registros de acessos*/
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="js/maps.js"></script>

<div class="row">
 <div class="col-md-12">
 <!-- Advanced Tables -->
 <div class="panel panel-default">
 <div class="panel-heading">
 Acessos
 </div>
 <div class="panel-body">
 <div class="table-responsive">
 <table class="table">
 <thead>
 <tr>
 <th>S.O</th>
 <th>Navegador</th>
 <th>Latitude</th>
 <th>Longitude</th>
 <th>IP</th>
 <th>Data</th>
 <th>OPÇÕES</th>
 </tr>
 </thead>
 <tbody>
 <?php
 if ($this->acessos) {
 foreach ($this->acessos as $row) {
 ?>
 <tr class="odd gradeX">
 <td><?= $row['sistema_operacional']; ?></td>
 <td><?= $row['navegador']; ?></td>
 <td><?= $row['latitude']; ?></td>
 <td><?= $row['longitude']; ?></td>
 <td><?= $row['ip']; ?></td>
 <td><?=$this->ConvercaoDate('-', $row['data_acesso'],4); ?></td>
 <td>
 <button type="button" class="btn btn-success rastrear" data-toggle="modal" data-target="#myModal" latitude="<?= $row['latitude']; ?>" longitude="<?= $row['longitude']; ?>" style=" margin-bottom: 12px!important;">Rastrear</button>
 </td>
 </tr>
 <? }
 } else { ?>
 <tr>Não ha registros de acessos</tr>
<? } ?> 
 </tbody>
 </table>
 </div>

</div>
 </div>

 </div>

</div>

<!-- Modal  a onde será exibido o mapa da localidade do visitante-->
<div class="modal fade bs-example-modal-lg" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-header">
 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 <h4 class="modal-title" id="myModalLabel">Mapa</h4>

</div>
 <div class="modal-body"> 
 <article>
 <p><span id="status">Por favor aguarde enquanto nós tentamos locar você...</span></p>
 </article>
 </div>
 <div class="modal-footer">
 <button type="button" class="btn btn-success pull-right" data-dismiss="modal">Fechar</button>
 </div>
 </div>
 </div>
</div>