Enable Offline Access

[amitness]

I just came across a site developed by google: https://hoverboard-master.firebaseapp.com. It works offline once the site is loaded on both mobile and desktop. It's some technology called "Progressive Web Apps" which they're using https://github.com/gdg-x/hoverboard.

Offline access in NepalMap can be useful for people in Nepal since they don't have 24/7 access and internet isn't available everywhere. I've thought of some approaches to go about this:

Option 1: Progressive Web App

• Research whether it's possible to implement it in a dynamic site like NepalMap.
• Looks for plugins in Django we can reuse.
• Test it with the existing architecture

Option 2: Build a mobile app

• Wait for the development of chatbot. We'll have a JSON API.
• Use JSON API to build a hybrid mobile app using React Native(or some other tech)

Option 3: Use option 1 and webview

• Add offline access to the site.
• Make a android app that fakes like it's native app. It'll hide all browser buttons and everything and loads the site
• Due to offline feature of site, it'll work without internet.

[leggsimon]

I've just come across this repo via @yourfirstpr I've had a little bit of experience using ServiceWorker while attempting a PWA for the FT. It could be an option but considering it's browser support is limited I'd be curious to know what Nepal's browser usage breakdown is.

[ravinepal]

@Studenton this is a great idea! In fact - a participant at www.digitalnepal.org conference asked me to build an app for NepalMap. I'm more excited about helping people access NepalMap offline!

[amitness]

@leggsimon There is no reliable source for the data but on searching the internet, I found Chrome as the dominant one with 55% share on Desktop. On mobile, it's UC Browser and Opera Mini which don't support PWA.

Are you interested in working on the second option React Native? That way we can have greater compatibility.

[leggsimon]

As much as I would like to, I just don't think I have the time to commit to starting that project unfortunately.

[aeruhxi]

is JSON API not ready yet? I can try experimenting with React Native if I can get the details of what app should look like and should include.

[amitness]

@absoluteZero273 There is a creative freedom on how it should look. Basically, we want to make this information available: http://nepalmap.org/profiles/district-27-kathmandu/

[amitness]

@absoluteZero273 We do have a design scheme for C4N with the hex values: #e00015(red) and #00adef(blue) as our primary colors.

[aeruhxi]

My attempt at this. There's only a single screen for now.
Repo: https://github.com/abs-zero/nepalmap-app-mobile

[ravinepal]

thanks, @Abs-Zero! Looks like a good start!

[cliftonmcintosh]

@amitness and @Abs-Zero

With regards to JSON APIs, as far as I can tell, the Wazimap framework is limited in what it provides. If you know the route for a particular region (be it country, district or VPC) you can get the JSON data that is used to present a view.
For example, the data behind the view at https://nepalmap.org/profiles/district-27-kathmandu can be retrieved as JSON by adding .json to the end of the URL, like
https://nepalmap.org/profiles/district-27-kathmandu.json

This seems to apply only to the profile views. It does not apply to compare views. It is also of limited value since you need to know the id associated with a geographical area, and Wazimap does not provide an endpoint for retrieving that information. For example, if you wanted to get the data for Jumla, you would need to know that it is district 54 so that you could request JSON from https://www.nepalmap.org/profiles/district-54-jumla.json

The mappings for districts are available in a .topojson file at https://nepalmap.org/static/geo/district.topojson and the same type of data is available for VDCs and municipalities at https://www.nepalmap.org/static/geo/vdc.topojson, but I'm not sure how much work would need to be done to parse those files. In particular, the VDC file is very large, and I believe it does not tell you which district a given VDC or municipality belongs to.

There is also an API endpoint that will tell a user all of the census-data tables in Postgres (see https://www.nepalmap.org/api/1.0/table), but there doesn't appear to be a way to extract data based on that information.

[axispx]

@cliftonmcintosh how often do the districts and vdcs change? Is it a good idea to parse and store the vdc/district to geoid/code mappings locally?

[cliftonmcintosh]

@anarchyrucks My apologies for missing your question earlier. The vdcs and districts will not change frequently. The geographic data is stable. The thing that is likely to change is the census and other numerical data. These changes will be mostly additive because we are adding new data points every few weeks.

[ravinepal]

Hi @Abs-Zero - I hope you had good dashain! If you have MVP of the app of NepalMap, we can work with you to deploy it via our server.

[ravinepal]

We'd be grateful for help on this from anyone who is interested :)

[aeruhxi]

Sorry, I have been busy lately. If anyone is willing to pick up from our incomplete work, they would be more than welcome.

Incidentally, I did a little research on PWA (offline caching with service workers) and found out that completely server rendered website like nepalmap is not ideal for caching because common application shell is hard to isolate, missing out on the opportunity to follow "gold standard" application shell + dynamic content pattern, which makes caching inefficient and harder.
ref: https://stackoverflow.com/a/35580105/3734057

If anyone has any ideas how to approach this, it would be helpful to share them. Meanwhile, I will try to figure out the optimal solution whenever I have time to spare.

[axispx]

Hi, @amitness @ravinepal @cliftonmcintosh @Abs-Zero I created a cross-platform MVP app (currently only tested on Android) using https://flutter.io for NepalMap. Currently, it just parses JSON API to create the UI but the next step is to make it work offline. I just open sourced it in https://gitlab.com/neptronix/nepalmap.

PS: Before you ask, yes #MoveToGitLab! 😄

[ravinepal]

@anarchyrucks this is great! Thank you so much! We'd love to work with you more, test it and launch the app. We are also planning to update NepalMap to mirror Nepal's new federal boundaries. More soon. We just forked your app: https://gitlab.com/codefornepal/nepalmap

[axispx]

@ravinepal I'll be looking forward to working with you guys as well. Cheers.

[devbks]

Hi there @ravinepal ,
i can help with the cross platform mobile app. if we are looking forward for it.