div.js 3.65 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 
	 * @param {bool} draw 
	 */
	constructor(position, size, draw = false) {
		this.position = position;
		this.size = size;
		this.drawOutline = draw;
		this.children = [];
	}

	addChild(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");

		let div = new Div(
			this.getDrawCoordinates(position),
			this.getSize(size)
		);
		this.children.push(div);
		return div;
	}

	addText(text, 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.push(new Text(
			text, 
			this.getDrawCoordinates(position)
		));
	}

	/**
	 * Array de arrays de la forma ['texto', VectorPosición]
	 * @param {array} textArray 
	 */
	addTexts(textArray) {
		textArray.forEach( args => 
			this.addText(args[0], args[1])	
		);
	}

	/**
	 * 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
		);
	}
}