how_are_we_doing 0.0.4 → 0.0.5

data/lib/generators/how_are_we_doing/install/templates/public/javascripts/flot/jquery.flot.js

@@ -1,33 +1,9 @@
-/* Javascript plotting library for jQuery, v. 0.6.
+/* Javascript plotting library for jQuery, v. 0.5.
  *
  * Released under the MIT license by IOLA, December 2007.
  *
  */
 
-// first an inline dependency, jquery.colorhelpers.js, we inline it here
-// for convenience
-
-/* Plugin for jQuery for working with colors.
- * 
- * Version 1.0.
- * 
- * Inspiration from jQuery color animation plugin by John Resig.
- *
- * Released under the MIT license by Ole Laursen, October 2009.
- *
- * Examples:
- *
- *   $.color.parse("#fff").scale('rgb', 0.25).add('a', -0.5).toString()
- *   var c = $.color.extract($("#mydiv"), 'background-color');
- *   console.log(c.r, c.g, c.b, c.a);
- *   $.color.make(100, 50, 25, 0.4).toString() // returns "rgba(100,50,25,0.4)"
- *
- * Note that .scale() and .add() work in-place instead of returning
- * new objects.
- */ 
-(function(){jQuery.color={};jQuery.color.make=function(E,D,B,C){var F={};F.r=E||0;F.g=D||0;F.b=B||0;F.a=C!=null?C:1;F.add=function(I,H){for(var G=0;G<I.length;++G){F[I.charAt(G)]+=H}return F.normalize()};F.scale=function(I,H){for(var G=0;G<I.length;++G){F[I.charAt(G)]*=H}return F.normalize()};F.toString=function(){if(F.a>=1){return"rgb("+[F.r,F.g,F.b].join(",")+")"}else{return"rgba("+[F.r,F.g,F.b,F.a].join(",")+")"}};F.normalize=function(){function G(I,J,H){return J<I?I:(J>H?H:J)}F.r=G(0,parseInt(F.r),255);F.g=G(0,parseInt(F.g),255);F.b=G(0,parseInt(F.b),255);F.a=G(0,F.a,1);return F};F.clone=function(){return jQuery.color.make(F.r,F.b,F.g,F.a)};return F.normalize()};jQuery.color.extract=function(C,B){var D;do{D=C.css(B).toLowerCase();if(D!=""&&D!="transparent"){break}C=C.parent()}while(!jQuery.nodeName(C.get(0),"body"));if(D=="rgba(0, 0, 0, 0)"){D="transparent"}return jQuery.color.parse(D)};jQuery.color.parse=function(E){var D,B=jQuery.color.make;if(D=/rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(E)){return B(parseInt(D[1],10),parseInt(D[2],10),parseInt(D[3],10))}if(D=/rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(E)){return B(parseInt(D[1],10),parseInt(D[2],10),parseInt(D[3],10),parseFloat(D[4]))}if(D=/rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(E)){return B(parseFloat(D[1])*2.55,parseFloat(D[2])*2.55,parseFloat(D[3])*2.55)}if(D=/rgba\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(E)){return B(parseFloat(D[1])*2.55,parseFloat(D[2])*2.55,parseFloat(D[3])*2.55,parseFloat(D[4]))}if(D=/#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(E)){return B(parseInt(D[1],16),parseInt(D[2],16),parseInt(D[3],16))}if(D=/#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(E)){return B(parseInt(D[1]+D[1],16),parseInt(D[2]+D[2],16),parseInt(D[3]+D[3],16))}var C=jQuery.trim(E).toLowerCase();if(C=="transparent"){return B(255,255,255,0)}else{D=A[C];return B(D[0],D[1],D[2])}};var A={aqua:[0,255,255],azure:[240,255,255],beige:[245,245,220],black:[0,0,0],blue:[0,0,255],brown:[165,42,42],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgrey:[169,169,169],darkgreen:[0,100,0],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkviolet:[148,0,211],fuchsia:[255,0,255],gold:[255,215,0],green:[0,128,0],indigo:[75,0,130],khaki:[240,230,140],lightblue:[173,216,230],lightcyan:[224,255,255],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightyellow:[255,255,224],lime:[0,255,0],magenta:[255,0,255],maroon:[128,0,0],navy:[0,0,128],olive:[128,128,0],orange:[255,165,0],pink:[255,192,203],purple:[128,0,128],violet:[128,0,128],red:[255,0,0],silver:[192,192,192],white:[255,255,255],yellow:[255,255,0]}})();
-
-// the actual Flot code
 (function($) {
     function Plot(placeholder, data_, options_, plugins) {
         // data is on the form:
@@ -52,8 +28,6 @@
                 },
                 xaxis: {
                     mode: null, // null or "time"
-                    transform: null, // null or f: number -> number to transform axis
-                    inverseTransform: null, // if transform is set, this should be the inverse function
                     min: null, // min. value to show, null means set automatically
                     max: null, // max. value to show, null means set automatically
                     autoscaleMargin: null, // margin in % to add if auto-setting min/max
@@ -67,8 +41,7 @@
                     tickSize: null, // number or [number, "unit"]
                     minTickSize: null, // number or [number, "unit"]
                     monthNames: null, // list of names of months
-                    timeformat: null, // format string to use
-                    twelveHourClock: false // 12 or 24 time in time mode
+                    timeformat: null // format string to use
                 },
                 yaxis: {
                     autoscaleMargin: 0.02
@@ -102,7 +75,8 @@
                         fill: true,
                         fillColor: null,
                         align: "left", // or "center" 
-                        horizontal: false // when horizontal, left is now top
+                        horizontal: false, // when horizontal, left is now top
+                        series_spread: false // display series side by side
                     },
                     shadowSize: 3
                 },
@@ -124,7 +98,10 @@
                     autoHighlight: true, // highlight in case mouse is near
                     mouseActiveRadius: 10 // how far the mouse can be away to activate an item
                 },
-                hooks: {}
+                selection: {
+                    mode: null, // one of null, "x", "y" or "xy"
+                    color: "#e8cfac"
+                }
             },
         canvas = null,      // the canvas for the plot itself
         overlay = null,     // canvas for interactive stuff on top of plot
@@ -142,17 +119,22 @@
             bindEvents: [],
             drawOverlay: []
         },
-        plot = this;
+        plot = this,
+        // dedicated to storing data for buggy standard compliance cases
+        workarounds = {};
 
         // public functions
         plot.setData = setData;
         plot.setupGrid = setupGrid;
         plot.draw = draw;
+        plot.clearSelection = clearSelection;
+        plot.setSelection = setSelection;
+        plot.getSelection = getSelection;
         plot.getPlaceholder = function() { return placeholder; };
         plot.getCanvas = function() { return canvas; };
         plot.getPlotOffset = function() { return plotOffset; };
-        plot.width = function () { return plotWidth; };
-        plot.height = function () { return plotHeight; };
+        plot.width = function () { return plotWidth; }
+        plot.height = function () { return plotHeight; }
         plot.offset = function () {
             var o = eventHolder.offset();
             o.left += plotOffset.left;
@@ -168,7 +150,7 @@
         plot.pointOffset = function(point) {
             return { left: parseInt(axisSpecToRealAxis(point, "xaxis").p2c(+point.x) + plotOffset.left),
                      top: parseInt(axisSpecToRealAxis(point, "yaxis").p2c(+point.y) + plotOffset.top) };
-        };
+        }
         
 
         // public attributes
@@ -202,7 +184,7 @@
         function parseOptions(opts) {
             $.extend(true, options, opts);
             if (options.grid.borderColor == null)
-                options.grid.borderColor = options.grid.color;
+                options.grid.borderColor = options.grid.color
             // backwards compatibility, to be removed in future
             if (options.xaxis.noTicks && options.xaxis.ticks == null)
                 options.xaxis.ticks = options.xaxis.noTicks;
@@ -221,10 +203,6 @@
             if (options.shadowSize)
                 options.series.shadowSize = options.shadowSize;
 
-            for (var n in hooks)
-                if (options.hooks[n] && options.hooks[n].length)
-                    hooks[n] = hooks[n].concat(options.hooks[n]);
-
             executeHooks(hooks.processOptions, [options]);
         }
 
@@ -278,7 +256,7 @@
                     if (typeof sc == "number")
                         assignedColors.push(sc);
                     else
-                        usedColors.push($.color.parse(series[i].color));
+                        usedColors.push(parseColor(series[i].color));
                 }
             }
             
