/*=========================================================================================
    File Name: project-summary.js
    Description: Project Summary Page JS
    ----------------------------------------------------------------------------------------
    Item Name: Modern Admin - Clean Bootstrap 4 Dashboard HTML Template
    Author: PIXINVENT
    Author URL: http://www.themeforest.net/user/pixinvent
==========================================================================================*/

var $primary = "#666ee8",
  $secondary = "#6B6F82",
  $success = "#1C9066",
  $info = "#1E9FF2",
  $warning = "#FF9149",
  $danger = "#FF4961";

var $themeColor = [$primary, $success, $info, $warning, $danger, $secondary];

$(document).ready(function() {
  var pieSimpleChart = {
    chart: {
      height: 350,
      type: "pie"
    },
    labels: ["Team A", "Team B", "Team C", "Team D", "Team E"],
    series: [44, 55, 13, 43, 22],
    responsive: [
      {
        breakpoint: 1200,
        options: {
          chart: {
            width: 300
          },
          legend: {
            position: "bottom"
          }
        }
      },
      {
        breakpoint: 768,
        options: {
          chart: {
            width: 520
          },
          legend: {
            position: "bottom"
          }
        }
      },
      {
        breakpoint: 620,
        options: {
          chart: {
            width: 450
          },
          legend: {
            position: "bottom"
          }
        }
      },
      {
        breakpoint: 480,
        options: {
          chart: {
            width: 250
          },
          legend: {
            position: "bottom"
          }
        }
      }
    ],
    fill: {
      colors: $themeColor
    }
  };
  // Initializing Pie Simple Chart
  var pie_simple_chart = new ApexCharts(
    document.querySelector("#task-pie-chart"),
    pieSimpleChart
  );
  pie_simple_chart.render();

  var radialBarMultipleChart = {
    chart: {
      height: 350,
      type: "radialBar"
    },
    plotOptions: {
      radialBar: {
        dataLabels: {
          name: {
            fontSize: "22px"
          },
          value: {
            fontSize: "16px"
          },
          total: {
            show: true,
            label: "Total",
            formatter: function(w) {
              // By default this function returns the average of all series. The below is just an example to show the use of custom formatter function
              return 249;
            }
          }
        }
      }
    },
    fill: {
      colors: $themeColor
    },
    series: [44, 55, 67, 83],
    labels: ["Apples", "Oranges", "Bananas", "Berries"]
  };
  // Initializing Radial Bar Multiple Chart
  var radial_bar_multiple_chart = new ApexCharts(
    document.querySelector("#bug-pie-chart"),
    radialBarMultipleChart
  );
  radial_bar_multiple_chart.render();
});