Device,Network, Vibration, Console, Accelerometer CIS 136 Building Mobile Apps

Device

Device Plug-in describes the device's hardware and software Global in scope, but not available until the device is ready Device object has 5 properties cordova model platform uuid Version Manufacturer isVirtual serial

Device Plug-in cordova property Gets the version of Cordova running on the device $(document).on(“deviceready", function() { $(‘#info’).html(device.cordova); });

Device Plug-in platform property Gets the operating system name "Android" "BlackBerry 10" "browser" "iOS" "WinCE" "Tizen" "Mac OS X" $(document).on(“deviceready", function() { $(‘info’).html(device.platform); });

Device Plug-in manufacturer property Gets the Manufacturer Android: Motorola XT1032 would return "motorola" BlackBerry: returns "BlackBerry" iPhone: returns "Apple" $(document).on(“deviceready", function() { $(‘info’).html(device.manufacturer); }

Device Plug-in model property Gets the name of the device's model or product set by the device manufacturer and may be different across versions of the same product Might get the production code name Android: Nexus One returns "Passion" (Nexus One code name) Motorola Droid returns "voles" iOS: for the iPad Mini, returns iPad2,5; iPhone 5 is iPhone 5,1 $(document).on(“deviceready", function() { $(‘info’).html(device.model); });

Device Plug-in uuid property Gets the Universally Unique Identifier a 128-bit value that is ‘practically unique’ determined by the device manufacturer and are specific to the device's platform or model. $(document).on(“deviceready", function() { $(‘info’).html(device.uuid); });

Device Plug-in version property Gets the operating system version Android: Froyo OS would return "2.2" Eclair OS would return "2.1", "2.0.1", or "2.0" iPhone: iOS 3.2 returns "3.2" Windows Phone 7: returns current OS version number, ex. on Mango returns 7.10.7720 $(document).on(“deviceready", function() { $(‘info’).html(device.version); });

Device Plug-in isVirtual property Determines whether the device is running on a simulator $(document).on(“deviceready", function() { $(‘info’).html(device.isVirtual); };

Device Plug-in serial property Gets the serial number $(document).on(“deviceready", function() { $(‘info’).html(device.serial); });

Network

Network Information Plug-in Navigator.connection provides information about the device's cellular and wifi connection Indicates if the device has an internet connection Connection Object has 1 property -connection.type connection.type has 8 values, available as constants (variables with fixed values) connection.type Connection.UNKNOWN Connection.ETHERNET Connection.WIFI Connection.CELL_2G Connection.CELL_3G Connection.CELL_4G Connection.CELL Connection.NONE

navigator.connection.type determine the device's network connection state, and type of connection Ex: $(document).on(“deviceready", function() { var networkState = navigator.connection.type; $(‘info’).html(networkState); });

Network States Using the type of connection, coupled with the translation of network state constants, can provide a textual description $(document).on(“deviceready", function() { var networkState = navigator.connection.type; var states = {}; states[Connection.UNKNOWN] = 'Unknown connection'; states[Connection.ETHERNET] = 'Ethernet connection'; states[Connection.WIFI] = 'WiFi connection'; states[Connection.CELL_2G] = 'Cell 2G connection'; states[Connection.CELL_3G] = 'Cell 3G connection'; states[Connection.CELL_4G] = 'Cell 4G connection'; states[Connection.CELL] = 'Cell generic connection'; states[Connection.NONE] = 'No network connection'; $(‘info’).html(states[networkState]); });

Network related events offline - fires when an application goes offline, and the device is not connected to the Internet $(document).on(“offline", function() { }); online - fires when an application goes online, and the device becomes connected to the Internet $(document).on(“online", function()

Vibration

Vibration Plug-in provides a way to vibrate the device using the navigator.vibrate() method Parameters passed to it alter the vibration pattern One long vibration Syntax: navigator.vibrate(duration) where duration is specified in milliseconds Example: navigator.vibrate(2000); Several vibrations with a pause in between : Syntax: navigator.vibrate(duration,pause[,duration,pause,duration,pause, etc]) Example: navigator.vibrate([1000,2000,3000,1000,5000]);

Vibration Plug-in Cancel Vibration: Pass in a parameter of 0, an empty array, or an array with one element of value 0  navigator.vibrate(0) navigator.vibrate([]) navigator.vibrate([0])

Console

Cordova Console Plugin log() – writes messages to the console $(document).on("deviceready", function() { console.log(“message to console – Hello there”); });

Battery

Battery Status Plug-in a means for web developers to programmatically determine the battery status of the hosting device and whether the device is plugged in or not without knowing the battery status of a device, you are designing the web application with the assumption there is sufficient battery level for the task at hand battery of a device may exhaust faster than expected if apps are unable to make decisions based on the battery status given knowledge of the battery status, web developers are able to craft web content and applications which are power- efficient, thereby leading to improved user experience

Battery Status Plug-in Battery Status events can be used to defer or scale back work when the device is not plugged in or is low on battery Ex: In an advanced application, like an email app, the app can check the server for new email every few seconds if the device is plugged in, but do so less frequently if the device is not plugged in or is low on battery In an advanced application, like a note keeper, the app could monitor the battery level and save changes before the battery runs out to prevent data loss

Battery Status Events BatteryStatus events are fired when charge percentage changes by at least 1 percent when the device is plugged in or unplugged This event returns an object containing the battery status, which scales in value from critical to ok Battery Status Object has the following properties: isPlugged (Boolean) whether the device is plugged in level (float) Represents how much of the internal power source remains, scaled from 0 to 100 (null if no juice)

Battery Status Events Battery Status values Critical Low OK null - unable to report the battery's level critical_threshold values are device-specific.

Battery Status Example The battery status event handler is passed an object that contains two properties: level: The percentage of battery charge (0-100) isPlugged: A boolean that indicates whether the device is plugged in $(document).on("batterystatus", function(info) console.log("Level: " + info.level + " isPlugged: " + info.isPlugged); });

Battery Critical The event fires when the percentage of battery charge has reached the critical battery threshold (device specific) The batterycritical handler is passed an object that contains two properties: level: The percentage of battery charge (0-100) isPlugged: A boolean that indicates whether the device is plugged in $(document).on("batterycritical", function(info) { alert("Battery Level Critical " + info.level + “ - Recharge Soon!"); } );

Battery Low Example The event fires when the percentage of battery charge has reached the low battery threshold (device specific) The batterylow handler is passed an object that contains two properties: level: The percentage of battery charge (0-100) isPlugged: A boolean that indicates whether the device is plugged in $(document).on("batterylow", function(info) { alert("Battery Level Low " + info.level + "%"); });

Accelerometer

Accelerometer Modern mobile phones come with a variety of sensors that automate many of our daily tasks Accelerometers in mobile phones are used to detect the orientation of the phone – axis based motion sensor Applications: When you use a compass app on your smartphone, it somehow knows which direction the phone is pointing Apps that calculate the steps you take whether you’re walking, jogging or running Detection of earthquakes https://vimeo.com/2182220

Accelerometer the device's accelerometer is a motion sensor that detects the change (delta) in movement relative to the current device orientation, in three dimensions along the x, y, and z axis Methods navigator.accelerometer.getCurrentAcceleration() navigator.accelerometer.watchAcceleration() navigator.accelerometer.clearWatch() Has success and fail callbacks If the method is successful, it returns an acceleration data object If the method fails, it returns an error object

Acceleration data object data captured at a specific point in time Acceleration values include the effect of gravity (9.81 m/s^2), so that when a device lies flat and facing up, x, y, and z values returned should be 0, 0, and 9.81. Properties x: Amount of acceleration on the x-axis. (in m/s^2) (Number) y: Amount of acceleration on the y-axis. (in m/s^2) (Number) z: Amount of acceleration on the z-axis. (in m/s^2) (Number) timestamp: Creation timestamp in milliseconds. (DOMTimeStamp)

Accelerometer – getCurrentAcceleration() navigator.accelerometer.getCurrentAcceleration(onSuccess, onError); function onSuccess(acceleration) { alert('Acceleration X: ' + acceleration.x + 'Acceleration Y: ' + acceleration.y + 'Acceleration Z: ' + acceleration.z + 'Timestamp: ' + acceleration.timestamp ); }; function onError(error) { alert(“an error occurred – “ + error.code);

Accelerometer – watchAcceleration() Retrieves the device's current Acceleration at a regular interval Executes the Success callback function each time Specify the interval in milliseconds via the Options object's frequency parameter Returns a watch ID which references the accelerometer's watch interval, and can be used with navigator.accelerometer.clearWatch to stop watching the accelerometer. var watchID = navigator.accelerometer.watchAcceleration(onSuccess,onError,options); options period: requested period of calls to accelerometerSuccess with acceleration data in Milliseconds. (Number) (Default: 10000)

Accelerometer – watchAcceleration() - example var options = { frequency: 3000 }; // Update every 3 seconds var watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError, options); function onSuccess(acceleration) { alert('Acceleration X: ' + acceleration.x + 'Acceleration Y: ' + acceleration.y + 'Acceleration Z: ' + acceleration.z + 'Timestamp: ' + acceleration.timestamp ); }; function onError() { alert(‘An Error occurred!');

Accelerometer – clear watch Stop watching the Acceleration being watched navigator.accelerometer.clearWatch(watchID); var watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError, options); // ... later on ...