Tutorial

Any static HTML files, such as documentation, can be enabled for viewing offline by following these steps. This tutorial shows you how to create a manifest file, and make your files available offline, using Gears. (Time estimate: 15 minutes.)

You will need:

Files to download for this tutorial:

1. Edit the sample manifest file

Save this tutorial manifest file to your computer.

Edit the version value

The manifest file contains a series of attribute-value pairs.

You will update this version string in the future to indicate that there is a change in any of your documents.

Edit the URLs

The "entries" attribute contains an array of URLs that you wish to capture and have available offline.

For example, if your documentation consists of an index.html page, a stylesheet style.css, and a logo in the file resources/logo.gif in addition to the tutorial's files, you will have the following "url" entries:

"entries": [
    { "url": "index.html" },
    { "url": "style.css" },
    { "url": "resources/logo.gif" },
    { "url": "gears_init.js"},
    { "url": "go_offline.html"},
    { "url": "go_offline.js"}
] 

Note: The URLs can be fully-qualified, for example "http://www.example.com/index.html", or they can be relative to the manifest file's location.

2. Add some User Interface

Some basic user interface is needed to provide a way for your user to request the offline functionality.

Download and save these files to your computer:

go_offline.html - user interface sample
go_offline.js
gears_init.js - provides access to Gears.

Special note: To keep this tutorial simple, the go_offline.html file is provided to act as the user interface.

You are not limited to using the provided file; you can integrate the functionality provided in the go_offline.js JavaScript file into your application in other ways.

Note that go_offline.html expects gears_init.js to be in the parent directory. If you have downloaded all files to the same location, you will need to edit go_offline.html accordingly.

Keep in mind that the user will need to:

3. Upload files to your HTTP server

Upload all the files and your documents to your HTTP server.

Important: Be sure all the files listed in the manifest file are available and accessible as listed.

4. Test: capture the files locally

In the testing steps, you act as the user.

5. Test: access the captured files

Clear your browser cache often while testing, to prevent seeing cached (but not necessarily offline-enabled) content.

Troubleshooting

6. Publish it to your users

Your users can now access your documents offline by following the instructions in Step 4 above.

7. Future changes: maintaining the manifest

Whenever you update the contents in the static HTML files, or if you add or remove files, you must update the manifest file. When Gears detects a new manifest version string, the updated contents are automatically copied to your user's local machine when they next view any of your files.

 

 

For more information on the manifest file or the APIs used in this tutorial, see the LocalServer API Reference.