Fengist's Forum Posts

  • Ok, that was it. About a month ago I did some 'tweaking' to the HTMLElement plugin to fix a similar problem to the one I've been describing. I did this 'tweaking' on the desktop.

    I blindly made the assumption that since I was using a cloud based app, that if I installed a plugin when I ran it on one machine that the same plugin would be on the other machine. As you can see, it's taken me two days of desk-facing to come to that conclusion.

    I looked at the changes to the plugin code I made on the desktop a month ago, it's the same changes I made today on the laptop to solve the above problem.

    At least now, I can get back to creating the game an not smacking my forehead.

  • You do not have permission to view this post

  • Ok, this nightmare has got me to seriously thinking about it. By tinkering with the code above I have it solved on the machine where it was giving issues. Later I'll be testing it on the other machine to see if it works.

    Here's the BIG question.

    When I install a plugin, does that plugin go to the cloud or does it stay on the specific machine.

    For example, I installed this 'fixed' plugin on my laptop. Later, when I go home and fire up C3 on the desktop does that 'fixed' plugin code magically appear on the home machine?

    If not, THAT may be the cause of all my problems as I've tinkered with this plugin code before and likely have 2 different installs. And if so, THAT... was unexpected.

  • More digging.

    It appears the plugin is changing that CSS. Here's the code it's using to determine the height and width for that CSS. Unfortunately, I don't know JS that well. If anyone could look over this and see if this somehow explains why the height and width on one computer is different from another.

     DrawSize()
     {
    
     if (!this.domStructure.useC3size) return;
    
     const exWidth = Dom.width(this.el);
     const exHeight = Dom.height(this.el);
    
     const wi = this._inst.GetWorldInfo();
     const layer = wi.GetLayer();
    
    
     const myinstance = this._inst.GetWorldInfo();
     const instWidth = myinstance.GetWidth();
     const instHeight = myinstance.GetHeight();
     const newWidth = Math.abs(layer.LayerToDrawSurface(instWidth, 0)[0]);
     const newHeight = Math.abs(layer.LayerToDrawSurface(0, instHeight)[1]);
    
     if (exWidth !== newWidth || exHeight !== newHeight || this.memory.resizeWindowForSize)
     {
     this.memory.resizeWindowForSize = false;
     this.SetStyle(
     {
     'width': newWidth + 'px',
     'height': newHeight + 'px'
     });
     }
     }

    In the constructor it's setting this.memory.resizeWindowForSize here

     this.memory = {
     // objectModel
     instVarNames: getArrayFromString(proprieta(contatore, "[]")),
     objectStore: getArrayFromString(proprieta(contatore + 1, "[]")),
     text: "", // per modificare il contenuto del dom solo quando il text cambia
     resizeWindowForSize: true,
     resizeWindowForPosition: true,
     resizeWindowForRotation: true,
     resizeWindowForFontSize: true,
     lastFileURL: "",
     lastBLOB: "",
     lastBase64: ""
     };

    and here

     window.onresize = () => {
     this.memory.resizeWindowForSize = true;
     this.memory.resizeWindowForPosition = true;
     this.memory.resizeWindowForRotation = true;
     this.memory.resizeWindowForFontSize = true;
     };
  • Browser.ExecJS("Date.now()")

    will get you the number of milliseconds since 1/1/1970. If say you wanted a 30 second shot clock, you add 30000 to that number then look to see if the current time <= to the shot clock.

  • Wow, but I see what you're saying.

    I have an on browser resize event that calls a function to handle the resizing. I also call that function on the start of any layout.

    I did some testing and put the ViewportLeft and ViewportWidth into a text box just before it called the function. Well into the function is where I resize one of the HTMLElements and I grabbed the ViewportLeft and Width again and put them in a different text box. If I slowly resized I was seeing maybe a 0.5 - 3px difference. But, if I did a quick drag and release resize, I was seeing 50-100px differences.

    If I clicked on the full-screen request button, the px differences were pretty huge, like 500px+

    Now, whether this is affecting that CSS div, I dunno.

  • Good guess but no difference. I even bumped it to a full second. The skillsbox according to the debug is staying at a 950px width. But, that CSS div that's getting inserted above it is changing based on the browser size. But only on the laptop. The desktop, the CSS stays at 950px.

    Damned befuddling.

  • Really? Ok, I'm off to experiment because that kinda makes sense. The machine where it works perfect is an 8 core 4ghz with 32gb ram. The other machine is just an old dual core laptop with 4 gigs.

    I'll let you know the result.

  • Yep, took your suggestion, made one catchall event and checked the tag. Worked great.

    But, as it turns out, that wasn't the cause of all the checks going on. It was JSON checks for keys. Unfortunately, there doesn't seem to be an onParsed event for JSON. So I'm checking every cycle to see if any of several keys exist which only exist when the Ajax gets a response and then, I have to delete the key to keep them from being true every cycle.

    Thanks again though.

  • Ok, that makes sense. I was trying to put an Ajax on event inside another ajax on event.

    Thanks.

  • Was watching my code in the debugger. I have several Ajax events that keep firing even when there's no Ajax request being sent. So, I thought I'd streamline things a bit and create an Ajax On Any Completed and then, move all of my Ajax On Completed events under it. That way, the code isn't constantly checking half a dozen events and is instead, checking just one.

    Well, I was surprised to find out that I can't make an Ajax event a sub event.

    So, I thought I'd be clever. I'd create a function and On Any Completed, I'd call the function to see which Ajax event completed. Wrong. Apparently you can't even make any Ajax event part of a function.

  • Still trying to figure this out. Here's some more details:

    Taking a look at the HTML in Chrome developer there is a 'div' for most every element. The div for the skillbox looks like this:

    <div sa-uid="53" id="" style="font-family: Arial; font-size: 12px; color: rgb(0, 0, 0); font-weight: normal; font-style: normal; text-align: center; border-radius: 0px; padding: 0px; overflow: hidden scroll; transform-origin: left top; opacity: 1; position: absolute; left: 460px; top: 393px; width: 950px; height: 376px; transform: rotate(0deg);">
    

    Of note is the width: 950px. On one machine, with the same construct code mind you, that width stays at 950. On another machine, that width changes based on how wide the browser is.

    So my question now is, what sets the CSS properties for this 'div' and why is it changing on one computer and not the other? Does the plugin set these CSS styles or does Construct?

    I've also checked, both computers are using the latest version of Chrome.

    Chrome warning note to self when I check other machine: [C3 preview] Browser opened wrong size popup: wanted 1600 x 900, got 1584 x 821; resizing to compensate.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads
  • I agree with AllanR. You're using local storage like a variable. It should be used for saving things that you want to remember when the user quits playing so that you have that info the next time the user starts the game. You should load them on start of layout and save them only when you need to. The rest of the time, just use a global or local variables.

  • I believe, Chrome mandates that a user press something before it goes full screen.

  • Ok, it's becoming apparent this is peculiar to the HTMLElement plugin but I can't understand why.

    Here's an image of both the SkillsBox and the SkillsInfo box selected in debug. The box sizes appear to be correct but apparently the contents are getting scaled down depending on the browser size.

    What I don't understand is why on one machine this scaling is taking place but not on another. Any ideas?