mowbly

$m

Mowbly is a cross platform mobile development framework to design and develop apps that run on multiple mobile operating systems and browsers. Apps in Mowbly framework are developed using web technologies like HTML5, CSS3 and Javascript. The mowbly API documentation provides information on concepts and APIs to use the framework to develop rich mobile apps.

$m

The $m is the global object available on every mowbly app page, which provides the single interface to access all Mowbly framework apis. The apis comprise a wide range of utilities that help to leverage native features in the device such as camera, contacts etc. The mowbly apis also include a UI framework called Juci that takes care of all the responsive design and data binding needs of your app. The Mowbly apis will ensure that you get the app developed rapidly with minimum number of lines in your code without any compromises in the richness of the app in interface and functionality.

Pages

Every mobile app comprises a set of user interfaces for an user to accomplish tasks the app is intended for. These user interfaces are referred to as pages in Mowbly framework. Each page is nothing but a Html file containing the mowbly javascript library and the script related to app business logic. During the lifecycle of the app, user would visit pages in any order and multiple times. Each page communicates all these user actions through a set of events. Listening to these events and doing necessary actions would make the user experience of the app richer. Following section describes in detail the lifecycle of a page.

Lifecycle of Page

The lifecycle of the page starts with one of the following actions,

  1. user launches the mowbly app from the Apps menu.
  2. page is launched using the open method from another page.

The lifecycle of the page ends with one of the following actions,

  1. user comes out of a page by pressing the back button in the device
  2. user comes out of a page by pressing the back button in the title bar of the page
  3. page is closed using the close method

During the lifecycle of the page, events are fired on the Page object at various stages. Following are the life cycle events,

ready

Fires after the page is loaded. This is the ideal place for doing all one-time initializations.

To improve the performance of pages on mobile, pages once opened will not be destroyed on close. Instead, they go to the background and taken to the foreground when needed. This ensures quicker and smoother loading of pages until the mowblyt app is active.

Hence, this event will not fire again for a page until the complete app is closed and reopened in the device and the page is opened again. In other words, this event fires only once for a page till the time app is actively running. However, in cases when the device runs out of memory, the mobile operating system may kill the pages in the background and in this case, the ready event will fire the next time the page is opened.

Use $m.onReady() method to register an event handler for ready event.

 

resume

Fires after the ready event. This event can be used to register touch event handlers for elements in the page to ensure that the page responds to touch events only after it is loaded.

This event also fires whenever the page comes to foreground which happens in the following cases,

  1. the page is opened from another page using open method.
  2. the page is reopened after it was closed when user presses the back button in the device or using the close method.

Use $m.onResume() method to register an event handler for resume event.

data

Fires after the resume event. This event can be used to receive the data passed to the page from the parent page. Use $m.onData() method to register an event handler for data event.

result

Fires after the resume event. This event can be used to receive the result passed back to the page from a child page. Use $m.onResult() method to register an event handler for result event.

pause

Fires when user leaves the page by navigating forward to a new page or navigating backward. This is the ideal place to unregister touch event handlers for the elements in the page to ensure that the page does not respond to the user touches during transition to a new page. The touch event handlers can be attached to the elements during the resume event of the page.

This event can also be used to set the page result on the parent page using the setResult method.

Use $m.onPause() method to register an event handler for ready event.

close

Fires when the page closes on a back press on the device or a call to the close method. This fires after the pause event. This event can be used to release any resources like open files held by the page.

Use $m.onClose() method to register an event handler for ready event.