Subversion Repositories SmartDukaan

function randNum(){
        return ((Math.floor( Math.random()* (1+40-20) ) ) + 20)* 1200;
}

function randNum2(){
        return ((Math.floor( Math.random()* (1+40-20) ) ) + 20) * 500;
}

function randNum3(){
        return ((Math.floor( Math.random()* (1+40-20) ) ) + 20) * 300;
}

function randNum4(){
        return ((Math.floor( Math.random()* (1+40-20) ) ) + 20) * 100;
}

$(document).ready(function(){
        
        /* ---------- Chart with points ---------- */
        if($("#dotChart").length)
        {       
                var likes = [[1, 5+randNum()], [2, 10+randNum()], [3, 40+randNum()], [4, 60+randNum()],[5, 90+randNum()],[6, 40+randNum()],[7, 25+randNum()],[8, 35+randNum()]];

                var plot = $.plot($("#dotChart"),
                           [ { data: likes, label: "Profit"} ], {
                                   series: {
                                           lines: { show: true,
                                                                lineWidth: 2,
                                                                fill: true, fillColor: { colors: [ { opacity: 0.5 }, { opacity: 0.2 } ] }
                                                         },
                                           points: { show: true, 
                                                                 lineWidth: 3 
                                                         },
                                           shadowSize: 0
                                   },
                                   grid: { hoverable: true, 
                                                   clickable: true, 
                                                   tickColor: "#f9f9f9",
                                                   borderWidth: 0
                                                 },
                                   colors: ["#75b9e6"],
                                        xaxis: {ticks:20, tickDecimals: 0},
                                        yaxis: {ticks:7, tickDecimals: 0},
                                 });

                function showTooltip(x, y, contents) {
                        $('<div id="tooltip">' + contents + '</div>').css( {
                                position: 'absolute',
                                display: 'none',
                                top: y + 5,
                                left: x + 5,
                                border: '1px solid #fdd',
                                padding: '2px',
                                'background-color': '#dfeffc',
                                opacity: 0.80
                        }).appendTo("body").fadeIn(200);
                }

                var previousPoint = null;
                $("#dotChart").bind("plothover", function (event, pos, item) {
                        $("#x").text(pos.x.toFixed(2));
                        $("#y").text(pos.y.toFixed(2));

                                if (item) {
                                        if (previousPoint != item.dataIndex) {
                                                previousPoint = item.dataIndex;

                                                $("#tooltip").remove();
                                                var x = item.datapoint[0].toFixed(2),
                                                        y = item.datapoint[1].toFixed(2);

                                                showTooltip(item.pageX, item.pageY,
                                                                        item.series.label + " of " + x + " = " + y);
                                        }
                                }
                                else {
                                        $("#tooltip").remove();
                                        previousPoint = null;
                                }
                });
        
        }
        
        function randNumTW(){
                return ((Math.floor( Math.random()* (1+40-20) ) ) + 20);
        }
        
        /* ---------- Chart with points ---------- */
        if($("#stats-chart").length)
        {
                var visitors = [[1, randNum()-10], [2, randNum()-10], [3, randNum()-10], [4, randNum()],[5, randNum()],[6, 4+randNum()],[7, 5+randNum()],[8, 6+randNum()],[9, 6+randNum()],[10, 8+randNum()],[11, 9+randNum()],[12, 10+randNum()],[13,11+randNum()],[14, 12+randNum()],[15, 13+randNum()],[16, 14+randNum()],[17, 15+randNum()],[18, 15+randNum()],[19, 16+randNum()],[20, 17+randNum()],[21, 18+randNum()],[22, 19+randNum()],[23, 20+randNum()],[24, 21+randNum()],[25, 14+randNum()],[26, 24+randNum()],[27,25+randNum()],[28, 26+randNum()],[29, 27+randNum()], [30, 31+randNum()]];

                var plot = $.plot($("#stats-chart"),
                           [ { data: visitors, label: "visitors" } ], {
                                   series: {
                                           lines: { show: true,
                                                                lineWidth: 3,
                                                                fill: true, fillColor: { colors: [ { opacity: 0.5 }, { opacity: 0.2 } ] }
                                                         },
                                           points: { show: true },
                                           shadowSize: 2
                                   },
                                   grid: { hoverable: true, 
                                                   clickable: true, 
                                                   tickColor: "#eee",
                                                   borderWidth: 0,
                                                 },
                                   colors: ["#b1d3d4"],
                                        xaxis: {ticks:11, tickDecimals: 0},
                                        yaxis: {ticks:11, tickDecimals: 0},
                                 });

                function showTooltip(x, y, contents) {
                        $('<div id="tooltip">' + contents + '</div>').css( {
                                position: 'absolute',
                                display: 'none',
                                top: y + 5,
                                left: x + 5,
                                border: '1px solid #fdd',
                                padding: '2px',
                                'background-color': '#dfeffc',
                                opacity: 0.80
                        }).appendTo("body").fadeIn(200);
                }

                var previousPoint = null;
                $("#stats-chart").bind("plothover", function (event, pos, item) {
                        $("#x").text(pos.x.toFixed(2));
                        $("#y").text(pos.y.toFixed(2));

                                if (item) {
                                        if (previousPoint != item.dataIndex) {
                                                previousPoint = item.dataIndex;

                                                $("#tooltip").remove();
                                                var x = item.datapoint[0].toFixed(2),
                                                        y = item.datapoint[1].toFixed(2);

                                                showTooltip(item.pageX, item.pageY,
                                                                        item.series.label + " of " + x + " = " + y);
                                        }
                                }
                                else {
                                        $("#tooltip").remove();
                                        previousPoint = null;
                                }
                });
                


                $("#sincos").bind("plotclick", function (event, pos, item) {
                        if (item) {
                                $("#clickdata").text("You clicked point " + item.dataIndex + " in " + item.series.label + ".");
                                plot.highlight(item.series, item.datapoint);
                        }
                });
        }
        
        
        
        /* ---------- Chart with points ---------- */
        if($("#sincos").length)
        {
                var sin = [], cos = [];

                for (var i = 0; i < 14; i += 0.5) {
                        sin.push([i, Math.sin(i)/i]);
                        cos.push([i, Math.cos(i)]);
                }

                var plot = $.plot($("#sincos"),
                           [ { data: sin, label: "sin(x)/x"}, { data: cos, label: "cos(x)" } ], {
                                   series: {
                                           lines: { show: true,
                                                                lineWidth: 2,
                                                         },
                                           points: { show: true },
                                           shadowSize: 2
                                   },
                                   grid: { hoverable: true, 
                                                   clickable: true, 
                                                   tickColor: "#dddddd",
                                                   borderWidth: 0 
                                                 },
                                   yaxis: { min: -1.2, max: 1.2 },
                                   colors: ["#FA5833", "#2FABE9"]
                                 });

                function showTooltip(x, y, contents) {
                        $('<div id="tooltip">' + contents + '</div>').css( {
                                position: 'absolute',
                                display: 'none',
                                top: y + 5,
                                left: x + 5,
                                border: '1px solid #fdd',
                                padding: '2px',
                                'background-color': '#dfeffc',
                                opacity: 0.80
                        }).appendTo("body").fadeIn(200);
                }

                var previousPoint = null;
                $("#sincos").bind("plothover", function (event, pos, item) {
                        $("#x").text(pos.x.toFixed(2));
                        $("#y").text(pos.y.toFixed(2));

                                if (item) {
                                        if (previousPoint != item.dataIndex) {
                                                previousPoint = item.dataIndex;

                                                $("#tooltip").remove();
                                                var x = item.datapoint[0].toFixed(2),
                                                        y = item.datapoint[1].toFixed(2);

                                                showTooltip(item.pageX, item.pageY,
                                                                        item.series.label + " of " + x + " = " + y);
                                        }
                                }
                                else {
                                        $("#tooltip").remove();
                                        previousPoint = null;
                                }
                });
                


                $("#sincos").bind("plotclick", function (event, pos, item) {
                        if (item) {
                                $("#clickdata").text("You clicked point " + item.dataIndex + " in " + item.series.label + ".");
                                plot.highlight(item.series, item.datapoint);
                        }
                });
        }
        
        /* ---------- Flot chart ---------- */
        if($("#flotchart").length)
        {
                var d1 = [];
                for (var i = 0; i < Math.PI * 2; i += 0.25)
                        d1.push([i, Math.sin(i)]);
                
                var d2 = [];
                for (var i = 0; i < Math.PI * 2; i += 0.25)
                        d2.push([i, Math.cos(i)]);

                var d3 = [];
                for (var i = 0; i < Math.PI * 2; i += 0.1)
                        d3.push([i, Math.tan(i)]);
                
                $.plot($("#flotchart"), [
                        { label: "sin(x)",  data: d1},
                        { label: "cos(x)",  data: d2},
                        { label: "tan(x)",  data: d3}
                ], {
                        series: {
                                lines: { show: true },
                                points: { show: true }
                        },
                        xaxis: {
                                ticks: [0, [Math.PI/2, "\u03c0/2"], [Math.PI, "\u03c0"], [Math.PI * 3/2, "3\u03c0/2"], [Math.PI * 2, "2\u03c0"]]
                        },
                        yaxis: {
                                ticks: 10,
                                min: -2,
                                max: 2
                        },
                        grid: { tickColor: "#dddddd",
                                        borderWidth: 0 
                        },
                        colors: ["#FA5833", "#2FABE9", "#FABB3D"]
                });
        }
        
        /* ---------- Stack chart ---------- */
        if($("#stackchart").length)
        {
                var d1 = [];
                for (var i = 0; i <= 10; i += 1)
                d1.push([i, parseInt(Math.random() * 30)]);

                var d2 = [];
                for (var i = 0; i <= 10; i += 1)
                        d2.push([i, parseInt(Math.random() * 30)]);

                var d3 = [];
                for (var i = 0; i <= 10; i += 1)
                        d3.push([i, parseInt(Math.random() * 30)]);

                var stack = 0, bars = true, lines = false, steps = false;

                function plotWithOptions() {
                        $.plot($("#stackchart"), [ d1, d2, d3 ], {
                                series: {
                                        stack: stack,
                                        lines: { show: lines, fill: true, steps: steps },
                                        bars: { show: bars, barWidth: 0.6 },
                                },
                                colors: ["#FA5833", "#2FABE9", "#FABB3D"]
                        });
                }

                plotWithOptions();

                $(".stackControls input").click(function (e) {
                        e.preventDefault();
                        stack = $(this).val() == "With stacking" ? true : null;
                        plotWithOptions();
                });
                $(".graphControls input").click(function (e) {
                        e.preventDefault();
                        bars = $(this).val().indexOf("Bars") != -1;
                        lines = $(this).val().indexOf("Lines") != -1;
                        steps = $(this).val().indexOf("steps") != -1;
                        plotWithOptions();
                });
        }
        
        /* ---------- Device chart ---------- */
        
        var data = [
        { label: "Desktop",  data: 73},
        { label: "Mobile",  data: 27}
        ];
        
        /* ---------- Donut chart ---------- */
        if($("#deviceChart").length)
        {
                $.plot($("#deviceChart"), data,
                {
                                series: {
                                                pie: {
                                                                innerRadius: 0.6,
                                                                show: true
                                                }
                                },
                                legend: {
                                        show: true
                                },
                                colors: ["#FA5833", "#2FABE9", "#FABB3D", "#78CD51"]
                });
        }
        
        var data = [
        { label: "iOS",  data: 20},
        { label: "Android",  data: 7},
        { label: "Linux",  data: 11},
        { label: "Mac OSX",  data: 14},
        { label: "Windows",  data: 48}
        ];
        
        /* ---------- Donut chart ---------- */
        if($("#osChart").length)
        {
                $.plot($("#osChart"), data,
                {
                                series: {
                                                pie: {
                                                                innerRadius: 0.6,
                                                                show: true
                                                }
                                },
                                legend: {
                                        show: true
                                },
                                colors: ["#FA5833", "#2FABE9", "#FABB3D", "#78CD51"]
                });
        }

        /* ---------- Pie chart ---------- */
        var data = [
        { label: "Internet Explorer",  data: 12},
        { label: "Mobile",  data: 27},
        { label: "Safari",  data: 85},
        { label: "Opera",  data: 64},
        { label: "Firefox",  data: 90},
        { label: "Chrome",  data: 112}
        ];
        
        if($("#piechart").length)
        {
                $.plot($("#piechart"), data,
                {
                        series: {
                                        pie: {
                                                        show: true
                                        }
                        },
                        grid: {
                                        hoverable: true,
                                        clickable: true
                        },
                        legend: {
                                show: false
                        },
                        colors: ["#FA5833", "#2FABE9", "#FABB3D", "#78CD51"]
                });
                
                function pieHover(event, pos, obj)
                {
                        if (!obj)
                                        return;
                        percent = parseFloat(obj.series.percent).toFixed(2);
                        $("#hover").html('<span style="font-weight: bold; color: '+obj.series.color+'">'+obj.series.label+' ('+percent+'%)</span>');
                }
                $("#piechart").bind("plothover", pieHover);
        }
        
        /* ---------- Donut chart ---------- */
        if($("#donutchart").length)
        {
                $.plot($("#donutchart"), data,
                {
                                series: {
                                                pie: {
                                                                innerRadius: 0.5,
                                                                show: true
                                                }
                                },
                                legend: {
                                        show: false
                                },
                                colors: ["#FA5833", "#2FABE9", "#FABB3D", "#78CD51"]
                });
        }




         // we use an inline data source in the example, usually data would
        // be fetched from a server
        var data = [], totalPoints = 300;
        function getRandomData() {
                if (data.length > 0)
                        data = data.slice(1);

                // do a random walk
                while (data.length < totalPoints) {
                        var prev = data.length > 0 ? data[data.length - 1] : 50;
                        var y = prev + Math.random() * 10 - 5;
                        if (y < 0)
                                y = 0;
                        if (y > 100)
                                y = 100;
                        data.push(y);
                }

                // zip the generated y values with the x values
                var res = [];
                for (var i = 0; i < data.length; ++i)
                        res.push([i, data[i]])
                return res;
        }

        // setup control widget
        var updateInterval = 30;
        $("#updateInterval").val(updateInterval).change(function () {
                var v = $(this).val();
                if (v && !isNaN(+v)) {
                        updateInterval = +v;
                        if (updateInterval < 1)
                                updateInterval = 1;
                        if (updateInterval > 2000)
                                updateInterval = 2000;
                        $(this).val("" + updateInterval);
                }
        });

        
        if($("#realtimechart").length)
        {
                var options = {
                        series: { shadowSize: 1 },
                        lines: { fill: true, fillColor: { colors: [ { opacity: 1 }, { opacity: 0.1 } ] }},
                        yaxis: { min: 0, max: 100 },
                        xaxis: { show: false },
                        colors: ["#F4A506"],
                        grid: { tickColor: "#dddddd",
                                        borderWidth: 0 
                        },
                };
                var plot = $.plot($("#realtimechart"), [ getRandomData() ], options);
                function update() {
                        plot.setData([ getRandomData() ]);
                        // since the axes don't change, we don't need to call plot.setupGrid()
                        plot.draw();
                        
                        setTimeout(update, updateInterval);
                }

                update();
        }
        
});