Sistema de votaciones con php

[heinther]

Hola amigos,
llevo ya unos días con un problema en mi sistema de votaciones que no soy capaz de resolver, trataré de explicarlo lo mejor posible a ver si pueden ayudarme.

Para realizar las votaciones utilizo php, jquery y ajax.

El caso es que el sistema funciona de maravillas salvo por un pequeño de detalle.
Para votar debes estar registrado obligatoriamente. Y cada voto que se realiza se guarda en una base de datos.
Cada vez que vayas a votar se consultará esa base de datos y si detecta que ya has votado no te dejará volver a votar.

El problema es que cuando vas a votar, mientras no refresques la página puedes seguir votando todas las veces que quieras.
Y por más que he buscado no sé como hacer para que sólo se pueda votar una vez antes de refrescar la página.

Si pueden decirme cómo hacer para que al pulsar en una de las estrellas diga: "gracias por tu voto" y no deje seguir votando se lo agradecería mucho.

Mi código es propio en toda la página salvo en el sistema de votaciones ya que apenas tengo conocimientos de jquery y ajax aunque sí lo he adaptado bastante a mi página.

Este es el código donde se ven las estrellas:

Código PHP:

          echo "<div id='$idmazmorra_' class='divValoracion'>"; 
            echo '<div class="estrella_1 estrellaSinVoto"></div>'; 
            echo '<div class="estrella_2 estrellaSinVoto"></div>'; 
            echo '<div class="estrella_3 estrellaSinVoto"></div>'; 
            echo '<div class="estrella_4 estrellaSinVoto"></div>'; 
            echo '<div class="estrella_5 estrellaSinVoto"></div>'; 
            echo '<div class="votosTotales">Necesita más votos</div>'; 
        echo '</div>';  
   

Código PHP:

   public function votar() { 
            session_start(); 
            $link1 = mysqli_connect(SERVER, USER, PASS); 
            mysqli_select_db($link1, BD); 
            $query1 = "INSERT INTO votaciones VALUES(NULL,'".$_SESSION['idusuario']."','".$_POST['mazmorra_id']."')"; 
            $result1 = mysqli_query($link1, $query1); 
            // necesitamos saber qué estrella es la que se votó 
            // para eso, usamos preg_match, que realiza una comparación  
            // tomando la expresión regular, la cadena de entrada (la estrella en la que hizo click) y dejando el resultado en $resultado 
            preg_match('/estrella_([1-5]{1})/', $_POST['clickEstrella'], $resultado); 
 
            // guardamos el valor de la estrella 
            $votar = $resultado[1]; 
             
            $ID = $this->mazmorra_id; 
            // si existe la mazmorra en el arreglo (cargado en el constructor) 
            if($this->data[$ID]) { 
 
                // aumentamos el número de votos en 1 
                $this->data[$ID]['numeroDeVotos'] += 1; 
 
                // sumamos el voto a los votos totales 
                $this->data[$ID]['votosTotales'] += $votar; 
            } 
            else { // si no existe la mazmorra 
 
                // indicamos que es el primer voto 
                $this->data[$ID]['numeroDeVotos'] = 1; 
 
                // indicamos el número del primer voto 
                $this->data[$ID]['votosTotales'] = $votar; 
            } 
             
            // calculamos el promedioExacto 
            $this->data[$ID]['promedioExacto'] =  
                round( $this->data[$ID]['votosTotales'] / $this->data[$ID]['numeroDeVotos'], 1 ); 
 
            // redondeamos el promedio, para no tener que volver a hacerlo en la página 
            $this->data[$ID]['promedioRedondeado'] = round( $this->data[$ID]['promedioExacto'] ); 
                 
            // guardamos el arreglo en formato plano de nuevo en el archivo de texto 
            file_put_contents($this->data_file, serialize($this->data)); 
 
            // obtenemos el nuevo rating para enviárselo a la página 
            $this->obtenerRating(); 
        }  
   

El código no lo pongo completo, porque creo que el problema no lo requiere.
Pero si necesitan algún dato más díganmelo.

