PhoneGap-----Device Infomation、Network State and four kinds of Notifications
The first , we can lead how to get the device Infomation ! It's very convenient by Phonegap ! At least , I think so !
<!DOCTYPE html>
<html >
<head>
<title>My Device</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
function onLoad()
{
document.addEventListener("deviceready",onDeviceReady,false);
}
function onDeviceReady()
{
var myDiv = document.getElementById('props');
myDiv.innerHTML = 'Device Name: ' + device.name + '<br />' +
'Device PhoneGap:' + device.phonegap + '<br />' +
'Device Platform:' + device.platform + '<br />' +
'Device UUID: ' + device.uuid + '<br />' +
'Device Version: ' + device.version + '<br />' ;
}
</script>
</head>
<body onLoad="onLoad()">
<p id="props">Loading device properties...</p>
</body>
</html>
The second , we can check the network state :
<!DOCTYPE html>
<html >
<head>
<title>Connectivity Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
document.addEventListener("deviceready",onDeviceReady,false);
function onDeviceReady()
{
checkConnection();
}
function checkConnection()
{
var networkState = navigator.network.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.NONE] = 'No network connection';
alert('Connection type:' + states[networkState]);
}
</script>
</head>
<body>
<p>A dialog box will report the network state.</p>
</body>
</html>
The third , the cases of four kinds of notifications :
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Event Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
function onLoad()
{
document.addEventListener("deviceready",onDeviceReady,false);
}
function onDeviceReady(){
}
function showAlert(){
navigator.notification.alert(
'Game Over!',//message
alertCallback,//callback
'Game Over',
'Done'//buttonName
);
}
function alertCallback(){
}
function onConfirm(button){
alert('You selected button ' + button);
}
function showConfirm(){
navigator.notification.confirm(
'Game Over!',
onConfirm,
'Game Over',
'Restart,Exit'
);
}
function playBeep(){
navigator.notification.beep(2);
}
function vibrate(){
navigator.notification.vibrate(4000);
}
</script>
</head>
<body onLoad="onLoad()">
<p><a href="#" onClick="showAlert();return false;">Show Alert</a></p>
<p><a href="#" onClick="showConfirm();return false;">Show Confirmation</a></p>
<p><a href="#" onClick="playBeep();return false;">Play Beep</a></p>
<p><a href="#" onClick="vibrate();return false;">Vibrate</a></p>
</body>
</html>