wiki:BluePrint/Mobile/EdenMobileFramework

Version 13 (modified by Tom Baker, 10 years ago) ( diff )

--

Eden Mobile Framework

A framework for creating mobile applications that work with Sahana Eden deployments is being designed and implemented. The source code can be found here: https://github.com/tombaker1/EdenMobile. The framework is designed to implement many of the common use cases for Eden.

The initial implementation will support a basic app with a few different pages. The target user of the first app that is implemented with the framework will be an aid worker that is working in a facility that is in an area affected by a disaster. The first forms that are implemented will be chosen to support that user type. Implementation of more functionality will proceed incrementally. The current plan is to proceed in three phases of implementation. As phases are completed more planned phases will be made. With additional help some of the phases can be worked on in parallel.

The general requirements are as follows:

Phase I - Basic forms

  1. Secure login
  2. Multiple languages
  3. Be able to work offline, and update forms and content when online
  4. The initial target device is Android.
    1. This includes registration on Google Play.
  5. Location based on GPS
  6. The initial forms that will be implemented are Hospitals, and Shelters.
  7. Modular design so that additional features can be easily implemented.

Phase II - Mapping

  1. Map based location entry
  2. Filters for different data sets
  3. Download location specific maps (Humanitarian Open Street Map?)

Phase III - Low bandwidth connectivity

  1. SMS communication

Application Design

The EdenMobile design is based on the EdenDisease (https://github.com/tombaker1/EdenDisease) code that is an early prototype created for the Sahana Eden ebola patient information management. EdenDisease has some features that are much more complete than the current version of EdenMobile. The EdenMobile implementation borrows heavily on EdenDisease, but EdenMobile is designed to be more modular so that similar forms can re-use base code. There isn't as much hard coded implementation of the forms in EdenMobile. If you are looking to add features to existing forms it may help to look at the EdenDisease source to see if it has already been implemented.

The EdenMobile framework uses the jquery, backbone.js, and foundation javascript libraries.

  • jQuery (jquery.org) Jquery is mostly used for DOM manipulation, and general Javascript utility functions.
  • Foundation (foundation.zurb.com) This is the presentation framework used by Eden. Many of the css files used are copied from Eden. I have tried to keep the look of the mobile client close to that of the Eden web UI.
  • Backbone (backbonejs.org) This is a Model-View-Controller framework that makes it easy to create web apps. Reading through the Backbone documentation will help you understand how the app is designed.

Source Code

  • The root directory has the cordova configuration files, directories, and the README.md file for the github documentation page. The www folder has all of the source code.
  • www - There are directories for the different types of files, and some fundamental source files.
  • www/index.html - This is the main page for the app. It also loads the core javascript and css files.
  • www/config.js - The main configuration for the app.
    • The base host url is defined in app.config.defaults.url.
    • The main menu from the home page is defined in app.config.mainMenu.
    • The plugins are defined in app.config.plugins.
  • www/css - The main stylesheets for the app. Currently there is only index.css.
  • www/js - The core JavaScript source code.
    • index.js The main entry point for the app. It initializes all of the core objects.
    • controller.js Coordinates all operations. See the Controller section below.
    • view.js The main user interface object. Handles page transitions. See Views below.
    • models.js The main model definitions. Has objects that are the basis of the form databases.
    • uiElements.js Fundamental UI objects. There are base objects for pages, dialogs, and controls used in tables.
    • communicator.js Handles requests to the server.
    • pluginManager.js Controls loading, initialization, and searches on plugins.
    • storage.js Manages localstorage reads and writes.
  • www/lib - External js libraries. This includes the css files copied from Eden.
  • www/plugins - The form plugins. See Plugins below.
  • www/res - Resources, currently only holds application icons.

Controllers

Models

Views

Plugins

How to Help

I will be using the github issues feature to keep track of things to do. Here are some ideas.

  1. Testing. If you find problems please submit an issue.
  2. Fixing bugs. Always helpful.
  3. Improve the UI style sheets. I have created a basic UI based on the Foundation framework. Work needs to be done to improve the style.
  4. Add features to the existing forms. Work is still ongoing for the Shelters form. Additional features such as completing the input types, and adding subforms.
  5. Add new forms of a similar type. Create a new plugin. Make a copy of the shelters form, and modify it for hospitals, warehouses, etc.
  6. Add new types of forms. For example mapping.
  7. SMS communication.
Note: See TracWiki for help on using the wiki.