For those that don’t know me all that well, I was in the first semester of my senior year in college when the attacks happened. So, without further ado, here’s my LJ post from 9/11/02…

and all the king’s horses and all the king’s men could not put humpty dumpty back together again…
i was thinking of doing a blast to the past and bring back an entry i did on september 11th 2001… but then i realized i didn’t have a livejournal that far back (mine started dececmber 7th, or so i found out tonight… for some reason i thought it was older than that, oh well). i did, however, remember writing something on that day. i had a paper i had to write for my senior seminar class. i decided, in memory of this tragic day in history to post this paper. it’s not extremely well written or even long due to the fact that this paper was the least of my worries on sad sad day (my professor didn’t hold it against us that most weren’t long or even done). i’m sure a lot of people are doing stuff like this in their journals today. just remember to give a moment of silence at 8:46 tomorrow morning. enjoy the read…

Michael J. Auteri
Senior Seminar
September 11, 2001
Chapter 1: Examples of research in everyday life
1.)
Based on today’s events, I have chosen to write this brief paper on the catastrophic events that shook our nation today. I found myself woken up at quarter to ten to my roommate screaming the World Trade Center had been damaged. Not even completely processing what was said, I rushed into our living room to find a bunch of my friends sitting around the television watching reporters explain what had happened in New York City this morning. Throughout the rest of the day, I watched our television like I was glued to the couch. This, I believe, is a perfect example of how research has a significant impact on my life.
When I first began watching CNN I had no idea what was going on. Was this a terrorist attack or simply just an accident? Over the course of the day as I watched the television, surfed the Internet, and spoke with other people, I was able to make some sense of the information the media was conveying to me. This task was quite frustrating. As a human being, I want all the answers upfront in the fastest way possible. However, this is not how it worked. Many things said were unclear and as the events of the day unfolded, some information was merely rumors. It was hard to decipher the “good” information from the “bad” information, like how many people were actually killed or who was responsible. The media did the best they could by figuring how many people were on the planes and how many (on average) worked in the buildings and how many were evacuated. This number, however, could be a way off estimate. The faceless cowards (terrorists) who were responsible were merely an assumption based on past events and threats.
Today’s events have caused shock not only in this area, or this nation, but also around the world. I am not even sure if all of my friends and family are safe. So when this question asked how research impacts my current life, I have an answer that only requires one sentence. Research on this event impacts my life so greatly, that I am having difficulty writing this paper on research impacting my life.
2.)
I was once told, if you want to write something you have to know the subject you are writing about. This, however, can be more difficult than you may believe. If you do not have all the information on a subject, it is very difficult to write about it. This I found true on many news articles I found on newyorktimes.com on the Attack on America events today. I found many holes in the articles that still remain unexplained. This is normal for breaking news though. Reporters have deadlines and have to report something even if it is only a fragment of the story. I found a great deal of the research were quotes gathered from eyewitnesses and anything the media was able to get out of those in public relations (especially having to do with the airplane hijacks). The way this influences today’s society is how the media makes haste. Though it is not always accurate, reporters quickly make reports in order to keep people informed on new events as they immerge.

But for this one project I’m working on, I wanted to make a menu that can also appear in my sidebar as a widget. Hmmmm…

Sure, once I head over to the widgets area, I notice that Genesis has Genesis – Page Navigation Menu, but that’s only good if A.) You are building a child-theme from Genesis and/or B.) You are fine with just picking and choosing the pages you created in WordPress. One of the great features of Custom Menus is that you can link to pages/assets outside of your WordPress installation. So, let’s look at how we can bring widgets and custom menus together for some awesome development flexibility.

First, go to Menus under Appearance in the WordPress admin area. Once there, create a menu called Widget Navigation and add a few pages, links, or whatever to fill out the menu.

Once you have your navigation complete, save it and open your theme’s functions.php file and add this bit of code:

function sub_menu_widget() {
	wp_nav_menu( array('menu' => 'Sub Navigation' ));
}
wp_register_sidebar_widget(
	'menu_widget_1',
	'Submenu Widget',
	'sub_menu_widget',
	array(
		'description' => 'Custom widget menu'
	)
);

Okay, let’s take a look at what’s going on here. We created a function called menu_widget, which when called outputs the Custom Menu we created called Widget Navigation (if you used a different name here, be sure to change the code to reflect the name you chose). In the second part of the code we register the widget. The first argument we pass is the widget ID I called menu_widget_1. This is used internally by WordPress to refer to your widget; it can basically be anything as log as it’s unique. The second argument is the name of your widget, which I called Widget Navigation. The third is our callback function which we went over already, and lastly, the fourth is an optional array. For this one, I simply defined the description. You don’t even need to include this, but I like having a description…