@@ -294,13 +272,14 @@
             while (colors.length < neededColors) {
                 var c;
                 if (options.colors.length == i) // check degenerate case
-                    c = $.color.make(100, 100, 100);
+                    c = new Color(100, 100, 100);
                 else
-                    c = $.color.parse(options.colors[i]);
+                    c = parseColor(options.colors[i]);
 
                 // vary color if needed
                 var sign = variation % 2 == 1 ? -1 : 1;
-                c.scale('rgb', 1 + sign * Math.ceil(variation / 2) * 0.2)
+                var factor = 1 + sign * Math.ceil(variation / 2) * 0.2;
+                c.scale(factor, factor, factor);
 
                 // FIXME: if we're getting to close to something else,
                 // we should probably skip this one
@@ -329,7 +308,7 @@
                 // turn on lines automatically in case nothing is set
                 if (s.lines.show == null) {
                     var v, show = true;
-                    for (v in s)
+                    for (var v in s)
                         if (s[v].show) {
                             show = false;
                             break;
@@ -353,6 +332,8 @@
             for (axis in axes) {
                 axes[axis].datamin = topSentry;
                 axes[axis].datamax = bottomSentry;
+                axes[axis].min = options[axis].min;
+                axes[axis].max = options[axis].max;
                 axes[axis].used = false;
             }
 
@@ -377,10 +358,10 @@
                 var data = s.data, format = s.datapoints.format;
 
                 if (!format) {
-                    format = [];
+                    format = []
                     // find out how to copy
-                    format.push({ x: true, number: true, required: true });
-                    format.push({ y: true, number: true, required: true });
+                    format.push({ x: true, number: true, required: true })
+                    format.push({ y: true, number: true, required: true })
 
                     if (s.bars.show)
                         format.push({ y: true, number: true, required: false, defaultValue: 0 });
@@ -417,8 +398,15 @@
                                 }
 
                                 if (val == null) {
-                                    if (f.required)
+                                    if (f.required) {
+                                        // extract min/max info before we whack it
+                                        if (f.x)
+                                            updateAxis(s.xaxis, val, val)
+                                        if (f.y)
+                                            updateAxis(s.yaxis, val, val)
+                                        val = null;
                                         nullify = true;
+                                    }
                                     
                                     if (f.defaultValue != null)
                                         val = f.defaultValue;
@@ -430,18 +418,8 @@
                     }
                     
                     if (nullify) {
-                        for (m = 0; m < ps; ++m) {
-                            val = points[k + m];
-                            if (val != null) {
-                                f = format[m];
-                                // extract min/max info
-                                if (f.x)
-                                    updateAxis(s.xaxis, val, val);
-                                if (f.y)
-                                    updateAxis(s.yaxis, val, val);
-                            }
+                        for (m = 0; m < ps; ++m)
                             points[k + m] = null;
-                        }
                     }
                     else {
                         // a little bit of line specific stuff that
@@ -465,7 +443,6 @@
                 }
             }
 
-            // give the hooks a chance to run
             for (i = 0; i < series.length; ++i) {
                 s = series[i];
                 
@@ -489,7 +466,7 @@
                         val = points[j + m];
                         f = format[m];
                         if (!f)
-                            continue;
+                            continue
                         
                         if (f.x) {
                             if (val < xmin)
@@ -569,9 +546,13 @@
             eventHolder = $([overlay, canvas]);
 
             // bind events
-            if (options.grid.hoverable)
+            if (options.selection.mode != null
+                || options.grid.hoverable)
                 eventHolder.mousemove(onMouseMove);
 
+            if (options.selection.mode != null)
+                eventHolder.mousedown(onMouseDown);
+
             if (options.grid.clickable)
                 eventHolder.click(onClick);
 
@@ -579,42 +560,27 @@
         }
 
         function setupGrid() {
-            function setTransformationHelpers(axis, o) {
-                function identity(x) { return x; }
-                
-                var s, m, t = o.transform || identity,
-                    it = o.inverseTransform;
+            function setTransformationHelpers(axis) {
+                var s, m;
                     
                 // add transformation helpers
                 if (axis == axes.xaxis || axis == axes.x2axis) {
                     // precompute how much the axis is scaling a point
                     // in canvas space
-                    s = axis.scale = plotWidth / (t(axis.max) - t(axis.min));
-                    m = t(axis.min);
-
+                    s = axis.scale = plotWidth / (axis.max - axis.min);
+                    m = axis.min;
+                    
                     // data point to canvas coordinate
-                    if (t == identity) // slight optimization
-                        axis.p2c = function (p) { return (p - m) * s; };
-                    else
-                        axis.p2c = function (p) { return (t(p) - m) * s; };
-                    // canvas coordinate to data point
-                    if (!it)
-                        axis.c2p = function (c) { return m + c / s; };
-                    else
-                        axis.c2p = function (c) { return it(m + c / s); };
+                    axis.p2c = function (p) { return (p - m) * s; };
+                    // canvas coordinate to data point 
+                    axis.c2p = function (c) { return m + c / s; };
                 }
                 else {
-                    s = axis.scale = plotHeight / (t(axis.max) - t(axis.min));
-                    m = t(axis.max);
+                    s = axis.scale = plotHeight / (axis.max - axis.min)
+                    m = axis.max;
                     
-                    if (t == identity)
-                        axis.p2c = function (p) { return (m - p) * s; };
-                    else
-                        axis.p2c = function (p) { return (m - t(p)) * s; };
-                    if (!it)
-                        axis.c2p = function (c) { return m - c / s; };
-                    else
-                        axis.c2p = function (c) { return it(m - c / s); };
+                    axis.p2c = function (p) { return (m - p) * s; };
+                    axis.c2p = function (p) { return m - p / s; };
                 }
             }
 
@@ -630,7 +596,7 @@
                     // them, we don't need the exact figures and the
                     // fixed-size box content is easy to center
                     if (axis.labelWidth == null)
-                        axis.labelWidth = canvasWidth / (axis.ticks.length > 0 ? axis.ticks.length : 1);
+                        axis.labelWidth = canvasWidth / 6;
 
                     // measure x label heights
                     if (axis.labelHeight == null) {
@@ -719,7 +685,7 @@
             }
             
             for (axis in axes)
-                setTransformationHelpers(axes[axis], options[axis]);
+                setTransformationHelpers(axes[axis]);
 
             if (options.grid.show)
                 insertLabels();
@@ -918,15 +884,14 @@
                     
                     var t = axis.tickSize[0] * timeUnitSize[axis.tickSize[1]];
                     var span = axis.max - axis.min;
-                    var suffix = (axisOptions.twelveHourClock) ? " %p" : "";
                     
                     if (t < timeUnitSize.minute)
-                        fmt = "%h:%M:%S" + suffix;
+                        fmt = "%h:%M:%S";
                     else if (t < timeUnitSize.day) {
                         if (span < 2 * timeUnitSize.day)
-                            fmt = "%h:%M" + suffix;
+                            fmt = "%h:%M";
                         else
-                            fmt = "%b %d %h:%M" + suffix;
+                            fmt = "%b %d %h:%M";
                     }
                     else if (t < timeUnitSize.month)
                         fmt = "%b %d";
@@ -1152,8 +1117,8 @@
                     
                     if (xrange.from == xrange.to || yrange.from == yrange.to) {
                         // draw line
-                        ctx.beginPath();
                         ctx.strokeStyle = m.color || options.grid.markingsColor;
+                        ctx.beginPath();
                         ctx.lineWidth = m.lineWidth || options.grid.markingsLineWidth;
                         //ctx.moveTo(Math.floor(xrange.from), yrange.from);
                         //ctx.lineTo(Math.floor(xrange.to), yrange.to);
@@ -1569,7 +1534,7 @@
             ctx.restore();
         }
 
-        function drawBar(x, y, b, barLeft, barRight, offset, fillStyleCallback, axisx, axisy, c, horizontal) {
+        function drawBar(x, y, b, barLeft, barRight, yoffset, x_line_adjustment, fillStyleCallback, axisx, axisy, c, horizontal) {
             var left, right, bottom, top,
                 drawLeft, drawRight, drawTop, drawBottom,
                 tmp;
@@ -1649,53 +1614,76 @@
                 c.fillStyle = fillStyleCallback(bottom, top);
                 c.fill();
             }
+            
+            if (yoffset) {
+                bottom += yoffset;
+                top += yoffset;
+            }
+            
+            if (x_line_adjustment) {
+                left += x_line_adjustment;
+                right -= x_line_adjustment;
+            }
 
             // draw outline
             if (drawLeft || drawRight || drawTop || drawBottom) {
                 c.beginPath();
 
                 // FIXME: inline moveTo is buggy with excanvas
-                c.moveTo(left, bottom + offset);
+                c.moveTo(left, bottom);
                 if (drawLeft)
-                    c.lineTo(left, top + offset);
+                    c.lineTo(left, top);
                 else
-                    c.moveTo(left, top + offset);
+                    c.moveTo(left, top);
                 if (drawTop)
-                    c.lineTo(right, top + offset);
+                    c.lineTo(right, top);
                 else
-                    c.moveTo(right, top + offset);
+                    c.moveTo(right, top);
                 if (drawRight)
-                    c.lineTo(right, bottom + offset);
+                    c.lineTo(right, bottom);
                 else
-                    c.moveTo(right, bottom + offset);
+                    c.moveTo(right, bottom);
                 if (drawBottom)
-                    c.lineTo(left, bottom + offset);
+                    c.lineTo(left, bottom);
                 else
-                    c.moveTo(left, bottom + offset);
+                    c.moveTo(left, bottom);
                 c.stroke();
             }
         }
         
         function drawSeriesBars(series) {
-            function plotBars(datapoints, barLeft, barRight, offset, fillStyleCallback, axisx, axisy) {
+            function plotBars(datapoints, barLeft, barRight, yoffset, x_line_adjustment, fillStyleCallback, axisx, axisy) {
                 var points = datapoints.points, ps = datapoints.pointsize;
                 
                 for (var i = 0; i < points.length; i += ps) {
                     if (points[i] == null)
                         continue;
-                    drawBar(points[i], points[i + 1], points[i + 2], barLeft, barRight, offset, fillStyleCallback, axisx, axisy, ctx, series.bars.horizontal);
+                    drawBar(points[i], points[i + 1], points[i + 2], barLeft, barRight, yoffset, x_line_adjustment, fillStyleCallback, axisx, axisy, ctx, series.bars.horizontal);
                 }
             }
 
             ctx.save();
             ctx.translate(plotOffset.left, plotOffset.top);
-
+            
             // FIXME: figure out a way to add shadows (for instance along the right edge)
             ctx.lineWidth = series.bars.lineWidth;
             ctx.strokeStyle = series.color;
             var barLeft = series.bars.align == "left" ? 0 : -series.bars.barWidth/2;
+            
+            if (series.bars.series_spread) {
+                var series_index = indexOfSeries(series);
+                var series_length = plot.getData().length;
+                var actualBarWidth = ((1.0/series_length) * (series.bars.barWidth));
+                barLeft = barLeft + (series_index * actualBarWidth);
+            }
+            
             var fillStyleCallback = series.bars.fill ? function (bottom, top) { return getFillStyle(series.bars, series.color, bottom, top); } : null;
-            plotBars(series.datapoints, barLeft, barLeft + series.bars.barWidth, 0, fillStyleCallback, series.xaxis, series.yaxis);
+            
+            if (series.bars.series_spread) {
+                plotBars(series.datapoints, barLeft, barLeft + actualBarWidth, 0, series.bars.lineWidth, fillStyleCallback, series.xaxis, series.yaxis);                
+            } else {
+                plotBars(series.datapoints, barLeft, barLeft + series.bars.barWidth, 0, 0, fillStyleCallback, series.xaxis, series.yaxis);
+            }
             ctx.restore();
         }
 
@@ -1707,7 +1695,7 @@
             if (filloptions.fillColor)
                 return getColorOrGradient(filloptions.fillColor, bottom, top, seriesColor);
             
-            var c = $.color.parse(seriesColor);
+            var c = parseColor(seriesColor);
             c.a = typeof fill == "number" ? fill : 0.4;
             c.normalize();
             return c.toString();
@@ -1771,13 +1759,12 @@
                     // label boxes
                     var c = options.legend.backgroundColor;
                     if (c == null) {
-                        c = options.grid.backgroundColor;
-                        if (c && typeof c == "string")
-                            c = $.color.parse(c);
+                        var tmp;
+                        if (options.grid.backgroundColor && typeof options.grid.backgroundColor == "string")
+                            tmp = options.grid.backgroundColor;
                         else
-                            c = $.color.extract(legend, 'background-color');
-                        c.a = 1;
-                        c = c.toString();
+                            tmp = extractColor(legend);
+                        c = parseColor(tmp).adjust(null, null, null, 1).toString();
                     }
                     var div = legend.children();
                     $('<div style="position:absolute;width:' + div.width() + 'px;height:' + div.height() + 'px;' + pos +'background-color:' + c + ';"> </div>').prependTo(legend).css('opacity', options.legend.backgroundOpacity);
@@ -1788,16 +1775,24 @@
 
         // interactive features
         
-        var highlights = [],
-            redrawTimeout = null;
+        var lastMousePos = { pageX: null, pageY: null },
+            selection = {
+                first: { x: -1, y: -1}, second: { x: -1, y: -1},
+                show: false,
+                active: false
+            },
+            highlights = [],
+            clickIsMouseUp = false,
+            redrawTimeout = null,
+            hoverTimeout = null;
         
         // returns the data item the mouse is over, or null if none is found
         function findNearbyItem(mouseX, mouseY, seriesFilter) {
             var maxDistance = options.grid.mouseActiveRadius,
-                smallestDistance = maxDistance * maxDistance + 1,
+                lowestDistance = maxDistance * maxDistance + 1,
                 item = null, foundPoint = false, i, j;
 
-            for (i = 0; i < series.length; ++i) {
+            for (var i = 0; i < series.length; ++i) {
                 if (!seriesFilter(series[i]))
                     continue;
                 
@@ -1827,12 +1822,9 @@
                         // data units, because the scales of the axes may be different
                         var dx = Math.abs(axisx.p2c(x) - mouseX),
                             dy = Math.abs(axisy.p2c(y) - mouseY),
-                            dist = dx * dx + dy * dy; // we save the sqrt
-
-                        // use <= to ensure last point takes precedence
-                        // (last generally means on top of)
-                        if (dist <= smallestDistance) {
-                            smallestDistance = dist;
+                            dist = dx * dx + dy * dy; // no idea in taking sqrt
+                        if (dist < lowestDistance) {
+                            lowestDistance = dist;
                             item = [i, j / ps];
                         }
                     }
@@ -1842,6 +1834,12 @@
                     var barLeft = s.bars.align == "left" ? 0 : -s.bars.barWidth/2,
                         barRight = barLeft + s.bars.barWidth;
                     
+                    if (s.bars.series_spread) {
+                        var actualBarWidth = ((1.0/series.length) * (s.bars.barWidth));
+                        barLeft = barLeft + (i * actualBarWidth);
+                        barRight = barLeft + actualBarWidth;
+                    }
+                    
                     for (j = 0; j < points.length; j += ps) {
                         var x = points[j], y = points[j + 1], b = points[j + 2];
                         if (x == null)
@@ -1861,7 +1859,6 @@
             if (item) {
                 i = item[0];
                 j = item[1];
-                ps = series[i].datapoints.pointsize;
                 
                 return { datapoint: series[i].datapoints.points.slice(j * ps, (j + 1) * ps),
                          dataIndex: j,
@@ -1873,12 +1870,50 @@
         }
 
         function onMouseMove(e) {
+            lastMousePos.pageX = e.pageX;
+            lastMousePos.pageY = e.pageY;
+            
             if (options.grid.hoverable)
-                triggerClickHoverEvent("plothover", e,
+                triggerClickHoverEvent("plothover", lastMousePos,
                                        function (s) { return s["hoverable"] != false; });
+
+            if (selection.active) {
+                placeholder.trigger("plotselecting", [ getSelection() ]);
+
+                updateSelection(lastMousePos);
+            }
         }
         
+        function onMouseDown(e) {
+            if (e.which != 1)  // only accept left-click
+                return;
+            
+            // cancel out any text selections
+            document.body.focus();
+
+            // prevent text selection and drag in old-school browsers
+            if (document.onselectstart !== undefined && workarounds.onselectstart == null) {
+                workarounds.onselectstart = document.onselectstart;
+                document.onselectstart = function () { return false; };
+            }
+            if (document.ondrag !== undefined && workarounds.ondrag == null) {
+                workarounds.ondrag = document.ondrag;
+                document.ondrag = function () { return false; };
+            }
+            
+            setSelectionPos(selection.first, e);
+                
+            lastMousePos.pageX = null;
+            selection.active = true;
+            $(document).one("mouseup", onSelectionMouseUp);
+        }
+
         function onClick(e) {
+            if (clickIsMouseUp) {
+                clickIsMouseUp = false;
+                return;
+            }
+
             triggerClickHoverEvent("plotclick", e,
                                    function (s) { return s["clickable"] != false; });
         }
@@ -1946,6 +1981,22 @@
                 else
                     drawPointHighlight(hi.series, hi.point);
             }
+
+            // draw selection
+            if (selection.show && selectionIsSane()) {
+                octx.strokeStyle = parseColor(options.selection.color).scale(null, null, null, 0.8).toString();
+                octx.lineWidth = 1;
+                ctx.lineJoin = "round";
+                octx.fillStyle = parseColor(options.selection.color).scale(null, null, null, 0.4).toString();
+                
+                var x = Math.min(selection.first.x, selection.second.x),
+                    y = Math.min(selection.first.y, selection.second.y),
+                    w = Math.abs(selection.second.x - selection.first.x),
+                    h = Math.abs(selection.second.y - selection.first.y);
+                
+                octx.fillRect(x, y, w, h);
+                octx.strokeRect(x, y, w, h);
+            }
             octx.restore();
             
             executeHooks(hooks.drawOverlay, [octx]);
@@ -1998,6 +2049,15 @@
             return -1;
         }
         
+        function indexOfSeries(s) {
+            for (var i = 0; i < series.length; ++i) {
+                var os = series[i];
+                if (os == s)
+                    return i;
+            }
+            return -1;
+        }
+                
         function drawPointHighlight(series, point) {
             var x = point[0], y = point[1],
                 axisx = series.xaxis, axisy = series.yaxis;
@@ -2007,7 +2067,7 @@
             
             var pointRadius = series.points.radius + series.points.lineWidth / 2;
             octx.lineWidth = pointRadius;
-            octx.strokeStyle = $.color.parse(series.color).scale('a', 0.5).toString();
+            octx.strokeStyle = parseColor(series.color).scale(1, 1, 1, 0.5).toString();
             var radius = 1.5 * pointRadius;
             octx.beginPath();
             octx.arc(axisx.p2c(x), axisy.p2c(y), radius, 0, 2 * Math.PI, false);
@@ -2016,13 +2076,161 @@
 
         function drawBarHighlight(series, point) {
             octx.lineWidth = series.bars.lineWidth;
-            octx.strokeStyle = $.color.parse(series.color).scale('a', 0.5).toString();
-            var fillStyle = $.color.parse(series.color).scale('a', 0.5).toString();
+            octx.strokeStyle = parseColor(series.color).scale(1, 1, 1, 0.5).toString();
+            var fillStyle = parseColor(series.color).scale(1, 1, 1, 0.5).toString();
             var barLeft = series.bars.align == "left" ? 0 : -series.bars.barWidth/2;
-            drawBar(point[0], point[1], point[2] || 0, barLeft, barLeft + series.bars.barWidth,
-                    0, function () { return fillStyle; }, series.xaxis, series.yaxis, octx, series.bars.horizontal);
+            
+            
+            if (series.bars.series_spread) {
+                s = plot.getData();
+                series_index = indexOfSeries(series);
+                var actualBarWidth = ((1.0/s.length) * (series.bars.barWidth));
+                barLeft = barLeft + (series_index * actualBarWidth);
+            }
+
+            if (series.bars.series_spread) {
+                drawBar(point[0], point[1], point[2] || 0, barLeft, barLeft + actualBarWidth,
+                    0, series.bars.lineWidth, function () { return fillStyle; }, series.xaxis, series.yaxis, octx, series.bars.horizontal);
+            } else {
+                drawBar(point[0], point[1], point[2] || 0, barLeft, barLeft + series.bars.barWidth,
+                    0, 0, function () { return fillStyle; }, series.xaxis, series.yaxis, octx, series.bars.horizontal);
+            }
         }
 
+        function getSelection() {
+            if (!selectionIsSane())
+                return null;
+            
+            var x1 = Math.min(selection.first.x, selection.second.x),
+                x2 = Math.max(selection.first.x, selection.second.x),
+                y1 = Math.max(selection.first.y, selection.second.y),
+                y2 = Math.min(selection.first.y, selection.second.y);
+
+            var r = {};
+            if (axes.xaxis.used)
+                r.xaxis = { from: axes.xaxis.c2p(x1), to: axes.xaxis.c2p(x2) };
+            if (axes.x2axis.used)
+                r.x2axis = { from: axes.x2axis.c2p(x1), to: axes.x2axis.c2p(x2) };
+            if (axes.yaxis.used)
+                r.yaxis = { from: axes.yaxis.c2p(y1), to: axes.yaxis.c2p(y2) };
+            if (axes.y2axis.used)
+                r.y2axis = { from: axes.y2axis.c2p(y1), to: axes.y2axis.c2p(y2) };
+            return r;
+        }
+        
+        function triggerSelectedEvent() {
+            var r = getSelection();
+            
+            placeholder.trigger("plotselected", [ r ]);
+
+            // backwards-compat stuff, to be removed in future
+            if (axes.xaxis.used && axes.yaxis.used)
+                placeholder.trigger("selected", [ { x1: r.xaxis.from, y1: r.yaxis.from, x2: r.xaxis.to, y2: r.yaxis.to } ]);
+        }
+        
+        function onSelectionMouseUp(e) {
+            // revert drag stuff for old-school browsers
+            if (document.onselectstart !== undefined)
+                document.onselectstart = workarounds.onselectstart;
+            if (document.ondrag !== undefined)
+                document.ondrag = workarounds.ondrag;
+            
+            // no more draggy-dee-drag
+            selection.active = false;
+            updateSelection(e);
+            
+            if (selectionIsSane()) {
+                triggerSelectedEvent();
+                clickIsMouseUp = true;
+            }
+            else {
+                // this counts as a clear
+                placeholder.trigger("plotunselected", [ ]);
+                placeholder.trigger("plotselecting", [ null ]);
+            }
+            
+            return false;
+        }
+
+        function setSelectionPos(pos, e) {
+            var offset = eventHolder.offset();
+            pos.x = clamp(0, e.pageX - offset.left - plotOffset.left, plotWidth);
+            pos.y = clamp(0, e.pageY - offset.top - plotOffset.top, plotHeight);
+            
+            if (options.selection.mode == "y") {
+                if (pos == selection.first)
+                    pos.x = 0;
+                else
+                    pos.x = plotWidth;
+            }
+
+            if (options.selection.mode == "x") {
+                if (pos == selection.first)
+                    pos.y = 0;
+                else
+                    pos.y = plotHeight;
+            }
+        }
+
+        function updateSelection(pos) {
+            if (pos.pageX == null)
+                return;
+
+            setSelectionPos(selection.second, pos);
+            if (selectionIsSane()) {
+                selection.show = true;
+                triggerRedrawOverlay();
+            }
+            else
+                clearSelection(true);
+        }
+
+        function clearSelection(preventEvent) {
+            if (selection.show) {
+                selection.show = false;
+                triggerRedrawOverlay();
+                if (!preventEvent)
+                    placeholder.trigger("plotunselected", [ ]);
+            }
+        }
+
+        function setSelection(ranges, preventEvent) {
+            var range;
+            
+            if (options.selection.mode == "y") {
+                selection.first.x = 0;
+                selection.second.x = plotWidth;
+            }
+            else {
+                range = extractRange(ranges, "x");
+                
+                selection.first.x = range.axis.p2c(range.from);
+                selection.second.x = range.axis.p2c(range.to);
+            }
+            
+            if (options.selection.mode == "x") {
+                selection.first.y = 0;
+                selection.second.y = plotHeight;
+            }
+            else {
+                range = extractRange(ranges, "y");
+                
+                selection.first.y = range.axis.p2c(range.from);
+                selection.second.y = range.axis.p2c(range.to);
+            }
+
+            selection.show = true;
+            triggerRedrawOverlay();
+            if (!preventEvent)
+                triggerSelectedEvent();
+        }
+        
+        function selectionIsSane() {
+            var minSize = 5;
+            return Math.abs(selection.second.x - selection.first.x) >= minSize &&
+                Math.abs(selection.second.y - selection.first.y) >= minSize;
+        }
+        
         function getColorOrGradient(spec, bottom, top, defaultColor) {
             if (typeof spec == "string")
                 return spec;
@@ -2034,12 +2242,7 @@
                 
                 for (var i = 0, l = spec.colors.length; i < l; ++i) {
                     var c = spec.colors[i];
-                    if (typeof c != "string") {
-                        c = $.color.parse(defaultColor).scale('rgb', c.brightness);
-                        c.a *= c.opacity;
-                        c = c.toString();
-                    }
-                    gradient.addColorStop(i / (l - 1), c);
+                    gradient.addColorStop(i / (l - 1), typeof c == "string" ? c : parseColor(defaultColor).scale(c.brightness, c.brightness, c.brightness, c.opacity));
                 }
                 
                 return gradient;
@@ -2070,33 +2273,21 @@
         
         var r = [];
         var escape = false;
-        var hours = d.getUTCHours();
-        var isAM = hours < 12;
         if (monthNames == null)
             monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
-
-        if (fmt.search(/%p|%P/) != -1) {
-            if (hours > 12) {
-                hours = hours - 12;
-            } else if (hours == 0) {
-                hours = 12;
-            }
-        }
         for (var i = 0; i < fmt.length; ++i) {
             var c = fmt.charAt(i);
             
             if (escape) {
                 switch (c) {
-                case 'h': c = "" + hours; break;
-                case 'H': c = leftPad(hours); break;
+                case 'h': c = "" + d.getUTCHours(); break;
+                case 'H': c = leftPad(d.getUTCHours()); break;
                 case 'M': c = leftPad(d.getUTCMinutes()); break;
                 case 'S': c = leftPad(d.getUTCSeconds()); break;
                 case 'd': c = "" + d.getUTCDate(); break;
                 case 'm': c = "" + (d.getUTCMonth() + 1); break;
                 case 'y': c = "" + d.getUTCFullYear(); break;
                 case 'b': c = "" + monthNames[d.getUTCMonth()]; break;
-                case 'p': c = (isAM) ? ("" + "am") : ("" + "pm"); break;
-                case 'P': c = (isAM) ? ("" + "AM") : ("" + "PM"); break;
                 }
                 r.push(c);
                 escape = false;
@@ -2116,4 +2307,167 @@
         return base * Math.floor(n / base);
     }
     
+    function clamp(min, value, max) {
+        if (value < min)
+            return min;
+        else if (value > max)
+            return max;
+        else
+            return value;
+    }
+    
+    // color helpers, inspiration from the jquery color animation
+    // plugin by John Resig
+    function Color (r, g, b, a) {
+       
+        var rgba = ['r','g','b','a'];
+        var x = 4; //rgba.length
+       
+        while (-1<--x) {
+            this[rgba[x]] = arguments[x] || ((x==3) ? 1.0 : 0);
+        }
+       
+        this.toString = function() {
+            if (this.a >= 1.0) {
+                return "rgb("+[this.r,this.g,this.b].join(",")+")";
+            } else {
+                return "rgba("+[this.r,this.g,this.b,this.a].join(",")+")";
+            }
+        };
+
+        this.scale = function(rf, gf, bf, af) {
+            x = 4; //rgba.length
+            while (-1<--x) {
+                if (arguments[x] != null)
+                    this[rgba[x]] *= arguments[x];
+            }
+            return this.normalize();
+        };
+
+        this.adjust = function(rd, gd, bd, ad) {
+            x = 4; //rgba.length
+            while (-1<--x) {
+                if (arguments[x] != null)
+                    this[rgba[x]] += arguments[x];
+            }
+            return this.normalize();
+        };
+
+        this.clone = function() {
+            return new Color(this.r, this.b, this.g, this.a);
+        };
+
+        this.normalize = function() {
+            this.r = clamp(0, parseInt(this.r), 255);
+            this.g = clamp(0, parseInt(this.g), 255);
+            this.b = clamp(0, parseInt(this.b), 255);
+            this.a = clamp(0, this.a, 1);
+            return this;
+        };
+
+        this.normalize();
+    }
+    
+    var lookupColors = {
+        aqua:[0,255,255],
+        azure:[240,255,255],
+        beige:[245,245,220],
+        black:[0,0,0],
+        blue:[0,0,255],
+        brown:[165,42,42],
+        cyan:[0,255,255],
+        darkblue:[0,0,139],
+        darkcyan:[0,139,139],
+        darkgrey:[169,169,169],
+        darkgreen:[0,100,0],
+        darkkhaki:[189,183,107],
+        darkmagenta:[139,0,139],
+        darkolivegreen:[85,107,47],
+        darkorange:[255,140,0],
+        darkorchid:[153,50,204],
+        darkred:[139,0,0],
+        darksalmon:[233,150,122],
+        darkviolet:[148,0,211],
+        fuchsia:[255,0,255],
+        gold:[255,215,0],
+        green:[0,128,0],
+        indigo:[75,0,130],
+        khaki:[240,230,140],
+        lightblue:[173,216,230],
+        lightcyan:[224,255,255],
+        lightgreen:[144,238,144],
+        lightgrey:[211,211,211],
+        lightpink:[255,182,193],
+        lightyellow:[255,255,224],
+        lime:[0,255,0],
+        magenta:[255,0,255],
+        maroon:[128,0,0],
+        navy:[0,0,128],
+        olive:[128,128,0],
+        orange:[255,165,0],
+        pink:[255,192,203],
+        purple:[128,0,128],
+        violet:[128,0,128],
+        red:[255,0,0],
+        silver:[192,192,192],
+        white:[255,255,255],
+        yellow:[255,255,0]
+    };    
+
+    function extractColor(element) {
+        var color, elem = element;
+        do {
+            color = elem.css("background-color").toLowerCase();
+            // keep going until we find an element that has color, or
+            // we hit the body
+            if (color != '' && color != 'transparent')
+                break;
+            elem = elem.parent();
+        } while (!$.nodeName(elem.get(0), "body"));
+
+        // catch Safari's way of signalling transparent
+        if (color == "rgba(0, 0, 0, 0)")
+            return "transparent";
+        
+        return color;
+    }
+    
+    // parse string, returns Color
+    function parseColor(str) {
+        var result;
+
+        // Look for rgb(num,num,num)
+        if (result = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(str))
+            return new Color(parseInt(result[1], 10), parseInt(result[2], 10), parseInt(result[3], 10));
+        
+        // Look for rgba(num,num,num,num)
+        if (result = /rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(str))
+            return new Color(parseInt(result[1], 10), parseInt(result[2], 10), parseInt(result[3], 10), parseFloat(result[4]));
+            
+        // Look for rgb(num%,num%,num%)
+        if (result = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(str))
+            return new Color(parseFloat(result[1])*2.55, parseFloat(result[2])*2.55, parseFloat(result[3])*2.55);
+
+        // Look for rgba(num%,num%,num%,num)
+        if (result = /rgba\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(str))
+            return new Color(parseFloat(result[1])*2.55, parseFloat(result[2])*2.55, parseFloat(result[3])*2.55, parseFloat(result[4]));
+        
+        // Look for #a0b1c2
+        if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(str))
+            return new Color(parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16));
+
+        // Look for #fff
+        if (result = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(str))
+            return new Color(parseInt(result[1]+result[1], 16), parseInt(result[2]+result[2], 16), parseInt(result[3]+result[3], 16));
+
+        // Otherwise, we're most likely dealing with a named color
+        var name = $.trim(str).toLowerCase();
+        if (name == "transparent")
+            return new Color(255, 255, 255, 0);
+        else {
+            result = lookupColors[name];
+            return new Color(result[0], result[1], result[2]);
+        }
+    }
+        
 })(jQuery);