Reference no: EM132805914

CSC73010 Programming Mobile Systems - Southern Cross University

Part 1 - An Ionic app using Ionic native

In this section, you will develop an app to use Cordova and Ionic native plugins which access some of your device's hardware sensors. It is unnecessary to test your app on a real device, but you should if you have one available. The app should be working correctly on an emulator (it will be tested).

You are requested to develop a multipage Ionic app. The pages required are:
1. A page to display the current charge level of your device's battery. Have your app also displays different messages when (2 marks):
• the battery goes critical
• the battery goes low status
• the battery starts charging or stops charging
You will need to add ‘Battery Status' Ionic native plugin to your app

2. A page to display:
• device's model
• platform (device's operating system name)
• name and version of the operating system
• device's manufacturer
To display the above information, you will need to add ‘Device' Ionic native plugin to your app

3. A page to display the device acceleration in X, Y and Z directions (2 marks). Activate the vibrator when the device is shaken (1 marks). You can either activate the vibrator for a fixed time or toggle it on/off by the shaking motion. Note that the vibrator may be difficult to emulate, so if you do not have a real device, display a message while the vibration is active and use very slow shakes, so you can alter the emulator to simulate shaking.

4. A page that has
• a button that plays a sound when swiped and another sound when swiped again. You can have more than two sounds if you like (cycle through them with each swipe) .
• a button that toggles the flashlight on/off using the Flashlight plugin.

5. Add a splash screen to your app. Any graphic will do. You will need to research the splash-screen plugin for this. You will not need to call show() or hide() as the default configuration will show the screen for three seconds when the app starts. You will, however, need to configure your splash screen by editing config.xml. There are many useful instructions on the internet, so look further than the official documentation.

Part 2 - An Ionic app to manage a pet database
The aim is to develop an Ionic multipage app that uses Ionic components, to maintain a small database of pet information while the app is running on a mobile device, or in a browser window. The app will access a remote website using RESTful operations (see below) to create, edit and delete records on the website.

Your app will implement an injectable service to access the remote website using AJAX techniques. Each page component will access this injectable service for remote HTTP operations.
The data records have the following format:
• Pet name - string. This will be a unique key for the data.
• Pet species - string (must be "dog", "cat", "fish", "bird", "snake" or "other")
• Pet age - number (will be the whole number of years)
• Pet sex - string (must be "male" or "female")
• Pet phone number (for lost pets) - string The data has the following requirements:
• Each record must have a value for all fields. No field can be blank.
• The pet ‘species' and ‘sex' must be one of the options shown.
• The pet name can only be entered and saved once (it must be unique for each pet). Your app will have several pages:
• Home page with greetings and your name as app author
• A page for listing all pets
• A page for adding new pets
• A page for editing the existing pets. This page will also allow searching for pets and deleting a pet from the data.
Your app will have help information that appears over the current page when requested (each page require a help widget). The delete operation will require a prompt to confirm the delete. This prompt should be an Ionic dialog (not a JavaScript alert!). You must have at least four pages on your app, and if you chose the tabs template, you must change the icons to be appropriate (3 marks for all of these).

Use appropriate Ionic user interface components to implement the app. Several things are missing here from the usual app. For example, there is no splash screen requested, and no media or other native interfaces (e.g. pictures of your pets). You can add them if you wish, but these have not been added as requirements to simplify the app.

The sever is at URL attached and the RESTful operations are as follows:
GET PetServ/ - get all the pet data as a JSON response (an array)
GET PetServ/name - get data for a pet named "name"
PUT PetServ/ - updates the record on the database with the PUT body, which is a JSON format pet record. If the pet name exists, the associated data is updated. Otherwise, a new pet record is created.
DELETE PetServ/name - removes the record with given name. Note that removal of pet named "terry" is forbidden (status 403 returned) so that students will find at least one record on the server. Successful deletion of other records must return a proper message.

Attachment:- Programming Mobile Systems.rar