var Width = 1200;       
var Height = 800;      
var Padding = 50;         
var tickSize = 10;
var xField = "";        
var yField = "";            
var disease = "";
var state = "";
var values = [];
var x1, y1, x2, y2, rectWidth, rectHeight;
var maxX, minX, xArr, minY, maxY, yArr, diseaseArr, stateArr, unique;

var fontBold;

function preload(){
    table=loadTable("StatewiseDiseasePopulationInfo.csv", "csv");
    //fontBold = loadFont('assets/Bold.ttf');
}

function setup() {
    createCanvas(Width, Height);
    xField = table.getColumn(0)[0];
    yField = table.getColumn(1)[0];
    disease = table.getColumn(2)[0];
    stateArr = table.getColumn(3);
    unique = stateArr.filter(function(item, i, ar){ return ar.indexOf(item) === i; });
   // print("Unique Values " + unique);
}

function sliceData(start, end) {
    for (var i = 0; i < 2; i++) {
        var column = table.getColumn(i).slice(start, end);
        column = column.map(function (num) {
            return parseFloat(num);
        });
        values.push(column);
    }
}

function draw() {
    background(255, 255, 255);
    x1 = 200;
    y1 = 350;
    x2 = 550;
    y2 = 350;
    rectWidth = 350;
    rectHeight = 300;
    drawAxes(x1, y1, x2, y2);
    fill("none");
    rect(x1, y1 - 300, rectWidth, rectHeight);
    drawAxes(x1, y1 + 300, x2, y2 + 300);
    fill("none");
    rect(x1, y1, rectWidth, rectHeight);
    drawAxes(x1 + 350, y1, x2 + 300, y2);
    fill("none");
    rect(x1 + 350, y1 - 300, rectWidth, rectHeight);
    drawAxes(x1 + 350, y1 + 300, x2 + 300, y2 + 300);
    fill("none");
    rect(x1 + 350, y1, rectWidth, rectHeight);

    sliceData(1, 35);
    xArr = values[0];
    yArr = values[1];
    diseaseArr = table.getColumn(2).slice(1, 35);
    maxX = Math.max.apply(Math, xArr);
    maxY = Math.max.apply(Math, yArr);
    minX = Math.min.apply(Math, xArr);
    minY = Math.min.apply(Math, yArr);
    drawPlot(x1, 350, x2, 650);
    textSize(20);
    fill(0, 0, 255);
    stroke(0);
    text("ARIZONA", x1 + 90, 500);
    values = [];

    sliceData(36, 73);
    xArr = values[0];
    yArr = values[1];
    diseaseArr = table.getColumn(2).slice(36, 73);
    maxX = Math.max.apply(Math, xArr);
    maxY = Math.max.apply(Math, yArr);
    minX = Math.min.apply(Math, xArr);
    minY = Math.min.apply(Math, yArr);
    drawPlot(x1, 50, x2, 350);
    textSize(20);
    fill(0, 0, 255);
    stroke(0);
    text("CALIFORNIA", x1 + 90, 250);
    values = [];

    sliceData(74, 107);
    xArr = values[0];
    yArr = values[1];
    diseaseArr = table.getColumn(2).slice(74, 107);
    maxX = Math.max.apply(Math, xArr);
    maxY = Math.max.apply(Math, yArr);
    minX = Math.min.apply(Math, xArr);
    minY = Math.min.apply(Math, yArr);
    drawPlot(x1 + 350, 350, x2 + 300, 650);
    textSize(20);
    fill(0, 0, 255);
    stroke(0);
    text("NEW YORK", x1 + 400, 500);
    values = [];

    sliceData(108, 139);
    xArr = values[0];
    yArr = values[1];
    diseaseArr = table.getColumn(2).slice(108, 139);
    maxX = Math.max.apply(Math, xArr);
    maxY = Math.max.apply(Math, yArr);
    minX = Math.min.apply(Math, xArr);
    minY = Math.min.apply(Math, yArr);
    drawPlot(x1 + 350, 50, x2 + 300, 350);
    textSize(20);
    fill(0, 0, 255);
    stroke(0);
    text("WASHINGTON", x1 + 400, 250);
    values = [];
    textSize(25);
    fill(0, 0, 0)
    text("Population Vs. Infected people with different diseases differentiated by State", x1, 20);
    textSize(20);
    fill(0, 0, 255);
    text(xField, x2 + 300, y2 + 350);
    text(yField, x1 - 180, y2 - 310);
}

