kylebakerio · February 3, 2016 20:32
diff --git a/pdfScreenCapture.html b/pdfScreenCapture.html
 <HTML>
  <head>
    <script type="text/javascript" src="./js/es6-promise.min.js"></script> 
    <script type="text/javascript" src="./js/jspdf/dist/jspdf.current.min.js"></script> 
    <link href="./css/dealer_center.css" rel="stylesheet">
    <script src="./js/html2canvas/dist/html2canvas.min.js"></script>
    <script src="./js/jspdf/libs/Downloadify/js/downloadify.min.js"></script>
    <script src="./js/jspdf/libs/Downloadify/js/swfobject.js"></script>
    <!-- // <script src="https://cdn.jsdelivr.net/bluebird/3.1.1/bluebird.min.js"></script> -->
  </head>
  <body>
    <div id="downloadify"> </div>
    <div id="container-fluid">
        
    </div><!-- /.container-fluid -->

    <script>
        
            var quotes = document.getElementById('container-fluid');
            html2canvas(quotes, {
                // remove logging for production
                onrendered: function(canvas){
                    window.fullimage = canvas.toDataURL("image/png", 1.0);

                    // canvas can be large enough to not fit on
                    // a single page, so we use the for loop to 
                    // slice sections of that canvas into 
                    // 'onePageCanvas' elements, which we then
                    // push into their own pdf pages.

                    var pdf = new jsPDF('p', 'pt', 'letter');
                    
                    var srcImg  = canvas;
                    var sX      = 0;
                    var sY      = 0; 
                    var sWidth  = 900;
                    var sHeight = 980;
                    var dX      = 0;
                    var dY      = 0;
                    var dWidth  = 900;
                    var dHeight = 980;

                    for (var i = 0; i <= quotes.clientHeight/980; i++) {
                        sY = 980*i; // start 980 pixels down for every new page

                        var onePageCanvas = document.createElement("canvas");
                        onePageCanvas.setAttribute('width', 900);
                        onePageCanvas.setAttribute('height', 980);
                        
                        var ctx           = onePageCanvas.getContext('2d');
                        ctx.drawImage(srcImg,sX,sY,sWidth,sHeight,dX,dY,dWidth,dHeight);
                        var canvasDataURL = onePageCanvas.toDataURL("image/png", 1.0);
                        var width         = onePageCanvas.width;
                        var height        = onePageCanvas.clientHeight;
                        
                        if (i > 0) {
                            pdf.addPage(612, 791); //8.5" x 11" in pts (in*72)
                        }

                        pdf.setPage(i+1);
                        pdf.addImage(canvasDataURL, 'PNG', 20, 40, (width*0.62), (height*0.62));
                        // DEBUG ONLY -- REMOVE
                        // document.body.appendChild(onePageCanvas);
                    }

                    // console.log("about to run pdf.save()");
                    // pdf.save('Zebra_Car_Insurance_Quotes.pdf');
                    // console.log("about to return pdf.output()");
                    var doc = new jsPDF();
                        // doc.setFontSize(22);
                        // doc.text(20, 20, 'My First PDF');
                        // doc.addPage();
                        doc.addImage(window.fullimage, 'PNG', 20, 40, (width*0.62), (height*0.62));
                        // doc.save();
                        // doc.setFontSize(16);
                        // doc.text(20, 30, "If this works, why doesn't the other?."); 

                    Downloadify.create('downloadify',{
                        filename: "quotes.pdf",
                        data: function(){ 
                            console.log(pdf);
                            console.log(pdf.output().length);
                            return doc.output();
                            // return pdf.output();

                        },
                        onComplete: function(){ 
                            alert('Your File Has Been Saved!'); 
                        },
                        onCancel: function(){ 
                            alert('You have cancelled the saving of this file.');
                        },
                        onError: function(){ 
                            alert('You must put something in the File Contents or there will be nothing to save!'); 
                        },
                        swf: './js/jspdf/libs/Downloadify/media/downloadify.swf',
                        downloadImage: './js/jspdf/libs/Downloadify/images/download.png', 
                        width: 100,
                        height: 30,
                        transparent: true,
                        append: false
                    });
                },
                logging: true,
                useCORS: true
            });

    </script>
  </body>
 </HTML>
	<HTML>
	<head>
	<script type="text/javascript" src="./js/es6-promise.min.js"></script>
	<script type="text/javascript" src="./js/jspdf/dist/jspdf.current.min.js"></script>
	<link href="./css/dealer_center.css" rel="stylesheet">
	<script src="./js/html2canvas/dist/html2canvas.min.js"></script>
	<script src="./js/jspdf/libs/Downloadify/js/downloadify.min.js"></script>
	<script src="./js/jspdf/libs/Downloadify/js/swfobject.js"></script>
	<!-- // <script src="https://cdn.jsdelivr.net/bluebird/3.1.1/bluebird.min.js"></script> -->
	</head>
	<body>
	<div id="downloadify"> </div>
	<div id="container-fluid">

	</div><!-- /.container-fluid -->

	<script>

	var quotes = document.getElementById('container-fluid');
	html2canvas(quotes, {
	// remove logging for production
	onrendered: function(canvas){
	window.fullimage = canvas.toDataURL("image/png", 1.0);

	// canvas can be large enough to not fit on
	// a single page, so we use the for loop to
	// slice sections of that canvas into
	// 'onePageCanvas' elements, which we then
	// push into their own pdf pages.

	var pdf = new jsPDF('p', 'pt', 'letter');

	var srcImg = canvas;
	var sX = 0;
	var sY = 0;
	var sWidth = 900;
	var sHeight = 980;
	var dX = 0;
	var dY = 0;
	var dWidth = 900;
	var dHeight = 980;

	for (var i = 0; i <= quotes.clientHeight/980; i++) {
	sY = 980*i; // start 980 pixels down for every new page

	var onePageCanvas = document.createElement("canvas");
	onePageCanvas.setAttribute('width', 900);
	onePageCanvas.setAttribute('height', 980);

	var ctx = onePageCanvas.getContext('2d');
	ctx.drawImage(srcImg,sX,sY,sWidth,sHeight,dX,dY,dWidth,dHeight);
	var canvasDataURL = onePageCanvas.toDataURL("image/png", 1.0);
	var width = onePageCanvas.width;
	var height = onePageCanvas.clientHeight;

	if (i > 0) {
	pdf.addPage(612, 791); //8.5" x 11" in pts (in*72)
	}

	pdf.setPage(i+1);
	pdf.addImage(canvasDataURL, 'PNG', 20, 40, (width0.62), (height0.62));
	// DEBUG ONLY -- REMOVE
	// document.body.appendChild(onePageCanvas);
	}

	// console.log("about to run pdf.save()");
	// pdf.save('Zebra_Car_Insurance_Quotes.pdf');
	// console.log("about to return pdf.output()");
	var doc = new jsPDF();
	// doc.setFontSize(22);
	// doc.text(20, 20, 'My First PDF');
	// doc.addPage();
	doc.addImage(window.fullimage, 'PNG', 20, 40, (width0.62), (height0.62));
	// doc.save();
	// doc.setFontSize(16);
	// doc.text(20, 30, "If this works, why doesn't the other?.");

	Downloadify.create('downloadify',{
	filename: "quotes.pdf",
	data: function(){
	console.log(pdf);
	console.log(pdf.output().length);
	return doc.output();
	// return pdf.output();

	},
	onComplete: function(){
	alert('Your File Has Been Saved!');
	},
	onCancel: function(){
	alert('You have cancelled the saving of this file.');
	},
	onError: function(){
	alert('You must put something in the File Contents or there will be nothing to save!');
	},
	swf: './js/jspdf/libs/Downloadify/media/downloadify.swf',
	downloadImage: './js/jspdf/libs/Downloadify/images/download.png',
	width: 100,
	height: 30,
	transparent: true,
	append: false
	});
	},
	logging: true,
	useCORS: true
	});

	</script>
	</body>
	</HTML>