{-# LANGUAGE OverloadedStrings #-}
{-# LANGUAGE ScopedTypeVariables #-}

module Cardano.RTView.GUI.Charts
    ( prepareChartsJS
    -- Charts JS snippets.
    , memoryUsageChartJS
    , cpuUsageChartJS
    , diskUsageChartJS
    , networkUsageChartJS
    , gridMemoryUsageChartJS
    , gridCPUUsageChartJS
    , gridDiskUsageChartJS
    , gridNetworkUsageChartJS
    -- Charts updaters.
    , updateMemoryUsageChartJS
    , updateCPUUsageChartJS
    , updateDiskUsageChartJS
    , updateNetworkUsageChartJS
    ) where

import           Cardano.Prelude
import           Prelude (String)

prepareChartsJS :: String
prepareChartsJS :: String
prepareChartsJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"window.charts = new Map();"
  ]

memoryUsageChartJS :: String
memoryUsageChartJS :: String
memoryUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      label: 'Memory usage',"
  , String
"      backgroundColor: '#FF8000',"
  , String
"      borderColor: '#FF8000',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'MB'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          max: 200,"
  , String
"          stepSize: 50"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

cpuUsageChartJS :: String
cpuUsageChartJS :: String
cpuUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      label: 'CPU usage',"
  , String
"      backgroundColor: '#FE2E2E',"
  , String
"      borderColor: '#FE2E2E',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'Percent'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          max: 100,"
  , String
"          stepSize: 25"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

diskUsageChartJS :: String
diskUsageChartJS :: String
diskUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      label: 'Disk | RD',"
  , String
"      backgroundColor: '#0080FF',"
  , String
"      borderColor: '#0080FF',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    },{"
  , String
"      label: 'Disk | WR',"
  , String
"      backgroundColor: '#D358F7',"
  , String
"      borderColor: '#D358F7',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'KB/s'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          stepSize: 50"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

networkUsageChartJS :: String
networkUsageChartJS :: String
networkUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      label: 'Network | IN',"
  , String
"      backgroundColor: '#D7DF01',"
  , String
"      borderColor: '#D7DF01',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    },{"
  , String
"      label: 'Network | OUT',"
  , String
"      backgroundColor: '#00FF80',"
  , String
"      borderColor: '#00FF80',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'KB/s'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          stepSize: 100"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

gridMemoryUsageChartJS :: String
gridMemoryUsageChartJS :: String
gridMemoryUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      backgroundColor: '#FF8000',"
  , String
"      borderColor: '#FF8000',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    legend: { display: false },"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'MB'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          max: 200,"
  , String
"          stepSize: 50"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

gridCPUUsageChartJS :: String
gridCPUUsageChartJS :: String
gridCPUUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      backgroundColor: '#FE2E2E',"
  , String
"      borderColor: '#FE2E2E',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    legend: { display: false },"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'Percent'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          max: 100,"
  , String
"          stepSize: 25"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

gridDiskUsageChartJS :: String
gridDiskUsageChartJS :: String
gridDiskUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      label: 'RD',"
  , String
"      backgroundColor: '#0080FF',"
  , String
"      borderColor: '#0080FF',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    },{"
  , String
"      label: 'WR',"
  , String
"      backgroundColor: '#D358F7',"
  , String
"      borderColor: '#D358F7',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'KB/s'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          stepSize: 50"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

gridNetworkUsageChartJS :: String
gridNetworkUsageChartJS :: String
gridNetworkUsageChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"var ctx = document.getElementById(%1).getContext('2d');"
  , String
"var chart = new Chart(ctx, {"
  , String
"  type: 'line',"
  , String
"  data: {"
  , String
"    labels: [],"
  , String
"    datasets: [{"
  , String
"      label: 'IN',"
  , String
"      backgroundColor: '#D7DF01',"
  , String
"      borderColor: '#D7DF01',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    },{"
  , String
"      label: 'OUT',"
  , String
"      backgroundColor: '#00FF80',"
  , String
"      borderColor: '#00FF80',"
  , String
"      data: [],"
  , String
"      fill: false"
  , String
"    }]"
  , String
"  },"
  , String
"  options: {"
  , String
"    scales: {"
  , String
"      yAxes: [{"
  , String
"        display: true,"
  , String
"        scaleLabel: {"
  , String
"          display: true,"
  , String
"          labelString: 'KB/s'"
  , String
"        },"
  , String
"        ticks: {"
  , String
"          min: 0,"
  , String
"          stepSize: 100"
  , String
"        }"
  , String
"      }]"
  , String
"    }"
  , String
"  }"
  , String
"});"
  , String
"window.charts.set(%1, chart);"
  ]

-- Chart updaters.
-- Please note that after 900 data points (which are collected in every 30 minutes)
-- we remove outdated points. It allows to avoid too compressed, narrow charts.

updateMemoryUsageChartJS
  , updateCPUUsageChartJS
  , updateDiskUsageChartJS
  , updateNetworkUsageChartJS :: String
updateMemoryUsageChartJS :: String
updateMemoryUsageChartJS  = String
updateSingleDatasetChartJS
updateCPUUsageChartJS :: String
updateCPUUsageChartJS     = String
updateSingleDatasetChartJS
updateDiskUsageChartJS :: String
updateDiskUsageChartJS    = String
updateDoubleDatasetChartJS
updateNetworkUsageChartJS :: String
updateNetworkUsageChartJS = String
updateDoubleDatasetChartJS

updateSingleDatasetChartJS :: String
updateSingleDatasetChartJS :: String
updateSingleDatasetChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"window.charts.get(%1).data.labels.push(%2);"
  , String
"var len = window.charts.get(%1).data.labels.length;"
  , String
"if (len == 900) {"
  , String
"  window.charts.get(%1).data.datasets[0].data.splice(0, len);"
  , String
"  window.charts.get(%1).data.labels.splice(0, len);"
  , String
"}"
  , String
"window.charts.get(%1).data.datasets[0].data.push(%3);"
  , String
"window.charts.get(%1).update({duration: 0});"
  ]

updateDoubleDatasetChartJS :: String
updateDoubleDatasetChartJS :: String
updateDoubleDatasetChartJS = [String] -> String
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ String
"window.charts.get(%1).data.labels.push(%2);"
  , String
"var len = window.charts.get(%1).data.labels.length;"
  , String
"if (len == 900) {"
  , String
"  window.charts.get(%1).data.datasets[0].data.splice(0, len);"
  , String
"  window.charts.get(%1).data.datasets[1].data.splice(0, len);"
  , String
"  window.charts.get(%1).data.labels.splice(0, len);"
  , String
"}"
  , String
"window.charts.get(%1).data.datasets[0].data.push(%3);"
  , String
"window.charts.get(%1).data.datasets[1].data.push(%4);"
  , String
"window.charts.get(%1).update({duration: 0});"
  ]