function drawPlot(x1, y1, x2, y2) {
    var tickGap = (x2 - x1) / 5;
    var XAxisScale = minX, YAxisScale = 0;
    var temp = (maxX - minX) / 5;
    textSize(15);
    fill(0, 0, 0);
    //print("Max and Min and Temp is " + maxX + " " + minX + " " + temp);
    for (var i = 1; i <= 5; i++) {
        if (i == 5)
            XAxisScale = maxX;
        text(int(XAxisScale), x1 + i * tickGap - 30, y2 + 30);
        XAxisScale += temp;
    }

    tickGap = (y2 - y1) / 5;
    YAxisScale = 0;
    // print("Start at " + YAxisScale);
    for (i = 0; i <= 5; i++) {
        text(YAxisScale, x1 - 45, y2 - i * tickGap + 4);
        YAxisScale += int(maxY / 5);
    }

    var selectedPoints = [];
    for (i = 0; i < xArr.length; i++) {
        selectedPoints.push(createVector(xArr[i], yArr[i]));
    }

    for (i = 0; i < selectedPoints.length; i++) {
        var point = selectedPoints[i];
        var newx1 = x1;
        var newx2 = x2;
        //  print("MAx values are : " + maxX + "3899518, " 150537+ maxY);
        var xPos = int(map(point.x, (minX - temp) - (temp / 4), maxX, newx1, newx2));
        var newy1 = y2;
        var newy2 = y1;
        var yPos = int(map(point.y, 0, maxY, newy1, newy2));
       // print("xpos an dypos are " + xPos + " " + yPos);
        colorbyDisease(diseaseArr[i + 1], xPos, yPos);
    }
    for (i = 0; i < selectedPoints.length; i++) {
        var point = selectedPoints[i];
        var newx1 = x1;
        var newx2 = x2;
        var xPos = map(point.x, (minX - temp) - (temp / 4), maxX, newx1, newx2);
        var newy1 = y2;
        var newy2 = y1;
        var yPos = int(map(point.y, 0, maxY, newy1, newy2));
        if (sq(mouseX - xPos) + sq(mouseY - yPos) < 80) {
            print("hi");
            fill(230, 138, 0);
            ellipse(xPos, yPos, 10, 10);
            // print(point);
            text(diseaseArr[i + 1] + " (" + point.x + ", " + point.y + ")", mouseX + 15, mouseY);
        }
    }
}

function drawAxes(x1, y1, x2, y2) {
    stroke(100, 100, 100);
    strokeWeight(1.5);
    fill(100, 100, 100);
    textSize(18);
    line(x1, y1, x2, y2);
    var tickGap = (x2 - x1) / 5;
    for (var j = 0; j < 5; j++) {
        line(x1 + (j + 1) * tickGap, y1, x1 + (j + 1) * tickGap, y1 + tickSize);
    }
   // text(xField, x2 + 5, y2 + 40);
    x1 = x1;
    x2 = x1;
    y1 = y1;
    y2 = y1 - 300;
    line(x1, y1, x2, y2);
    tickGap = (y1 - y2) / 5;
    for (var j = 0; j < 5; j++) {
        line(x1, y2 + j * tickGap, x1 - tickSize, y2 + j * tickGap);
    }
   // text(yField, x1, y2 - 15);
}

function colorbyDisease(diseaseName, xPos, yPos) {
    switch (diseaseName) {
        case 'HEPATITIS A':
            fill(0, 204, 0); 
            ellipse(xPos, yPos, 10, 10);
            rect(Width / 2 + 350, Padding / 2 + 100, Width / 24, Padding / 10);
            fill(0, 0, 0); 
            textSize(18);
            text("HEPATITIS A", Width / 2 + 400, Padding / 2 + 115);
            break;
        case 'PERTUSSIS':
            fill(255, 0, 102); 
            ellipse(xPos, yPos, 10, 10);
            rect(Width / 2 + 350, Padding / 2 + 125, Width / 24, Padding / 10);
            fill(0, 0, 0); 
            textSize(18);
            text("PERTUSSIS", Width / 2 + 400, Padding / 2 + 140);
            break;
        default:
            fill(0, 51, 204); 
            ellipse(xPos, yPos, 10, 10);
            rect(Width / 2 + 350, Padding / 2 + 150, Width / 24, Padding / 10);
            fill(0, 0, 0); 
            textSize(18);
            text("OTHER", Width / 2 + 400, Padding / 2 + 165);
      }
}