Esri / offline-editor-js

ArcGIS JavaScript library for handling offline editing and tiling.
http://esri.github.io/offline-editor-js/demo/
Apache License 2.0
159 stars 142 forks source link

Page Reload or Application Relaunch in Offline Mode #191

Closed wlatif closed 10 years ago

wlatif commented 10 years ago

Hi,

I came to know that version 1 does not support page reload or application relaunch in offline mode. Can anyone please update about the next version of offline-editor-js?

I have downloaded the latest source code few days ago. I am running one of the sample applications i.e. appcache-features.html found in: https://github.com/Esri/offline-editor-js

It is working pretty well. If I go to offline mode using the toggle button it shows the map with the markers on it. However, If I go to offline mode by disabling the network adapter the map does not show upon reloading the page or reopening the application in offline mode.

Regards, Waseem

andygup commented 10 years ago

Waseem, good question. The answer is yes on supporting reload and restart of the browser. Looks like we need to add some documentation on this topic.

You will need to build an application cache file. These are also sometimes referred to as manifest files. There are two samples and a cache builder tool. The samples are: appcache-features.html and appcache-tiles.html. The tool is /samples/Gruntfile.js and it's associated package.json file. There is also a helper library for listening to application cache events in /utils/appCacheManager.js.

Here are a couple of good articles to read on application cache: Using the application cache, Beginnners guide to application cache.

andygup commented 10 years ago

If I go to offline mode by disabling the network adapter the map does not show upon reloading the page or reopening the application in offline mode.

Which browser and browser version are you using? And, are there any errors showing up in the console?

wlatif commented 10 years ago

Andy, I appreciate your prompt reply. I am using Chrome Version 34.0.1847.131. I have also tested the appcache-tiles.html. But I am experiencing this issue on IE10 as well. Here are the steps I performed.

I am using Google Chrome Version 34.0.1847.131 on Windows 7. I have also cleared all the cache.

1) Run sample application (appcache-tiles.html) in online mode. 2) Download tiles by clicking on the provided button and let the download process complete. 3) Go to offline mode by clicking on the toggle button. 4) Browse the map. The downloaded tiles are visible and rest of the map shows the label "No Tiles" 5) So far so good. 6) Change the adapter settings and disable the LAN. 7) Reload or Refresh appcache-tiles.html. Map will not show up.

Note: Upon inspecting the Resources->IndexedDB I find out that all the downloaded tiles are presisted. Application Cache was also populated.

Regards, Waseem

andygup commented 10 years ago

Gotcha...please note, we aren't currently supporting IE, however we do have another open enhancement request #184 in addition to yours.

I'll do some quick tests on Chrome 35. Is Chrome 34 the latest version on Windows 7?

wlatif commented 10 years ago

Chrome Version 34.0.1847.131 is the latest one.

wlatif commented 10 years ago

Reloading in offline mode causes the following errors:

appcache-tiles.html: 76 - GET http://js.arcgis.com/3.9/ net::ERR_INTERNET_DISCONNECTED appcache-tiles.html:104 - Uncaught ReferenceError: require is not defined (anonymous function)

andygup commented 10 years ago

The errors you gave indicate the ArcGIS API for JavaScript library didn't get cached properly. Note, I was able to run the app okay on Chrome 31 on Windows 7. (I'm unable to update that machine to the specific Chrome 34 at this time).

Did you modify the appcache-tiles.html file? If you did you would need to create a new application cache.

Try the following: 1) Open a new tab and browse to chrome://appcache-internals/ and 'remove' all existing app caches. 2) On the tab where your app is running, open the Developer tools Console tab 3) Re-load the application 4) You should see a bunch of messages like this: Application Cache Progress event (18 of 18). There should not be any errors, and all 18 Application Cache Progress events should complete successfully.

Let me know what you find after doing steps 1 - 4?

wlatif commented 10 years ago

I made the following changes: 1) Rename "appcache-tiles.appcache" to "appcache-tiles.manifest" 2) In appcache-tiles.html I just changed the extension of manifest file as part of html tag.

In IIS I added the mime type "application/x-ms-manifest" for .manifest files.

With these changes I am getting the following output: log1 log2 indexeddb

Note: I had to make these changes because appcache-tiles.appcache was not being fetched. Even though in IIS, MIME type text/cache-manifest was added for the .appcache files. I was getting the following error: error

