Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

UI Indicator of Online / Offline status.

  • Loading branch information...
commit 878ae2d11c0cc7d8425c6d67337e602e9827b19a 1 parent c838f44
@JosephPecoraro authored
View
2  sample/notes/appcache.manifest
@@ -1,6 +1,6 @@
CACHE MANIFEST
-# Version 2.0
+# Version 2.1
# Resources to Cache
CACHE:
View
10 sample/notes/css/styles.css
@@ -19,6 +19,7 @@ a img {border:none;}
/* title banner */
#title {
+ position: relative;
background: black;
}
@@ -30,6 +31,15 @@ a img {border:none;}
font-family: 'Lucida Grande', serif;
}
+#connectivity {
+ background-color: #444;
+ color: black;
+ position: absolute;
+ top: 10px;
+ left: 10px;
+ padding: 10px;
+}
+
/* content area */
body {
background: #AAA;
View
1  sample/notes/index.html
@@ -69,6 +69,7 @@
<body>
<div id="title">
<h1>Twitter Notes</h1>
+ <span id="connectivity">status</span>
</div>
<div id="content">
View
22 sample/notes/js/offlineHandlers.js
@@ -18,9 +18,31 @@
// DataCache.Offline = true;
// }, false);
+
// Prevent Namespace Collisions
(function() {
+ // -----------------
+ // UI Indicators
+ // -----------------
+
+ function indicateOnline() { indicate('green', 'online'); }
+ function indicateOffline() { indicate('red', 'offline'); }
+ function indicate(color, text) {
+ var elem = document.getElementById('connectivity');
+ elem.style.backgroundColor = color;
+ elem.innerHTML = text;
+ }
+
+ document.addEventListener('now-online', indicateOnline, false);
+ document.addEventListener('now-offline', indicateOffline, false);
+ window.addEventListener('load', function() {
+ setTimeout(function() {
+ (DataCache.Offline ? indicateOffline() : indicateOnline());
+ }, 500); // latency is for the initial automated check
+ }, false);
+
+
// ------------------------
// Table of Saved Items
// ------------------------
Please sign in to comment.
Something went wrong with that request. Please try again.