Untitled

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
	<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />

    <title><?php bloginfo('name'); ?><?php wp_title();?></title>

    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

    <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
    <link rel="pingback" href="<?php bloginfo('pingback_url');?>" />

    <?php wp_head(); ?>
    <link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/images/favicon.ico" />
</head>

<body>
<div id="main">

        <div class="container">

            <div id="header">
                <ul id="menu">
                    <li><a href="<?php bloginfo('url'); ?>" title="Home">Home</a></li>
					<?php wp_list_pages('title_li='); ?>
                </ul>

                <div id="logo">
               	  <h1>TheAfterMatter</h1>
            	</div>
            </div>

            <div id="banner">
				<h1>theaftermatter</h1>
                <h2><?php bloginfo('description'); ?></h2>
            </div>

            <div id="bar">

		<div id="twitter" style="z-index:100">

        	<h2><a href="http://www.twitter.com/#!/theaftermatter/"><img src="<?php bloginfo('template_directory'); ?>/images/twitter.png" alt="twitter" /></a></h2>

            <p style="display:inline"></p>

			<noscript><p>This feature requires JavaScript</p></noscript>

		</div>

		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
		<script src="<?php bloginfo('template_directory'); ?>/scripts/gistfile1.js"></script>
		<script type="text/javascript">

			jQuery(document).ready(function($) {
				// $() will work as an alias for jQuery() inside of this function

			var Twitter = {
				init: function () {
					// Pass in the username you want to display feeds for
					this.insertLatestTweets('theaftermatter');
				},

				// This replaces the 'Loading...' with the tweets
				insertLatestTweets: function (username) {
					var limit	= 5;	// How many feeds do you want?
					var url		= 'http://twitter.com/statuses/user_timeline.json?screen_name=' + username + '&count=' + limit + '&callback=?';

					// Now ajax in the feeds from twitter.com
					$.getJSON(url, function (data) {
						// We'll start by creating a normal marquee-element for the tweets
						var html = '<marquee behavior="scroll" scrollamount="3" direction="left">';

						// Loop through all the tweets and create a link for each
						for (var i in data) {
							html += '<a href="http://twitter.com/' + username + '/status/' + data[i].id_str + '">' + data[i].text + ' <i>' + Twitter.daysAgo(data[i].created_at) + '</i></a>';
						}

						html += '</marquee>';

						// Now replace the 'p' with our 'marquee' element
						$('#twitter p').replaceWith(html);

						// The marquee element looks quite shite so we'll use Remy Sharp's plug-in to replace it with a smooth one
						Twitter.fancyMarquee();
					});
				},

				// Replaces the marquee-element with a fancy one
				fancyMarquee: function () {
					// Replace the marquee and do some fancy stuff (taken from remy sharp's website)
					$('#twitter marquee').marquee('pointer')
						.mouseover(function () {
							$(this).trigger('stop');
						})
						.mouseout(function () {
							$(this).trigger('start');
						})
						.mousemove(function (event) {
							if ($(this).data('drag') == true) {
								this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX);
							}
						})
						.mousedown(function (event) {
							$(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft);
						})
						.mouseup(function () {
							$(this).data('drag', false);
						});
				},

				// Takes a date and return the number of days it's been since said date
				daysAgo: function (date) {
					// TODO: Fix date for IE...
					if ($.browser.msie) {
						return '1 day ago';
					}

					var d = new Date(date).getTime();
					var n = new Date().getTime();

					var numDays = Math.round(Math.abs(n - d) / (1000 * 60 * 60 * 24));
					var daysAgo = numDays + ' Days Ago';

					if (numDays == 0) {
						daysAgo = 'Today';
					}
					else if (numDays == 1) {
						daysAgo = numDays + ' Day Ago';
					}

					return daysAgo;
				}
			};

			Twitter.init();

			});
		</script>

        		<div id="icons">
                	<a href="http://www.facebook.com/TheAfterMatter" style="padding-right:9px;"><img src="<?php bloginfo('template_directory'); ?>/images/facebook.png" alt="facebook" /></a>
                    <a href="http://www.twitter.com/#!/TheAfterMatter" style="padding-right:9px;"><img src="<?php bloginfo('template_directory'); ?>/images/twitter2.png" alt="twitter" /></a>
                    <a href="mailto:contactus@theaftermatter.com?subject=AfterMatter Question" style="padding-right:9px;"><img src="<?php bloginfo('template_directory'); ?>/images/email.png" alt="twitter" /></a>
                    <a href="<?php bloginfo('rss2_url'); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/rss.png" alt="twitter" /></a>
                </div>

                <div id="searchwrapper">
					<?php include(TEMPLATEPATH.'/searchform.php'); ?>
				</div>

                <div id="fade">
                	<img src="<?php bloginfo('template_directory'); ?>/images/fadeleft.png" style="padding-left:30px; width:80px; height:33px;" alt="fadeleft" />
                    <img src="<?php bloginfo('template_directory'); ?>/images/faderight.png" style="padding-left:390px; width:80px; height:33px;" alt="faderight"/>
                </div>

            </div>
        </div>