Obtener valor actual. Jquery+websocket

EmpireFX · #1 (**permalink**) 17/11/2013, 16:08

Hola hace un rato estoy haciendo un juego simple de estrategia... estoy utilizando websocket para realizar la conexion entre el cliente y el servidor. En la parte del cliente no puedo obtener la respuesta actual del servidor.

Aca hice un resumen del cliente, pueden problarlo.

Código HTML:

Ver original<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
        <script type="text/javascript">
            localStorage.lastresponse = 'old';
 
            function init(){
                var host = "ws://echo.websocket.org";
 
                socket = new WebSocket(host);
                socket.onopen    = function(msg){log("Welcome - status "+this.readyState); };
                socket.onmessage = function(msg){
                    localStorage.lastresponse = msg.data;
                    log("Received: "+msg.data); 
                };
                socket.onclose   = function(msg){log("Disconnected - status "+this.readyState); };
            }
 
            function log(msg){var log = document.getElementById("log"); log.innerHTML+="<br>"+msg; log.scrollTop = log.scrollHeight;}
 
            function send_msg(msg){ log('Sent: '+msg); socket.send(msg); }
 
            $(document).ready(function(){
                $('.boton').on('click', function () {
                    $('.map').unbind().on('click', function (e) {
                        send_msg('Rock it with HTML5 WebSocket');
                        alert(localStorage.lastresponse);
                        //console.log(localStorage.lastresponse);
                        //delete localStorage.lastresponse;
 
                        e.stopPropagation();
                    });
                });
            });
        </script>
        <style type="text/css">
            .map{width: 200px;height: 200px;background-color: green;}
            #log{width: 400px; height: 120px;overflow-y: scroll;}
        </style>
    </head>
    <body onload="init()">
        <div class="map"></div>
        <div id="log"></div>
        <br>
        <button class="boton">Crear unidad</button>
    </body>
</html>

Creas una unidad y seleccionas que parte del mapa(cuadro verde). El problema es que muestro por pantalla el valor anterior de localStorage.lastresponse, no el actual(siendo la respuesta actual del servidor que deberia ser 'Rock it with HTML5 WebSocket').

Estube probando varias cosas pero sin resultado, espero que alguien me guie y mejor si explica el porque, que no logro entenderlo del todo.

Saludos

EmpireFX · #2 (**permalink**) 20/11/2013, 15:00

Ya lo solucione haciendo un callback.

Código Javascript:

Ver originalfunction send_msg(msg, callback){
   socket.send(msg);
   socket.onmessage = function(got){
      callback(got);
   };
}
 
var msg = 'Esperar a que termine send_msg();':
send_msg(msg, function(respuesta){
    alert('El servidor respondio: '+respuesta);
};