GithubHelp home page GithubHelp logo

Comments (9)

rchl avatar rchl commented on June 10, 2024

Are you sure this information is up-to-date? Chrome didn't seem to require a service worker and Samsung browser is based on Chromium. Of course they could have changed that condition but not sure why would they.

Can you check on Chrome browser if you can install it?

from tileboard.

akloeckner avatar akloeckner commented on June 10, 2024

It appears, there is a difference between those two constructs:

  • add to home screen adds a shortcut to the home screen, i.e, the pages that hold such shortlinks or widgets. It will open the TileBoard page in full screen mode as intended. But it cannot be moved to the "app screen", which is "hidden" by a gesture behind the home screen. So, this is basically a widget-like thing and even displays with a small Chrome or SamsungInternet icon. This shortcut can be generated by both Chrome and Samsung Internet. In both apps we need to open the menu and select the appropriate action.
  • install in app screen actually installs an app-like thing, i.e. it will show up in the list of installed apps both in the "app screen" but also in the Android settings. It will do the same thing as the shortcut above. But it starts out on the hidden app screen and can be added to the "home screen" if desired. This shortcut does not seem to be an option in Chrome. In Samsung Internet it is just a matter of clicking the appropriate icon in the browser address bar.

That's what I found out by testing on my device. I cannot find any official info on this.

So, this seems to be an additional option in Samsung Internet. I noticed, because HA itself does provide the option to "install in app screen". I know that HA has a service worker. So, I think it is plausible, that this is the requirement we don't fulfil.

from tileboard.

akloeckner avatar akloeckner commented on June 10, 2024

I did some more research and think, what I would like to see is ambient badging and installation as a WebAKP, which come with some requirements,

I also found out, that Chrome and Edge can install pages as apps even on Windows and Linux. I verified with both, that HA itself shows an installation symbol in the address bar while we don't. Maybe this will help with finding out, what is different...

grafik

grafik

I did try to fulfil all requirements in a test setup, and I cannot get it to show the badge. But I'm just taking stabs, actually, especially on the service worker bit...

from tileboard.

akloeckner avatar akloeckner commented on June 10, 2024

Being able to test on a laptop really helped...

I now have a working version at https://github.com/akloeckner/TileBoard/tree/feat/webapk !

What did I change? I followed this advice: https://web.dev/install-criteria/

  • add a dummy ServiceWorker with fetch handler
  • add start_url in manifest
  • add a 512px favicon and actually increase the favicon size

I could clean this up and start a PR. But I'd appreciate a brief hint on

  • best practices to unregister the service worker.
  • anything you notice already that could trip me off in the wrong direction.

from tileboard.

rchl avatar rchl commented on June 10, 2024

I suppose you could create PR for it if you care about it.

Some quick comments after looking at your changes:

  • It would be nice if the 512px image would be made natively and not just blurry scaled one :)
  • We would have to think about the addon variant of Tileboard. It would ideally not set up the service worker when running in ingress
  • Maybe the service worker should only be enabled on the path where tileboard is running from (location.pathname?).
  • Obviously there should be no alert's in production code :)

from tileboard.

rchl avatar rchl commented on June 10, 2024

I could clean this up and start a PR. But I'd appreciate a brief hint on

* best practices to unregister the service worker.

* anything you notice already that could trip me off in the wrong direction.

I don't really have experience with service workers but I don't think we'd need to unregister the service worker. I don't see any specific time that would be good for doing that.

from tileboard.

akloeckner avatar akloeckner commented on June 10, 2024

Thanks for your comments and I agreee with them. I'll give it a try later.

I did not understand the comment about the add-on and ingress, though. We could prevent the service worker from starting up in the add-on, if there is a way to detect that case. I don't have enough insight in the way add-ons work to judge if this differenciation is necessary. A quick search gave me at least one add-on with a service worker. As it's announced by frenck, I'd assume, that this is a sound add-on. I'll try and see, how they handle service workers in their add-on, and then I'l make a prposal PR.

from tileboard.

rchl avatar rchl commented on June 10, 2024

Since our service worker would be a dummy and added just for the purpose of enabling app install, it shouldn't be needed when running in ingress as then we are running in a home assistant frontend that already has a service worker.

As for detecting ingress, we do something like that already in a way.
For example there are these variables in the index file:

TileBoard/index.html.ejs

Lines 33 to 38 in f4c537a

<script>
window.AUTH_TOKEN_OVERRIDE = null;
window.SERVER_URL_OVERRIDE = null;
window.REST_URL_OVERRIDE = null;
window.WS_URL_OVERRIDE = null;
</script>

that are rewritten when running as an addon:
https://github.com/resoai/TileBoard-addon/blob/f635379f2eb4b82999e31c2f77d56539832f7d38/addon/rootfs/etc/nginx/templates/direct.gtpl#L22-L26

So we could create a variable like IN_INGRESS and rewrite it to have true value when running in ingress.

from tileboard.

akloeckner avatar akloeckner commented on June 10, 2024

:-) OK. Looks really hacky. But sure, that will do. I'll add that logic.

from tileboard.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.