mirror of
https://github.com/faisalman/ua-parser-js.git
synced 2025-09-27 16:08:47 +03:00
Add live demo page
This commit is contained in:
Faisalman
parent
55b697fd56
commit
3382a8ad43
140
index.html
Normal file
140
index.html
Normal file
@ -0,0 +1,140 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>UA-Parser.js</title>
|
||||
<meta name="author" content="Faisalman" />
|
||||
<meta name="description" content="Small script to extract system info (browser, engine, os) from user-agent string" />
|
||||
<meta name="keywords" content="user agent, parser, javascript, detect, details, new, browser, engine, mobile, device, operating system" />
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
html {
|
||||
font: 14px/20px Helvetica, Ubuntu, Arial, sans-serif;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
body {
|
||||
background: #fff;
|
||||
margin: 0 auto;
|
||||
padding: 40px 20px;
|
||||
width: 960px;
|
||||
text-align: center;
|
||||
}
|
||||
header, section, footer {
|
||||
padding: 40px 0 0;
|
||||
}
|
||||
pre {
|
||||
margin: 0 0 20px;
|
||||
padding: 10px;
|
||||
background: #ccc;
|
||||
white-space: pre-wrap;
|
||||
overflow: auto;
|
||||
}
|
||||
table {
|
||||
border-spacing: 0;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
}
|
||||
th, td {
|
||||
border-left: 1px solid #ccc;
|
||||
border-top: 1px solid #ccc;
|
||||
min-width: 100px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
tr:first-child th:first-child {
|
||||
border: 0;
|
||||
}
|
||||
tr:last-child th, tr:last-child td {
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
th:last-child, td:last-child {
|
||||
border-right: 1px solid #ccc;
|
||||
}
|
||||
select, input {
|
||||
width: 100%;
|
||||
}
|
||||
p {
|
||||
margin: 10px 0;
|
||||
}
|
||||
</style>
|
||||
<script src="ua-parser.js"></script>
|
||||
<script src="ua-list-example.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>UA-Parser.js - JavaScript-based User-Agent Parser</h1>
|
||||
</header>
|
||||
<section>
|
||||
<pre>
|
||||
</pre>
|
||||
<table>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Browser</th>
|
||||
<th>Engine</th>
|
||||
<th>OS</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<th>Version</th>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</table>
|
||||
</section>
|
||||
<section>
|
||||
<select>
|
||||
<option>Pick a user-agent string to be tested</option>
|
||||
</select>
|
||||
<p>or Enter your user-agent string here to be tested:</p>
|
||||
<input type="text" />
|
||||
</section>
|
||||
<footer>
|
||||
<p>
|
||||
UA-Parser.js © 2012 Faisalman - GPLv2 @
|
||||
<a href="https://github.com/faisalman/ua-parser-js">https://github.com/faisalman/ua-parser-js</a>
|
||||
</p>
|
||||
</footer>
|
||||
<script>
|
||||
var pre = document.getElementsByTagName('pre')[0];
|
||||
var sel = document.getElementsByTagName('select')[0];
|
||||
var txt = document.getElementsByTagName('input')[0];
|
||||
for(var i = 0; i < uaExampleList.length; i++){
|
||||
var opt = document.createElement('option');
|
||||
opt.innerText = uaExampleList[i];
|
||||
sel.appendChild(opt);
|
||||
}
|
||||
var fillTable = function(uastring){
|
||||
var parser = new uaparser(uastring);
|
||||
var browser = parser.getBrowser();
|
||||
var engine = parser.getEngine();
|
||||
var os = parser.getOS();
|
||||
var tbl = document.getElementsByTagName('td');
|
||||
tbl[0].innerText = browser.name;
|
||||
tbl[1].innerText = engine.name;
|
||||
tbl[2].innerText = os.name;
|
||||
tbl[3].innerText = browser.release;
|
||||
tbl[4].innerText = engine.version;
|
||||
tbl[5].innerText = os.version;
|
||||
pre.innerHTML = 'Result for <strong>' + (uastring ? uastring.replace(/</g,'<') : parser.ua) + '</strong>';
|
||||
}
|
||||
fillTable();
|
||||
sel.addEventListener('change', function(){
|
||||
fillTable(sel.children[sel.selectedIndex].value);
|
||||
});
|
||||
txt.addEventListener('keydown', function(e){
|
||||
if(e.keyCode == 13){
|
||||
fillTable(this.value);
|
||||
return false;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
33
ua-list-example.js
Normal file
33
ua-list-example.js
Normal file
@ -0,0 +1,33 @@
|
||||
// Only used for testing purpose
|
||||
|
||||
var uaExampleList = [
|
||||
"Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en; rv:1.9.0.19) Gecko/2010111021 Camino/2.0.6 (MultiLang) (like Firefox/3.0.19)",
|
||||
"Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/534.20 (KHTML, like Gecko) Chrome/11.0.672.2 Safari/534.20",
|
||||
"Mozilla/5.0 (X11; Linux i686) AppleWebKit/535.7 (KHTML, like Gecko) Ubuntu/11.10 Chromium/16.0.912.21 Chrome/16.0.912.21 Safari/535.7",
|
||||
"Mozilla/5.0 (X11; U; Linux i686; it-it) AppleWebKit/531.2+ (KHTML, like Gecko) Safari/531.2+ Epiphany/2.30.2",
|
||||
"Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.2) Gecko/20100308 Ubuntu/10.04 (lucid) Firefox/3.6 GTB7.1",
|
||||
"Mozilla/5.0 (X11; U; Linux i686; pt-PT; rv:1.9.2.3) Gecko/20100402 Iceweasel/3.6.3 (like Firefox/3.6.3) GTB7.0",
|
||||
"Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_6; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Flock/3.5.3.4628 Chrome/7.0.517.450 Safari/534.7",
|
||||
"Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0; SLCC2; Media Center PC 6.0; InfoPath.3; MS-RTC LM 8; Zune 4.7)",
|
||||
"Mozilla/5.0 (compatible; Konqueror/4.1; OpenBSD) KHTML/4.1.4 (like Gecko)",
|
||||
"Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/533.3 (KHTML, like Gecko) Lunascape/6.4.2.23236 Safari/533.3",
|
||||
"Lynx/2.8.8dev.3 libwww-FM/2.14 SSL-MM/1.4.1",
|
||||
"Midori/0.2 (X11; Linux; U; cs-cz) WebKit/531.2+",
|
||||
"Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/532.4 (KHTML, like Gecko) Maxthon/3.0.6.27 Safari/532.4",
|
||||
"Opera/9.80 (Windows NT 6.0; U; en) Presto/2.8.99 Version/11.10",
|
||||
"Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.24 (KHTML, like Gecko) RockMelt/0.9.58.494 Chrome/11.0.696.71 Safari/534.24",
|
||||
"Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10_5_6; it-it) AppleWebKit/528.16 (KHTML, like Gecko) Version/4.0 Safari/528.16",
|
||||
"Mozilla/5.0 (BeOS; U; BeOS BePC; en-US; rv:1.9a1) Gecko/20060702 SeaMonkey/1.5a",
|
||||
"Opera/10.61 (J2ME/MIDP; Opera Mini/5.1.21219/19.999; en-US; rv:1.9.3a5) WebKit/534.5 Presto/2.6.30",
|
||||
"Opera/9.80 (Windows Mobile; WCE; Opera Mobi/WMD-50430; U; en-GB) Presto/2.4.13 Version/10.00",
|
||||
"Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_0 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8A293 Safari/6531.22.7",
|
||||
"Mozilla/5.0 (Android; Linux armv7l; rv:9.0) Gecko/20111216 Firefox/9.0 Fennec/9.0",
|
||||
"Mozilla/5.0 (Linux; U; en-US) AppleWebKit/528.5+ (KHTML, like Gecko, Safari/528.5+) Version/4.0 Kindle/3.0 (screen 600X800; rotate)",
|
||||
"Mozilla/5.0 (Linux; U; Android 2.1-update1; en-au; HTC_Desire_A8183 V1.16.841.1 Build/ERE27) AppleWebKit/530.17 (KHTML, like Gecko) Version/4.0 Mobile Safari/530.17",
|
||||
"Mozilla/5.0 (SAMSUNG; SAMSUNG-GT-S8500/S8500XXJF4; U; Bada/1.0; fr-fr) AppleWebKit/533.1 (KHTML, like Gecko) Dolfin/2.0 Mobile WVGA SMM-MMS/1.2.0 OPN-B",
|
||||
"Mozilla/5.0 (BlackBerry; U; BlackBerry 9800; en-US) AppleWebKit/534.1+ (KHTML, like Gecko) Version/6.0.0.201 Mobile Safari/534.1+",
|
||||
"Mozilla/5.0 (PlayBook; U; RIM Tablet OS 1.0.0; en-US) AppleWebKit/534.11 (KHTML, like Gecko) Version/7.1.0.7 Safari/534.11",
|
||||
"Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0; ",
|
||||
"Mozilla/5.0 (X11; U; Linux i686; en-GB; rv:2.0) Gecko/20110404 Fedora/16-dev Firefox/4.0",
|
||||
"Mozilla/5.0 (X11; U; Linux armv7l; no-NO; rv:1.9.2.3pre) Gecko/20100723 Firefox/3.5 Maemo Browser 1.7.4.8 RX-51 N900"
|
||||
];
|
||||
Loading…
x
Reference in New Issue
Block a user