joda

Members
  • Content Count

    6
  • Joined

  • Last visited

About joda

  • Rank
    Newbie

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. //main script var action = "stop"; function update(){ otherScript.update(whatDoIWriteHere); } update(); //other script export class OtherScript { update(mainScript) { mainScript.action = "go"; } } I'd like to set up my code to work this way, mainly to keep my code cleaner. Note the "whatDoIWritehere" above. I've tried to google around and get a simple answer, but it's pretty tricky. Any help here? Thank you!
  2. Never mind. The problem was within my own drawing code, not the deltaTime.
  3. requestAnimationFrame(update); var lastTime = 0; var deltaTime = 0; function update(timeStamp) { // deltaTime = timeStamp - lastTime; lastTime = timeStamp; // requestAnimationFrame(update); } I'm building an html5 browser game (without phaser or pixi) I'm having problems with getting consistent deltaTimes with this very simple example. I get different results based on what platform I use: my PC: ~16 my iPhone ~11 my Mac using Firefox: 24-27 This obviously has a giant impact on how the game displays. What am I doing wrong? Tried searching around, but can't find any answers. What can I do to get consistent deltaTimes?
  4. Here are some more details about what I'm looking for. This is not developed in phaser or pixi. I have 2 bits of code that help this work. The first is on index.html. It only works on iphone which is part of the problem. This second script is in index.js. It changes the size of the canvas to the browser size. Not sure if this is the smartest way to deal with things, but this is the best solution I was able to come up with. <script> //a window.document.addEventListener( "orientationchange", function() { var iOS = navigator.userAgent.match(/(iPad|iPhone|iPod)/g); var viewportmeta = document.querySelector('meta[name="viewport"]'); if (iOS && viewportmeta) { if (viewportmeta.content.match(/width=device-width/)) { viewportmeta.content = viewportmeta.content.replace( /width=[^,]+/, "width=1" ); } viewportmeta.content = viewportmeta.content.replace( /width=[^,]+/, "width=" + window.innerWidth ); } // If you want to hide the address bar on orientation change, uncomment the next line window.scrollTo(0, 0); }, false ); </script> function resizeCanvas() { if (mobile === true) { var cWidth = window.innerWidth / window.devicePixelRatio; var cHeight = window.innerHeight / window.devicePixelRatio; var cAspectRatio = originalHeight / originalWidth; canvasWidth = cTargetWidth * bbScale; canvasHeight = cTargetHeight * bbScale; canvasWidth2 = cTargetWidth * bbScale; canvasHeight2 = cTargetHeight * bbScale; if (cWidth > cHeight) { var cTargetHeight = cWidth * cAspectRatio; var cTargetWidth = cWidth; } else { cTargetHeight = cHeight; cTargetWidth = cHeight * cAspectRatio; } let cCanvas = document.getElementById("gameScreen"); cCanvas.width = cTargetWidth; cCanvas.height = cTargetHeight; var dpr = 1 / window.devicePixelRatio; ctx.scale(cTargetWidth / originalWidth, cTargetWidth / originalWidth); window.ctx = ctx; } } Right now this does not work on android due to the first one. I've also seen it have problems on iphone 10+ Each browser has very cryptic quirks that I need help overcoming. If you are familiar with these quirks please reach out.
  5. I'm a former Flash person that has just built my first html5 browser game for a client. Everything is running great except that I don't seem to be able to get it to size properly on all mobile platforms. I can get it to size properly on Safari & iPhone, but that's about it. I'm looking to pay $100 for someone to make my game responsive on mobile (iphone, android, etc) in as many browsers as possible. I'd also like you to explain it to me in the end. This is flat rate job. I am paying for results and not time. Please contact jason@jasonoda.com if interested. Thank you.