import * as maths from "./maths.js";
import { createPdf } from "./print.js";

let uInput = document.getElementById("u");
let hInput = document.getElementById("h");
let rInput = document.getElementById("r");
let rsInput = document.getElementById("rs");
let npInput = document.getElementById("np");
let outputdiv = document.getElementById("output");
let stepInput = document.getElementById("steps");
let paperInput = document.getElementById("p");

// parameters
let height = 0;
let radius = 0;
let spillRadius = 0;
let numberOfPanels = 0;
let step = 0.001;
const offset = 4 * 10 ** -5;

// temporary data 
let pointsP = [];
let pointsQ = [];
let distances = [];
let panelPoints = [];

// print data
let panelPaths = [];
let svgSize = { width: 0, height: 0 };
let scaleFactor = 1;
let paperSize = "a3";

let n = 0;
let unit = "px";

// logic
function getValues() {
    pointsP = [];
    pointsQ = [];
    distances = [];
    panelPoints = [];
    height = (parseFloat(hInput.value) * 1);
    radius = (parseFloat(rInput.value) * 1);
    spillRadius = (parseFloat(rsInput.value) * 1);
    numberOfPanels = (parseFloat(npInput.value) * 1);
    step = radius / parseInt(stepInput.value);
	paperSize = paperInput.value;
    if (isNaN(spillRadius)) {
        spillRadius = (0.05 * radius);
        rsInput.value = 0.05 * radius ;
    }
    n = ((radius - spillRadius) / (step - offset)) - 1;
}

function getPoints() {
    for (let x = spillRadius; x < radius; x += step - offset) {
	// round x to reduce oppourtunity for a NaN to occur from accuracy
        x = maths.approx(x);
        pointsP.push({
            x: x,
            y: maths.f(x, height, radius)
        });
    }
}

function getPointsOfTangentIntersection() {
    for (let i = 0; i < n; i++) {
        pointsQ.push({
            x: maths.j(pointsP[i], pointsP[i + 1], height, radius),
            y: maths.g(maths.j(pointsP[i], pointsP[i + 1], height, radius), pointsP[i + 1], height, radius)
        });
    }
}

function getDistancesBetweenIntersections() {
    for (let i = 0; i < n - 1; i++) {
        distances.push(maths.d(pointsQ[i], pointsQ[i + 1], height, radius));
    }
}

function generateCoordinates() {
    let Xi = 0;
    for (let i = 0; i < n - 2; i++) {
        Xi += distances[i];
        let Yi = (Math.PI * pointsQ[i].x) / numberOfPanels;
        panelPoints.push({
            x: Xi,
            y: Yi
        });
    }
}

function createPerimeterPath(maxY) {
	let path = `M `;
	
	// first arc
	for (let i = 0; i < panelPoints.length; i++) {
		let point = panelPoints[i];
		path += `${maths.approx(point.x)},${maths.approx((maxY) - point.y)} `;
	}
	// second arc
	for (let i = panelPoints.length-1; i>=0;i--) {
		let point = panelPoints[i];
		path +=`${maths.approx(point.x)},${maths.approx((point.y + maxY))} `;
	}
	path += `${maths.approx(panelPoints[0].x)},${maths.approx((maxY) - panelPoints[0].y)}`;
	return path;
}

function createCentrePath(maxY) {
	return `M ${maths.approx(panelPoints[0].x)},${(maxY - maths.approx(panelPoints[0].y) + maths.approx((panelPoints[0].y + maxY))) / 2} ${panelPoints[panelPoints.length - 1].x},${(maxY - maths.approx(panelPoints[panelPoints.length - 1].y) + maths.approx((panelPoints[panelPoints.length - 1].y + maxY))) / 2}`;
}

function plotSVG() {
	let maxY = 0;
	let minY = 1000;
    	let maxX = 0;
    	let minX = 1000;
    	panelPoints.forEach((point) => {
        	if (maxY < point.y) {
            		maxY = point.y;
        	}
		if (minY > point.y) {
			minY = point.y;
		}
        	if (minX > point.x) {
            		minX = point.x;
        	}
        	if (maxX < point.x) {
            		maxX = point.x;
        	}
    	});
	svgSize.width = panelPoints[panelPoints.length - 1].x - maths.approx(panelPoints[0].x);
	svgSize.height = (maxY - maths.approx(panelPoints[0].y) + maths.approx((panelPoints[0].y + maxY)));
	panelPaths[0] = createCentrePath(maxY);
	panelPaths[1] = createPerimeterPath(maxY);
	outputdiv.innerHTML = `
	<svg 	width="297mm"
		height="210mm"
		xmlns="http://www.w3.org/2000/svg">
		<g id="layer1">
			<path
				d="${panelPaths[0]}"
				fill="none"
				stroke="black"
				stroke-width="1"
			/>
			<path
				d="${panelPaths[1]}"
				fill="none"
				stroke="black"
				stroke-width="1"
			/>
		</g>
	</svg>`;
}

function calculateScaleFactor(unit) {
	if (unit == "mm") {
		scaleFactor = 72/25.4;
	} else if (unit == "cm") {
		scaleFactor = 72/2.54;
	} else if (unit == "in") {
		scaleFactor = 72;
	} else if (unit == "px")  {
		scaleFactor = 0.75;
	}
}

// main func
function generatePanel() {
    unit=uInput.value;
    getValues();
    getPoints();
    getPointsOfTangentIntersection();
    getDistancesBetweenIntersections();
    generateCoordinates();
    plotSVG();
	calculateScaleFactor(unit);
	createPdf(panelPaths, svgSize, scaleFactor, paperSize);
}

document.getElementById("generate").addEventListener("click", () => generatePanel());