"from":from,

            "to":to

        }

    };

    for(var key in dataset){

      var data = dataset[key].data;

      for(var d in data){

        data[d].time *= 1000;

      }

    }

    for(var key in overview_dataset){

      overview_dataset[key][0] *= 1000;

    }

    var dataset = dataset;

    var overview_dataset = [overview_dataset];

    var choiceContainer = $("#legend_choices")[0];

    var choiceContainerTable = $("#legend_choices_tables")[0];

    var $plotContainer = $('#commit_history');

    var plotContainer = $('#commit_history')[0];

    var $overviewContainer = $('#overview');

    var overviewContainer = $('#overview')[0];

    var plot_options = {

        bars: {show:true, align: 'center', lineWidth: 4},

        points: {show:true, radius: 0, fill: false},

        yaxis: {tickDecimals: 0},

        xaxis: {

            mode: "time",

            timeformat: "%d/%m",

            min: from,

            max: to

        },

        grid: {

            hoverable: true,

            clickable: true,

            autoHighlight: true,

            color: "#999"

        },

        //selection: {mode: "x"}

    };

    var overview_options = {

        legend:{show:false},

        bars: {show:true, barWidth: 2},

        shadowSize: 0,

        xaxis: {mode: "time", timeformat: "%d/%m/%y"},

        yaxis: {ticks: 3, min: 0, tickDecimals:0},

        grid: {color: "#999"},

        selection: {mode: "x"}

                 "added":0,

                 "changed":0,

                 "removed":0

            }],

            "schema":["commits"],

            "color":'#ffffff'

        }

    }

    /**

     * generate checkboxes accordingly to data

     * @param keys

     * @returns

     */

    function generateCheckboxes(data) {

        //append checkboxes

        var i = 0;

        choiceContainerTable.innerHTML = '';

        for(var pos in data) {

            data[pos].color = i;

            i++;

            if(data[pos].label != ''){

                choiceContainerTable.innerHTML +=

                     {0}</label></td></tr>'.format(data[pos].label);

            }

        }

    }

    /**

     * ToolTip show

     */

    function showTooltip(x, y, contents) {

        var div=document.getElementById('tooltip');

        if(!div) {

            div = document.createElement('div');

            div.id="tooltip";

            div.style.position="absolute";

            div.style.border='1px solid #fdd';

            div.style.padding='2px';

            div.style.backgroundColor='#fee';

            document.body.appendChild(div);

        }

        $(div).css('opacity', 0)

        div.innerHTML = contents;

        div.style.top=(y + 5) + "px";

        div.style.left=(x + 5) + "px";

            if (new_dataset[key] !== undefined){

                data.push(new_dataset[key]);

            }

        }

        if (data.length > 0){

            return data;

        }

        else{

            //just return dummy data for graph to plot itself

            return [getDummyData('')];

        }

    }

    /**

    * redraw using new checkbox data

    */

    function plotchoiced(e){

        args = e.data;

        var cur_data = args[0];

        var cur_ranges = args[1];

        var new_data = [];

        var inputs = choiceContainer.getElementsByTagName("input");

        //show only checked labels

        for(var i=0; i<inputs.length; i++) {

            var checkbox_key = inputs[i].name;

            if(inputs[i].checked){

                for(var d in cur_data){

                    if(cur_data[d].label == checkbox_key){

                        new_data.push(cur_data[d]);

                    }

                }

            }

            else{

                //push dummy data to not hide the label

                new_data.push(getDummyData(checkbox_key));

            }

        }

        var new_options = $.extend(plot_options, {

            xaxis: {

                min: cur_ranges.xaxis.from,

                max: cur_ranges.xaxis.to,

                mode: "time",

                timeformat: "%d/%m"

            }

        });

        if (!new_data){

            new_data = [[0,1]];

        }

        // do the zooming

       plot = $.plot(plotContainer, new_data, new_options);

       $plotContainer.on("plotselected", plotselected);

       //resubscribe plothover

       $plotContainer.on("plothover", plothover);

       // don't fire event on the overview to prevent eternal loop

       overview.setSelection(cur_ranges, true);

    }

    /**

     * plot only selected items from overview

     * @param ranges

     * @returns

     */

    function plotselected(e, ranges) {

        //updates the data for new plot

        var data = getDataAccordingToRanges(ranges);

        generateCheckboxes(data);

        var new_options = $.extend(plot_options, {

            xaxis: {

                min: ranges.xaxis.from,

                max: ranges.xaxis.to,

                mode:"time",

                timeformat: "%d/%m"

            }

        });

        // do the zooming

        plot = $.plot(plotContainer, data, new_options);

        $plotContainer.on("plotselected", plotselected);

        //resubscribe plothover

        $plotContainer.on("plothover", plothover);

        // don't fire event on the overview to prevent eternal loop

        overview.setSelection(ranges, true);

        //resubscribe choiced

    }

    var previousPoint = null;

    function plothover(e, pos, item) {

        if (item) {

            if (previousPoint != item.datapoint) {

                previousPoint = item.datapoint;

                var tooltip = $("#tooltip")[0];

                if(tooltip) {

                      tooltip.parentNode.removeChild(tooltip);

                }

                var d = new Date(item.datapoint[0]);

                var fd = d.toDateString();

                var nr_commits = item.datapoint[1];

                if (!item.series.label){

                    item.series.label = 'commits';

                }

                var cur_data = dataset[item.series.label].data[item.dataIndex];

                var added = cur_data.added;

    /**

     * MAIN EXECUTION

     */

    var data = getDataAccordingToRanges(initial_ranges);

    generateCheckboxes(data);

    //main plot

    var plot = $.plot(plotContainer,data,plot_options);

    //overview

    var overview = $.plot(overviewContainer, overview_dataset, overview_options);

    //show initial selection on overview

    overview.setSelection(initial_ranges);

    $plotContainer.on("plotselected", plotselected);

    $plotContainer.on("plothover", plothover);

    $overviewContainer.on("plotselected", function (e, ranges) {

        plot.setSelection(ranges);

    });

    // user choices on overview

}

SummaryPlot(${h.js(c.ts_min)}, ${h.js(c.ts_max)}, ${h.js(c.commit_data)}, ${h.js(c.overview_data)});

</script>

</%def>