<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Edward A. Webb (.com) &#187; Site News</title>
	<atom:link href="http://edwardawebb.com/category/site-news/feed/" rel="self" type="application/rss+xml" />
	<link>http://edwardawebb.com</link>
	<description>get all his digital goodness 24/7</description>
	<lastBuildDate>Sat, 28 Jan 2012 17:46:28 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=</generator>
<xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" />
		<item>
		<title>Writing a Custom Widget for Google Calendars</title>
		<link>http://edwardawebb.com/site-news/writing-custom-widget-google-calendars</link>
		<comments>http://edwardawebb.com/site-news/writing-custom-widget-google-calendars#comments</comments>
		<pubDate>Sun, 14 Aug 2011 13:39:48 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=963</guid>
		<description><![CDATA[The amount of users who rely on Google Calendars to organize their personal and professional lives is staggering.   Seeing as most clients are comfortable and proficient with the technology, there is little reason to point them elsewhere when they ask for a custom widget to display upcoming events on their site. In fact, the only trouble [...]]]></description>
			<content:encoded><![CDATA[<p>The amount of users who rely on Google Calendars to organize their personal and professional lives is staggering.   Seeing as most clients are comfortable and proficient with the technology, there is little reason to point them elsewhere when they ask for <strong>a custom widget to display upcoming events</strong> on their site.</p>
<div id="attachment_966" class="wp-caption aligncenter" style="width: 317px"><a href="http://google.com/calendar" rel="nofollow" ><img class="size-full wp-image-966" title="google-calendar-final1" src="http://edwardawebb.com/wp-content/uploads/2011/08/google-calendar-final1.png" alt="google calendar final1 Writing a Custom Widget for Google Calendars" width="307" height="326" /></a><p class="wp-caption-text">Google Calendars are easy and everywhere, with a robust API we can leverage</p></div>
<p>In fact, the only trouble is that Google&#8217;s provided widget layouts are all &#8211; er, well they are all quite lame, and likely won&#8217;t match your current theme.</p>
<p>No worries!  We can easily leverage Google&#8217;s calendar API  and Javascript to create a fully customized Calendar widget showing the next N upcoming events in chronological order.</p>
<p><span id="more-963"></span>Let&#8217;s start by looking at the provided Google widgets..</p>
<div id="attachment_967" class="wp-caption aligncenter" style="width: 310px"><a href="http://edwardawebb.com/wp-content/uploads/2011/08/default_calendar.png"><img class="size-medium wp-image-967" title="default_calendar" src="http://edwardawebb.com/wp-content/uploads/2011/08/default_calendar-300x224.png" alt="default calendar 300x224 Writing a Custom Widget for Google Calendars" width="300" height="224" /></a><p class="wp-caption-text">Default &quot;Agenda&quot; layout for Google Calendar</p></div>
<p>Wow, that would look great in a Google webpage somewhere. But it probably doesn&#8217;t meet the layout you were looking for.  So we&#8217;ll use some basic HTML and JS to manipulate an Atom feed from Google.</p>
<p>Getting the base URL for your Calendar</p>
<h3>Getting the public URL for a calendar is easy.</h3>
<ol>
<li>Click &#8220;settings&#8221; for the calendar in question</li>
<li>click the XML icon in the Calendar Address section.<br />
<a href="http://edwardawebb.com/wp-content/uploads/2011/08/publicURL.png"><img class="aligncenter size-thumbnail wp-image-968" title="publicURL" src="http://edwardawebb.com/wp-content/uploads/2011/08/publicURL-150x150.png" alt="publicURL 150x150 Writing a Custom Widget for Google Calendars" width="150" height="150" /></a></li>
<li>Copy the URL.</li>
</ol>
<h3>Adding the necessary parameters to organize the feed</h3>
<p>Alright, so we have a URL for an RSS feed.  This RSS format has a few critical downsides.</p>
<ul>
<li>The dates are the date the event was created, not the date it will occur.</li>
<li>By default, repeating events are listed as a single event</li>
<li>The event name, summary and other details are all trapped in a single &lt;content&gt; element.</li>
</ul>
<div>But by exploring <a href="http://code.google.com/apis/calendar/data/2.0/reference.html" rel="nofollow" title="API Reference for Google Calendar"  target="_blank">Google&#8217;s API documentation</a> we learn of a better format, their custom Atom feed!</div>
<div><u>So here is the provided URL from the last section:</u>
</div>
<pre>https://www.google.com/calendar/feeds/tkmmbaodloipo29vn3aor8idd4%40group.calendar.google.com/public/basic</pre>
<div><u>We need to modify the &#8220;basic&#8221; projection, and replace it with &#8220;full&#8221;:</u></div>
<pre>https://www.google.com/calendar/feeds/tkmmbaodloipo29vn3aor8idd4@group.calendar.google.com/public/full</pre>
<div><u>But since we don&#8217;t care about attendees in this case we shrink the payload a little bit:</u></div>
<pre>https://www.google.com/calendar/feeds/tkmmbaodloipo29vn3aor8idd4@group.calendar.google.com/public/full-noattendees</pre>
<div>That looks much better!  Now we get custom fields like gd:when and gd:where</div>

<div class="wp_syntax"><div class="code"><pre class="xml" style="font-family:monospace;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;entry<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;id<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>...<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/id<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;published<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>2011-08-08T14:16:34.000Z<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/published<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;updated<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>2011-08-08T14:16:34.000Z<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/updated<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;category</span> <span style="color: #000066;">scheme</span>=<span style="color: #ff0000;">'http://schemas.google.com/g/2005#kind'</span> <span style="color: #000066;">term</span>=<span style="color: #ff0000;">'http://schemas.google.com/g/2005#event'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;title</span> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">'text'</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>Sangria <span style="color: #ddbb00;">&amp;amp;</span> Tapas Tasting<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/title<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;content</span> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">'text'</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
		BLAH BLAH BLAH
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/content<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;link</span> <span style="color: #000066;">rel</span>=<span style="color: #ff0000;">'alternate'</span> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">'text/html'</span> <span style="color: #000066;">href</span>=<span style="color: #ff0000;">'https://www.google.com/calendar/event?eid=cWcxa2U0ZnRhYnUwZWRpYzdnZTJzdXBwajggNDY1OWlmNW1yZGZ2a3Y0YWIzcGZqczY1Z2NAZw'</span> <span style="color: #000066;">title</span>=<span style="color: #ff0000;">'alternate'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;link</span> <span style="color: #000066;">rel</span>=<span style="color: #ff0000;">'self'</span> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">'application/atom+xml'</span> <span style="color: #000066;">href</span>=<span style="color: #ff0000;">'https://www.google.com/calendar/feeds/XXXXXX%40group.calendar.google.com/public/full-noattendees/qg1ke4ftabu0edic7ge2suppj8'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;author<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;name<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Calendar Name<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/name<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/author<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gd:comments<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gd:feedLink</span> <span style="color: #000066;">href</span>=<span style="color: #ff0000;">'https://www.google.com/calendar/feeds/XXXXX%40group.calendar.google.com/public/full/qg1ke4ftabu0edic7ge2suppj8/comments'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/gd:comments<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gd:eventStatus</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">'http://schemas.google.com/g/2005#event.confirmed'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gd:where</span> <span style="color: #000066;">valueString</span>=<span style="color: #ff0000;">'Tasca Restaurant - 1612 Commonwealth Ave, Brighton, MA 02135 '</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gd:when</span> <span style="color: #000066;">endTime</span>=<span style="color: #ff0000;">'2011-08-15T21:00:00.000-04:00'</span> <span style="color: #000066;">startTime</span>=<span style="color: #ff0000;">'2011-08-15T19:00:00.000-04:00'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gd:transparency</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">'http://schemas.google.com/g/2005#event.opaque'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gCal:sequence</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">'0'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;gCal:uid</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">'qg1ke4ftabu0edic7ge2suppj8@google.com'</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/entry<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre></div></div>

<div>
<h3>Parsing the Feed with JS and DOM</h3>
</div>
<div>Now that all the pieces we need have their own little pockets, we can start parsing into a presentable format.</div>
<div>First we start with a simple block of HTML that will house the populated calendar.</div>

<div class="wp_syntax"><div class="code"><pre class="html" style="font-family:monospace;">&lt;h2&gt;Upcomming Events&lt;/h2&gt; 
&lt;div id=&quot;status&quot; style=&quot;display:none&quot;&gt;&lt;/div&gt; 
&lt;div id=&quot;calendarFeed&quot;&gt;&lt;/div&gt;</pre></div></div>

<p>Before we get into the JS I must credit a source I stumbled across while researching this.  The objective is quite common, so it may not be the original source.</p>
<p>http://blog.csdn.net/runupwind/article/details/1655837</p>
<h3>The JavaScript that parses the DOM and prints HTML</h3>
<p>Nothing you need to edit here, unless you want to completely change the layout of things.  You should be able to CSS alone to get the style you want.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #339933;">&lt;!--</span> discovered on http<span style="color: #339933;">:</span><span style="color: #006600; font-style: italic;">//blog.csdn.net/runupwind/article/details/1655837 --&gt;</span>
<span style="color: #339933;">&lt;</span>script language<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;javascript&quot;</span>  type<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;text/javascript&quot;</span><span style="color: #339933;">&gt;</span> 
&nbsp;
<span style="color: #006600; font-style: italic;">// the max number of evewnts to show</span>
maxEvents <span style="color: #339933;">=</span> <span style="color: #CC0000;">7</span><span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">var</span> Backend <span style="color: #339933;">=</span> <span style="color: #3366CC;">'https://www.google.com/calendar/feeds/tkmmbaodloipo29vn3aor8idd4%40group.calendar.google.com/public/full-noattendees'</span><span style="color: #339933;">;</span> <span style="color: #006600; font-style: italic;">// Calendar url</span>
&nbsp;
&nbsp;
<span style="color: #006600; font-style: italic;">// DO NOT EDIT BELOW</span>
&nbsp;
&nbsp;
<span style="color: #003366; font-weight: bold;">var</span> RSSRequestObject <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">false</span><span style="color: #339933;">;</span> <span style="color: #006600; font-style: italic;">// XMLHttpRequest Object</span>
<span style="color: #003366; font-weight: bold;">var</span> Backend <span style="color: #339933;">=</span> <span style="color: #3366CC;">'https://www.google.com/calendar/feeds/tkmmbaodloipo29vn3aor8idd4%40group.calendar.google.com/public/full-noattendees'</span><span style="color: #339933;">;</span> <span style="color: #006600; font-style: italic;">// Calendar url</span>
window.<span style="color: #660066;">setInterval</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;update_timer()&quot;</span><span style="color: #339933;">,</span> <span style="color: #CC0000;">1200000</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #006600; font-style: italic;">// update the data every 20 mins</span>
&nbsp;
&nbsp;
<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>window.<span style="color: #660066;">XMLHttpRequest</span><span style="color: #009900;">&#41;</span> <span style="color: #006600; font-style: italic;">// try to create XMLHttpRequest</span>
	RSSRequestObject <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> XMLHttpRequest<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>window.<span style="color: #660066;">ActiveXObject</span><span style="color: #009900;">&#41;</span>	<span style="color: #006600; font-style: italic;">// if ActiveXObject use the Microsoft.XMLHTTP</span>
	RSSRequestObject <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> ActiveXObject<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;Microsoft.XMLHTTP&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
&nbsp;
<span style="color: #006600; font-style: italic;">/*
* onreadystatechange function
*/</span>
<span style="color: #003366; font-weight: bold;">function</span> ReqChange<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">// If data received correctly</span>
	<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>RSSRequestObject.<span style="color: #660066;">readyState</span><span style="color: #339933;">==</span><span style="color: #CC0000;">4</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
&nbsp;
		<span style="color: #006600; font-style: italic;">// if data is valid</span>
		<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>RSSRequestObject.<span style="color: #660066;">responseText</span>.<span style="color: #660066;">indexOf</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'invalid'</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">==</span> <span style="color: #339933;">-</span><span style="color: #CC0000;">1</span><span style="color: #009900;">&#41;</span> 
		<span style="color: #009900;">&#123;</span> 	
			<span style="color: #006600; font-style: italic;">// Parsing Feeds</span>
			<span style="color: #003366; font-weight: bold;">var</span> node <span style="color: #339933;">=</span> RSSRequestObject.<span style="color: #660066;">responseXML</span>.<span style="color: #660066;">documentElement</span><span style="color: #339933;">;</span> 
&nbsp;
			<span style="color: #006600; font-style: italic;">// Get the calendar title</span>
			<span style="color: #003366; font-weight: bold;">var</span> title <span style="color: #339933;">=</span> node.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'title'</span><span style="color: #009900;">&#41;</span>.<span style="color: #000066; font-weight: bold;">item</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">firstChild</span>.<span style="color: #660066;">data</span><span style="color: #339933;">;</span>
&nbsp;
			content <span style="color: #339933;">=</span> <span style="color: #3366CC;">'&lt;div class=&quot;channeltitle&quot;&gt;'</span><span style="color: #339933;">+</span>title<span style="color: #339933;">+</span><span style="color: #3366CC;">'&lt;/div&gt;'</span><span style="color: #339933;">;</span>
&nbsp;
			<span style="color: #006600; font-style: italic;">// Browse events</span>
			<span style="color: #003366; font-weight: bold;">var</span> items <span style="color: #339933;">=</span> node.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'entry'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>items.<span style="color: #660066;">length</span> <span style="color: #339933;">==</span> <span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
				content <span style="color: #339933;">+=</span> <span style="color: #3366CC;">'&lt;ul&gt;&lt;li&gt;&lt;div class=error&gt;No events&lt;/div&gt;&lt;/li&gt;&lt;/ul&gt;'</span><span style="color: #339933;">;</span>
			<span style="color: #009900;">&#125;</span> <span style="color: #000066; font-weight: bold;">else</span> <span style="color: #009900;">&#123;</span>
				content <span style="color: #339933;">+=</span> <span style="color: #3366CC;">'&lt;ul&gt;'</span><span style="color: #339933;">;</span>
<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>maxEvents <span style="color: #339933;">&gt;</span> items.<span style="color: #660066;">length</span><span style="color: #009900;">&#41;</span> maxEvents <span style="color: #339933;">=</span> items.<span style="color: #660066;">length</span><span style="color: #339933;">;</span>
				<span style="color: #000066; font-weight: bold;">for</span> <span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">var</span> n<span style="color: #339933;">=</span><span style="color: #CC0000;">0</span><span style="color: #339933;">;</span> n <span style="color: #339933;">&lt;=</span> maxEvents<span style="color: #339933;">-</span><span style="color: #CC0000;">1</span><span style="color: #339933;">;</span> n<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span>
				<span style="color: #009900;">&#123;</span>
					<span style="color: #003366; font-weight: bold;">var</span> itemTitle <span style="color: #339933;">=</span> items<span style="color: #009900;">&#91;</span>n<span style="color: #009900;">&#93;</span>.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'title'</span><span style="color: #009900;">&#41;</span>.<span style="color: #000066; font-weight: bold;">item</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">firstChild</span>.<span style="color: #660066;">data</span><span style="color: #339933;">;</span>
					<span style="color: #003366; font-weight: bold;">var</span> Summary <span style="color: #339933;">=</span> items<span style="color: #009900;">&#91;</span>n<span style="color: #009900;">&#93;</span>.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'content'</span><span style="color: #009900;">&#41;</span>.<span style="color: #000066; font-weight: bold;">item</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">firstChild</span>.<span style="color: #660066;">data</span><span style="color: #339933;">;</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #003366; font-weight: bold;">var</span> eventId<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;&quot;</span><span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">var</span> baseUrl<span style="color: #339933;">=</span>items<span style="color: #009900;">&#91;</span>n<span style="color: #009900;">&#93;</span>.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'link'</span><span style="color: #009900;">&#41;</span>.<span style="color: #000066; font-weight: bold;">item</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">attributes</span>.<span style="color: #660066;">getNamedItem</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;href&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">value</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//alert(calId);</span>
&nbsp;
					<span style="color: #003366; font-weight: bold;">var</span> itemLink <span style="color: #339933;">=</span> baseUrl<span style="color: #339933;">;</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #006600; font-style: italic;">//pull event date from gd:when element</span>
<span style="color: #003366; font-weight: bold;">var</span> uglyEventDate<span style="color: #339933;">=</span>items<span style="color: #009900;">&#91;</span>n<span style="color: #009900;">&#93;</span>.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'when'</span><span style="color: #009900;">&#41;</span>.<span style="color: #000066; font-weight: bold;">item</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">attributes</span>.<span style="color: #660066;">getNamedItem</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;startTime&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">value</span><span style="color: #339933;">;</span>
&nbsp;
&nbsp;
<span style="color: #006600; font-style: italic;">//parse date into pretty format</span>
					<span style="color: #000066; font-weight: bold;">try</span> 
					<span style="color: #009900;">&#123;</span>  <span style="color: #003366; font-weight: bold;">var</span> mydate<span style="color: #339933;">=</span><span style="color: #003366; font-weight: bold;">new</span> Date<span style="color: #009900;">&#40;</span>uglyEventDate<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">var</span> readAs<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;&quot;</span> <span style="color: #339933;">+</span> <span style="color: #009900;">&#40;</span>mydate.<span style="color: #660066;">getMonth</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">+</span><span style="color: #CC0000;">1</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">+</span> <span style="color: #3366CC;">&quot;/&quot;</span> <span style="color: #339933;">+</span> mydate.<span style="color: #660066;">getDate</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">+</span> <span style="color: #3366CC;">&quot;/&quot;</span> <span style="color: #339933;">+</span> mydate.<span style="color: #660066;">getFullYear</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
						<span style="color: #003366; font-weight: bold;">var</span> occursWhen<span style="color: #339933;">=</span> <span style="color: #3366CC;">'&lt;span class=&quot;event-date&quot;&gt;['</span><span style="color: #339933;">+</span> readAs<span style="color: #339933;">+</span><span style="color: #3366CC;">']&lt;/span&gt; '</span><span style="color: #339933;">;</span>
					<span style="color: #009900;">&#125;</span> 
					<span style="color: #000066; font-weight: bold;">catch</span> <span style="color: #009900;">&#40;</span>e<span style="color: #009900;">&#41;</span> 
					<span style="color: #009900;">&#123;</span> 
						<span style="color: #003366; font-weight: bold;">var</span> occursWhen<span style="color: #339933;">=</span> <span style="color: #3366CC;">''</span><span style="color: #339933;">;</span>
					<span style="color: #009900;">&#125;</span>
&nbsp;
					<span style="color: #003366; font-weight: bold;">var</span> occursWhere<span style="color: #339933;">=</span>items<span style="color: #009900;">&#91;</span>n<span style="color: #009900;">&#93;</span>.<span style="color: #660066;">getElementsByTagName</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'where'</span><span style="color: #009900;">&#41;</span>.<span style="color: #000066; font-weight: bold;">item</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">attributes</span>.<span style="color: #660066;">getNamedItem</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;valueString&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">value</span><span style="color: #339933;">;</span>
&nbsp;
&nbsp;
				<span style="color: #006600; font-style: italic;">//append date, event, and location to unordered list</span>
					content <span style="color: #339933;">+=</span> <span style="color: #3366CC;">'&lt;li&gt;'</span><span style="color: #339933;">+</span>occursWhen<span style="color: #339933;">+</span><span style="color: #3366CC;">'&lt;a href=&quot;'</span><span style="color: #339933;">+</span>itemLink<span style="color: #339933;">+</span><span style="color: #3366CC;">'&quot;&gt;&lt;span class=&quot;event-summary&quot;&gt;'</span><span style="color: #339933;">+</span>itemTitle<span style="color: #339933;">+</span><span style="color: #3366CC;">'&lt;/span&gt;&lt;/a&gt;'</span><span style="color: #339933;">+</span> occursWhere <span style="color: #339933;">+</span><span style="color: #3366CC;">'&lt;/li&gt;'</span><span style="color: #339933;">;</span>
				<span style="color: #009900;">&#125;</span>
&nbsp;
&nbsp;
				content <span style="color: #339933;">+=</span> <span style="color: #3366CC;">'&lt;/ul&gt;'</span><span style="color: #339933;">;</span>
			<span style="color: #009900;">&#125;</span>
			<span style="color: #006600; font-style: italic;">// Display the result</span>
			document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;calendarFeed&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">innerHTML</span> <span style="color: #339933;">=</span> content<span style="color: #339933;">;</span>
&nbsp;
			<span style="color: #006600; font-style: italic;">// Tell the reader the everything is done</span>
			document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;status&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">innerHTML</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;Done.&quot;</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #009900;">&#125;</span>
		<span style="color: #000066; font-weight: bold;">else</span> <span style="color: #009900;">&#123;</span>
			<span style="color: #006600; font-style: italic;">// Tell the reader that there was error requesting data</span>
			document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;status&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">innerHTML</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;&lt;div class=error&gt;Error requesting data.&lt;div&gt;&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
&nbsp;
		HideShow<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'status'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">/*
* Main AJAX RSS reader request
*/</span>
<span style="color: #003366; font-weight: bold;">function</span> RSSRequest<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">// change the status to requesting data</span>
	HideShow<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'status'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;status&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">innerHTML</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;Requesting data ...&quot;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">// Prepare the request</span>
	RSSRequestObject.<span style="color: #000066;">open</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;GET&quot;</span><span style="color: #339933;">,</span> Backend <span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">true</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">// Set the onreadystatechange function</span>
	RSSRequestObject.<span style="color: #660066;">onreadystatechange</span> <span style="color: #339933;">=</span> ReqChange<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">// Send</span>
	RSSRequestObject.<span style="color: #660066;">send</span><span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">null</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> 
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">/*
* Timer
*/</span>
<span style="color: #003366; font-weight: bold;">function</span> update_timer<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	RSSRequest<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
&nbsp;
<span style="color: #003366; font-weight: bold;">function</span> HideShow<span style="color: #009900;">&#40;</span>id<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #003366; font-weight: bold;">var</span> el <span style="color: #339933;">=</span> GetObject<span style="color: #009900;">&#40;</span>id<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>el.<span style="color: #660066;">style</span>.<span style="color: #660066;">display</span><span style="color: #339933;">==</span><span style="color: #3366CC;">&quot;none&quot;</span><span style="color: #009900;">&#41;</span>
	el.<span style="color: #660066;">style</span>.<span style="color: #660066;">display</span><span style="color: #339933;">=</span><span style="color: #3366CC;">''</span><span style="color: #339933;">;</span>
	<span style="color: #000066; font-weight: bold;">else</span>
	el.<span style="color: #660066;">style</span>.<span style="color: #660066;">display</span><span style="color: #339933;">=</span><span style="color: #3366CC;">'none'</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #003366; font-weight: bold;">function</span> GetObject<span style="color: #009900;">&#40;</span>id<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #003366; font-weight: bold;">var</span> el <span style="color: #339933;">=</span> document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span>id<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #000066; font-weight: bold;">return</span><span style="color: #009900;">&#40;</span>el<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
 RSSRequest<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&lt;/</span>script<span style="color: #339933;">&gt;</span></pre></div></div>

<h3>Demo &#8211; First Attempt</h3>
<p>Alright, so we have a decent XML feed with the info we need. We have a JS snippet to walk the DOM and pull out our info. And we are inserting the formatted HTML into our page.</p>
<p>Let&#8217;s have a look!<br />
<IFRAME SRC="http://edwardawebb.com/wp-content/uploads/2011/08/demo/demo1.html" >Iframe containing Demo 1 &#8211; <a href="http://edwardawebb.com/wp-content/uploads/2011/08/demo/demo1.html">Demo 1</a> </iframe></p>
<p><strong>Yes, quite ugly without any styling, but there is a bigger issue, the dates are all wrong</strong>.  No order, past and future.. no Good!</p>
<h3>Customize the output</h3>
<p>In order to get the future looking, chronological calendar we expect, we&#8217;ll need to tell Google Calendar to refine the results a bit..</p>
<p>Again, consulting the <a href="http://code.google.com/apis/calendar/data/2.0/reference.html" rel="nofollow" title="API Reference for Google Calendar"  target="_blank">Google&#8217;s API documentation</a> we learn of 4 critical modifiers:</p>
<ul>
<li>futureevents=true</li>
<li>singleevents=true</li>
<li>orderby=starttime</li>
<li>sortorder=ascending</li>
</ul>
<p>This will tell Google Calendar we only want future events, sorted by the start time, ascending.  We also ask that recurring events be specified individually, and not as one event.</p>
<pre>https://www.google.com/calendar/feeds/tkmmbaodloipo29vn3aor8idd4%40group.calendar.google.com/public/full-noattendees?futureevents=true&#038;singleevents=true&#038;orderby=starttime&#038;sortorder=ascending</pre>
<h3> Demo 2</h3>
<p><IFRAME SRC="http://edwardawebb.com/wp-content/uploads/2011/08/demo/demo2.html">Iframe containing Demo 2 &#8211; <a href="http://edwardawebb.com/wp-content/uploads/2011/08/demo/demo2.html">Demo 2</a> </iframe></p>
<div>That looks much better!</div>
<h3>Styling it up</h3>
<p>The choir is just to add the appropriate CSS styling to format the feed as you wish.  I&#8217;m no designer, and your site is much different then mine. SO I issue a challenge to some of my CSS savvy readers.<br />
<Strong>Submit your best styling for this widget and I will include the winner&#8217;s css for everyone to awe over</storng></p>
<p>C&#8217;mon!  I wanna see rounded corners, pretty gradients, clear divisions and nice eye candy.</p>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/writing-custom-widget-google-calendars/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Link to element IDs inside a jQuery tabs &#8211; read &#8220;Stateless&#8221;</title>
		<link>http://edwardawebb.com/site-news/link-element-ids-jquery-tabs-read-stateless</link>
		<comments>http://edwardawebb.com/site-news/link-element-ids-jquery-tabs-read-stateless#comments</comments>
		<pubDate>Tue, 26 Apr 2011 21:48:20 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=928</guid>
		<description><![CDATA[I recently implemented JQuery's Tabs feature into a site I am building for a client.  My first though was "wow, that was easy."  <strong>And then the usability issues starting making themselves apparent</strong>.<strong>  I like stateless web. Everything is linkable and bookmarkable, and once you have something the way you want, you should be able to share it with nothing more then the unique and repeatable url.</strong>

WHat do I mean by usability issues, let me explain with a few scenarios.
<h2>Problems</h2>
<h3>Problem 1: Switching tabs is not reflected by the URL, making the page stateful</h3>
Ugh, we <em>hate</em> stateful web sites!
<ol>
	<li>Your visitor lands on PageA that has 3 tabs: Main content, Dynamic Map, and User comments.</li>
	<li>To see the maps, user clicks on "Tab2". (URL remains unchanged)</li>
	<li>User wants to share map, and sends link to a friend, but all they see is the welcome content - OOps!</li>
</ol>
In this case user A would need to supply User B with a link, and instructions to get to the right tab. <strong>This violates the principle that the web should be stateless, and repeatable.  If content changes, the URL should too.</strong>
<h3>Problem 2:  Elements inside hidden tabs are not reachable by URL alone</h3>
<ol>
	<li>User A is reading the comments tab "Tab3" and decides he wants to add her own.</li>
	<li>After supplying her info, and the CAPTCHA she submits the form</li>
	<li>Let's suppose the user forgot to add her actual comment, and the form tries to re-render with the validation message - OOps!</li>
</ol>
Here User A expected to see the comment form again, and instead sees the page re-rendered, but Tab1, the default tab, is shown. <strong>She has no awareness that the form (on Tab3) failed, and assumes her comment was submitted.</strong>

But what if she had successfully submitted her comment? The same problem will crop up when the comment widget tries to redirect our user to her submitted comment (mysite.com/pageA#YourNewComment) Because the ID "YourNewComment" is part of the hidden content of Tab3, the page will just load Tab1, and leave our user curious.

&#160;
<h2>Solution</h2>
Fortunately it only takes a few lines of clever jQuery code to solve these usability issues.
<ol>
	<li>If the current tab changes, we update the URL with the correct anchor (mysite.com/PageA#Tab2)</li>
	<li>If a URL contains the anchor of a tab, we make it active</li>
	<li>&#60;The icing&#62; If the URL contains an anchor for an element that resides in a hidden tab, we make it active and scroll to that element</li>
</ol>]]></description>
			<content:encoded><![CDATA[<p>I recently implemented JQuery&#8217;s Tabs feature into a site I am building for a client.  My first though was &#8220;wow, that was easy.&#8221;  <strong>And then the usability issues starting making themselves apparent</strong>.</p>
<p><strong>  I like stateless web. Everything is linkable and bookmarkable, and once you have something the way you want, you should be able to share it with nothing more then the unique and repeatable url.</strong></p>
<p>WHat do I mean by usability issues, let me explain with a few scenarios.</p>
<h2>Problems</h2>
<h3>Problem 1: Switching tabs is not reflected by the URL, making the page stateful</h3>
<p>Ugh, we <em>hate</em> stateful web sites!</p>
<ol>
<li>Your visitor lands on PageA that has 3 tabs: Main content, Dynamic Map, and User comments.</li>
<li>To see the maps, user clicks on &#8220;Tab2&#8243;. (URL remains unchanged)</li>
<li>User wants to share map, and sends link to a friend, but all they see is the welcome content &#8211; OOps!</li>
</ol>
<p>In this case user A would need to supply User B with a link, and instructions to get to the right tab. <strong>This violates the principle that the web should be stateless, and repeatable.  If content changes, the URL should too.</strong></p>
<h3>Problem 2:  Elements inside hidden tabs are not reachable by URL alone</h3>
<ol>
<li>User A is reading the comments tab &#8220;Tab3&#8243; and decides she wants to add her own.</li>
<li>After supplying her info, and the CAPTCHA she submits the form</li>
<li>Let&#8217;s suppose the user forgot to add her actual comment, and the form tries to re-render with the validation message &#8211; OOps!</li>
</ol>
<p>Here User A expected to see the comment form again, and instead sees the page re-rendered, but Tab1, the default tab, is shown. <strong>She has no awareness that the form (on Tab3) failed, and assumes her comment was submitted.</strong></p>
<p>But what if she had successfully submitted her comment? The same problem will crop up when the comment widget tries to redirect our user to her submitted comment (mysite.com/pageA#YourNewComment) Because the ID &#8220;YourNewComment&#8221; is part of the hidden content of Tab3, the page will just load Tab1, and leave our user curious.</p>
<p>&nbsp;</p>
<h2>Solution</h2>
<p>Fortunately it only takes a few lines of clever jQuery code to solve these usability issues.</p>
<ol>
<li>If the current tab changes, we update the URL with the correct anchor (mysite.com/PageA#Tab2)</li>
<li>If a URL contains the anchor of a tab, we make <em>that</em> tab active</li>
<li>&lt;The icing&gt; If the URL contains an anchor for an element that resides <em>inside</em> a  tab, we make the parent tab active and scroll to the specified element</li>
</ol>
<p>I need to thank Mark Yoon for numbers 1&#038;2 that are based on a comment he left <em>somewhere</em> (i;ve been googling this issue alot!)</p>
<p>Number 3 was my own addition, and the most critical to me, because it allows existing widgets to work inside the tabs, and makes the tabs transparent from a URLs perspective.  </p>
<p>&nbsp;</p>
<p><span id="more-928"></span></p>
<p>&nbsp;</p>
<p>Alright, assume the following HTML:</p>

<div class="wp_syntax"><div class="code"><pre class="html" style="font-family:monospace;">&lt;div id=&quot;tabs&quot; style=&quot;clear:both;&quot;&gt; 
	&lt;ul&gt; 
		&lt;li&gt;&lt;a href=&quot;#Tab1&quot;&gt;Tab1&lt;/a&gt;&lt;/li&gt; 
		&lt;li&gt;&lt;a href=&quot;#Tab2&quot;&gt;Tab2&lt;/a&gt;&lt;/li&gt; 
	&lt;/ul&gt; 
	&lt;div id=&quot;Tab1&quot;&gt; 
		Content for Tab one, active by default
	&lt;/div&gt; 
	&lt;div id=&quot;Tab2&quot;&gt; 
		Content for Tab two, hidden by default
		&lt;div id=&quot;comment-form&quot;&gt; A simple form to submit comments&lt;/div&gt;
		&lt;div id=&quot;com3&quot;&gt; The third comment, hidden by default&lt;/div&gt;
		&lt;div id=&quot;com2&quot;&gt; The second comment, hidden by default&lt;/div&gt;
		&lt;div id=&quot;com1&quot;&gt; The first comment, hidden by default&lt;/div&gt;
	&lt;/div&gt; 
&lt;/div&gt;</pre></div></div>

<p>So we could supply a URL for the default tab: <em>PageA.html<strong>#Tab1</strong></em>.</p>
<p>We could supply a URL for the inactive tab: <em>PageA.html<strong>#Tab2</strong>.</em></p>
<p>We can also supply a URL for the hidden comment #3 on Tab2: <em> PageA.html<strong>#com3</strong></em></p>
<p>And! If a user lands on tab1, but switches to tab2, we update the URL instantly so they can share the right tab with friends.</p>
<p>&nbsp;</p>
<h2>The Code</h2>
<p>I included this code right under the call to initialize my tabs, which is also shown for illustration purposes.</p>

<div class="wp_syntax"><div class="code"><pre class="html" style="font-family:monospace;">				&lt;script&gt;
	$(function() {
		//initiate tabs
		$( &quot;#tabs&quot; ).tabs();
&nbsp;
		//Determine is the URL contains an Anchor, and what the value is
		var anchor = $(document).attr('location').hash; // the anchor in the URL- Thanks Mike!
&nbsp;
		//now the 3 scenarios we need to handle
		if($(&quot;#Tab2&quot;).find( anchor).size()&gt;0){
			//the anchor lives in Tab2
			$(&quot;#tabs&quot;).tabs('select', 1);
		}else if($(&quot;#Tab1&quot;).find( anchor).size()&gt;0){
			//the anchor lives in Tab1
			$(&quot;#tabs&quot;).tabs('select', 0);
		}else{
		    var index = $('#tabs div.ui-tabs-panel').index($(anchor)); //Thanks Mike! 
		    if(index &gt;=0){
			//the anchor _is_ tab 1 or 2
			$('#tabs').tabs('select', index); 
		    }
		}
		//anchor resides outside tabs, or doesn't exist, take no action
&nbsp;
&nbsp;
		//This line will update our URL anytime a tab is selected - Thanks Mike!
		//setting this before now will cause odd behavior
		$(&quot;#tabs&quot;).bind('tabsshow', function(event, ui){document.location =$(document).attr('location').pathname + &quot;#&quot; + ui.panel.id; });
&nbsp;
	});
&nbsp;
&lt;/script&gt;</pre></div></div>

<p>That&#8217;s it!  You can now ignore the tabs as far as URLs are concerned, and point to any valid element&#8217;s ID on the page!</p>
<p>Please let me know if anyone has found a better way to achieve these 3 goals.</p>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/link-element-ids-jquery-tabs-read-stateless/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Linux Turns 20!</title>
		<link>http://edwardawebb.com/site-news/linux-turns-20</link>
		<comments>http://edwardawebb.com/site-news/linux-turns-20#comments</comments>
		<pubDate>Tue, 12 Apr 2011 21:22:46 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[linux]]></category>
		<category><![CDATA[Site News]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=922</guid>
		<description><![CDATA[I was only 6 when Linus shared his first offering to the world, but I do remember the linux superbowl ad by IBM.]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.linuxfoundation.org/20th" rel="nofollow"  target="_blank"><img src="http://www.linuxfoundation.org/20th/images/lf_linux20_webbadge.png" width="300" height="250" alt="lf linux20 webbadge Linux Turns 20!" border="0" title="Linux Turns 20!" /></a></p>
<p>
I was only 6 when Linus shared his first offering to the world, but I do remember the <a href="http://www.youtube.com/watch?v=sYT5VcPSjSg" rel="nofollow" >linux superbowl ad by IBM</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/linux-turns-20/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Web Hosting Deal in Celebration of Julygustember ($4.95 + Free Domain)</title>
		<link>http://edwardawebb.com/site-news/web-hosting-deal-celebration-julygustember-495-free-domain</link>
		<comments>http://edwardawebb.com/site-news/web-hosting-deal-celebration-julygustember-495-free-domain#comments</comments>
		<pubDate>Wed, 08 Sep 2010 00:56:07 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=833</guid>
		<description><![CDATA[Yes, you read that right. Julygustember 2010 DreamHost Newsletter In celebration of Julygustember, and the Julygustember 2010 DreamHost Newsletter, I am offering a discount code to all of my readers. The coupon is good for $60 off 1 yr of DreamHost hosting, with a free domain for life! Dig, that&#8217;s less than $60 bucks for [...]]]></description>
			<content:encoded><![CDATA[<p>Yes, you read that right.</p>
<h2><strong>Julygustember 2010 DreamHost Newsletter</strong></h2>
<p>In celebration of Julygustember, and the Julygustember 2010 DreamHost Newsletter, I am offering a discount code to all of my readers.</p>
<p>The coupon is good for <strong>$<a href="http://www.dreamhost.com/r.cgi?488244|JAS2010/hosting.html" rel="nofollow" title="$4.95 for unlimited hosting with free domain for life" >60 off 1 yr of DreamHost hosting, with a free domain for life</a></strong>!</p>
<h3>Dig, that&#8217;s less than $60 bucks for a year</h3>
<p>of top-notch, full access, best support money can by hosting &#8211; <strong>WITH a free domain.</strong></p>
<p>Use the <a href="http://www.dreamhost.com/r.cgi?488244|JAS2010" rel="nofollow" title="$4.95 for unlimited hosting with free domain for life"  target="_blank">DreamHost promo code JAS2010</a> when you check out to receive the deal.</p>
<div class="wp-caption aligncenter" style="width: 478px"><a href="http://www.dreamhost.com/r.cgi?488244|JAS2010" rel="nofollow" ><img title="Wordpress Discount" src="http://images.dreamhost.com/rewards/468x60-c.gif" alt="468x60 c Web Hosting Deal in Celebration of Julygustember ($4.95 + Free Domain)" width="468" height="60" /></a><p class="wp-caption-text">Only 4.95 for all this! Normally 8.95</p></div>
<p>That&#8217;s<strong> only $4.95 per month</strong> for:</p>
<ul>
<li>Unlimited Bandwidth</li>
<li>Unlimited Storage</li>
<li>Unlimited Domains</li>
<li>Unlimited DBs</li>
<li>Unlimited users (ftp/shell/root)</li>
<li>Lots of one click instalss (drupal, wp, joomla, phpbb, etc)</li>
</ul>
<p>Your welcome.<span id="more-833"></span></p>
<p>What is the Julygustember 2010 DreamHost Newsletter? You ask? Well, I am surprised you&#8217;re not acting on that lucrative deal, but I&#8217;ll explain regardless.</p>
<p>Each month-ish DreamHost sends out a friendly newsletter updating customers on the most recent data center upgrades, one-click installs, or other upgrades and perks.</p>
<p>This months was another multi-month catch-up, hence the name. But as usual, worth the delay.  Good things coking, and plenty of humor:</p>
<blockquote><p>DreamHost, unlike most hosts, provides technical support for popular<br />
third party applications.  When you contact our talented technical<br />
support team with a WordPress or phpBB question they&#8217;ll provide you with<br />
all the links and hand-holding you need to get your problems resolved.</p>
<p>Most of the hosting industry is, unfortunately, not so generous.</p>
<p>It&#8217;s not because they don&#8217;t like *you* &#8211; you&#8217;re great, honestly.  I mean<br />
those eyes, those legs&#8230;UNNH.  You&#8217;ve got it going on.</p></blockquote>
<p><a href="http://wiki.dreamhost.com/V12.7-8-9_Julygustember_2010" rel="nofollow" title="Read the DreamHost Newsletter"  target="_blank">Click here to read the full newsletter and learn why you need a new host</a> <img src='http://edwardawebb.com/wp-includes/images/smilies/icon_smile.gif' alt="icon smile Web Hosting Deal in Celebration of Julygustember ($4.95 + Free Domain)" class='wp-smiley' title="Web Hosting Deal in Celebration of Julygustember ($4.95 + Free Domain)" /> </p>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 0px; width: 1px; height: 1px; overflow: hidden;">http://wiki.dreamhost.com/V12.7-8-9_Julygustember_2010</div>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/web-hosting-deal-celebration-julygustember-495-free-domain/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Google Voice and Gmail play nice to deliver telephone to pc calls</title>
		<link>http://edwardawebb.com/site-news/google-voice-gmail-play-nice-deliver-telephone-pc-calls</link>
		<comments>http://edwardawebb.com/site-news/google-voice-gmail-play-nice-deliver-telephone-pc-calls#comments</comments>
		<pubDate>Fri, 27 Aug 2010 21:50:00 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>
		<category><![CDATA[gmail]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[voice]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=827</guid>
		<description><![CDATA[You may have seen the news recently that Gmail can not place calls to your contacts through the use of a browser plugin, and google voice&#8217;s VOIP infrastructure. All you need is a headset or microphone for your PC to send calls. But the best part is the flip side &#8212; calls to my Google [...]]]></description>
			<content:encoded><![CDATA[<p>You may have seen the news recently that Gmail can not place calls to your contacts through the use of a browser plugin, and google voice&#8217;s VOIP infrastructure.   All you need is a headset or microphone for your PC to send calls.<br />
<strong><br />
But the best part is the flip side &#8212; calls to my Google Voice number can reach me in Gmail chat ! </strong></p>
<p>So along with ringing my work extension and mobile phone, I will get your call in my (always open) gchat window !</p>
<div id="attachment_829" class="wp-caption aligncenter" style="width: 310px"><a href="http://edwardawebb.com/wp-content/uploads/2010/08/gchatvoiuce.png"><img src="http://edwardawebb.com/wp-content/uploads/2010/08/gchatvoiuce-300x213.png" alt="gchatvoiuce 300x213 Google Voice and Gmail play nice to deliver telephone to pc calls" title="Google Voice and Gchat play nice" width="300" height="213" class="size-medium wp-image-829" /></a><p class="wp-caption-text">Calls to google voice numbers can now also ring your gchat session</p></div>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/google-voice-gmail-play-nice-deliver-telephone-pc-calls/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Script to Backup Files (with Version History) Before Editing</title>
		<link>http://edwardawebb.com/site-news/script-backup-edit-files-version-history</link>
		<comments>http://edwardawebb.com/site-news/script-backup-edit-files-version-history#comments</comments>
		<pubDate>Sat, 12 Jun 2010 01:02:41 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>
		<category><![CDATA[backup]]></category>
		<category><![CDATA[bash]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=771</guid>
		<description><![CDATA[Editing config files is the only certain thing above taxes and death (too lame?).  Whether it's your apache setup, or dns bindings its likely you use vi or another favorite editor to open your server's files, make that needed update and save. If you were good you copied the file first to a backup tagged by date. ..  <strong> But managing that process manually is just a workflow annoyance.</strong>

<strong>So the script below backups the file, tags it with the date, and opens it for edit. Additionally you can set a maximum number of versions to track any given day.
</strong> It adds no more effort than calling vi..]]></description>
			<content:encoded><![CDATA[<p>Editing config files is the only certain thing above taxes and death (too lame?).  Whether it&#8217;s your apache setup, or dns bindings its likely you use vi or another favorite editor to open your server&#8217;s files, make that needed update and save. If you were good you copied the file first to a backup tagged by date. ..  <strong> But managing that process manually is just a workflow annoyance.</strong></p>
<p><strong>So the script below backups the file, tags it with the date, and opens it for edit. Additionally you can set a maximum number of versions to track any given day.<br />
</strong> It adds no more effort than calling vi..<br />
<span id="more-771"></span></p>
<h3>calling a file to edit</h3>
<p>Example, to edit config.conf, just pass the file as a parameter to the script you save.</p>
<pre>
$ &lt;thisscript&gt;.sh config.conf
</pre>
<p>the result (for today ) would be a new file</p>
<pre>
config.conf.backup.61110.1
</pre>
<p>and vi would then open with config.conf ready to edit.</p>
<p>Running it again the same day would produce</p>
<pre>
config.conf.backup.61110.2 # older file from above renamed
config.conf.backup.61110.1 # your earlier work, now backed up in additona to original
</pre>
<p>This continues as you save and reopen the file until <MAX> versions are reached, at which point the oldest gets overwritten.</p>
<h4>output</h4>
<pre>
version 1 already exists today
version 2 already exists today
version 3 already exists today
version 4 already exists today
version 5 already exists today
version 6 already exists today
version 7 already exists today
version 8 already exists today
version 9 already exists today
version 10 already exists today
</pre>
<h3>The Code: Script to backup and edit a file with version</h3>

<div class="wp_syntax"><div class="code"><pre class="bash" style="font-family:monospace;"><span style="color: #666666; font-style: italic;">#!/bin/bash</span>
<span style="color: #666666; font-style: italic;"># Author : Eddie Webb http://edwardawebb.com</span>
<span style="color: #666666; font-style: italic;">#License: GNU GPL v3 - http://www.gnu.org/licenses/gpl-3.0-standalone.html</span>
<span style="color: #666666; font-style: italic;">#</span>
<span style="color: #666666; font-style: italic;">#    backup and edit</span>
<span style="color: #666666; font-style: italic;"># Script to edit a file only after making a backup tagged with date and version. </span>
<span style="color: #666666; font-style: italic;"># Only &lt;MAX&gt; version will exist for any one day</span>
<span style="color: #666666; font-style: italic;">#</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #000000; font-weight: bold;">if</span> <span style="color: #7a0874; font-weight: bold;">&#91;</span> <span style="color: #007800;">$#</span> <span style="color: #660033;">-ne</span> <span style="color: #000000;">1</span> <span style="color: #7a0874; font-weight: bold;">&#93;</span>
<span style="color: #000000; font-weight: bold;">then</span>
	<span style="color: #7a0874; font-weight: bold;">printf</span><span style="color: #ff0000;">&quot;<span style="color: #000099; font-weight: bold;">\n</span>Usage:<span style="color: #000099; font-weight: bold;">\n</span>%s &lt;fileTOEdit&gt;&quot;</span> <span style="color: #007800;">$0</span>
	<span style="color: #7a0874; font-weight: bold;">exit</span> <span style="color: #000000;">1</span>
<span style="color: #000000; font-weight: bold;">fi</span>
&nbsp;
<span style="color: #007800;">date</span>=$<span style="color: #7a0874; font-weight: bold;">&#40;</span><span style="color: #c20cb9; font-weight: bold;">date</span> +<span style="color: #000000; font-weight: bold;">%</span>m<span style="color: #000000; font-weight: bold;">%</span>d<span style="color: #000000; font-weight: bold;">%</span>y<span style="color: #7a0874; font-weight: bold;">&#41;</span>
<span style="color: #7a0874; font-weight: bold;">echo</span> <span style="color: #007800;">$date</span>
<span style="color: #007800;">maxBacks</span>=<span style="color: #000000;">10</span>
&nbsp;
<span style="color: #007800;">file</span>=<span style="color: #007800;">$1</span>
&nbsp;
<span style="color: #007800;">path</span>=<span style="color: #007800;">$file</span>.backup.<span style="color: #007800;">$date</span>
&nbsp;
<span style="color: #7a0874; font-weight: bold;">echo</span> Backup Scheme: <span style="color: #007800;">$path</span>
&nbsp;
<span style="color: #666666; font-style: italic;"># check for exsiting backups, and get highest version</span>
<span style="color: #000000; font-weight: bold;">for</span> <span style="color: #7a0874; font-weight: bold;">&#40;</span><span style="color: #7a0874; font-weight: bold;">&#40;</span> <span style="color: #007800;">i</span>=<span style="color: #000000;">1</span>;i <span style="color: #000000; font-weight: bold;">&lt;</span>= <span style="color: #007800;">$maxBacks</span>; <span style="color: #007800;">i</span>=<span style="color: #007800;">$i</span>+<span style="color: #000000;">1</span><span style="color: #7a0874; font-weight: bold;">&#41;</span><span style="color: #7a0874; font-weight: bold;">&#41;</span>
<span style="color: #000000; font-weight: bold;">do</span>
<span style="color: #007800;">version</span>=<span style="color: #007800;">$i</span>
&nbsp;
        <span style="color: #000000; font-weight: bold;">if</span> <span style="color: #7a0874; font-weight: bold;">&#91;</span> <span style="color: #660033;">-f</span> <span style="color: #ff0000;">&quot;<span style="color: #007800;">$path</span>.<span style="color: #007800;">$i</span>&quot;</span> <span style="color: #7a0874; font-weight: bold;">&#93;</span>
        <span style="color: #000000; font-weight: bold;">then</span>
                <span style="color: #7a0874; font-weight: bold;">echo</span> version <span style="color: #007800;">$i</span> already exists today
        <span style="color: #000000; font-weight: bold;">else</span>
                <span style="color: #666666; font-style: italic;">#file doesnt exist, and will be our new highest version</span>
                <span style="color: #7a0874; font-weight: bold;">break</span>
        <span style="color: #000000; font-weight: bold;">fi</span>
<span style="color: #000000; font-weight: bold;">done</span>
<span style="color: #666666; font-style: italic;">#now push each copy back one for new (higher version are older, version 1 is the latest..</span>
<span style="color: #000000; font-weight: bold;">if</span> <span style="color: #7a0874; font-weight: bold;">&#91;</span> <span style="color: #007800;">$version</span> <span style="color: #660033;">-gt</span> <span style="color: #000000;">1</span> <span style="color: #7a0874; font-weight: bold;">&#93;</span>
<span style="color: #000000; font-weight: bold;">then</span>
&nbsp;
        <span style="color: #000000; font-weight: bold;">for</span><span style="color: #7a0874; font-weight: bold;">&#40;</span><span style="color: #7a0874; font-weight: bold;">&#40;</span> <span style="color: #007800;">j</span>=<span style="color: #007800;">$version</span>; j<span style="color: #000000; font-weight: bold;">&gt;</span><span style="color: #000000;">1</span>; j-- <span style="color: #7a0874; font-weight: bold;">&#41;</span><span style="color: #7a0874; font-weight: bold;">&#41;</span>
        <span style="color: #000000; font-weight: bold;">do</span>
                <span style="color: #c20cb9; font-weight: bold;">cp</span> <span style="color: #007800;">$path</span>.$<span style="color: #7a0874; font-weight: bold;">&#40;</span><span style="color: #7a0874; font-weight: bold;">&#40;</span><span style="color: #007800;">$j</span> - <span style="color: #000000;">1</span><span style="color: #7a0874; font-weight: bold;">&#41;</span><span style="color: #7a0874; font-weight: bold;">&#41;</span> <span style="color: #007800;">$path</span>.<span style="color: #800000;">${j}</span>
        <span style="color: #000000; font-weight: bold;">done</span>
<span style="color: #000000; font-weight: bold;">fi</span>
&nbsp;
&nbsp;
<span style="color: #c20cb9; font-weight: bold;">cp</span> <span style="color: #007800;">$1</span> <span style="color: #007800;">$path</span>.1
&nbsp;
<span style="color: #666666; font-style: italic;">#you can pick any editor you like ;)</span>
<span style="color: #c20cb9; font-weight: bold;">vi</span> <span style="color: #007800;">$1</span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/script-backup-edit-files-version-history/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Details for the HTC EVO root</title>
		<link>http://edwardawebb.com/site-news/details-htc-evo-root</link>
		<comments>http://edwardawebb.com/site-news/details-htc-evo-root#comments</comments>
		<pubDate>Thu, 27 May 2010 18:01:04 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>
		<category><![CDATA[android]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=763</guid>
		<description><![CDATA[Everyone is posting the video that shows a rooted HTC EVO, but no one has details. The main reason is a lack of information for the hack author themselves.. But to understand from the source why the details aren&#8217;t forthcoming, see this forum post that highlights the details, and links to the hacker&#8217;s site. Here&#8217;s [...]]]></description>
			<content:encoded><![CDATA[<p>Everyone is posting the video that shows a rooted HTC EVO, but no one has details.<strong> The main reason is a lack of information for the hack author themselves</strong>..</p>
<p><strong>But to understand from the source why the details aren&#8217;t forthcoming</strong>, see <a href="http://evounlocked.com/rooting-and-imaging-f2/root-the-htc-evo-t1.html" rel="nofollow" title="Details for the HTC EVO root hack, including a link to the author site." >this forum post that highlights the details</a>, and links to the hacker&#8217;s site.</p>
<p><strong>Here&#8217;s the short </strong>- we will be waiting until at least the public release of Froyo (Android 2.2) on the EVO before the root hack goes public.</p>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/details-htc-evo-root/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Wireless Tethering for Android Phones</title>
		<link>http://edwardawebb.com/site-news/wireless-tethering-android-phones</link>
		<comments>http://edwardawebb.com/site-news/wireless-tethering-android-phones#comments</comments>
		<pubDate>Wed, 26 May 2010 22:41:38 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>
		<category><![CDATA[android]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=761</guid>
		<description><![CDATA[As many of you already know, Google announed during their second IO Keynote on Thursday that the latest version of Android (2.2 &#8211; Froyo) to start shipping will include WiFi tethering &#8211; or hotspots. This feature allows you to share your mobile phone&#8217;s connection with any nearby computer &#8211; and its completely legit Phone carriers [...]]]></description>
			<content:encoded><![CDATA[<p>As many of you already know, Google announed during their second IO Keynote on Thursday that the latest version of <strong>Android</strong> (2.2 &#8211; Froyo) to start shipping will <strong>include WiFi tethering</strong> &#8211; or hotspots.</p>
<p>This feature <strong>allows you to share your mobile phone&#8217;s connection with any nearby computer</strong> &#8211; and its completely legit<br />
Phone carriers can be none to pleased, as<strong> makers like <a href="http://evounlocked.com/viewtopic.php?f=8&amp;t=12" rel="nofollow" title="Sprint Hotspot on the JHTC Evo - pictures and more" >Sprint already include a hotspot option on their latest EVO</a>, but charge extra for the feature</strong>.</p>
<p>Since I was fortunate enough to attend Google IO i received <a href="http://now.sprint.com/evo/?id9=SEM_Google_P_Sprint_HTC" rel="nofollow" title="Visit Sprint site to pre-order the EVO now" >the new <strong>EVO</strong></a> along with its 30 day trial of Sprint&#8217;s service.  I must say that I am in love, but paying ~$80 a month for one phone and data is just too much..</p>
<p>Maybe I will share the phone with a loyal reader after my plan expires next month..</p>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/wireless-tethering-android-phones/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>QueueMan &#8211; Netflix manager for Android to see major updates</title>
		<link>http://edwardawebb.com/site-news/queueman-netflix-manager-android-major-updates</link>
		<comments>http://edwardawebb.com/site-news/queueman-netflix-manager-android-major-updates#comments</comments>
		<pubDate>Tue, 11 May 2010 22:47:17 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>
		<category><![CDATA[android]]></category>
		<category><![CDATA[droid]]></category>
		<category><![CDATA[netflix]]></category>
		<category><![CDATA[Nexus One]]></category>
		<category><![CDATA[QueueMan]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=755</guid>
		<description><![CDATA[I am feverishly working to entirely refactor QueueMan in order to introduce long awaited features]]></description>
			<content:encoded><![CDATA[<p>Anyone who has been to this site more than once likely knows of my <a href="http://edwardawebb.com/site-news/netflix-queue-manager-android-phones"title="Netflix on Android" >Android application for Netflix users</a>.  The application supports Android phones like the Motorola Droid, The HTC Incredible, and the Nexus One (among other devices).</p>
<p>What none but a few &#8220;power users&#8221; know is that<strong> I am feverishly working to entirely refactor QueueMan in order to introduce long awaited features</strong>.  The newer version will still be wicked cute, and simple to use, but there are some critical features lacking in the current version I need to address.<br />
Like what? Keep reading&#8230;</p>
<h2><span id="more-755"></span>Bug Fixes</h2>
<p>A bug?! <em>In my code</em>? &#8230; <strong>Impossible</strong>.</p>
<p>Er wait, I mean, of course! I wrote the app expecting 30 people would use it.  Since it has been downloaded 30,000 times now I guess I need to make the little guy much more stable .  So My refactoring effort cleans up much of the code in order to mitigate:</p>
<ul>
<li>Failed move or add actions (502 and 200)</li>
<li>Failed rating action</li>
<li>Confusion around &#8220;saved&#8221;, &#8220;available&#8221; and &#8220;short-wait&#8221; titles</li>
</ul>
<h2>Queue Types</h2>
<p>I only use DVD and Instant queues, so QueueMan only cared about those two. Turns out that you,<strong> the public QueueMan adores so much, uses crazy new technology like Blu-Ray</strong>.</p>
<p>I won&#8217;t pretend to understand the new fangled discs, but I will support them.  So Queueman will soon be sporting a second delivery queue for <strong>Blu-Ray</strong> movies. (<strong> I will need some volunteers who actually have Blu-Ray to test this out for me in the pre-release)</strong> Just drop me a line.</p>
<h2>Search Enhancements</h2>
<p><em>Ohhh</em> so a simple search focused on titles only doesn&#8217;t cut it for you?!   Me neither&#8230;<br />
SO QueueMan will soon be able to<strong> search based on Genre, Actors, Format and more</strong>!</p>
<h2>Performance Enhancements</h2>
<p>The way Queues are handled currently sucks. Its a sharp trade off between seeing all movies, and waiting all day.  To compensate I added the option to choose how many titles you want to see. (5,10,25, 50 and ALL)</p>
<p>This makes viewing your first 10 movies much faster, but leaves you cluesless as to #11.</p>
<p><strong>QueueMan wil now support pagination in every queue typ</strong>e (dvd, blu-ray, instant, recommendations and even searches)</p>
<p>Whats that mean? Take a look..</p>
<div id="attachment_756" class="wp-caption aligncenter" style="width: 190px"><a href="http://edwardawebb.com/wp-content/uploads/2010/05/paging10.png"><img class="size-medium wp-image-756" title="Paging Netflix queue results " src="http://edwardawebb.com/wp-content/uploads/2010/05/paging10-180x300.png" alt="paging10 180x300 QueueMan   Netflix manager for Android to see major updates " width="180" height="300" /></a><p class="wp-caption-text">Rather than limiting max results, you now specify the results per page., and can grab more titles as needed.</p></div>
<p><strong>You can now start with ten titles (in a second or two) and then view the next 10, and the next 10, and continue through the result pages until you reach the upper limit.</strong> (The results per page = former Max Results, so you can makes pages any length that suits you!)</p>
<h2>Identity Management</h2>
<p>A number of households share Netflix queues and create &#8220;User Profiles&#8221; or &#8220;Sub-Accounts&#8221; to add many queues to one primary account.  The Netflix website allows primary baccount users to fully manage sub-accounts, but their API does not expose such abilities, hence queueman lacks said features.</p>
<p>However as a work around, QueueMan will support the ability to maintain multiple accounts, and choose which account to use.</p>
<h2>Where The Requests Came From</h2>
<p>For a list of outstanding tickets, or to add your own suggestion, please see the Issues section of QueueMan&#8217;s hosted site.</p>
<p><a href="http://code.google.com/p/queueman/wiki/Issues" rel="nofollow" title="Netflix on Android - Issues" >http://code.google.com/p/queueman/wiki/Issues</a></p>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 1122px; width: 1px; height: 1px; overflow: hidden;">http://code.google.com/p/queueman/wiki/Issues</div>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/queueman-netflix-manager-android-major-updates/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>T-Mobile G1 to ADP (Android Developer Phone)</title>
		<link>http://edwardawebb.com/site-news/tmobile-g1-adp-android-developer-phone</link>
		<comments>http://edwardawebb.com/site-news/tmobile-g1-adp-android-developer-phone#comments</comments>
		<pubDate>Thu, 08 Apr 2010 21:24:40 +0000</pubDate>
		<dc:creator>Eddie</dc:creator>
				<category><![CDATA[Site News]]></category>
		<category><![CDATA[adp]]></category>
		<category><![CDATA[android]]></category>
		<category><![CDATA[g1]]></category>
		<category><![CDATA[Nexus One]]></category>

		<guid isPermaLink="false">http://edwardawebb.com/?p=720</guid>
		<description><![CDATA[I know G1's are locked, hence I took the action as a good citizen and called T-Mobile. Turns out if you have the phone for 90 days then they will just give you the Unlock Code.  So I naively thought that would allow me to wipe the phone, and run sans sim.  Wrong.  I ended up with a useless piece of hardware that would do nothing but report the absence of a sim card.]]></description>
			<content:encoded><![CDATA[<p>So I purchased a G1 from t-mobile when they were reasonably new, and have since was kindly donated a nexus one (best phone ever).  <strong> But what to do with my old G1?   Obvi -  turn it into an Android Developer Phone</strong> that I can run without a sim card, and test my apps on anything faster than the emulator.   Not to mention the value of actual phone, accelerometer and leds.</p>
<p>I know G1&#8242;s are locked, hence I took the action as a good citizen and called T-Mobile. <strong>Turns out if you have the phone for 90 days then they will just give you the Unlock Code. </strong> So I naively thought that would allow me to wipe the phone, and run sans sim.  Wrong. <strong> Turns out that you only get the unlock prompt if you have a foreign sim card.  But if I use a bunk sim, I wont have a data connection, and could not get past registration.</strong> I ended up with a useless piece of hardware that would do nothing but report the absence of a sim card.</p>
<p>Let me share a few other highlights:</p>
<ul>
<li>ADP &#8220;Dream&#8221; images can not be flashed to G1s due to signature issues of boot loader UNLESS</li>
<li>You can root your phone and use sqlite to modify some system settings to bypass the protection HOWEVER</li>
<li>Only RC29 or earlier OS releases have the vulnerability allowing this, mine did not BUT</li>
<li>You can supposedly downgrade the image to RC29, root the phone and  flash thereafter UNFORTUNATELY</li>
<li>This just seems like a ridiculous way to get any functionality of a device I paid for and T-Mobile is willing to let me unlock anyhow</li>
</ul>
<p>So I took a simpler approach.</p>
<p><strong>SInce I am still a t-mobile customer with a data plan I just pulled my sim from the Nexus ONe, back into my G1, and registered a new bogus user.</strong> After the user is registered I turned on wifi, and usb debug, then restarted. After the restart I turned off the phone to remove the sim. (my first attempt of removing sim without a clean reboot resulted in a no sim card lockout)  This way I can still lend the device to a co-worker as a dev phone, without worrying about my info.<br />
<strong>So if any of you happen to have a legit way to bypass the sim card lockout and enter the htc/t-mobile provided unlock code to permanently eliminate the need for a sim card, please share. </strong></p>
]]></content:encoded>
			<wfw:commentRss>http://edwardawebb.com/site-news/tmobile-g1-adp-android-developer-phone/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

