googlechromelabs / airhorn Goto Github PK

I'm displaying desktop notifications when push requests come from GCM, but haven't succesfully played a sound when browser receives it, can you give me more information about how to achieve that...

Here is my sample:

self.addEventListener('push', function(event) {
    event.waitUntil(
        self.registration.showNotification("Title", {
            body: "body",
            icon: 'img/logo.png',
            vibrate: [200, 100, 200, 100, 200, 100, 200],
            requireInteraction:true,
            tag:"my-tag",
            sound:"notify.mp3"`,
            silent:false
        });
    );
})

Just need to clean up the code a bit and remove the stuff that isn't core.

Google docs says it will be called only once in 3 months.
If dismissed by a user, it will not be shown until a sufficient period of time (~3 months) has passed.

https://developers.google.com/web/updates/2018/06/a2hs-updates

const beforeinstallprompt = function(e) {
promptEvent = e;
promptEvent.preventDefault();
ga('send', 'event', 'install', 'available');
root.classList.add('available');
return false;
};

window.addEventListener('beforeinstallprompt', beforeinstallprompt);

It's because I have a timestamp on the URL and then use ignoreSearch and a host of other reasons.

Best thing, is make a specific cache per version of the App and just target that for the reqeusts.

While running through the tutorial I ran into the issue where after I switched branches (master > code-lab) the tutorial continued running offline because Chrome still had the service worker registered in memory. Might be helpful to add some quick instructions for unregistering it if others run into that issue:

If you do not get an error screen this is because the Service Worker needs to be unregistered. Open up the Chrome devtools and under Sources > Workers, click the Unregister button next to sw.js. Refresh the page, and you should get the standard error.

At a certain point of the tutorial it says "add the following code.".
But there is no code.

Needs visual focus and keyboard access to cover minimal usability and accessibility use cases. Name role and state could be enhanced with aria role of button to improve those use cases.

Hey, while reading your article here:
https://developers.google.com/web/fundamentals/codelabs/offline/

I've visited the repo in order to take a look at the cache-polyfill and was suprised I found it only in Removal commit message. Maybe it would be good to remove it from the code provided in the article as well.

Clicking with 2 mouse buttons simultaneously causes the sound to play forever, even after release of both mouse buttons.

Clicking this way multiple times causes the long airhorns to stack and eventually sound really bad.

Hi,

Just wondering if there is an advantage to use an XMLHttpRequest for the airhorn sound effect rather than the native Audio API? I guess compatibility could be an issue, but it seems very well supported:
http://caniuse.com/#feat=audio

Hi, I cloned the contents of app folder (airhorn/app/*), the app works on the domain but the service worker doesn't. opening the progressive app offline doesn't work. It shows the internet disconnected error. Should I take any other steps ? As I understand these mentioned are optional.

Working on Apache server, Derbian.

Unless the project were to move to an automated build-time solution, like sw-precache, it's necessary to bump the version number in sw.js in order to trigger the SW update flow.

If a developer makes any local changes to resources and then fails to bump the version, their existing users will be stuck indefinitely with the old resources due to the cache-first strategy that's being used.

Given the importance of understanding versioning, it would be ideal to explicitly call this out in the README.md.

Many of the URLs within the source are absolutely, starting with /. This makes it more difficult than it needs be to deploy somewhere that isn't the root of a domain.

E.g. xhr.open('GET', '/sounds/airhorn.mp3' ); would be more flexible if it were xhr.open('GET', 'sounds/airhorn.mp3' );

There's another case where / is used as the scope for the SW registration, and that's an anti-pattern. / will never be valid unless the registering page is also served from the top-level, and if that's the case, you might as well just leave it with the default scope of ./.

Since the SW uses a cache-first strategy that will never check for updates to resources outside of the install handler, it's crucial that the HTTP request made during the install handler goes directly against the network, and doesn't return a response from the browser's cache. In order to ensure this, a cache-busting URL parameter can be added to each URL.

This is something that sw-precache takes care of automatically.

There is no description of how to run the run/deploy the project. Would be nice to have a more detailed README that addresses this issue.

Hi,

Not sure this is a place to ask questions and if not apologies and could you direct me to a more appropriate forum. Thanks.

One general issue (not with this code per-se but related to service worker caching in general) that i see is that some files get loaded twice - specifically those links and scripts which are in the doc head section and then again in the set of files that are to be cached during the service worker install. For example the script <script src='/scripts/pwacompat.min.js' async></script> is loaded at the end of and is also in the cache.addAll of the install.

So, what seems to happen is that the files that are loaded by the browser because they are linked in the head section get loaded before the install event occurs for the service worker and then get loaded again during the install process to put them in cache.

Am I understanding this correctly and if so, is there a particular strategy to follow to minimize or avoid this?

Chromecast and Chromecast built-in devices uses Chrome to open the receiver files. In some devices it isn't possible to play videos because Chrome requires a user click and, obviously, it's impossible.

The videos only play if we set in muted mode and pauses when we try to unmute.

The allow="autoplay;" attribute for iframe tag doesn't run in all Chromecast. It looks as depending chromecast type it uses different Chrome versions.

I've put together a version of Air Horner that uses sw-precache to handle generating and versioning the service worker for the static resources the site uses. You can check out the changes in https://github.com/GoogleChrome/airhorn/compare/master...jeffposnick:master?w=1 and I have it deployed at https://jeffy.info/airhorn/

I have a feeling that @PaulKinlan wants to keep this repo using a "vanilla" SW, in which case the issues identified at #9 and #10 should probably be resolved independently (I'm happy to take care of them). But I wanted to at least propose using sw-precache, since I do think it avoid these common pitfalls and pointing developers to it from the get-go can lead to a better overall experience, especially as the size and complexity of a static site grows.

I appreciate the sample code but this airhorn made me jump off my chair.

Hi,
tried to change the color of the text showing in the slash color but did not find any explication:
default : with “background_color”: “#2196F3” in manifest.json

edited : “background_color”: “#FFFFFF” in manifest.json

So from where does the text get its color?