Jon Nylander avatar Jon Nylander committed d4f10af

Design Updates.

Comments (0)

Files changed (2)

detect_timezone.js

 	'America/Godthab' : ['America/Miquelon', 'America/Godthab']
 }
 
+
 /**
  * A simple object containing information of utc_offset, which olson timezone key to use, 
  * and if the timezone cares about daylight savings or not.
 	this.ambiguity_check();
 	var response_text = '<b>UTC-offset</b>: ' + this.utc_offset + '<br/>';
 	response_text += '<b>Olson database name</b>: ' + this.olson_tz + '<br/>';
-	response_text += '<b>Daylight Savings</b>: ' + (this.uses_dst ? 'yes' : 'no') + '<br>'
+	response_text += '<b>Daylight Savings</b>: ' + (this.uses_dst ? 'yes' : 'no') + '<br/>';
 	
 	return response_text;
 }
 function get_timezone_info() {
 	var january_offset = get_january_offset();
 	var june_offset = get_june_offset();
-	  
+	
 	var diff = january_offset - june_offset;
 
 	if (diff < 0) {
 	document.getElementById('tz_info').innerHTML = response_text
 }
 
+var BrowserDetect = {
+	init: function () {
+		this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
+		this.version = this.searchVersion(navigator.userAgent)
+			|| this.searchVersion(navigator.appVersion)
+			|| "an unknown version";
+		this.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"
+		},
+		{
+			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();
+
 onload = show_timezone_info;
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 <html>
 
 <head>
   -->
   <style type="text/css">
   body {
-    font-family: arial, helvetica, sans-serif;
-    background-color: #eee;
+    font-family: helvetica, sans-serif;
+    background-color: #ddd;
     color: #333;
     text-shadow:1px 1px 1px #fff;
   }
   }
   
   div#content p {
-    padding: 10px;
-    font-size: 1.2em;
-    line-height: 1.5em;
+    padding: 3px 10px 3px 10px;
+    text-align: left;
+    font-size: 20px;
+    line-height: 30px;
+    font-weight: normal;
   }
   
   p.info {
-    width: 550px;
+    width: 730px;
     margin-left: auto;
     margin-right: auto;
-    font-size: 0.8em;
+    font-size: 11px;
     font-style: italic;
+    font-weight: normal;
     text-align: right;
     letter-spacing: 1px;
   }
   
+  p.instructions {
+    width: 520px;
+    margin-left: auto;
+    margin-right: auto;
+    font-size: 13px;
+    text-align: left;
+    letter-spacing: 1px;
+    line-height: 15px;
+  }
+  
+  ul {
+    width: 520px;
+    margin-left: auto;
+    margin-right: auto;
+    font-size: 13px;
+    letter-spacing: 1px;
+    line-height: 17px;
+  }
+  
   h1 {
     text-align: center;
+    margin-bottom: 0px;
+  }
+  
+  h3 {
+    width: 550px;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 20px;
+    margin-bottom: -5px;
+  }
+  
+  h3.omg {
+    color: green;
   }
   
   a {
 
 <body>
 
-<h1>Automatic time zone detection using JavaScript</h3>
+<h1>Automatic Timezone Detection Using JavaScript</h3>
+<p class="info">This script is open source and hosted as <a href="https://bitbucket.org/pellepim/jstimezonedetect"/>jsTimezoneDetect @ Bitbucket</a>.</p>
 <div id="content">
 <p id="tz_info"></p>
 </div>
-<p class="info">This script is open source and hosted as <a href="https://bitbucket.org/pellepim/jstimezonedetect"/>jsTimezoneDetect @ Bitbucket</a>.</p>
+<h3>How do I test this script?</h3>
+<p class="instructions">To test the detection script, simply change your system timezone and refresh this page. In Chrome you will have to open a new tab for the new timezone to be detected, and Safari needs to be restarted (unfortunately nothing that JavaScript can solve).</p>
+<h3>What is the Olson Database?</h3>
+<p class="instructions">The Olson database, also known as the <strong>tz database</strong>. Is a public domain collaborative compilation of information about the world's timezones.</p>
+<p class="instructions">It is widely used as basis for timezone information in operating systems and software. Most platforms and programming languages have libraries that support it.</p>
+<p class="instructions"><a href="http://en.wikipedia.org/wiki/Tz_database">More at Wikipedia!</a></p>
+<h3 class="omg">I don't like the timezone this script gives me!</h3>
+<p class="instructions">This script does not do geolocation. It simply picks the most populated timezone among several roughly identical ones.</p>
+<p class="instructions">For example, it is impossible to distinguish between different cities in Europe. This script will return Europe/Berlin regardless of where you live in the Central European timezone.</p>
+<p class="instructions"><a href="https://bitbucket.org/pellepim/jstimezonedetect/wiki/Detection_List">Click here for the list of timezones this script is able to detect</a>.</p>
+<h3 class="omg">NO CAN HAZ TIMEZONEZ?!?11</h3>
+<p class="instructions">If this script fails to correctly determine your timezone, <a href="https://bitbucket.org/pellepim/jstimezonedetect/issues/new">Please report it!</a></p>
+<p class="instructions">When you report an issue. Please tell us </p>
+<ul>
+    <li>what timezone your computer is set to,</li>
+    <li>what operating system you use, and</li>
+    <li>what browser you use.</li>
+</ul>
 
 </body>
-
 </html>
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.