Muchas gracias de antemano a todo el que ayude.

[chulifo]

Tienes que evaluar varias cosas para tu problema:

• Si quieres que al pulsar la estrella aparezca otro mensaje, es un tema de Javscript, donde te puede ser muy util los eventos onclick .
• Por otra parte desde el PHP cuando recibas la consulta, debes buscar primero en la base de datos si existe el voto y luego insertarlo.
  

Ambas cosas para que te funcione mejor.

Código HTML:

<p id="primero"  onclick="this.innerHTML='cambio'">primero</p>
 

Para obetener si el usuario ya voto o no , deberias consultar el numero de resultados

[heinther]

Gracias por contestar chulifo.

Con respecto a lo que me dices, la segunda parte si la tengo controlada. Los votos que se realizan se van guardando en la base de datos.
En mi caso, se hace una consulta en la que se devuelve el numero de filas de la tabla "votaciones" en las que aparece el usuario y el objeto votado.
Si el número de filas es > 0 entonces sólo aparecen las estrellas y los votos totales. Si el numero de filas es = 0 entonces aparece lo anterior y la posibilidad de votar si te pones encima de las estrellas.

Mi problema sería más bien lo primero que has comentado.
Al entrar en la página (estando registrado por supuesto), te da la opción de votar (en caso de que no lo hayas hecho antes).
Y mientras no recargues la página puedes votar todas las veces que quieras y cada voto va a parar a la base de datos.
Cuando recargas la página ya si detecta que tienes votos en ese objeto y no te vuelve a dejar votar.

Por eso lo que busco es algo que sólo deje votar una vez mientras no se haya refrescado la página. Lo que propones del "onclick" lo veo bien, pero en mi caso las estrellas las estoy mostrando a través de los <div> ¿cómo podría añadirlo?

y luego ¿el código a escribir en javascript cuál sería?

Esa es mi duda exactamente.

Gracias.


EDITO:
He estado probando de muchas formas la función "document.getElementById" y sus derivados "document.getElementByClassName..." y no me han servido.
Cuando lo utilizo es cierto que soy capaz de cambiar la clase del div o la información que hay dentro. Pero por alguna razón que no comprendo el código sigue cambiando cuando paso por encima de las estrellas.

Hago otro mensaje que en este no me deja escribir todo.e.

[heinther]

Aquí mi codigo javascript

Código PHP:

  $(document).ready(function() {   
 
    // iteramos todos los elementos dentro del divValoracion       
    $('.divValoracion').each(function() { 
        var mazmorra = this; 
 
        // creamos el objeto JSON que enviaremos a la página PHP 
        var datos = { 
            mazmorra_id : $(mazmorra).attr('id'), // este es el id que mencionamos antes   
            buscar: 1 // indicamos que queremos obtener la información y no guardar un voto 
        }; 
 
        // cargamos datos del servidor utilizando un pedido HTTP POST 
        $.post( 
            '../paginas/votaciones/ratings.php', // archivo que va a recibir nuestro pedido                     
            datos, // el objeto que creamos antes 
 
            // función que se ejecutará cuando obtengamos la respuesta 
            function(INFO) { // INFO son los datos que nos devuelve la página PHP 
 
                // data es un método jQuery que nos permite asociar datos a un objeto del DOM 
                $(mazmorra).data( 'puntaje', INFO ); 
 
                // llamamos al método que carga los valores en las estrellas y la información 
                indicarVotos(mazmorra); 
            }, 
            'json' 
        ); 
    }); 
     
 
    // cuando pasamos el mouse por encima de las estrellas 
    $('.estrellasValoracion').hover( 
 
        // la función hover necesita que definamos dos funciones 
        // una para cuando el puntero del mouse se posiciona sobre el elemento 
        function() { 
 
            // dependiendo el div en el que nos encontremos, 
            // a todos los divs anteriores y al que tiene el mouse encima, les agregamos esta clase 
            $(this).prevAll().andSelf().addClass('estrellaVotar'); 
 
            // a los siguientes le quitamos esta clase 
            $(this).nextAll().removeClass('estrellaValoracion');  
        }, 
         
        // y una para cuando el mouse deja el elemento 
        function() { 
 
            // a todos los divs anteriores y al que tenía el mouse encima, les quitamos esta clase 
            $(this).prevAll().andSelf().removeClass('estrellaVotar'); 
             
            // llamamos al método que carga los valores originales de las estrellas 
            indicarVotos($(this).parent()); 
        } 
    ); 
 
    // este método es el que guarda el voto, al hacer click sobre una estrella 
    $('.estrellasValoracion').bind('click', function() { 
 
        // obtenemos la estrella sobre la que se hizo click 
        var estrella = this; 
 
        // obtenemos la mazmorra a la que pertenece la estrella 
        var mazmorra = $(this).parent(); 
         
        // creamos el objeto para enviar a la página PHP 
        var datosClick = { 
            clickEstrella : $(estrella).attr('class'), 
            mazmorra_id : $(estrella).parent().attr('id') 
        }; 
 
        // cargamos datos del servidor utilizando un pedido HTTP POST 
        $.post( 
            '../paginas/votaciones/ratings.php', // archivo que recibe nuestro pedido 
            datosClick, // datos que le enviamos a la página 
 
            // función que se ejecuta cuando obtenemos la respuesta 
            function(INFO) { // INFO son los datos que nos devolvió la página PHP 
 
                // data nos permite asociar datos a un objeto del DOM 
                mazmorra.data( 'puntaje', INFO ); 
 
                // llamaos al método que llena los valores 
                indicarVotos(mazmorra); 
            }, 
            'json' 
        );  
    }); 
     
         
}); 
 
