Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 4.18.0-553.111.1.lve.el8.x86_64

PHP Version:

7.4.33

User:

creativebazzar

Directory:

/home/creativebazzar/www/admin-pages/demofiles

Free Space:

30.82 GB

🔧 Quick Actions

✏️ Editing: chart_data_example.js

// REAL TIME DATA GENERATOR
/*
 * Real-time data generators for the example graphs in the documentation section.
 */
(function() {

/*
     * Class for generating real-time data for the area, line, and bar plots.
     */
    var RealTimeData = function(layers) {
        this.layers = layers;
        this.timestamp = ((new Date()).getTime() / 1000)|0;
    };

RealTimeData.prototype.rand = function() {
        return parseInt(Math.random() * 100) + 50;
    };

RealTimeData.prototype.history = function(entries) {
        if (typeof(entries) != 'number' || !entries) {
            entries = 60;
        }

var history = [];
        for (var k = 0; k < this.layers; k++) {
            history.push({ values: [] });
        }

for (var i = 0; i < entries; i++) {
            for (var j = 0; j < this.layers; j++) {
                history[j].values.push({time: this.timestamp, y: this.rand()});
            }
            this.timestamp++;
        }

return history;
    };

RealTimeData.prototype.next = function() {
        var entry = [];
        for (var i = 0; i < this.layers; i++) {
            entry.push({ time: this.timestamp, y: this.rand() });
        }
        this.timestamp++;
        return entry;
    }

window.RealTimeData = RealTimeData;

/*
     * Gauge Data Generator.
     */
    var GaugeData = function() {};

GaugeData.prototype.next = function() {
        return Math.random();
    };

window.GaugeData = GaugeData;

/*
     * Heatmap Data Generator.
     */

var HeatmapData = function(layers) {
        this.layers = layers;
        this.timestamp = ((new Date()).getTime() / 1000)|0;
    };
    
    window.normal = function() {
        var U = Math.random(),
            V = Math.random();
        return Math.sqrt(-2*Math.log(U)) * Math.cos(2*Math.PI*V);
    };

HeatmapData.prototype.rand = function() {
        var histogram = {};

for (var i = 0; i < 1000; i ++) {
            var r = parseInt(normal() * 12.5 + 50);
            if (!histogram[r]) {
                histogram[r] = 1;
            }
            else {
                histogram[r]++;
            }
        }

return histogram;
    };

HeatmapData.prototype.history = function(entries) {
        if (typeof(entries) != 'number' || !entries) {
            entries = 60;
        }

var history = [];
        for (var k = 0; k < this.layers; k++) {
            history.push({ values: [] });
        }

for (var i = 0; i < entries; i++) {
            for (var j = 0; j < this.layers; j++) {
                history[j].values.push({time: this.timestamp, histogram: this.rand()});
            }
            this.timestamp++;
        }

return history;
    };

HeatmapData.prototype.next = function() {
        var entry = [];
        for (var i = 0; i < this.layers; i++) {
            entry.push({ time: this.timestamp, histogram: this.rand() });
        }
        this.timestamp++;
        return entry;
    }

window.HeatmapData = HeatmapData;

})();

var chartData = {};

chartData['barchart_demo'] = {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [
        {
            label: "",
            fillColor: "rgba(84, 121, 170, 0.5)",
            strokeColor: "rgba(84, 121, 170, 0.8)",
            highlightFill: "rgba(84, 121, 170, 0.5)",
            highlightStroke: "rgba(84, 121, 170, 0.5)",
            data: [65, 59, 80, 81, 56, 55, 40]
        },
        {
            label: "",
            fillColor: "rgba(78, 78, 78, 0.5)",
            strokeColor: "rgba(78, 78, 78, 0.8)",
            highlightFill: "rgba(78, 78, 78, 0.5)",
            highlightStroke: "rgba(78, 78, 78, 0.5)",
            data: [28, 48, 40, 19, 86, 27, 90]
        }
    ]
};

chartData['linechart_demo'] = {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [
        {
            label: "",
            fillColor: "rgba(84, 121, 170, 0.5)",
            strokeColor: "rgba(84, 121, 170, 0.8)",
            pointColor: "rgba(84, 121, 170, 1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(84, 121, 170, 0.5)",
            data: [65, 59, 80, 81, 56, 55, 40]
        },
        {
            label: "",
            fillColor: "rgba(117, 176, 69, 0.5)",
            strokeColor: "rgba(117, 176, 69, 0.8)",
            pointColor: "rgba(117, 176, 69, 1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(117, 176, 69, 0.5)",
            data: [28, 48, 40, 19, 86, 27, 90]
        }
    ]
};

chartData['radarchart_demo'] = {
    labels: ["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"],
    datasets: [
        {
            label: "My First dataset",
            fillColor: "rgba(84, 121, 170, 0.5)",
            strokeColor: "rgba(84, 121, 170, 0.8)",
            pointColor: "rgba(84, 121, 170, 1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(84, 121, 170, 1)",
            data: [65, 59, 90, 81, 56, 55, 40]
        },
        {
            label: "My Second dataset",
            fillColor: "rgba(117, 176, 69, 0.5)",
            strokeColor: "rgba(117, 176, 69, 0.8)",
            pointColor: "rgba(117, 176, 69, 1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(117, 176, 69, 1)",
            data: [28, 48, 40, 19, 96, 27, 100]
        }
    ]
};

