I am recreating C2's dt [it's always 1 when conditions are perfect] My code works, but pls check.

  • var Delta_Time_Last_Update = Date.now();
    var Delta_Time_Now = 0;
    var Delta_Time = 0;
    
    var delta_time_enterframe_handle = requestAnimationFrame(delta_time_enterframe);
    function delta_time_enterframe(event)
    {
    	Delta_Time_Now = Date.now();
    	Delta_Time = (Delta_Time_Now - Delta_Time_Last_Update) / (1000/60);
    	Delta_Time_Last_Update = Delta_Time_Now;
    	
    	$("#delta_Time").html(Delta_Time);
    	
    	
    	delta_time_enterframe_handle = requestAnimationFrame(delta_time_enterframe);
    	//cancelAnimationFrame(delta_time_enterframe_handle);
    }

    This code works and almost always reports 0.969999998~

    Is this more or less the way Construct 2 get its dt ?

    Thanks !

  • <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Delta Time</title>
    <style type="text/css">
    body,td,th 
    {
    	font-family: consolas;
    	font-weight:bold;
    	font-size: 50px;
    	color: #F90;
    }
    body 
    {
    	border:0;
    	margin:0;
    	padding:0;
    	background-color: #000;
    	overflow:hidden;
    }
    #container
    {
    	width:100vw;
    	height:100vh;
    	display:grid;
    	place-items:center;
    }
    #delta_Time
    {
    	color:#7f84ff;
    }
    </style>
    <script src="jquery-1.11.1.min.js"></script>
    <script>
    
    var Delta_Time_Last_Update = Date.now();
    var Delta_Time_Now = 0;
    var Delta_Time = 0;
    
    var delta_time_enterframe_handle = requestAnimationFrame(delta_time_enterframe);
    function delta_time_enterframe(event)
    {
    	Delta_Time_Now = Date.now();
    	Delta_Time = (Delta_Time_Now - Delta_Time_Last_Update) / (1000/60);
    	Delta_Time_Last_Update = Delta_Time_Now;
    	
    	$("#delta_Time").html(Delta_Time);
    	$("#ball").css("left",(parseFloat($("#ball").css("left").replace(/[^-\d\.]/g, ''))+0.2)*Delta_Time+"px");
    	console.log($("#ball").css("left").replace(/[^-\d\.]/g, ''));
    	
    	delta_time_enterframe_handle = requestAnimationFrame(delta_time_enterframe);
    	//cancelAnimationFrame(delta_time_enterframe_handle);
    }
    </script>
    
    </head>
    
    <body>
    <div id="container">
    <table width="800px" border="1">
    <tr>
    <td align="right" style="color:#cc99cc;" width="330px">Delta Time:</td>
    <td>
    <div id="delta_Time" style="margin-left:7px;">
    0000
    </div>
    </td>
    </tr>
    </table>
    </div>
    <div id="ball" style="position:absolute; left:10px; top:10px; background-color:#0F0; width:100px; height:100px; border-radius:100px;"></div>
    </body>
    
    </html>
    
    
    I couldn't get it to work, deltatime is not accurate, if I remove delta time everything works perfectly.
    
  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • It's ok I have fixed it !

    Looks like my Delta time function works !

    Hopefully someone will find this useful.

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Delta Time</title>
    <style type="text/css">
    body,td,th 
    {
    	font-family: consolas;
    	font-weight:bold;
    	font-size: 50px;
    	color: #F90;
    }
    body 
    {
    	border:0;
    	margin:0;
    	padding:0;
    	background-color: #000;
    	overflow:hidden;
    }
    #container
    {
    	width:100vw;
    	height:100vh;
    	display:grid;
    	place-items:center;
    }
    #delta_Time
    {
    	color:#7f84ff;
    }
    </style>
    <script src="jquery-1.11.1.min.js"></script>
    <script>
    
    var Delta_Time_Last_Update = Date.now();
    var Delta_Time_Now = 0;
    var Delta_Time = 0;
    
    var delta_time_enterframe_handle = requestAnimationFrame(delta_time_enterframe);
    function delta_time_enterframe(event)
    {
    	Delta_Time_Now = Date.now();
    	Delta_Time = (Delta_Time_Now - Delta_Time_Last_Update) / (1000/60);
    	Delta_Time_Last_Update = Delta_Time_Now;
    	
    	$("#delta_Time").html(Delta_Time);
    	$("#ball").css("left",(parseFloat($("#ball").css("left").replace(/[^-\d\.]/g, ''))+(0.2 * Delta_Time))+"px");
    	console.log($("#ball").css("left").replace(/[^-\d\.]/g, ''));
    	
    	delta_time_enterframe_handle = requestAnimationFrame(delta_time_enterframe);
    	//cancelAnimationFrame(delta_time_enterframe_handle);
    }
    </script>
    
    </head>
    
    <body>
    <div id="container">
    <table width="800px" border="1">
    <tr>
    <td align="right" style="color:#cc99cc;" width="330px">Delta Time:</td>
    <td>
    <div id="delta_Time" style="margin-left:7px;">
    0000
    </div>
    </td>
    </tr>
    </table>
    </div>
    <div id="ball" style="position:absolute; left:10px; top:10px; background-color:#0F0; width:100px; height:100px; border-radius:100px;"></div>
    </body>
    
    </html>
    
    
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)