Monday, November 2, 2009

David bishop - dynamic project content

david bishop site
It wasn't long ago I asked my graphic artist Travis Oakes to design a persona site for me, David Bishop, which I then created from his graphics and design. This site functions as an online resume detailing my work history and contains links to everything I do: blogs, my Company: VillainousMind including the Locura Media Server its flagship product, my World of WarCraft guild which I recently updated, my kid's sites and more.

But as time progressed, I realized the static nature of the site was no good for a few reasons:
  • There wasn't an automatic way to show project completion.

  • There wasn't a way to reference projects that had completed.


For this reason I wanted to create a data-driven list of projects to show the information on the projects, show the completion within a time frame after the project completed, then drop them off the main pages and into the archive section. And, in keeping with Code Once philosophy, the site will auto-update by the data without code changes.

The Technology
Since personal projects are always opportunities to learn and have fun, we get to play with some fun tech. In a nutshell the data will be normalized in a SQL Server database, referenced through a data layer in C#.NET, and pulled using SOAP Web Services. Woot! And to kick it up a notch I'm going to try my hand at Windows Communication Foundation (WCF)

The Data
The data will focus on projects and run out from there to pictures, links to blog posts, and information about the technologies used.

Bishop Universe database design

The technologies will also show dependencies which link back recursively to the technologies table. Those dependencies in turn could have dependencies. For instance, Web Services are dependent on SOAP, which is in turn dependent on XML.

Bishop Universe technologies table

The fun part is finding the best way to find out how to grab all related technologies. For instance, if I say a project uses WCF and XHTML, the technology list needs to pull Web Services, which pulls SOAP, which pulls XML. In addition, it needs to pull HTML because of XHTML.

Joe Celko has some interesting SQL on trees (who better to turn to for SQL but Celko himself?) but I don't like the way he's set up the data structure in order to be able to pull the data (for a better visual explanation see this article).

I also thought about finding a way to pull the data recursively with solid SQL, meaning no cursors (spit) and no iterative and future-killing, pre-defined, numbered tables (Technologies AS Tech1 LEFT JOIN Technologies AS Tech2 LEFT JOIN Technologies AS Tech 3 LEFT JOIN Technologies AS Tech4 etc.)

In the end, however, this is a job for code. I think like most developers I had the "that would be cool" or "wow, finding a way to do 'x' would be a challenge. Let's do it!" hat on. Instead common sense took hold and I realized I should pull the data and link it all up in the code.

The Code
I'm new to Windows Communication Foundation. I have read a fair amount about it. I have yet to understand why I need it, but I would like to a) find out and b) continue learning.

windows communication foundation