chartData['polarareachart_demo'] = [
    {
        value: 300,
        color:"rgba(84, 121, 170, 0.6)",
        highlight: "rgba(84, 121, 170, 0.8)",
        label: "Blue"
    },
    {
        value: 50,
        color: "rgba(117, 176, 69, 0.6)",
        highlight: "rgba(117, 176, 69, 0.8)",
        label: "Green"
    },
    {
        value: 100,
        color: "rgba(189, 81, 81, 0.6)",
        highlight: "rgba(189, 81, 81, 0.8)",
        label: "Red"
    },
    {
        value: 40,
        color: "rgba(78, 78, 78, 0.6)",
        highlight: "rgba(78, 78, 78, 0.8)",
        label: "Grey"
    },
    {
        value: 120,
        color: "rgba(187, 96, 150, 0.6)",
        highlight: "rgba(187, 96, 150, 0.8)",
        label: "Purple"
    }

];

chartData['piechart_demo'] = [
    {
        value: 300,
        color:"rgba(84, 121, 170, 0.6)",
        highlight: "rgba(84, 121, 170, 0.8)",
        label: "Blue"
    },
    {
        value: 50,
        color: "rgba(117, 176, 69, 0.6)",
        highlight: "rgba(117, 176, 69, 0.8)",
        label: "Green"
    },
    {
        value: 100,
        color: "rgba(78, 78, 78, 0.6)",
        highlight: "rgba(78, 78, 78, 0.8)",
        label: "Yellow"
    }
]

