08-28-2011 08:55 PM - edited 08-28-2011 08:56 PM
I'm exploring creating a (free and open source) offline mapping app for the BlackBerry PlayBook. So far, the plan is:
Unfortunately, I'm stuck on #1 for a strange reason. If I reference a page that loads the Leaflet library on a remote server, the touch events work properly - drag to zoom, double tap to zoom, pinch - it all works. However, if I take the exact same page that was referenced via a http:// call and instead use local:/// , the touch events don't work.
This works:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0;" />
<title>Azimuth</title>
<link rel="stylesheet" href="leaflet/leaflet.css" />
<script src="leaflet/leaflet.js"></script>
<style>
body {
padding: 0;
margin: 0;
}
html, body, #map {
height: 600px;
}
</style>
</head>
<body>
<script>
//window.location = 'local:///map.html';
window.location = 'http://leaflet.cloudmade.com/examples/mobile-examp le.html';
</script>
</body>
</html>But this does not:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0;" />
<title>Azimuth</title>
<link rel="stylesheet" href="leaflet/leaflet.css" />
<script src="leaflet/leaflet.js"></script>
<style>
body {
padding: 0;
margin: 0;
}
html, body, #map {
height: 600px;
}
</style>
</head>
<body>
<script>
window.location = 'local:///map.html';
//window.location = 'http://leaflet.cloudmade.com/examples/mobile-examp le.html';
</script>
</body>
</html>The code for the app is located here: http://yllus.com/wp-content/uploads/2011/08/azimut
You'll need to update the author and authorId values in blackberry-tablet.xml but past that, the app should simply work. Does anyone know what the deal is here? If we can solve this, we're most of the way to having a very nice offline GPS map app for the PlayBook.
Solved! Go to Solution.
08-30-2011 12:51 PM - edited 08-30-2011 12:52 PM
Are you sure that those libraries are not pulling in other content that you haven't included in your WebWorks archive?
Or using relative paths that expect to be hosted on their domain?
08-30-2011 02:08 PM
08-30-2011 07:37 PM
08-31-2011 01:34 PM
Wanted to ask a follow up question for the benefit of other developers who may experience a similar issue - could this have been a whitelisting error?
Did you have the following element defined in your config.xml file?
<access uri="http://leaflet.cloudmade.com" subdomains="true"/>
This would allow your WebWorks app to retrieve the mobile-example.html file from a remote location at runtime. Without this access element defined, this external resource would have been inaccessible.
Sincerely,
Adam
08-31-2011 01:39 PM
I had * for my access rule in config.xml - I looked deeper into this and it looks like I was running v0.2 of the JavaScript library, while the remote site (leaflet.cloudmade.com) was running an experimental v0.3. Grabbing that version solved the issue.