There is nothing crazy here on tech. It will be simple stored procs (and for those out there that don't make stored procs simple: shame on you!), a data access layer written in C#.NET and a web service layer utilizing WCF. Of course this will all be consumed with a web front end and Web Controls.

data access layer model

The web service will be consumed by a Web Control on the page and an new archive section will be added.

That's It
There's really nothing more to say: New database, data driven projects with recursive technology links, data access layer, WCF web service consumed by custom Web Control on a C#.NET ASP.NET page.

Now to get cracking!

Monday, October 26, 2009

Order of magnitude site live


The Order of Magnitude guild site is now live. The project was a filler project for me in-between company projects, but was fun nonetheless with the roster web clients, XML pulls and mashups, XSD compliance, XSLT transformations, and some really cool graphics provided by Travis Oakes.

My next project to put an archive section on my David Bishop site will include this project in it's listing.

Wednesday, September 9, 2009

Order of magnitude web site

order of magnitude home page
I'm in a World of Warcraft guild named Order of Magnitude with several friends including the artist who has done a lot of work for me (David Bishop) and my company.

For our guild we use the WOW Armory to see different guild stats, but unfortunately it doesn't show whose characters are whose. I wanted to create a guild roster that married the person to their characters.

For this purpose, I commissioned my artist to create a look for a small site centered around two things: a piece of art I had commissioned with the founding 5 members in anime, and a roster of the guild. I employed several technologies to read the data from the armory and compile it into a form that could be presented. The task I have before me is to marry the code and proof of concept with the final art and complete the guild site for Order of Magnitude.

The Code

The new site is mostly about looks but there is one piece that is functional and that's the roster. The roster uses several interesting technologies to build and mesh data from our server with data from the WOW Armory.

First, the roster uses the System.Net.WebClient to connect to the armory. Because the armory detects automated requests in an attempt to thwart malicious acts, it will sometimes throw a bogus call out. For this reason, there needs to be a retry for the calls. Also, after the guild call is made, the character calls should only be made for characters needing PvP stats. Calling all extended character information will result in a temporary blacklist. Trust me. I know.

This is the main method that gets the XML from the armory:
/// <summary>Gets the xml from the text of the http response.</summary>
/// <param name="path">The path for the request.</param>
/// <param name="realm">The realm to request.</param>
/// <param name="name">The name to request.</param>
/// <returns>The xml.</returns>
public static string GetXml(string path, string realm, string name)
{
  // Set up.
  WebClient client = new WebClient();
  client.QueryString.Add("r", realm);
  client.QueryString.Add("n", name);

  // Run and clean up.
  TextReader reader = null;
  int tries = 0; bool good = false;
  while ((tries < 2) && (!good))
  {
    try
    {
      client.Headers.Add("user-agent", "MSIE 7.0");
      reader = new StreamReader(client.OpenRead(path));
      good = true;
    }
    catch
    {
      tries++;
      System.Threading.Thread.Sleep(100);
    }
  }

  // If it was blacklisted, say, otherwise complete.
  if (!good)
  {
    throw new Exception("The query was blacklisted.");
  }
  else
  {
    string response = reader.ReadToEnd();
    client.Dispose();
    reader.Dispose();

  // Return.
  return response;
  }
}

The rest of the code simply takes the XML that was received and mashes it up with the guild file linking all character data to the specific player. The resulting XML is saved to a file that resides in an accessible folder.

The trigger for this XML mashup is a hit to the page. When the page is requested, a check for one of three things occurs:
  • No mashup file exists, or it is more than 24 hours old.

  • The guild file was changed since the mashup file was created.

  • A refresh was forced through a query string request.

When the page is requested it performs this check to decide whether to update the mashup data, then it transforms the XML against the XSLT to spit out the resulting web page.

The Data

The data is completely XML. It starts with the guild definition file which describes the players and the characters they play:
guild template xml
This guild file is vetted against the schema file which makes sure the guild file strictly adheres to the definition for this type of file:
guild template xsd
The armory data comes directly from the WOW Armory and contains the guild information which includes basic information for all the characters in the guild:
guild wow armory xml
Once that data is read into guild and character class objects, the armory data for specific characters which are flagged to gain extended information is pulled from the armory and then this data is merged with the guild file to create the resultant roster XML:
guild roster xml
Finally, the XML is transformed with the following XSLT file to create HTML that is output to the browser. This XSLT is determined by whether the request is guild wide or for a particular character:
guild roster xslt
The Presentation

The final page is presented showing the player roster. The current page shows the proof-of-concept for the roster, allowing selection of the player and which factions to show for the player.
roster player
The selector also has an option to show the entire guild of characters.
roster faction
Travis Oakes has already completed the final design, updating the home page to brighten the anime-themed illustration done by J Zacholl and provide an updated logo and navigation.
order of magnitude home page
Finally, Travis created the roster preview (and separate images components), to complete the site.
Order of Magnitude Roster
All in all the site looks good. It's simple, clean, and provides an easy way to see a breakdown of characters by player - a feature seemingly unique to our guild. The graphics work done by Travis is crisp and clean as usual, and the background processes that pull, mashup, and present the XML are seamless to the user. The new site is 60% complete and is slated to be fully live fall of this year.