Once all this is in place and saved, head over to Appearance and then to Widgets. If you did everything correctly, you will find your widget under Available Widgets. Now just drag it over to one of your sidebars and you are good to go! If you have any questions, comments, or find any errors in my code, please let me know in the comments.

Please keep in mind that this is my personal list, which is limited to my own taste in music. If you’d like to add some of your own in the comments, please do. So without any further ado, here’s my list in alphabetical order by artist.

• The Arcade Fire / Neon Bible / My Body Is A Cage
• The Beatles / Abbey Road / Because*
• Belle & Sebastian / If You’re Feeling Sinister / Judy And The Dream Of Horses
• Blanche / If We Can’t Trust The Doctors… / Someday
• Built To Spill / Keep It Like A Secret / Broken Chairs
• Catherine Wheel / Happy Days / Kill My Soul
• Guns N’ Roses / Appetite For Destruction / Rocket Queen
• The Kinks / The Village Green Preservation Society / People Take Pictures Of Each Other
• Led Zeppelin / Led Zeppelin IV / When The Levee Breaks
• Modest Mouse / The Moon & Antarctica / What People Are Made Of
• Muse / Black Holes And Revelations / Knights Of Cydonia
• Nirvana / In Utero / All Apologies
• Pavement / Crooked Rain, Crooked Rain / Fillmore Jive
• Pavement / Brighten The Corners / Fin
• Pixies / Doolittle / Gouge Away
• Pulp / His ‘n’ Hers / Razzmatazz**
• Radiohead / Pablo Honey / Blow Out***
• Radiohead / The Bends / Street Spirit (Fade Out)
• Elliott Smith / Either/Or / Say Yes
• Supergrass / In It For The Money / Sometimes I Make You Sad
• Television / Marquee Moon / Torn Curtain
• Weezer / Weezer (Blue Album) / Only In Dreams

* Not the last song, but the last song on the first side of Abbey Road is you are listening to it on record. It has a “last song” feel to it for me.
** This is the last song on the US version of the album, apparently. None the less, it has that last song feel.
*** Creep (Clean Version) doesn’t count!

My inspiration for this one came from when my wife’s lovely cat, Gizmo, peed on me 5 and a half years ago. Steph and I were casually dating about a week at that point. So basically, Gizmo claimed me as his before she did.

The Back-End: PHP

So basically we are going to create a function called getCalendar(), which of course will look something like this…

function getCalendar() {
	//our code will go here
}

Now that we got how to write a function out of the way, let’s move on to the guts of the code that will replace my little //our code will go here comment within the function. So first, let’s take a look at the variables we need.

function getCalendar() {
	$day = date('d');
	$month = date('m');
	$year = date('Y');
	$first_day = mktime(0,0,0,$month, 1, $year);
	$title = date('M', $first_day);
	$day_of_week = date('D', $first_day);

Ok, so obviously we’ll be using the handy date() function. And by passing different arguments like d for day, m for month, and Y for year, we can grab all that we need to start building a calendar that reflects the current date. That last variable, $day_of_week will be used in the next section of code to figure out which day the first of the month falls on. We’ll be using a switch statement to start figuring that out.

	switch($day_of_week) {
		case "Sun": $blank = 0; break;
		case "Mon": $blank = 1; break;
		case "Tue": $blank = 2; break;
		case "Wed": $blank = 3; break;
		case "Thu": $blank = 4; break;
		case "Fri": $blank = 5; break;
		case "Sat": $blank = 6; break;
	}
	$days_in_month = cal_days_in_month(0, $month, $year);

The next bit of markup you might want to edit. Some parts of this table can be done better with CSS. Please take note of the id’s and classes I use here. I added them in from the original code in order to write the jQuery functions. I also added in the $row_count variable so I will always have enough rows to fill in all the dates for every month. Anyway, here is the last bit of code you need to add to the calendar.

	echo "<table id='calendar' border='1' cellspacing='0' width='280'>";
	echo "<tr><th id='prev'><</th><th colspan='5'> <span id='month'>$title</span>, <span id='year'>$year</span></th><th id='next'>></th></tr>";
	echo "<tr><td width='42'>S</td><td width='42'>M</td><td width='42'>T</td><td width='42'>W</td><td width='42'>T</td><td width='42'>F</td><td width='42'>S</td></tr>";
	$day_count = 1;
	echo "<tr>";
	while ( $blank > 0 ) {
	echo "<td class='day'></td>";
		$blank = $blank-1;
		$day_count++;
	}
	$day_num = 1;
	$row_count = 1;
	while ( $day_num <= $days_in_month ) {
		echo "<td class='day'> $day_num </td>";
		$day_num++;
		$day_count++;
		if ($day_count > 7) {
			echo "</tr><tr>";
			$day_count = 1;
			$row_count++;
		}
	}
	while ($row_count <=6 ) {
		echo "<td class='day'></td>";
		$day_count++;
		if ($day_count > 7) {
			$day_count = 1;
			$row_count++;
			$row_count <=6 ? print('</tr><tr>') : print('');
		}
	}
	echo "</tr></table>";
}

