

Heyoffline.js warns your users when their network becomes unreachable - wassago
http://oskarkrawczyk.github.com/heyoffline.js/

======
chrisacky
Today I learnt something that I didn't know exist, so i'm actually really glad
that you linked this project, it made me look for details on the
spec/standard.

First of all, I looked through your code and couldn't understand how this was
implemented. After I found it and researched, it's clear that it's essentially
useless[1].

I'm not bashing on your project, I like it, but aside from being a cool
gimmick, I can't think of any real world usages?

...Unless your application is LAN-based , offline-heavy, or your have pixies
that run around your office pulling out your network cable regularly *
chuckles *.

I'll explain, but please correct me if I am way off the mark.

The project connects to the network events

    
    
         this.events = {       
            network: ['online', 'offline']
          };
         
    

These events fire from observing the attribute

    
    
        window.navigator.onLine
    

This attribute returns true, when the system is connected to a network, but
returns false when it isn't.

The importance of this is that the attribute is inherently unreliable. A
computer can be connected to a network without having Internet access. [2]

This is a barebones minimal example that doesn't have the features you added:

    
    
       <!DOCTYPE HTML>
        <html>
         <head>
          <title>Online status</title>
          <script>
           function updateIndicator() {
             document.getElementById('indicator').textContent =
                           navigator.onLine ? 'online' : 'offline';
           }
          </script>
         </head>
         <body onload="updateIndicator()" onoffline="updateIndicator()">
          <p>The network is: <span id="indicator">(state unknown)</span>
         </body>
        </html>
    

You can see the fiddle here: <http://jsfiddle.net/3rRWK/>

If you disconnect yourself from your network you will see the fiddle update to
"Offline", however, if you pull your phone-line from your router, it will
still stay at "Online".

    
    
        [1] : It's inherently unreliable. 
              A computer can be connected to a network without internet access.
        [2] : http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html

~~~
anonymouz
> A computer can be connected to a network without having Internet access.

In fact, as the Internet is essentially a network of networks some of which
may be connected and disconnected at arbitrary points in time, it is a bit
difficult to strictly define what it means to have Internet access.

In practice it would probably mean something like "can access a large majority
of servers that consider themselves to be Internet servers", which is however
impractical to test for. A "good enough" substitute is often enough to test
connectivity to a few representative services which are unlikely to be
unreachable all at the same time if you consider yourself to have "Internet
access" (Google, Amazon, ...).

In this case it would however be best to test connectivity between the user
and the specific server that the user is supposed to access.

~~~
molf
Usually it's pretty irrelevant which servers are accessible except the ones
that host your app/back-end. So that's what you should check when implementing
such a feature.

------
philfreo
If you want to roll your own UI (something less obtrusive, perhaps), this can
be done in only a few lines of code. From our Backbone.js app...

    
    
        (function() {
            var errorView = null;
            $(window).on('online', function() {
                if (errorView) errorView.close();
                errorView = null;
            });
            $(window).on('offline', function() {
                errorView = new ErrorView({ message: 'No internet connection.'});
                errorView.render();
            });
        }());

------
jbrooksuk
Looks good to me. We run an internal web app which relies on users being
connected to a local server. This is perfect for my needs.

------
ubermensche
This looks great - but that sub-headline is almost unreadable (too thin/too
light) "Warn your users when their network etc." (Chrome OSX)

------
frozenport
I press the red button in the latest version of Firefox and nothing happens.
The cursor doesn't change when I hover over the button.

~~~
bradp
It's not a button, you actually have to disconnect from the internet for the
demo.

~~~
matthuggins
Considering that it's right next to it an identically rendered element that IS
a button, it definitely appears to be a button itself. The example page should
be changed to prompt the user to disconnect in another manner so that visitors
don't get confused.

------
copypasteweb
This should be a browser feature, extension or user script, not a website
feature.

~~~
tantalor
You might want a notification like this at the application level for the sake
of consistency. For instance, Gmail's "Loading..." messages will also notify
you when you have lost or gained a connection.

Surely consistent messaging and notifications is better for the user. Chrome
has a desktop notifications API, but that's only appropriate for certain types
of messages, such as receiving a new email. In general, it's probably best to
handle messaging at the application level.

------
BaconJuice
This is really cool. Thank you for sharing!

------
jamespo
works in chrome, doesn't work in an admittedly old firefox or IE8

~~~
adam-a
The FF window.navigator.onLine event fires when you click the "Work offline"
option in the menu, at least I think it used to. Just tried that and it didn't
work either.

I have been looking for a X-browser way to do this myself and the best I cam
up with so far was to ping google.com with a XHR OPTIONS type request. Pretty
ugly, but it works.

~~~
stuaxo
Hm, I clicked 'work offline' in firefox and didn't see the demo page do
anything - maybe I'm missing something.

~~~
adam-a
Yes, you're right. I know that that was the behaviour at some point in the
past on OSX. But I tried just now on Windows, FF Nightly and saw nothing.

Could be a change in FF, difference in os's, or something in the library. Not
a very helpful comment I'm afraid.

------
tunnuz
Very cool!

~~~
chacham15
Why do these comments get downvoted? Granted that they add no value except to
the author, that is still a valuable thing.

~~~
frozenport
Its a cheap comment and may be misleading. If they can't explain why they like
it, calling it cool is suspect.

