class ProductManagementPage
{
	// Attributes
	
	// Constructor
	constructor()
    {
		$.ajaxSetup({cache:false});	// May need to turn of browser cache
    }
	
	// Properties
	
	// Methods
	PageLoad(): void
	{
		// Add event handlers to buttons, etc.
		$("#readall-product-button").click(this.LoadAllProductClick);
		$("#add-product-button").click(this.AddProductClick);
		$("#delete-product-button").click(this.DeleteProductClick);		
	}	
	
	private LoadAllProductClick = (e: JQuery.Event): boolean => 
	{
		$.ajax({
			cache: false,
			type: "GET",
			url: "http://localhost:1339/products/read",
			data: '{}',
			contentType: "application/json",
			dataType: "json",
			success: this.ProductReadAll,
			error: this.AjaxError
		});		

		e.preventDefault();
		return false;
	};
	
	private ProductReadAll = (products: {name:string, description:string, price:number}[], status: string, req: JQueryXHR): void =>
	{
		let rows: string = "";
		for(let i in products)
		{
			let product: {name:string, description:string, price:number} = products[i];
			
			rows += `<tr><td>Name</td><td>${product.name}</td></tr>
					<tr><td>Description</td><td>${product.description}</td></tr>
					<tr><td>Price</td><td>${product.price}</td></tr>`;
		}
		
		$("#display-product-div").html(`<table>${rows}</table>`);		
	};	
	
	private AddProductClick = (e: JQuery.Event): boolean => 
	{
		let product: {name:string, description:string, price:number};
		
		product = {
			name: $("#product-name-text-box").val() as string,
			description: $("#product-description-text-box").val() as string,
			price: parseFloat($("#product-price-text-box").val() as string)
		};

		$.ajax({
			cache: false,
			type: "POST",
			url: "http://localhost:1339/products/add",
			data: JSON.stringify(product),
			contentType: "application/json",
			dataType: "json",
			success: this.ProductAdded,
			error: this.AjaxError
		});

		e.preventDefault();
		return false;
	};	
	
	private ProductAdded = (json: any, status: string, req: JQueryXHR): void =>
	{
		if(json.done === true)
		{
			$("#product-opstatus-span").html("Product added at index "+json.productid);
		}		
	};

	private LoadProductClick = (e: JQuery.Event): boolean => 
	{
		let productid: number = parseInt($("#productid-text-box").val() as string, 10);
		
		$.ajax({
			cache: false,
			type: "GET",
			url: "http://localhost:1339/products/read/"+productid,
			data: '{}',
			contentType: "application/json",
			dataType: "json",
			success: this.ProductRead,
			error: this.AjaxError
		});

		e.preventDefault();
		return false;
	};	
	
	private ProductRead = (json: {done:boolean, product:{name:string, description:string, price:number}}, status: string, req: JQueryXHR): void =>
	{
		if(json.done == true)
		{
			$("#display-product-div").html(`<table>
			<tr><td>Name</td><td>${json.product.name}</td></tr>
			<tr><td>Description</td><td>${json.product.description}</td></tr>
			<tr><td>Price</td><td>${json.product.price}</td></tr>
			</table>`);	
		}	
		else
		{
			$("#display-product-div").html(`<p>No matching product</p>`)
		}	
	};	
	
	private EditProductClick = (e: JQuery.Event): boolean => 
	{
		let product: {name:string, description:string, price:number};
		let productid: number;
		
		product = {
			name: $("#product-name-text-box").val() as string,
			description: $("#product-description-text-box").val() as string,
			price: parseFloat($("#product-price-text-box").val() as string)
		};
		
		productid = parseInt($("#productid-text-box").val() as string);

		$.ajax({
			cache: false,
			type: "PUT",
			url: "http://localhost:1339/products/put/"+productid,
			data: JSON.stringify(product),
			contentType: "application/json",
			dataType: "json",
			success: this.ProductEditPut,
			error: this.AjaxError
		});

		e.preventDefault();
		return false;
	};	
	
	private ProductEditPut = (json: any, status: string, req: JQueryXHR): void =>
	{
		if(json.done === true)
		{
			$("#product-opstatus-span").html("Product edited (put) at index "+json.productid);
		}		
	};	
	
	private DeleteProductClick = (e: JQuery.Event): boolean => 
	{
		let productid: number;
		
		productid = parseInt($("#productid-text-box").val() as string);

		$.ajax({
			cache: false,
			type: "DELETE",
			url: "http://localhost:1339/products/delete/"+productid,
			data: '{}',
			contentType: "application/json",
			dataType: "json",
			success: this.ProductDelete,
			error: this.AjaxError
		});

		e.preventDefault();
		return false;
	};	
	
	private ProductDelete = (json: any, status: string, req: JQueryXHR): void =>
	{
		if(json.done === true)
		{
			$("#product-opstatus-span").html("Product deleted at index "+json.productid);
		}		
	};	
	
	private AjaxError = (req: JQueryXHR, status: string, error: string): void =>
	{
		window.alert("Ajax Error --"+"\n"+
		 "status: "+status+"\n"+
		 "RdyStatus: "+req.readyState+"\n"+
		 "Message: "+req.statusText);
	};

}	

// Self-invoking function
$(function() {
	let page: ProductManagementPage = new ProductManagementPage();
	page.PageLoad();
});