// función encargada de tomar los datos que se obtuvieron de la página PHP 
// y cargar las estrellas correspondientes 
function indicarVotos(mazmorra) { 
 
    // extraemos la información guardada el objeto DOM donde está la mazmorra 
    // y creamos 3 variables para mostrar los datos 
    var promedioRedondeado = $(mazmorra).data('puntaje').promedioRedondeado; 
    var votos = $(mazmorra).data('puntaje').numeroDeVotos; 
    var promedioExacto = $(mazmorra).data('puntaje').promedioExacto;             
 
    // buscamos la estrella de la mazmorra que tenga el número igual al promedio redondeado 
    // de esa para atrás, les cargamos la clase estrellaValoración 
    $(mazmorra).find('.estrella_' + promedioRedondeado).prevAll().andSelf().addClass('estrellaValoracion'); 
 
    // a las que la suceden (si las hubiera) le quitamos la clase (por si la tenían) para que queden vacías 
    $(mazmorra).find('.estrella_' + promedioRedondeado).nextAll().removeClass('estrellaValoracion');  
 
    // mostramos la cantidad de votos y el promedio exacto 
    $(mazmorra).find('.votosTotales').text( votos + ' votos (' + promedioExacto + ')' ); 
}  
   

y aquí ratings.php

Código PHP:

  <?php 
 
    include "../../conexion.php"; 
    // se crea un nuevo objeto y le pasamos el id de la mazmorra que vino por el postback 
    $rating = new ratings($_POST['mazmorra_id']); 
 
    // si en el postback se indicó la variable buscar, obtenemos los ratings, sino guardamos el voto 
    isset($_POST['buscar']) ? $rating->obtenerRating() : $rating->votar(); 
     
    // definición de la clase 
    class ratings { 
             
         
        // el archivo donde guardamos los datos 
        var $data_file = './ratings.data.txt'; 
        private $mazmorra_id; 
        private $data = array(); 
         
        // el constructor de la clase va a recibir la mazmorra 
        function __construct($mazmo) { 
                 
            // guardamos la mazmorra en la propiedad 
            $this->mazmorra_id = $mazmo; 
 
            // file_get_contents devuelve lo que está en el archivo de texto a una variable string 
            $info = file_get_contents($this->data_file); 
             
            // si se cargó el archivo 
            if($info) { 
 
                // transformamos los datos planos a un array en php 
                $this->data = unserialize($info); 
            } 
        } 
 
 
        public function obtenerRating() { 
 
            // si en el arreglo con los datos del archivo txt (que se cargó en el constructor), está el id de la mazmorra 
            if($this->data[$this->mazmorra_id]) { 
 
                // devolvemos los datos de la mazmorra por JSON a la pagína 
                echo json_encode($this->data[$this->mazmorra_id]); 
            } 
            else { // caso contrario 
 
                // cargamos los datos de la mazmorra al arreglo, con los valores por defecto 
                $data['mazmorra_id'] = $this->mazmorra_id; 
                $data['numeroDeVotos'] = 0; 
                $data['votosTotales'] = 0; 
                $data['promedioExacto'] = 0; 
                $data['promedioRedondeado'] = 0; 
 
                // devolvemos el objeto recién creado por JSON a la página 
                echo json_encode($data); 
            }  
        } 
        public function votar() { 
            session_start(); 
            $link1 = mysqli_connect(SERVER, USER, PASS); 
            mysqli_select_db($link1, BD); 
            $query1 = "INSERT INTO votaciones VALUES(NULL,'".$_SESSION['idusuario']."','".$_POST['mazmorra_id']."')"; 
            $result1 = mysqli_query($link1, $query1); 
            // necesitamos saber qué estrella es la que se votó 
            // para eso, usamos preg_match, que realiza una comparación  
            // tomando la expresión regular, la cadena de entrada (la estrella en la que hizo click) y dejando el resultado en $resultado 
            preg_match('/estrella_([1-5]{1})/', $_POST['clickEstrella'], $resultado); 
 
            // guardamos el valor de la estrella 
            $votar = $resultado[1]; 
             
            $ID = $this->mazmorra_id; 
            // si existe la mazmorra en el arreglo (cargado en el constructor) 
            if($this->data[$ID]) { 
 
                // aumentamos el número de votos en 1 
                $this->data[$ID]['numeroDeVotos'] += 1; 
 
                // sumamos el voto a los votos totales 
                $this->data[$ID]['votosTotales'] += $votar; 
            } 
            else { // si no existe la mazmorra 
 
                // indicamos que es el primer voto 
                $this->data[$ID]['numeroDeVotos'] = 1; 
 
                // indicamos el número del primer voto 
                $this->data[$ID]['votosTotales'] = $votar; 
            } 
             
            // calculamos el promedioExacto 
            $this->data[$ID]['promedioExacto'] =  
                round( $this->data[$ID]['votosTotales'] / $this->data[$ID]['numeroDeVotos'], 1 ); 
 
            // redondeamos el promedio, para no tener que volver a hacerlo en la página 
            $this->data[$ID]['promedioRedondeado'] = round( $this->data[$ID]['promedioExacto'] ); 
                 
            // guardamos el arreglo en formato plano de nuevo en el archivo de texto 
            file_put_contents($this->data_file, serialize($this->data)); 
 
            // obtenemos el nuevo rating para enviárselo a la página 
            $this->obtenerRating(); 
        } 
    } 
?>   

Por último los cambios recientes que he realizado para intentar solucionarlo.
Es sólo un ejemplo de lo que hice, en realidad lo aplicaba a todo. Pero igualmente no me funcionaba.

Código PHP:

 <script> 
function myFunction<?php echo $idmazmorra_ ?>() { 
    document.getElementById("estrella1<?php echo $idmazmorra_ ?>").className = "estrella_1 estrellaSinValoracion"; 
} 
</script> 
<?php 
        echo "<div id='$idmazmorra_' class='divValoracion'>"; 
?> 
        <div id="estrella1<?php echo $idmazmorra_ ?>" class="estrella_1 estrellasValoracion" onclick="myFunction<?php echo $idmazmorra_ ?>()"></div> 
         <div class="votosTotales"  onclick="myFunction<?php echo $idmazmorra_ ?>()">Necesita más votos</div> 
<?php 
        echo '</div>'; 
?>   

donde $idmazmorra_ es la id de la mazmorra que la he guardado en esa variable.