<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="charset=utf-8;"/>
    <script src="../lib/core.js"></script>
    <script src="../dist/chart.js"></script>
</head>
<body >

<div id="chart"></div>

<script id="script_code">
    jui.ready([ "chart.builder", "util.time" ], function(chart, time) {
        var today = getTodayData();

        function getTodayData() {
            var start = new Date(2014, 10, 7),
                end = time.add(start, time.hours, 23);

            var data = [],
                    value = 240;

            for(var i = 0; i < 60 *24; i++) {
                if(value < 60 * 8) {
                    value += 1;
                }

                data.push({ time: time.add(start, time.minutes, i), value: value })
            }

            return {
                start: start,
                end: end,
                data: data
            };
        }

        var now = new Date(2014, 10, 7);
        now.setHours(10);

        chart("#chart", {
            width: 800,
            height: 400,
            axis : {
                x : {
                    type : "dateblock",
                    domain : "time",
                    interval : 1000 * 60 * 60 * 4,
                    format : "dd HH:mm:ss",
                    key: "time"
                },
                y : {
                    type : "range",
                    step : 10,
                    domain : function(d) {
                        return [0, 600];
                    }
                },
                data : today.data,
                buffer: today.data.length
            }
        });
	})
</script>


</body>
</html>