Jon Nylander avatar Jon Nylander committed 8a9f4e5

Changed styling completely. Added jquery to the mix with a little fadein.

Comments (0)

Files changed (2)

detect_timezone.js

 	}
 	
 	document.getElementById('tz_info').innerHTML = response_text
+	
+	$('#tz_info').fadeIn(3000);
 }
-
-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;
   <style type="text/css">
   body {
     font-family: helvetica, sans-serif;
-    background-color: #ddd;
-    color: #333;
-    text-shadow:1px 1px 1px #fff;
+    background-color: #555;
+    color: #fff;
+    text-shadow:1px 1px 0px #000;
+    padding: 0px;
+    margin: 0px;
   }
   
   div#content {
-    background-color: #ccf;
-    width: 550px;
-    margin-left: auto;
-    margin-right: auto;
-    border: 1px solid #fff;
-    -moz-border-radius:5px 5px 5px 5px;
-    border-bottom-left-radius: 5px 5px;
-    border-bottom-right-radius: 5px 5px;
-    border-top-left-radius: 5px 5px;
-    border-top-right-radius: 5px 5px;
-    -box-shadow: 5px 5px 3px #aaa;
-    -moz-box-shadow: 5px 5px 3px #aaa;
-    -webkit-box-shadow: 5px 5px 3px #aaa;
+    background-color: #333;
+    width: 100%;
+    border-top: 1px solid #fff;
+    border-bottom: 1px solid #fff;
+    -box-shadow: 5px 5px 3px #333;
+    -moz-box-shadow: 5px 5px 3px #333;
+    -webkit-box-shadow: 5px 5px 3px #333;
   }
   
   div#content p {
+    width: 500px;
+    margin-left: auto;
+    margin-right: auto;
     padding: 3px 10px 3px 10px;
     text-align: left;
     font-size: 20px;
     font-weight: normal;
   }
   
+  div#content p#tz_info {
+    display: none;
+  }
+  
   p.info {
     width: 730px;
     margin-left: auto;
     margin-right: auto;
-    font-size: 11px;
-    font-style: italic;
+    font-size: 12px;
     font-weight: normal;
     text-align: right;
     letter-spacing: 1px;
   
   a {
     border-bottom:1px solid #A7A7A7;
-    color:#333;
+    color:#bdf;
     line-height:20px;
     white-space:nowrap;
     text-decoration: none;
   }
   </style>
   <script type="text/javascript" src='detect_timezone.js'></script>
+  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
 </head>
 
 <body>
 <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>
+<h3>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>
+<h3>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 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.