/*
		print.js
		Simple jQuery script to print HTML elements.
		
		See full guides and samples in index.html
		
		ATTENTION! Please see comments on line #26 and #40.
		   		   It requires style.css file please correct
				   paths on lines #24 and #38.
		
		TIP: if you want to change height and width of
			 preview window just give your values for
			 height and width variables (lines: #21 and #22; #35 and $36)

*/


$(document).ready(function(){ // wait for full DOM loading
	$("#printButton").click(function () { // button click event
		div = $("#coupon1");
		height = div.height();
		width = div.width();
		// creating the code of preview window
		pr = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>Print Coupon</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><link href="css/style.css" type="text/css" rel="stylesheet" /></head><body onload="print();" style="margin:0;" id="coupon1" class="coupon">' + div.html() + '</body></html>';
		
		// opening preview window with sending print-command. IT GETS HEIGHT AND WIDTH BUT YOU MUST GIVE WIDTH IN style.css FILE
		newWin = window.open('','printwin','Toolbar=0,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=yes,Resizable=0,Height=' + height + ',Width=' + width);
		newWin.document.open();
		newWin.document.writeln(pr);
		newWin.document.close();
	});
	
	$("#printButton2").click(function () { // button click event
		div = $("#coupon2");
		height = div.height();
		width = div.width();
		// creating the code of preview window
		pr = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>Print Coupon</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><link href="css/style.css" type="text/css" rel="stylesheet" /></head><body onload="print();" style="margin:0;" id="coupon2" class="coupon">' + div.html() + '</body></html>';
		
		// opening preview window with sending print-command. IT GETS HEIGHT AND WIDTH BUT YOU MUST GIVE WIDTH IN style.css FILE
		newWin = window.open('','printwin','Toolbar=0,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=yes,Resizable=0,Height=' + height + ',Width=' + width);
		newWin.document.open();
		newWin.document.writeln(pr);
		newWin.document.close();
	});
	
	
	
	
	$("#printImg").click(function () { // image click event
		img = $("#printImg");
		height = img.height();
		width = img.width();
		// creating the code of preview window
		pr = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>Print Coupon</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><link href="css/style.css" type="text/css" rel="stylesheet" /></head><body onload="print();" style="margin:0" id="print"><img src="' + img.attr('src') + '" alt="" /></body></html>';
		
		// opening preview window with sending print-command. IT GETS THE HEIGHT AND WIDTH OF YOUR IMAGE, BUT YOU CAN PUT YOUR OWN VALUES
		newWin = window.open('','printwin','Toolbar=0,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=0,Resizable=0,Height=' + height + ',Width=' + width);
		newWin.document.open();
		newWin.document.writeln(pr);
		newWin.document.close();
	});
});