andygup commented 10 years ago

All are you up and running now? Note, if the ArcGIS API for JavaScript is still not loading/working you will need to create your own optimized build using http://jso.arcgis.com/. Once you've done that you can either host it locally or reference it via CDN.

The problem with using the standard API's CDN (for the non-optimized API build) is it has a redirect in it. The application cache mechanism will fail if it detects a redirect in a URL that it is trying to cache.

wlatif commented 10 years ago

I have not hosted the application in IIS yet. Simply running it with Visual Studio 2012. Information regarding mime types was additional one. Keeping it in IIS or removing does not make any difference for now, still getting the same above output.

andygup commented 10 years ago

Oh, okay I might have misunderstood...can you clarify what is working and what is not working on your local machine? And, are you using an optimized build of the ArcGIS API for JavaScript?

wlatif commented 10 years ago

I am not sure about whether this build has been optimized or not. I have simple downloaded the offline-editor-js package and tried to run the sample application as is in VS 2012. I am restating the steps:

1) Run sample application (appcache-tiles.html) in online mode. 2) Download tiles by clicking on the provided button and let the download process complete. 3) Go to offline mode by clicking on the toggle button. 4) Browse the map. The downloaded tiles are visible and rest of the map shows the label "No Tiles" 5) So far so good. 6) Change the adapter settings and disable the LAN. 7) Reload or Refresh appcache-tiles.html. Map will not show up.

andygup commented 10 years ago

Got it. I'm digging into it. At least one of the problems looks like some of the required libraries are being skipped by Gruntfile.js cache generator.

wlatif commented 10 years ago

Andy, any luck?

andygup commented 10 years ago

Yes, I've narrowed it down to a couple of issues. One of them has to do with the application life cycle that I'm looking closely at. I'm hoping to have something later this afternoon.

andygup commented 10 years ago

@wlatif Wanted to give you an update. It looks like it might be another day or two before I can push up the fix.

I think I've nailed all the life-cycle issues. I need to do more extensive testing since it affects how the offlineTilesEnabler.js library works. And, I'm working on "how to use" documentation on the application cache.

There are also problems with the offline detection library on the latest versions of some browsers/operating systems, and additionally when it is used with in conjunction with the application cache. I've opened an issue with the owner of the library. I'm doing my own digging into the problem to see if there is an easy fix that I can make and submit a PR. If you want to track that it's issue #194

andygup commented 10 years ago

@wlatif I'm still working on it. I found a few more issues over the weekend that I've now fixed. My best guess as to the cause is there was a change in our JS API at v3.9 on how tiles are fetched. We suspected it might cause some issues and...it apparently did. What's left is updating/rewriting some samples and updating the API docs.

wlatif commented 10 years ago

@andygup, thanks for the update. I hope you will solve these issues very soon. Good luck!!

andy commented 10 years ago

@wlatif I am the wrong @andy

wlatif commented 10 years ago

please ignore it. i have just made the corrections :-)

andygup commented 10 years ago

@wlatif thanks for catching this. Check out the new version of appcache-features.html and let me know if there are any more issues.

Closed with https://github.com/Esri/offline-editor-js/commit/30f858287c8afba93d3f615973b9ce93db7e74c3

wlatif commented 10 years ago

Hello Andy,

I was testing this issue on the latest build and I did not find it fixed with the following time stamps found in the .appcache files:

APPCACHE-FEATURES CACHE MANIFEST

This manifest was generated by grunt-manifest HTML5 Cache Manifest Generator

Time: Tue Jun 17 2014 11:23:22 GMT-0600 (MDT)

APPCAHE-TILES CACHE MANIFEST

This manifest was generated by grunt-manifest HTML5 Cache Manifest Generator

Time: Wed Jun 04 2014 17:49:41 GMT-0600 (MDT)

appcache-features offline mode appcache-features offline mode appcache-features online mode appcache-features online mode appcache-tile offline mode appcache-tile offline mode appcach-tiles online mode appcach-tiles online mode

andygup commented 10 years ago

@wlatif Is there any chance you are behind a proxy or firewall? I'm assuming you are in Chrome, if so can you go to the following URL: chrome://appcache-internals/, the go to the appropriate cache, select 'View Entries' and then copy and paste the entries here?

wlatif commented 10 years ago

Andy, I am not behind any proxy or firewall. Following are the entries found on the given URL: entries1 entries2