div.js 3.36 KB
/**
 * 2D Vector.
 * Container for x and y coordinates. 
 */

class Vector {
	constructor(x,y) {
		this.x = x;
		this.y = y;
	}
}

class Text {

	/**
	 * Both arguments should be real coordinates and not a percentage based on parent element
	 * @param {Vector} position 
	 * @param {Vector?} size 
	 */
	constructor(text, position) {
		this.text = text;
		this.position = position;
	}

	/**
	 * Compiles the true position coordinates based on percentage relative to parent element
	 * Assumes the elements grow to the right and down
	 * @param {Vector} position 
	 */
	getDrawCoordinates(position) {
		return new Vector(
			(this.size.x * position.x / 100) + this.position.x,
			(this.size.y * position.y / 100) + this.position.y,
		);
	}


}

/**
 * This class does NOT regulate if its children go out of its cofinements.
 * It does NOT resize or realocate its children to fit, in any way.
 * Its only purpose is to provide percentage based relative coordinates.
 */

class Div {

	/**
	 * Both arguments should be real coordinates and not a percentage based on parent element
	 * @param {Vector} position 
	 * @param {Vector} size 
	 */
	constructor(position, size) {
		this.position = position;
		this.size = size;
		this.children = {};
	}

	addChild(id, position, size) {
		if (position.x < 0 || position.x > 100)
			console.error("position.x has to be an int between 0 and 100");
		if (position.y < 0 || position.y > 100)
			console.error("position.y has to be an int between 0 and 100");
		if (size.x < 0 || size.x > 100)
			console.error("size.x has to be an int between 0 and 100");
		if (size.y < 0 || size.y > 100)
			console.error("size.y has to be an int between 0 and 100");

		this.children[id] = new Div (
			this.getDrawCoordinates(position),
			this.getSize(size)
		);

		return this.children[id];
	}

	addText(id, position) {
		if (position.x < 0 || position.x > 100)
			console.error("position.x has to be an int between 0 and 100");
		if (position.y < 0 || position.y > 100)
			console.error("position.y has to be an int between 0 and 100");
		
		this.children[id] = new Text(position);
	}

	/**
	 * Compiles the true position coordinates based on percentage relative to parent element
	 * Assumes the elements grow to the right and down
	 * @param {Vector} position 
	 */
	getDrawCoordinates(position) {
		return new Vector (
			(this.size.x * position.x / 100) + this.position.x,
			(this.size.y * position.y / 100) + this.position.y,
		);
	}
		
	/**
	 * Compiles the true size based on percentage relative to parent element
	 * Assumes the elements grow to the right and down
	 * @param {Vector?} size
	 */
	getSize(size) {
		if (size === null) return null;
		return new Vector (
			this.size.x * size.x / 100,
			this.size.y * size.y / 100,
		);
	}

	/**
	 * Debug method to see the confines of the Div
	 * @param {jsPDF} pdf 
	 */
	drawDivBox(pdf) {
		/** Upper **/
		pdf.line(
			this.position.x,
			this.position.y,
			this.position.x + this.size.x,
			this.position.y
		);
		/** Lower **/
		pdf.line(
			this.position.x,
			this.position.y + this.size.y,
			this.position.x + this.size.x,
			this.position.y + this.size.y
		);
		/** Left **/
		pdf.line(
			this.position.x,
			this.position.y,
			this.position.x,
			this.position.y + this.size.y
		);
		/** Right **/
		pdf.line(
			this.position.x + this.size.x,
			this.position.y,
			this.position.x + this.size.x,
			this.position.y + this.size.y
		);
	}
}