Param Blogs: 2019

////testSave.php////////////////
<?php
if (isset($GLOBALS["HTTP_RAW_POST_DATA"]))
{
// Get the data
$imageData=$GLOBALS['HTTP_RAW_POST_DATA'];

// Remove the headers (data:,) part.
// A real application should use them according to needs such as to check image type
$filteredData=substr($imageData, strpos($imageData, ",")+1);

// Need to decode before saving since the data we received is already base64 encoded
$unencodedData=base64_decode($filteredData);

//echo "unencodedData".$unencodedData;

//=============
   $limit = 4;
   $digit_str   = '0123456789';
   $digit = substr(str_shuffle($digit_str), 0, $limit);
   //======================
   $letter_str='abcdefhigklmnopqrstuvwxyz';
   $letter = substr(str_shuffle($letter_str), 0, $limit);
   //==================
   $filename="CANVAS$digit$letter.png";

   echo $filename;

// Save file. This example uses a hard coded filename for testing,
// but a real application can specify filename in POST variable
// $fp = fopen( 'test.png', 'wb' );
$fp = fopen( $filename, 'wb' );
fwrite( $fp, $unencodedData);
fclose( $fp );
}
?>

<!DOCTYPE html>
<html>
<head>
<title>
How To Save HTML5 Canvas Into File
</title>
<meta name="Keywords" content="html, html5, javascript canvas tutorial, javascript canvas, todataurl, saving, web development, ajax" />
<meta name="Description" content="html 5, html5, javascript canvas tutorial for web development, saving canvas" />
<script type="text/javascript">

//****************************************************************
// Example function save save canvas content into image file.
// www.permadi.com
//****************************************************************
function saveViaAJAX()
{
    var testCanvas = document.getElementById("testCanvas");
    var canvasData = testCanvas.toDataURL("image/png");
    var postData = "canvasData="+canvasData;
    var debugConsole= document.getElementById("debugConsole");
    debugConsole.value=canvasData;

    //alert("canvasData ="+canvasData );
    var ajax = new XMLHttpRequest();
    ajax.open("POST",'testSave.php',true);
    ajax.setRequestHeader('Content-Type', 'canvas/upload');
    //ajax.setRequestHeader('Content-TypeLength', postData.length);

    ajax.onreadystatechange=function()
    {
        if (ajax.readyState == 4)
        {
            alert(ajax.responseText);
            // Write out the filename.
                document.getElementById("debugFilenameConsole").innerHTML="Saved as<br><a target='_blank' href='"+ajax.responseText+"'>"+ajax.responseText+"</a><br>Reload this page to generate new image or click the filename to open the image file.";
        }
    }

    ajax.send(postData);
}

</script>
</head>

<body>

     <div>
        <canvas id="testCanvas" width="300" height="300"></canvas>
      </div>
      <div>
    <textarea id="debugConsole" rows="10" cols="60">Data</textarea>
       <p><button onclick="saveViaAJAX();">Save Via AJAX</button>   <p>
    <div id="debugFilenameConsole">Wait for a while after clicking the button and the filename of the image will be shown to you. </div>
      </div>
    <script type="text/javascript">
        // This portion of the code simply draws random circles into the canvas (it has nothing todo with saving the canvas).
        var canvas = document.getElementById("testCanvas");
        if (canvas.getContext)
        {
            var canvasContext = canvas.getContext("2d");
            for (i=0; i<150; i++)
            {
                canvasContext.fillStyle="rgb("+(parseInt(Math.random()*255))+","+(parseInt(Math.random()*255))+","+(parseInt(Math.random()*255))+")";
                canvasContext.beginPath();
                canvasContext.arc(Math.random()*350,Math.random()*350,Math.random()*20, 0,Math.PI*2,true);
                canvasContext.fill();
            }
        }
    </script>
</body>

</html>

$pdf->writeHTML($txt, true, false, true, false, '');
//=============
$limit = 4;
$digit_str = '0123456789';
$digit = substr(str_shuffle($digit_str), 0, $limit);
//======================
$letter_str='abcdefhigklmnopqrstuvwxyz';
$letter = substr(str_shuffle($letter_str), 0, $limit);
//==================
$filename="LGHT$digit$letter.pdf";
//$dir='/var/www/html/pdf/pdf_files/';
$dir= $_SERVER["DOCUMENT_ROOT"].'param/temp_reports/';
/*PDF info page */
$pdf->SetCreator(PDF_CREATOR);
$pdf->SetAuthor('Lighthouse247');
$pdf->SetTitle($filename);
$pdf->SetSubject('INVOICE Lighthouse247');
//$pdf->SetKeywords('TCPDF, PDF, example, test, guide');
/*Save pdf file to folder*/
$pdf->Output($dir.$filename, 'F');
//$download_link = "http://$_SERVER[HTTP_HOST]/pdf/pdf_files/$filename";
//$download_link = $_SERVER['HTTP_HOST']."/pdf_files/$filename";
$download_link = "http://localhost/param/temp_reports/$filename";

/*Apear Download link on screen*/
echo $result="<a href='$download_link' download>
<img src='pdf.png' alt='download' width='104' height='142'>
</a>";

Param Blogs

Sunday, 3 March 2019

add signature to form using canvas complete code

save canvas as file to server php

Wednesday, 20 February 2019

add at end of TCPDF to save file in folder