Window Navigator In TypeScript

Introduction

The window.navigator object contains information about the visitor's browser. It can also tell you if cookies and Java are enabled by the user. One of the more interesting properties is the user agent string. This information is sent to every web server. But the user agent string can't be trusted for many web browsers because it can be changed by the user.

The following example shows information about the visitor's browser with the help of the window navigator using TypeScript.

Step 1

Open Visual Studio 2012 and click "File" -> "New" -> "Project...". A window is opened. In this window, click "HTML Application for TypeScript" under Visual C#.

Give the name of your application as "Window_Navigator" and then click ok.

Step 2

After this session the project has been created; a new window is opened on the right side. This window is called the Solution Explorer. The Solution Explorer contains the ts file, js file, and CSS files.

Coding

window_navigator.ts

class window_navigator
{
navigator()
{
var txt;
txt = "Browser CodeName: " + navigator.appCodeName + "";
txt += "Browser Name: " + navigator.appName + "";
txt += "Browser Version: " + navigator.appVersion + "";
txt += "Cookies Enabled: " + navigator.cookieEnabled + "";
txt += "Platform: " + navigator.platform + "";
txt += "User-agent header: " + navigator.userAgent + "";
txt += "User-agent language: " + navigator.systemLanguage + "";
document.getElementById("content").innerHTML = txt;
}
}
window.onload = () =>
{
var win = new window_navigator();
win.navigator();
};

Window_Navigator.htm

<!DOCTYPEhtml>
<htmllang="en"
xmlns="http://www.w3.org/1999/xhtml">
<head>
<metacharset="utf-8"/>
<title>Navigator in TypeScript</title>
<linkrel="stylesheet"href="app.css"type="text/css"/>
<scriptsrc="app.js">
</script>
</head>
<body>
<h2style="color:#0026ff">Window Navigator in TypeScript
</h2>
<divid="content"style="color:#0c8813"/>
</body>
</html>

app.js

var window_navigator = (function() {
function window_navigator() {}
window_navigator.prototype.navigator = function() {
var txt;
txt = "Browser CodeName: " + navigator.appCodeName + "";
txt += "Browser Name: " + navigator.appName + "";
txt += "Browser Version: " + navigator.appVersion + "";
txt += "Cookies Enabled: " + navigator.cookieEnabled + "";
txt += "Platform: " + navigator.platform + "";
txt += "User-agent header: " + navigator.userAgent + "";
txt += "User-agent language: " + navigator.systemLanguage + "";
document.getElementById("content").innerHTML = txt;
};
return window_navigator;
})();
window.onload = function() {
var win = new window_navigator();
win.navigator();
};

Output

Referenced By

http://www.typescriptlang.org/

Window Navigator In TypeScript

Reactions

Comments

Introduction

Coding