├── src ├── media │ ├── 1.gif │ └── example.gif ├── css │ └── main.css ├── newsletter.html ├── about.html └── index.html ├── .gitignore ├── package.json ├── LICENSE.md └── README.md /src/media/1.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/surge-sh/example-autoappcache/HEAD/src/media/1.gif -------------------------------------------------------------------------------- /src/media/example.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/surge-sh/example-autoappcache/HEAD/src/media/example.gif -------------------------------------------------------------------------------- /src/css/main.css: -------------------------------------------------------------------------------- 1 | h1, h2, h3, h4, h5, h6, body { 2 | font-family: "Avenir Next", "Avenir", Helvetica, Arial, sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | 4 | # Logs 5 | logs 6 | *.log* 7 | 8 | # Compiled binary addons (http://nodejs.org/api/addons.html) 9 | build/Release 10 | 11 | # Dependency directory 12 | node_modules 13 | components 14 | bower_components 15 | 16 | # Compile directories 17 | www/ 18 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@surge/example-autoappcache", 3 | "version": "0.1.0", 4 | "description": "An example using Surge’s Auto AppCache to building offline web apps.", 5 | "homepage": "https://surge.sh", 6 | "repository": "https://github.com/surge-sh/example-autoappcache.git", 7 | "license": "MIT", 8 | "private": true, 9 | "author": "Kenneth Ormandy (http://kennethormandy.com)", 10 | "contributors": [ 11 | "Kenneth Ormandy (http://kennethormandy.com)", 12 | "Brock Whitten (http://sintaxi.com)" 13 | ], 14 | "keywords": ["surge", "surge.sh", "example", "appcahce", "auto appcahce", "offline", "offline first", "static"], 15 | "devDependencies": { 16 | "surge": "latest" 17 | }, 18 | "scripts": { 19 | "compile": "echo \"If you’re using a static site generator or other compilation step, you could run it here and deploy your build directory instead!\"", 20 | "predeploy": "npm run compile", 21 | "deploy": "surge --project ./src --domain example-autoappcache.surge.sh" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/newsletter.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Example Newsletter 5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 |

13 | 14 | Newsletter 15 | 16 |

17 |
18 |
19 |
20 |

Phasellus sit amet nulla id diam lacinia porttitor ac sit amet ante.

21 |
22 | 23 | 24 |
25 |
26 |
27 |
28 |
29 | 30 | 31 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright © 2015 [Chloi Inc.](https://chloi.io) 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of 6 | this software and associated documentation files (the “Software”), to deal in 7 | the Software without restriction, including without limitation the rights to 8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 9 | the Software, and to permit persons to whom the Software is furnished to do so, 10 | subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS 17 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 18 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 19 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN 20 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 21 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Auto AppCache example 2 | 3 | An example using [Surge](https://surge.sh)’s Auto AppCache to building offline web apps 4 | 5 | ## Getting started 6 | 7 | - The promise of the Application Cache 8 | -- Why you’d want an app offline 9 | -- Why you’d want a static site offine (Slides, docs, read-it-later) 10 | - The problems of Application Cache…it’s really, really challenging to maintain properly, is really picky about tiny details, and breaks if a single thing is wrong 11 | - We build an `auto.appcache` file for you automatically, so you don’t have to worry about the challenging parts, and instead can focus on the fun parts: getting you app or static site to run offline 12 | - Reference the `auto.appcache` file in the `manifest` attribute in the `` tag 13 | - Clean URLs work automatically 14 | - Index page is your fallback 15 | - Don’t add the `manifest.appcache` attribute to the `200.html` file (?) 16 | - Script prevents jumping out of Standalone mode on mobile Safari (still having an inconsistent experience with this on harpjs.com, but it works in this demo) 17 | 18 | ## License 19 | 20 | [The MIT License (MIT)](LICENSE.md) 21 | 22 | Copyright © 2015 [Chloi Inc.](http://chloi.io) 23 | -------------------------------------------------------------------------------- /src/about.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Example About 5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 |

13 | 14 | About 15 | 16 |

17 |
18 |
19 |
20 |

21 | 22 | About Info Title 23 | 24 |

25 |

Phasellus sit amet nulla id diam lacinia porttitor ac sit amet ante. Morbi sodales eleifend tortor vel facilisis. Donec eget magna sit amet sem blandit mollis vel ac ipsum. Vestibulum nec felis risus. Sed malesuada felis eget nisl sollicitudin, a vehicula sapien fermentum. Ut sed orci pulvinar, eleifend arcu non, imperdiet augue. Integer id purus elit.

26 | Read more 27 |
28 |
29 |
30 |
31 | 32 | 33 | -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Example 5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 |

13 | 14 | Blog 15 | 16 |

17 |
18 |
19 |
20 |

21 | 22 | Blog Post Title 23 | 24 |

25 |

Aliquam lobortis lacinia magna eu eleifend. Cras et lobortis diam, vel efficitur lacus. Phasellus eget sollicitudin felis. Pellentesque fringilla, ex eu vehicula sodales, tortor ex accumsan nibh, id varius mi ipsum id massa. Nullam tempus, tortor sed aliquet consequat, orci metus tincidunt tortor, in aliquam erat turpis at urna.

26 | 27 |

Nam finibus massa non tempor pellentesque. Vivamus dapibus lobortis hendrerit. In nec elit tortor. Duis eget vulputate nisi. Mauris blandit, arcu in sagittis faucibus, purus lacus ultricies tellus, vitae volutpat est sem sit amet nisl. Donec porttitor purus id ex placerat fermentum. Sed et diam feugiat, luctus diam quis, condimentum risus. Morbi ultricies tempor massa, ut mattis diam tincidunt quis.

28 | Read more 29 |
30 |
31 |

32 | 33 | Blog Post Title 34 | 35 |

36 |

Vivamus felis lorem, auctor sed convallis sed, elementum nec mauris. Phasellus accumsan, orci sed auctor placerat, diam nisl dapibus massa, blandit porta sapien elit vulputate sapien. Integer commodo nibh eget quam porta sagittis. Quisque euismod mattis lacus, eu eleifend risus rhoncus ac. Donec at sollicitudin erat, at vehicula lectus. Quisque dignissim semper orci, vitae pulvinar neque rutrum non. Maecenas vitae nisi finibus, lacinia urna id, bibendum magna. Integer eu libero vel quam viverra venenatis ut sed justo. Etiam lacinia metus ex, a dignissim odio maximus sit amet. Nunc vitae tortor volutpat, euismod est sit amet, iaculis leo.

37 | Read more 38 |
39 |
40 |
41 |

Categories

42 | 50 |
51 |
52 |
53 | 54 | 55 | --------------------------------------------------------------------------------