Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: EFEX en 23 Marzo 2018, 23:23 pm



Título: [Resuelto] javascript itinerancia de un objeto dentro de un timer
Publicado por: EFEX en 23 Marzo 2018, 23:23 pm
Tengo un intervalo de tiempo ejecutandoce que quiero coincidir con el tiempo transcurrido con un objeto, pero el tiempo trancurrido no coincide con el tiempo del objeto. Estoy pensando la mejor forma de hacerlo como se les ocurriria a ustedes realizarlo

Código
  1. var testJSON = {
  2.    "9352": {
  3.        "data": {
  4.            "x": 220,
  5.            "y": 188
  6.        },
  7.        "time": 9352
  8.    },
  9.    "9452": {
  10.        "data": {
  11.            "x": 221,
  12.            "y": 186
  13.        },
  14.        "time": 9452
  15.    },
  16.    "9954": {
  17.        "data": {
  18.            "x": 221,
  19.            "y": 184
  20.        },
  21.        "time": 9954
  22.    },
  23.    "10054": {
  24.        "data": {
  25.            "x": 221,
  26.            "y": 184
  27.        },
  28.        "time": 10054
  29.    },
  30.    "10154": {
  31.        "data": {
  32.            "x": 221,
  33.            "y": 183
  34.        },
  35.        "time": 10154
  36.    },
  37.    "10554": {
  38.        "data": {
  39.            "x": 220,
  40.            "y": 183
  41.        },
  42.        "time": 10554
  43.    },
  44.    "10654": {
  45.        "data": {
  46.            "x": 218,
  47.            "y": 182
  48.        },
  49.        "time": 10654
  50.    },
  51.    "10754": {
  52.        "data": {
  53.            "x": 217,
  54.            "y": 181
  55.        },
  56.        "time": 10754
  57.    }
  58. };
  59.  
  60. function handleActivity() {
  61.    var timeElapsed, activity, last;
  62.    var startingTime = Date.now();
  63.  
  64.    if (testJSON) {
  65.        activity = testJSON;
  66.        last = Object.keys(activity)[Object.keys(activity).length - 1];
  67.  
  68.        console.log('total: ' + Object.keys(activity).length);
  69.  
  70.        var timer = setInterval(function() {
  71.  
  72.            timeElapsed = parseInt(((Date.now() - startingTime) / 1000).toFixed(3).replace(/\./g, ''));
  73.  
  74.            if (true) {
  75.                console.log(activity[timeElapsed]);
  76.            }
  77.  
  78.            if (last <= timeElapsed) {
  79.                clearInterval(timer);
  80.            }
  81.  
  82.        }, 100);
  83.    }
  84. }

Se ejecutara por 10s cuando termina deberia mostrar los 8 objetos encontrados pero como el intervalo se saltea ciertos numeros no mostrara nada o solo alguno de los 8.
Ya estoy cansado no puedo pensar mas  ;D


Título: Re: javascript itinerancia de un objeto dentro de un timer
Publicado por: #!drvy en 24 Marzo 2018, 00:25 am
Creo que lo tienes crudo.

Ningún navegador da timestamps seguidos.. algunos incluso se saltan varios ciclos para ahorrar batería.. aparte, tenemos en cuenta que cada operación tarda X tiempo en realizarse (el calculo de timeElapsed pj) y eso añade tiempo perdido.

¿ Para que necesitas el timer exactamente ? Quizás podamos encontrar alguna alternativa.

Saludos


Título: Re: javascript itinerancia de un objeto dentro de un timer
Publicado por: EFEX en 24 Marzo 2018, 01:16 am
Trato de obtener la posicion del mouse, guardarlo y despues recrearlo. Queria ser algo mas preciso con el tiempo, pero creo que mejor seria dividir el tiempo en segundos ? o llegare al mismo problema?


Título: Re: javascript itinerancia de un objeto dentro de un timer
Publicado por: #!drvy en 24 Marzo 2018, 02:19 am
Lo único que se me ocurre es ampliar el tiempo entre capturas a un valor seguro.. quizás 500ms podría valer.. pero se pierde precisión :/

Saludos


Título: Re: javascript itinerancia de un objeto dentro de un timer
Publicado por: [u]nsigned en 24 Marzo 2018, 02:36 am
Lo correcto seria capturar el evento mouve del mouse y asyncronicamente (promise) guardar las coordenaas en un array. Asi es mas fluido y no bloqueante,


Título: Re: javascript itinerancia de un objeto dentro de un timer
Publicado por: [u]nsigned en 24 Marzo 2018, 02:39 am
Aca hay un ejemplo, en vez de aplicarlo dentro del cuadrado deberias hacerlo en body o html

https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onmousemove


Título: Re: javascript itinerancia de un objeto dentro de un timer
Publicado por: EFEX en 28 Marzo 2018, 13:02 pm
Al fin pude con esto de la siguiente forma..

Código
  1. var testJSON = {"9352":{"data":{"x":220,"y":188},"type":"mouseMove","time":9352},"9452":{"data":{"x":221,"y":186},"type":"mouseMove","time":9452},"9954":{"data":{"x":221,"y":184},"type":"mouseMove","time":9954},"10054":{"data":{"x":221,"y":184},"type":"mouseMove","time":10054},"10154":{"data":{"x":221,"y":183},"type":"mouseMove","time":10154},"10554":{"data":{"x":220,"y":183},"type":"mouseMove","time":10554},"10654":{"data":{"x":218,"y":182},"type":"mouseMove","time":10654},"10754":{"data":{"x":217,"y":181},"type":"mouseMove","time":10754}};
  2. var elapsedTimeReplay = 0;
  3. //Copiamos nuestro objeto y paso a array
  4. var activitySession = Object.values(testJSON);
  5.  
  6. function handleActivity(){
  7.  if (Object.keys(testJSON).length > 0 ) {
  8.  
  9.    //Borrar el primer elemento de nuestro array
  10.    var parts = activitySession.splice(0, 1),
  11.        currentTime;
  12.  
  13.    currentTime = parts[0].time;
  14.  
  15.    setTimeout(function(){
  16.  
  17.      //handleMouseEmulated
  18.      console.log('move mouse ' + testJSON[currentTime].time);
  19.  
  20.      elapsedTimeReplay = currentTime;
  21.      handleActivity(); // Siguiente elemento de nuestro array
  22.  
  23.    }, currentTime - elapsedTimeReplay);
  24.  
  25.  }
  26. }
  27.  
  28. handleActivity();