Now all you have to do is call the function on a page.

echo getCalendar();

Now let’s move onto the really fun jQuery part.

The Front-End: jQuery

As you probably know, jQuery is an incredibly popular and powerful JavaScript library that lets you do some incredible things using very little code. For the calendar, I wrote 2 functions that use the #next and #prev id’s in the HTML of my calendar to go forward and backward. Anyway, before we get into the big functions, here’s a quick styling function I wrote to grey out the unused boxes in the calendar. Also remember to place all this code in document ready, which looks like this:

$(function() {
	//jQuery code goes here
});

Okay, so for my grey boxes, place this code in document ready.

$('.day').each(function() {
	$(this).text() == '' ? $(this).css('background', '#ccc') : $(this).css('background', '#fff');
});

Now lets create the JavaScript arrays for months and days. We also need a variable to grab today’s date.

 var months = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec');
 var days = new Array('S', 'M', 'T', 'W', 'T', 'F', 'S');
 var date = new Date();

Here’s the last bit of code you need: 2 jQuery click functions to take you forward and backward. This is all done in JavaScript/jQuery, so the page never needs to reload. If you do reload the page, it will take you back to the current month. If you want it to hold onto the month/year you were looking at, I suggest creating/updating a cookie. Maybe I’ll cover how to do that too in part 2.

$('#next').click(function() {
	//gets current year from page
	var curMon = $('#month').text();
	for(var i in months) {
		if(months[i] == curMon) {
			//if not dec, increment i
			if(i != 11) {
				i++;
			} else {
			//else, back to jan and increment year
				i = 0;
				var curYear = $('#year').text();
				curYear = parseInt(curYear) + 1;
				curYear = curYear.toString();
				$('#year').text(curYear);
			}
			$('#month').html(months[i]);
			var yy = parseInt( $('#year').text() );
			var days = daysInMonth(i, yy);
			//clear all the dates
			$('.day').each(function() {
				$(this).text('');
			});
			var firstDay = new Date(months[i]+', 1 ' + yy);
			firstDay = firstDay.getDay();
			var j = 1;
			while(j <= days) {
				//fills in dates starting in the correct spot
				$('.day').eq(firstDay).text(j);
				firstDay++;
				j++;
			}
		}
	}
	//grey out unused boxes again
	$('.day').each(function() {
		$(this).text() == '' ? $(this).css('background', '#ccc') : $(this).css('background', '#fff');
	});
});
$('#prev').click(function() {
	var curMon = $('#month').text();
	for(var i in months) {
		if(months[i] == curMon) {
			if(i != 0) {
				i--;
			} else {
				i = 11;
				var curYear = $('#year').text();
				curYear = parseInt(curYear) - 1;
				curYear = curYear.toString();
				$('#year').text(curYear);
			}
			$('#month').html(months[i]);
			var yy = parseInt( $('#year').text() );
			var days = daysInMonth(i, yy);
			$('.day').each(function() {
				$(this).text('');
			});
			var firstDay = new Date(months[i]+', 1 ' + yy);
			firstDay = firstDay.getDay();
			var j = 1;
			while(j <= days) {
				$('.day').eq(firstDay).text(j);
				firstDay++;
				j++;
			}
		}
	}
	$('.day').each(function() {
		$(this).text() == '' ? $(this).css('background', '#ccc') : $(this).css('background', '#fff');
	});
});
//this little function returns how many days or in each month
function daysInMonth(m, y) {
return new Date(y, m+1, 0).getDate();
}

So that’s it. I added some comments in the first function so you can follow along. I’ve also included a link to a working model of the calendar. Just view source to see all the jQuery and (minimal) CSS.