Offline Web Application with Web View
Posted: Thu Jul 19, 2012 11:30 am
You can create an offline HTML application with LongRange Web View.
With offline HTML applications:
1) Where do I put my HTML files (also images & JS files).
You need to put that in the /LongRange/resource folder, together with other static resource files.
2) If my HTML page is using images, external CSS, or scripts, how do I tell LongRange to download all the required files as a unit as they would be available offline?
You do that from the Web View editor in LongRange Studio.
There is a section called "Required Resources" in the Web View editor - that is where we put the list of files that are used by our offline HTML page.
For example, that's where we should put our jquery.js and .css files if we are using jquery.
Images used by the HTML page should also go there.
3) How do I refer to the local resources (images or scripts) from my local HTML?
All files would be put under virtual path "/app/resource".
So for example, to refer to your jquery.js and .css file, you'd do this:
<link rel="stylesheet" href="app/resources/jquery-mobile.css" />
<script src="app/resources/jquery.js"></script>
<script src="app/resources/jquery-mobile.js"></script>
With offline HTML applications:
- HTML pages will be cached locally so you can still run the application (with cached data) when there is no network connectivity.
- You can easily perform cross-domain AJAX requests as local HTML pages are not constrained by the cross-domain restriction.
1) Where do I put my HTML files (also images & JS files).
You need to put that in the /LongRange/resource folder, together with other static resource files.
2) If my HTML page is using images, external CSS, or scripts, how do I tell LongRange to download all the required files as a unit as they would be available offline?
You do that from the Web View editor in LongRange Studio.
There is a section called "Required Resources" in the Web View editor - that is where we put the list of files that are used by our offline HTML page.
For example, that's where we should put our jquery.js and .css files if we are using jquery.
Images used by the HTML page should also go there.
3) How do I refer to the local resources (images or scripts) from my local HTML?
All files would be put under virtual path "/app/resource".
So for example, to refer to your jquery.js and .css file, you'd do this:
<link rel="stylesheet" href="app/resources/jquery-mobile.css" />
<script src="app/resources/jquery.js"></script>
<script src="app/resources/jquery-mobile.js"></script>