<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US">
<head>
<meta charset="UTF-8">
<script type=text/javascript src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type=text/javascript src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<script type=text/javascript src="browserdetect.js"></script>
<title>This is for testing purpose</title>
<script type=text/javascript>
</script>
</head>
<body ng-app="myApp" onorientationchange="updateOrientation();">
<div ng-controller="AppController">
<h1>Mobile device testing</h1>
<p>After rotating, the orientation you are viewing is: <span style="color:red;">{{deviceOrientation}}</span></p>
<p>Are you using an iPad device? : <span style="color:red;">{{isiPad}}</span></p>
<p><b>Browser detect</b></p>
<ul>
<li>Browser name: <span style="color:red;">{{browser}}</span></li>
<li>Browser version: <span style="color:red;">{{version}}</span></li>
<li>OS name:<span style="color:red;"> {{OS}}</span></li>
</ul>
<p>You are using <span style="color:red;">{{browser}} {{version}}</span> on <span style="color:red;"> {{OS}}</span></p>
</div>
</body>
</html>
var app = angular.module('myApp', []);
app.controller('AppController', function ($scope) {
$scope.deviceName = navigator.userAgent.toLowerCase();
$scope.isiPad = navigator.userAgent.match(/iPad/i) !== null;
$scope.safeApply = function (fn) {
var phase = this.$root.$$phase;
if (phase == '$apply' || phase == '$digest') {
if (fn && (typeof(fn) === 'function')) {
fn();
}
} else {
this.$apply(fn);
}
};
function readDeviceOrientation() {
if (Math.abs(window.orientation) === 90) {
$scope.deviceOrientation = "Landscape";
// alert($scope.deviceOrientation);
} else {
$scope.deviceOrientation = "Portrait";
// alert($scope.deviceOrientation);
}
$scope.safeApply();
}
readDeviceOrientation();
window.onorientationchange = readDeviceOrientation;
var browserDetect = {
init: function () {
$scope.browser = this.searchString(this.dataBrowser) || "An unknown browser";
$scope.version = this.searchVersion(navigator.userAgent)
|| this.searchVersion(navigator.appVersion)
|| "an unknown version";
$scope.OS = this.searchString(this.dataOS) || "an unknown OS";
},
searchString: function (data) {
for (var i = 0; i < data.length; i++) {
var dataString = data[i].string;
var dataProp = data[i].prop;
this.versionSearchString = data[i].versionSearch || data[i].identity;
if (dataString) {
if (dataString.indexOf(data[i].subString) != -1)
return data[i].identity;
}
else if (dataProp)
return data[i].identity;
}
},
searchVersion: function (dataString) {
var index = dataString.indexOf(this.versionSearchString);
if (index == -1) return;
return parseFloat(dataString.substring(index + this.versionSearchString.length + 1));
},
dataBrowser: [
{
string: navigator.userAgent,
subString: "Chrome",
identity: "Chrome"
},
{ string: navigator.userAgent,
subString: "OmniWeb",
versionSearch: "OmniWeb/",
identity: "OmniWeb"
},
{
string: navigator.vendor,
subString: "Apple",
identity: "Safari",
versionSearch: "Version"
},
{
prop: window.opera,
identity: "Opera",
versionSearch: "Version"
},
{
string: navigator.vendor,
subString: "iCab",
identity: "iCab"
},
{
string: navigator.vendor,
subString: "KDE",
identity: "Konqueror"
},
{
string: navigator.userAgent,
subString: "Firefox",
identity: "Firefox"
},
{
string: navigator.vendor,
subString: "Camino",
identity: "Camino"
},
{ // for newer Netscapes (6+)
string: navigator.userAgent,
subString: "Netscape",
identity: "Netscape"
},
{
string: navigator.userAgent,
subString: "MSIE",
identity: "Explorer",
versionSearch: "MSIE"
},
{
string: navigator.userAgent,
subString: "Gecko",
identity: "Mozilla",
versionSearch: "rv"
},
{ // for older Netscapes (4-)
string: navigator.userAgent,
subString: "Mozilla",
identity: "Netscape",
versionSearch: "Mozilla"
}
],
dataOS: [
{
string: navigator.platform,
subString: "Win",
identity: "Windows"
},
{
string: navigator.platform,
subString: "Mac",
identity: "Mac"
},
{
string: navigator.userAgent,
subString: "iPhone",
identity: "iPhone/iPod"
},
{
string: navigator.platform,
subString: "Linux",
identity: "Linux"
}
]
};
browserDetect.init();
})