/////////////////////
// CHARTS ///////////
/////////////////////
jQuery(document).ready(function() {

Chart.defaults.global = {
        animation: true,
        animationSteps: 60,
        animationEasing: "easeOutQuart",
        showScale: true,
        scaleOverride: false,
        scaleSteps: null,
        scaleStepWidth: null,
        scaleStartValue: null,
        scaleLineColor: "rgba(0,0,0,0.05)",
        scaleLineWidth: 1,
        scaleShowLabels: true,
        scaleLabel: "<%=value%>",
        scaleIntegersOnly: true,
        scaleBeginAtZero: false,
        scaleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
        scaleFontSize: 12,
        scaleFontStyle: "normal",
        scaleFontColor: "rgba(0,0,0,0.2)",
        responsive: true,
        maintainAspectRatio: true,
        showTooltips: true,
        customTooltips: false,
        tooltipEvents: ["mousemove", "touchstart", "touchmove"],
        tooltipFillColor: "#1a2a42",
        tooltipFontFamily: "'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
        tooltipFontSize: 12,
        tooltipFontStyle: "normal",
        tooltipFontColor: "#fff",
        tooltipTitleFontFamily: "'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
        tooltipTitleFontSize: 12,
        tooltipTitleFontStyle: "normal",
        tooltipTitleFontColor: "#fff",
        tooltipYPadding: 6,
        tooltipXPadding: 6,
        tooltipCaretSize: 8,
        tooltipCornerRadius: 2,
        tooltipXOffset: 10,
        tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>",
        multiTooltipTemplate: "<%= value %>",

onAnimationProgress: function(){},
        onAnimationComplete: function(){}
    }

jQuery('.bar-chart').each(function() {
        var options = {
            barShowStroke : false,
            barStrokeWidth : 2,
            barValueSpacing : 6,
            barDatasetSpacing : 2
        }
        var data = jQuery(this).attr('cr-data');
        var ctx = jQuery(this).get(0).getContext("2d");
        var crBarChart = new Chart(ctx).Bar(chartData[data], options);
    });

jQuery('.line-chart').each(function() {
        var options = {
        }

var data = jQuery(this).attr('cr-data');
        var ctx = jQuery(this).get(0).getContext("2d");
        var crLineChart = new Chart(ctx).Line(chartData[data], options);
    });

jQuery('.radar-chart').each(function() {
        var options = {
        }

var data = jQuery(this).attr('cr-data');
        var ctx = jQuery(this).get(0).getContext("2d");
        var myRadarChart = new Chart(ctx).Radar(chartData[data], options);
    });

jQuery('.polararea-chart').each(function() {
        var options = {
        }

var data = jQuery(this).attr('cr-data');
        var ctx = jQuery(this).get(0).getContext("2d");
        var myPolarAreaChart = new Chart(ctx).PolarArea(chartData[data], options);
    });

jQuery('.pie-chart').each(function() {
        var options = {
        }

var data = jQuery(this).attr('cr-data');
        var ctx = jQuery(this).get(0).getContext("2d");
        var myPieChart = new Chart(ctx).Pie(chartData[data],options);
    });

jQuery('.doughnut-chart').each(function() {
        var options = {
        }

var data = jQuery(this).attr('cr-data');
        var ctx = jQuery(this).get(0).getContext("2d");
        var myDoughnutChart = new Chart(ctx).Doughnut(chartData[data],options);
    });

if (jQuery('#morris-line-example').length > 0) {
        Morris.Line({
          element: 'morris-line-example',
          data: [
            { y: '2006', a: 100, b: 90 },
            { y: '2007', a: 75,  b: 65 },
            { y: '2008', a: 50,  b: 40 },
            { y: '2009', a: 75,  b: 65 },
            { y: '2010', a: 50,  b: 40 },
            { y: '2011', a: 75,  b: 65 },
            { y: '2012', a: 100, b: 90 }
          ],
          xkey: 'y',
          ykeys: ['a', 'b'],
          labels: ['Series A', 'Series B'],
          lineColors: ['rgba(84, 121, 170, 0.6)', 'rgba(117, 176, 69, 0.6)']
        });
    }

if (jQuery('#morris-bar-example').length > 0) {
        Morris.Bar({
          element: 'morris-bar-example',
          data: [
            { y: '2006', a: 100, b: 90 },
            { y: '2007', a: 75,  b: 65 },
            { y: '2008', a: 50,  b: 40 },
            { y: '2009', a: 75,  b: 65 },
            { y: '2010', a: 50,  b: 40 },
            { y: '2011', a: 75,  b: 65 },
            { y: '2012', a: 100, b: 90 }
          ],
          xkey: 'y',
          ykeys: ['a', 'b'],
          labels: ['Series A', 'Series B'],
          barColors: ['rgba(78, 78, 78, 0.6)', 'rgba(84, 121, 170, 0.6)']
        });
    }

if (jQuery('#morris-donut-example').length > 0) {
        Morris.Donut({
          element: 'morris-donut-example',
          data: [
            {label: "Download Sales", value: 12},
            {label: "In-Store Sales", value: 30},
            {label: "Mail-Order Sales", value: 20}
          ],
          colors: ['rgba(84, 121, 170, 0.6)', 'rgba(117, 176, 69, 0.6)', 'rgba(78, 78, 78, 0.6)']
        });
    }

jQuery('.inlinesparkline').sparkline('html', { type:'line' });
    jQuery('.inlinebarsparkline').sparkline('html', { type:'bar' });
    jQuery('.discretechart').sparkline('html', { type:'discrete' });
    jQuery('.inlinepiesparkline').sparkline('html', { type:'pie' });

jQuery("span.peity-pie").peity("pie")
    jQuery("span.peity-donut").peity("donut")
    jQuery("span.peity-line").peity("line")
    jQuery("span.peity-bar").peity("bar")
    var updatingChart = jQuery(".peity-updating-chart").peity("line", { width: 64 })

setInterval(function() {
      var random = Math.round(Math.random() * 10)
      var values = updatingChart.text().split(",")
      values.shift()
      values.push(random)

updatingChart
        .text(values.join(","))
        .change()
    }, 1000)

$('#quote-carousel').carousel({
        pause: true,
        interval: 4000,
      });

// EPOCH examples
    var values = [];

var data1 = [
        {label: 'Cos', values: []},
        {label: 'Sin', values: []}
    ];

var data2 = [
        {label: 'Sqrt', values: []},
        {label: 'Cbrt', values: []},
        {label: '4th', values: []}
    ];

for (var i = 0; i <= 128; i++) {
        var x = 4 * Math.PI * (i / 128);
        data1[0].values.push({x: x, y: Math.cos(x) + 1});
        data1[1].values.push({x: x, y: Math.sin(x) + 1});

var data = [data1, data2];

var area = $('#basic-area-example').epoch({
        type: 'area',
        data: data1,
        axes: ['bottom', 'left', 'right']
    });

$('.basic-area-data').on('click', function(e) {
        e.preventDefault();

$('.basic-area-data').removeClass('active');
        $(e.target).addClass('active');
        var index = parseInt($(e.target).attr('data-value'));
        area.setData(data[index]);
        area.draw();
    });

// bubbles

var DATA_LENGTH = 24;

var data2 = [
        { label: 'A', values: [] },
        { label: 'B', values: [] }
    ];

for (var i = 0; i < DATA_LENGTH; i++) {
        for (var j = 0; j < data2.length; j++) {
            data2[j].values.push({ x: (Math.random() * 1000), y: (Math.random() * 200), r: Math.random()*15 + 1 });
        }
    }

var chart = $('#basic-bubble-example').epoch({
        type: 'scatter',
        data: data2,
        axes: ['top', 'bottom', 'left', 'right']
    });

// Real time epoch

var data3 = new RealTimeData(3);

var chart = $('#real-time-bar').epoch({
        type: 'time.bar',
        data: data3.history(),
        axes: ['left', 'bottom', 'right']
    });

setInterval(function() { chart.push(data3.next()); }, 1000);
    chart.push(data3.next());

// line

var data4 = new RealTimeData(2);

var chart2 = $('#real-time-line').epoch({
        type: 'time.line',
        data: data4.history(),
        axes: ['left', 'bottom', 'right']
    });

setInterval(function() { chart2.push(data4.next()); }, 1000);
    chart2.push(data4.next())
});

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: chart_data_example.js

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation