How to remove the startup animation in the web interface

[albar965]

@KOKAProduktion or @u-an-i

How to remove the startup animation in the web interface? It seems to cause issues for some users.

https://www.avsim.com/forums/topic/657236-help-keep-little-navmap-for-msfs-2024/page/2/#findComment-5358644

Alex

[u-an-i]

Hi @albar965 ,

there is no way.

I created this PR #1239 which removes it.

It is the first thing which happened. I have no idea to offer to skip it before it happens.

We can offer to run it after an option gets selected after the web page already loaded. Appears a bit pointless. We could offer "show me a nice animation" option or move it to an easter egg if you like it to be still viewable.

Currently it was always only shown once on first page load until the webbrowser cache got cleared (localStorage in particular).

The user's described issue lets me assume some unfortunate other issue is behind this: for the startup animation to show 2 things must be: 1. the cache is empty. 2. the page gets loaded.
The cache gets filled after first page load. Thus for the described issue to occur the cache must have either been not written to or was cleared AND the page gets reloaded immediately after it loaded.
Cache not getting filled can be an (extreme) security setting (in some/one browser).
Cache getting cleared on every browser close can be a browser setting (I believe Chrome-based / Firefox have).
Now looped reloading would be unintended and likely caused by some error somewhere which isn't caught in the code. I can guess the map server image not delivered (due to some tight security setting) results in some error which isn't caught although I would be surprised about if I do not catch something like that, that it crashes the code and causes a page reload.

If the users still experiences that issue after the fix applied investigation would have to occur which runs deeper. Likely some setting on the users browser/machine must be changed to make the web interface work but once we have discovered what exactly goes wrong I/we can attempt to prevent it resulting in an endless loop.

[albar965]

Just checked. The logo still pops up briefly. Not sure if I merged correctly but using

    <div id="interactionParent" style="flex:1 0">
      <div id="mapcontainer" onclick="handleInteraction(event)"></div>
    </div>

leaves the map window empty and

    <div id="interactionParent" style="flex:1 0">
      <div id="mapcontainer" onclick="handleInteraction(event)">
        <img id="map" src="/images/littlenavmap.svg" alt="Map" style="display:block">
      </div>
    </div>

shows the logo.

[u-an-i]

@albar965 the upper code is as intended.

I don't have a logo with it: the element is gone, there "can't be" a logo.
The initial map image has to load into the container: during this time the window might be white, i estimate this to last only a few ms at worst, I don't experience this white window, at least I don't get aware of it or remember.

Do you have a different experience?
Can you share a screen recording ? :|

[albar965]

the upper code is as intended.

Then it looks like I broke the merge. I'm lousy at merging. Anyway, the code below leaves a white map page

...
        <iframe src="about:blank" id="preventstandbyVideoContainer" title="cachable standby prevention resource"></iframe>
      </div>
    </div>
    <div id="interactionParent" style="flex:1 0">
      <div id="mapcontainer" onclick="handleInteraction(event)"></div>
    </div>
    <script>
      parent.MAP_VERSION = 1;
      parent.attemptRun("findPlugins");
    </script>
  </body>
</html>

All site data deleted before:

[albar965]

Let's leave it as it is for now. The blinking logo should hopefully cause no problems for users or add-ons.

[u-an-i]

hi @albar965 ,

I installed the lastest beta of lnm and copied over the web folder from the release/3.0 branch which contains the 2 new branches, which remove the logo and skip the animation, correctly.

On a new system, as well as on my old system, the web interface works correctly with regards to the intention of there being no logo and no animation but the map instantly.

The map ought to show for you too when you use the release/3.0 web folder. If not, I'm intrigued to find out why. There is no new code and the old code contains no "trickery", "dependencies" or "parallelisms"; it's simple code which should request the map image and put it into the container. Code which I expect to work and whose type code I would write in the future is the same of.
Can you identify whether the map image and its src is present and loaded and what the styling of that image and its parents is ?

[albar965]

Apologies for bothering you again @u-an-i

It seems that a higher screen scale on Windows messes up the web interface although I could not reproduce this using a 150 percent scale on Windows here.

https://www.avsim.com/forums/topic/652836-little-navmap-3012-released/page/2/#findComment-5363213

Maybe you have an idea.

[albar965]

It seems that QWidget::grab() multiplies the image size with the QPaintDevice::devicePixelRatioF()

So all images are bigger than expected for the web interface and image export. I simply reduce size of the widget before calling grab as a workaround.

Need to fix one more bug with image export creating too big images (i.e. area on the globe) before committing.

[u-an-i]

@albar965 although I like retina image getting delivered when scaling > 100%.

It wouldn't need to be 2x for 150% and it can be also > 1x for 125 %, so this I can request from the frontend. devicePixelRatio is the JS property to query.

[albar965]

150% = ratio of 1.5 . I can test only with Windows and Linux. No need for a high DPI screen.
The ratio entirely depends on what is set on the computer running LNM. The value is set for the whole application and cannot be changed for single widgets. Therefore, no use requesting it from the frontend except for manual scaling after drawing. But manual scaling would result in lower image quality.

You can also use the environment variable for Qt in LNM for testing: QT_SCALE_FACTOR=2 or QT_SCALE_FACTOR=1.5

[u-an-i]

oh, I meant delivering a request to the server which contains the size of the to be delivered image as the exact pixel size of the display area. You would always deliver exactly what the frontend requested, so 1x.

[albar965]

That's the plan. 🙂 You'll get the pixel size you request.
I cannot guarantee that it looks the same.