The PhoneGap JavaScript library adds new properties to the window global object. One of them is the device property. The device property holds a reference for an object that describes the device. The following code sample shows how simple it is to use this object in order to get detailed information about the device.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>Hello World</title>
</head>
<body>
<div id="msg">...</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript">
function onDeviceReady()
{
var str = "<h1>information about the device</h1>";
str += "<h2>device.name="+device.name+"</h2>";
str += "<h2>device.version="+device.version+"</h2>";
str += "<h2>device.platform="+device.platform+"</h2>";
str += "<h2>device.uuid="+device.uuid+"</h2>";
str += "<h2>device.phonegap="+device.phonegap+"</h2>";
document.getElementById("msg").innerHTML = str;
}
document.addEventListener('deviceready', onDeviceReady, false);
</script>
</body>
</html>
The following video clip overviews this code sample, shows its execution and explains it in detail.
You can find more video clips, code samples and training materials for learning how to use the PhoneGap JavaScript library in my free online courses at http://abelski.lifemichael.com.
