
/*jslint white: false, onevar: true, browser: true, devel: true, undef: true, nomen: true, eqeqeq: true, plusplus: true, bitwise: true, regexp: true, strict: false, newcap: true, immed: true */
/*global jQuery, $, Raphael */

function Timeline(paper, datesAndVersions) {
  if ( !(this instanceof arguments.callee) ) {
    return new arguments.callee(arguments);
  }

  this.paper            = paper;
  this.datesAndVersions = datesAndVersions;

  this.parseDates = function () {
    var parsedDatesAndVersions = [],
      i = 0,
      obj,
      dateParts,
      parsedDate;
    for (i = 0; i < this.datesAndVersions.length; i++) {
      obj = this.datesAndVersions[i];
      dateParts = obj.date.split(/\//);
      parsedDate = new Date();
      parsedDate.setFullYear(parseInt(dateParts[2], 10),
                             parseInt(dateParts[0], 10) - 1,
                             parseInt(dateParts[1], 10));
      parsedDatesAndVersions.push({date: parsedDate, version: obj.version});
    }
    this.datesAndVersions = parsedDatesAndVersions;
  };

  this.draw = function () {
    var radius = 26,
      timeRange,
      graphWidth = this.paper.width - radius * 2 - 2,
      startTime, endTime,
      i = 0,
      obj,
      dot,
      label,
      xOffset;

    startTime = this.datesAndVersions[0].date.getTime();
    endTime = this.datesAndVersions[this.datesAndVersions.length - 1].date.getTime();
    timeRange = endTime - startTime;

    // Versions with dot
    this.plotArray(this.datesAndVersions,
                   this.drawDotAndLabel,
                   graphWidth,
                   startTime,
                   timeRange,
                   radius);

    // Years
    this.plotArray([
      {date: (new Date(2005, 0, 1)), version: "2005"},
      {date: (new Date(2006, 0, 1)), version: "2006"},
      {date: (new Date(2007, 0, 1)), version: "2007"},
      {date: (new Date(2008, 0, 1)), version: "2008"},
      {date: (new Date(2009, 0, 1)), version: "2009"},
      {date: (new Date(2010, 0, 1)), version: "2010"}
    ], this.drawYear, graphWidth, startTime, timeRange, radius);
  };

  this.plotArray = function (theArray, aDrawingCallback, graphWidth, startTime, timeRange, radius) {
    var i = 0,
      obj,
      xOffset;
    for (i = 0; i < theArray.length; i++) {
      obj = theArray[i];
      xOffset = graphWidth * ((obj.date.getTime() - startTime) / timeRange) + radius;
      aDrawingCallback(obj, xOffset, radius);
    };
  }

  this.drawDotAndLabel = function (obj, xOffset, radius) {
    var dot, label;
    dot = paper.circle(xOffset, radius, radius - 6);
    dot.attr({
      "stroke-width": 0,
      fill: "#cccccc",
      "fill-opacity": 1.0
    });
    dot.toBack();
    if (obj.version.match(/^\d\.0/)) {
      dot.attr({ fill: "#d92027", r: radius });
      dot.toFront();
    }
    label = paper.text(xOffset, radius, obj.version);
    label.attr({
      fill: "#ffffff",
      "font-size": 20,
      "font-family": "'League Gothic', 'Futura-CondensedMedium', 'Gill Sans MT Condensed', 'Arial Narrow', sans-serif"
    });
  };

  this.drawYear = function (obj, xOffset, radius) {
    var label;
    label = paper.text(xOffset, (radius * 2) + 10, obj.version);
    label.attr({
      fill: "#000000",
      "fill-opacity": 0.5,
      "font-size": 10,
      "font-family": "sans-serif"
    });
  };

  this.parseDates();
  this.draw();
}

  jQuery(function () {

    var paper = Raphael("history-graph", 940, 81),
      timeline;

    timeline = new Timeline(paper, [
      {date:"06/25/2004", version:"0.5"},
      {date:"12/13/2005", version:"1.0.0"},
      {date:"3/28/2006",  version:"1.1.0"},
      {date:"1/18/2007",  version:"1.2.0"},
      {date:"12/07/2007", version:"2.0.0"},
      {date:"5/31/2008",  version:"2.1.0"},
      {date:"11/21/2008", version:"2.2.2"},
      {date:"3/15/2009",  version:"2.3.2"},
      {date:"11/26/2009", version:"2.3.5"},
      {date:"7/26/2010",  version:"3 RC1"},
      {date:"8/29/2010",  version:"3.0.0"}
    ]);

  });


