'use strict';
document.addEventListener('DOMContentLoaded', function () {
    setTimeout(function () {
        floatchart();
    }, 500);
    if (!!document.querySelector('.user-scroll')) {
        new SimpleBar(document.querySelector('.user-scroll'));
    }
    if (!!document.querySelector('.feed-scroll')) {
        new SimpleBar(document.querySelector('.feed-scroll'));
    }
    const datepicker_inline = new Datepicker(document.querySelector('#pc-datepicker-6'), {
        buttonClass: 'btn'
    });
    peity.defaults.donut = {
        delimiter: null,
        fill: ['#ff9900', '#fff4dd', '#ffd592'],
        height: null,
        innerRadius: 11,
        radius: 16,
        width: null
    };
    document.querySelectorAll('.donut').forEach((e) => peity(e, 'donut'));
});

function floatchart() {
    (function () {
        var options = {
            chart: {
                type: 'area',
                height: 250,
                toolbar: {
                    show: false
                }
            },
            colors: ['#FFC107', '#4680ff'],
            dataLabels: {
                enabled: false
            },
            legend: {
                show: true,
                position: 'top'
            },
            markers: {
                size: 1,
                colors: ['#fff', '#fff', '#fff'],
                strokeColors: ['#FFC107', '#4680ff'],
                strokeWidth: 1,
                shape: 'circle',
                hover: {
                    size: 4
                }
            },
            stroke: {
                width: 2,
                curve: 'smooth'
            },
            fill: {
                type: 'gradient',
                gradient: {
                    shadeIntensity: 1,
                    type: 'vertical',
                    inverseColors: false,
                    opacityFrom: 0.5,
                    opacityTo: 0
                }
            },
            grid: {
                show: false
            },
            series: [{
                    name: 'Revenue',
                    data: [200, 320, 320, 275, 275, 400, 400, 300, 440, 320, 320, 275, 275, 400, 300, 440]
                },
                {
                    name: 'Sales',
                    data: [200, 250, 240, 300, 340, 320, 320, 400, 350, 250, 240, 300, 340, 320, 400, 350]
                }
            ],
            xaxis: {
                tooltip: {
                    enabled: false
                },
                labels: {
                    hideOverlappingLabels: true
                },
                axisBorder: {
                    show: false
                },
                axisTicks: {
                    show: false
                }
            }
        };
        var chart = new ApexCharts(document.querySelector('#revenue-sales-chart'), options);
        chart.render();
        var invites_goal_chart_option = {
            series: [76],
            chart: {
                type: 'radialBar',
                offsetY: -20,
                sparkline: {
                    enabled: true
                }
            },
            colors: ['#2196f3'],
            plotOptions: {
                radialBar: {
                    startAngle: -95,
                    endAngle: 95,
                    hollow: {
                        margin: 15,
                        size: '50%'
                    },
                    track: {
                        background: '#eaeaea',
                        strokeWidth: '97%',
                        margin: 20
                    },
                    dataLabels: {
                        name: {
                            show: false
                        },
                        value: {
                            offsetY: 0,
                            fontSize: '20px'
                        }
                    }
                }
            },
            grid: {
                padding: {
                    top: 10
                }
            },
            stroke: {
                lineCap: 'round'
            },
            labels: ['Average Results']
        };
        var chart = new ApexCharts(document.querySelector('#invites-goal-chart'), invites_goal_chart_option);
        chart.render();

        var course_report_bar_chart_options = {
            chart: {
                type: 'bar',
                height: 210,
                toolbar: {
                    show: false
                }
            },
            plotOptions: {
                bar: {
                    columnWidth: '60%',
                    borderRadius: 3
                }
            },
            stroke: {
                show: true,
                width: 3,
                colors: ['transparent']
            },
            dataLabels: {
                enabled: false
            },
            legend: {
                position: 'top',
                horizontalAlign: 'right',
                show: true,
                fontFamily: `'Public Sans', sans-serif`,
                offsetX: 10,
                offsetY: 10,
                labels: {
                    useSeriesColors: false
                },
                markers: {
                    width: 10,
                    height: 10,
                    radius: '50%',
                    offsexX: 2,
                    offsexY: 2
                },
                itemMargin: {
                    horizontal: 15,
                    vertical: 5
                }
            },
            colors: ['#2196f3', '#FFC107'],
            series: [{
                    name: 'Net Profit',
                    data: [180, 90, 135, 114, 120, 145, 180, 90, 135, 114, 120, 145]
                },
                {
                    name: 'Revenue',
                    data: [120, 45, 78, 150, 168, 99, 120, 45, 78, 150, 168, 99]
                }
            ],
            grid: {
                borderColor: '#00000010'
            },
            yaxis: {
                show: false
            }
        };
        var chart = new ApexCharts(document.querySelector('#course-report-bar-chart'), course_report_bar_chart_options);
        chart.render();

        var total_revenue_line_1_chart_options = {
            chart: {
                type: 'line',
                height: 60,
                sparkline: {
                    enabled: true
                }
            },
            dataLabels: {
                enabled: false
            },
            colors: ['#00C853'],
            stroke: {
                curve: 'straight',
                lineCap: 'round',
                width: 3
            },
            series: [{
                name: 'series1',
                data: [20, 10, 18, 12, 25, 10, 20]
            }],
            yaxis: {
                min: 0,
                max: 30
            },
            tooltip: {
                theme: 'dark',
                fixed: {
                    enabled: false
                },
                x: {
                    show: false
                },
                y: {
                    title: {
                        formatter: function (seriesName) {
                            return '';
                        }
                    }
                },
                marker: {
                    show: false
                }
            }
        };
        var chart = new ApexCharts(document.querySelector('#total-revenue-line-1-chart'), total_revenue_line_1_chart_options);
        chart.render();

        var total_revenue_line_2_chart_options = {
            chart: {
                type: 'line',
                height: 60,
                sparkline: {
                    enabled: true
                }
            },
            dataLabels: {
                enabled: false
            },
            colors: ['#F44336'],
            stroke: {
                curve: 'straight',
                lineCap: 'round',
                width: 3
            },
            series: [{
                name: 'series1',
                data: [20, 10, 25, 18, 18, 10, 12]
            }],
            yaxis: {
                min: 0,
                max: 30
            },
            tooltip: {
                theme: 'dark',
                fixed: {
                    enabled: false
                },
                x: {
                    show: false
                },
                y: {
                    title: {
                        formatter: function (seriesName) {
                            return '';
                        }
                    }
                },
                marker: {
                    show: false
                }
            }
        };
        var chart = new ApexCharts(document.querySelector('#total-revenue-line-2-chart'), total_revenue_line_2_chart_options);
        chart.render();

        var student_states_chart_options = {
            chart: {
                height: 250,
                type: 'donut'
            },
            dataLabels: {
                enabled: false
            },
            plotOptions: {
                pie: {
                    donut: {
                        size: '65%'
                    }
                }
            },
            labels: ['Total Signups', 'Active Student'],
            series: [76.7, 30],
            legend: {
                show: true,
                position: 'bottom'
            },
            fill: {
                opacity: [1, 0.5]
            },
            colors: ['#2196f3', '#2196f3']
        };
        var chart = new ApexCharts(document.querySelector('#student-states-chart'), student_states_chart_options);
        chart.render();

        var activity_line_chart_options = {
            chart: {
                type: 'line',
                height: 300,
                toolbar: {
                    show: false
                }
            },
            colors: ['#00C853', '#4680ff'],
            dataLabels: {
                enabled: false
            },
            legend: {
                show: true,
                position: 'top'
            },
            markers: {
                size: 1,
                colors: ['#fff', '#fff', '#fff'],
                strokeColors: ['#00C853', '#4680ff'],
                strokeWidth: 1,
                shape: 'circle',
                hover: {
                    size: 4
                }
            },
            stroke: {
                width: 3,
                curve: 'smooth'
            },
            grid: {
                strokeDashArray: 4
            },
            series: [{
                    name: 'Free Course',
                    data: [20, 90, 65, 85, 20, 80, 30]
                },
                {
                    name: 'Subscription',
                    data: [70, 30, 40, 15, 60, 40, 95]
                }
            ],
            xaxis: {
                labels: {
                    hideOverlappingLabels: true
                },
                axisBorder: {
                    show: false
                },
                axisTicks: {
                    show: false
                }
            }
        };
        var chart = new ApexCharts(document.querySelector('#activity-line-chart'), activity_line_chart_options);
        chart.render();

        var visitors_bar_chart_options = {
            chart: {
                type: 'bar',
                height: 220,
                toolbar: {
                    show: false
                }
            },
            colors: ['#00C853'],
            dataLabels: {
                enabled: false
            },
            grid: {
                strokeDashArray: 4
            },
            yaxis: {
                tickAmount: 3
            },
            states: {
                normal: {
                    filter: {
                        type: 'lighten',
                        value: 0.5
                    }
                },
                hover: {
                    filter: {
                        type: 'lighten',
                        value: 0
                    }
                }
            },
            plotOptions: {
                bar: {
                    borderRadius: 2,
                    columnWidth: '50%'
                }
            },
            labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
            series: [{
                data: [20, 15, 22, 25, 32, 50]
            }]
        };
        var chart = new ApexCharts(document.querySelector('#visitors-bar-chart'), visitors_bar_chart_options);
        chart.render();

        var earning_courses_line_chart_options = {
            chart: {
                type: 'line',
                height: 230,
                toolbar: {
                    show: false
                }
            },
            colors: ['#FFC107', '#4680ff'],
            dataLabels: {
                enabled: false
            },
            markers: {
                size: 1,
                colors: ['#fff', '#fff', '#fff'],
                strokeColors: ['#FFC107', '#4680ff'],
                strokeWidth: 1,
                shape: 'circle',
                hover: {
                    size: 4
                }
            },
            stroke: {
                width: 3
            },
            grid: {
                strokeDashArray: 4
            },
            series: [{
                name: 'Last Month',
                data: [200, 320, 275, 400, 300, 440]
            }],
            xaxis: {
                labels: {
                    hideOverlappingLabels: true
                },
                axisBorder: {
                    show: false
                },
                axisTicks: {
                    show: false
                }
            }
        };
        var chart = new ApexCharts(document.querySelector('#earning-courses-line-chart'), earning_courses_line_chart_options);
        chart.render();
    })();
}
