Permalink
Browse files

Changes for talk

  • Loading branch information...
jakearchibald committed Mar 19, 2012
1 parent b9c0b29 commit 8274e5c91e85f8fb22a378466d1be5a1609f2e28
@@ -4,15 +4,15 @@
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Article 1</title>
- <link rel="stylesheet" href="/localstorage-cache/css/core.css">
+ <link rel="stylesheet" href="/offline-demos/www/localstorage-cache/css/core-v1.css">
</head>
<body>
- <h1>Article 1</h1>
- <p>This is article 1</p>
+ <h1>Test article 1</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi urna felis, posuere et dignissim eget, consequat scelerisque orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi felis lectus, volutpat et sollicitudin in, interdum at leo. Nam nec lorem ac dolor placerat elementum eu et quam. Suspendisse libero leo, aliquam nec adipiscing eget, egestas a eros. Nam ac erat lectus. Ut dignissim felis justo. Sed sodales placerat accumsan.</p>
<p><a href="../">Back to index</a></p>
- <script src="/localstorage-cache/js/jquery-1.7.1.js"></script>
- <script src="/localstorage-cache/js/offliner-v1.js"></script>
- <script src="/localstorage-cache/js/offlineInterface-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/jquery-1.7.1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offliner-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offlineInterface-v1.js"></script>
<script>
$( function() {
if ( !offliner.isOffline ) {
@@ -4,15 +4,21 @@
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Article 2</title>
- <link rel="stylesheet" href="/localstorage-cache/css/core.css">
+ <link rel="stylesheet" href="/offline-demos/www/localstorage-cache/css/core-v1.css">
</head>
<body>
- <h1>Article 2</h1>
- <p>This is article 2</p>
+ <h1>Test article 2</h1>
+ <p>
+ Suspendisse nisl arcu, viverra vel ullamcorper non, dignissim in dui. Nulla sit amet fringilla risus. Suspendisse potenti. Etiam vehicula egestas varius. Vivamus aliquet mollis nisl, ac cursus odio semper id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque ut porttitor turpis. Nam in quam vel nunc scelerisque convallis. Pellentesque non felis sit amet metus sagittis placerat vitae luctus purus. Morbi a tristique elit. Phasellus tristique adipiscing pretium. Cras elementum malesuada felis, blandit pharetra quam auctor at. Duis vitae est eget dui faucibus dictum eu aliquet magna.
+ </p>
+ <p>
+ Aliquam erat volutpat. Nam blandit lacus quis felis imperdiet eu convallis leo pulvinar. Sed fermentum metus posuere nulla commodo quis cursus purus varius. Maecenas in sollicitudin odio. Integer tempus, sapien in rutrum lacinia, justo mauris cursus lorem, eget pellentesque mauris enim eu magna. Curabitur rhoncus dapibus eros eget sodales. Morbi consectetur cursus nulla, laoreet consectetur ligula pharetra nec. Sed at quam ac ligula varius pharetra.
+ </p>
+ <p>Morbi at felis massa. Nam congue scelerisque cursus. Curabitur ac velit urna. Phasellus consequat elit facilisis dolor ultricies semper dictum ligula suscipit. Aliquam sem libero, bibendum at laoreet et, consectetur nec neque. Maecenas vitae nisl metus, id lobortis felis. In hac habitasse platea dictumst.</p>
<p><a href="../">Back to index</a></p>
- <script src="/localstorage-cache/js/jquery-1.7.1.js"></script>
- <script src="/localstorage-cache/js/offliner-v1.js"></script>
- <script src="/localstorage-cache/js/offlineInterface-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/jquery-1.7.1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offliner-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offlineInterface-v1.js"></script>
<script>
$( function() {
if ( !offliner.isOffline ) {
@@ -21,6 +21,11 @@ a {
.offline-toggler {
position: absolute;
- top: 1.7em;
+ top: 65px;
right: 1.7em;
+ font-size: 1em;
+}
+
+h1 {
+ margin-bottom: 41px;
}
@@ -0,0 +1,23 @@
+<!doctype html>
+<html lang="en-gb" manifest="/offline-demos/www/localstorage-cache/offline.appcache" class="offline">
+<head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <title>Fallback Page</title>
+ <link rel="stylesheet" href="/offline-demos/www/localstorage-cache/css/core-v1.css">
+</head>
+<body>
+ <h1>Fallback Page</h1>
+ <script src="/offline-demos/www/localstorage-cache/js/jquery-1.7.1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offliner-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offlineInterface-v1.js"></script>
+ <script>
+ offliner.isOffline = true;
+
+ // We only want to render the page if we're not in the hidden iframe
+ if ( location.hash != '#iframed' ) {
+ offliner.renderCurrentPage();
+ }
+ </script>
+</body>
+</html>
@@ -1,23 +0,0 @@
-<!doctype html>
-<html lang="en-gb" manifest="/localstorage-cache/offline.appcache" class="offline">
-<head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <title>Fallback Page</title>
- <link rel="stylesheet" href="/localstorage-cache/css/core-v1.css">
-</head>
-<body>
- <h1>Fallback Page</h1>
- <script src="/localstorage-cache/js/jquery-1.7.1.js"></script>
- <script src="/localstorage-cache/js/offliner-v1.js"></script>
- <script src="/localstorage-cache/js/offlineInterface-v1.js"></script>
- <script>
- offliner.isOffline = true;
-
- // We only want to render the page if we're not in the hidden iframe
- if ( location.hash != '#iframed' ) {
- offliner.renderCurrentPage();
- }
- </script>
-</body>
-</html>
@@ -4,17 +4,17 @@
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Site Index</title>
- <link rel="stylesheet" href="/localstorage-cache/css/core-v1.css">
+ <link rel="stylesheet" href="/offline-demos/www/localstorage-cache/css/core-v1.css">
</head>
<body>
- <h1>Site Index</h1>
+ <h1>Jake's test articles</h1>
<ul class="article-list">
- <li><a href="articles/1.html">Article 1</a></li>
- <li><a href="articles/2.html">Article 2</a></li>
+ <li><a href="articles/1.html">Test article 1</a></li>
+ <li><a href="articles/2.html">Test article 2</a></li>
</ul>
- <script src="/localstorage-cache/js/jquery-1.7.1.js"></script>
- <script src="/localstorage-cache/js/offliner-v1.js"></script>
- <script src="/localstorage-cache/js/offlineInterface-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/jquery-1.7.1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offliner-v1.js"></script>
+ <script src="/offline-demos/www/localstorage-cache/js/offlineInterface-v1.js"></script>
<script>
$( function() {
@@ -56,7 +56,7 @@ var offliner = (function() {
isOffline: false, // this is set in fallback.html
addCachingIframe: function() {
$body.prepend(
- '<iframe src="/localstorage-cache/fallback.html#iframed" style="position:absolute;top:-999em;visibility:hidden"></iframe>'
+ '<iframe src="/offline-demos/www/localstorage-cache/fallback.html#iframed" style="position:absolute;top:-999em;visibility:hidden"></iframe>'
);
},
cacheCurrentPage: function() {
@@ -1,4 +1,5 @@
CACHE MANIFEST
+# v1
js/jquery-1.7.1.js
js/offliner-v1.js
@@ -9,4 +10,4 @@ NETWORK:
*
FALLBACK:
-/localstorage-cache/ fallback/v1.html
+/offline-demos/www/localstorage-cache/ fallback.html
@@ -1,13 +1,13 @@
<!doctype html>
-<html lang="en-gb" manifest="/simple-fallback/offline.appcache">
+<html lang="en-gb" manifest="/offline-demos/www/simple-fallback/offline.appcache">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <link rel="stylesheet" href="/simple-fallback/css/core.css">
+ <link rel="stylesheet" href="/offline-demos/www/simple-fallback/css/core.css">
<title>Offline Page</title>
</head>
<body>
- <h1>Offline Page</h1>
+ <h1>Cached Page</h1>
<p>This page is available offline. Yey.</p>
</body>
</html>
@@ -3,21 +3,16 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <link rel="stylesheet" href="/simple-fallback/css/core.css">
+ <link rel="stylesheet" href="/offline-demos/www/simple-fallback/css/core.css">
<title>Content Page</title>
</head>
<body>
- <h1>Content Page</h1>
+ <h1>Non-cached page</h1>
<p>
- This page is doing the same iframe trick as before,
- but the manifest has a fallback section.
+ This page isn't cached. It was fetched normally.
</p>
- <p>
- If you stop your network connection and hit refresh,
- you should get a fallback page.
- </p>
- <script src="/simple-fallback/js/jquery-1.7.1.js"></script>
- <script src="/simple-fallback/js/offliner.js"></script>
+ <script src="/offline-demos/www/simple-fallback/js/jquery-1.7.1.js"></script>
+ <script src="/offline-demos/www/simple-fallback/js/offliner.js"></script>
<script>
offliner.addCachingIframe();
</script>
@@ -2,7 +2,7 @@ var offliner = (function() {
return {
addCachingIframe: function() {
$( document.body ).prepend(
- '<iframe src="/simple-fallback/fallback.html" style="position:absolute;top:-999em;visibility:hidden"></iframe>'
+ '<iframe src="/offline-demos/www/simple-fallback/fallback.html" style="position:absolute;top:-999em;visibility:hidden"></iframe>'
);
}
};
@@ -3,4 +3,4 @@ CACHE MANIFEST
css/core.css
FALLBACK:
-/simple-fallback/ fallback.html
+/offline-demos/www/simple-fallback/ fallback.html

0 comments on commit 8274e5c

Please sign in to comment.