Sunday, 19 May 2019

HTML to PDF Example






<!DOCTYPE html>
<html lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>HTML to PDF Example - PHP Kishan</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<style>
.center{text-align: center;}
.pdfdiv{background-color: #d9ec58;margin: 50px;padding:30px;}
.innerdiv{padding: 10px;margin: 15px 0;border: 2px solid #ea5555;}
.loader-div {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.66);z-index: 9;bottom: 0;display: block;text-align:center;color: #fff;font-size: 22px;padding: 30% 0;}
.dp-img{border: 1px solid #e65959;border-radius: 50%;padding: 12px;margin: 6px;}
.btn-div{margin: 58px auto;}
.downloadpdf{text-align: center;background-color: #27d848;width: max-content;padding: 10px;border-radius: 10px;margin: 0 auto;font-size: 30px;text-decoration-line: none;}
.downloadpdf:hover{background-color: #d1d451;}
</style>
</head>
<body>
    <div class="btn-div center">
        <a class="downloadpdf" href="javascript:;" data-pdf="html2pdf" data-target="pdfdiv">Download PDF</a>
    </div>
    <div id="pdfdiv" class="pdfdiv center">
        <div class="innerdiv">
            <h1>This is a Heading</h1>
            <p>This is a paragraph.</p>
            <h5>This is a image.</h5>
            <div>
                <img class="dp-img" src="image.png" alt="HTML to PDF">
            </div>
        </div>
        <div class="innerdiv">
            <h1>This is a Heading</h1>
            <p>This is a paragraph.</p>
            <h5>This is a image.</h5>
            <div>
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
                <img class="dp-img" src="image.png" alt="HTML to PDF">
            </div>
        </div>
        <div class="innerdiv">
            <h1>This is a Heading</h1>
            <p>This is a paragraph.</p>
            <h5>This is a image.</h5>
            <div>
                <img class="dp-img" src="image.png" alt="HTML to PDF">
            </div>
        </div>       
    </div>
    <div class="btn-div center">
        <a class="downloadpdf" href="javascript:;" data-pdf="html2pdf" data-target="pdfdiv">Download PDF</a>
    </div>
    <div class="loader-div">Loading...</div>
<footer>
<script>
jQuery(document).ready(function(){
    jQuery('.loader-div').hide();
    jQuery(".downloadpdf").click(function(e){   
        jQuery('.loader-div').show();
        var pdfname = jQuery(this).data('pdf');
        var pdftarget = jQuery(this).data('target');
        console.log("PDF NAME:" + pdfname + "PDF HTML Div: " + pdftarget);   
       

        var pdfw = jQuery('#'+pdftarget).width();
        var pdfh = jQuery('#'+pdftarget).height();
        // console.log  ('div width: '+ pdfw + ' div height: '+pdfh);       

        html2canvas(document.getElementById(pdftarget)).then(function(canvas) {
            var imgData = canvas.toDataURL("image/jpeg");
            // console.log(imgData);
           
            var pdf = new jsPDF('','px',[pdfw,pdfh]);          
            var pwidth = pdf.internal.pageSize.getWidth();
            var pheight = pdf.internal.pageSize.getHeight();
            // console.log('PDF pwidth: '+ pwidth + ' PDF height: '+pheight);   

            pdf.addImage(imgData, 'JPEG', 0, 0, pwidth, pheight);                  
            pdf.save(pdfname+'.pdf');             
            jQuery('.loader-div').hide();
        }).catch(function(M) {
             console.log(M);   
        });
    });
});
</script>
</footer>
</body>
</html>

Note: All images of HTML page must be on the current domain.

Saturday, 29 December 2018

How to set default image on image loaded broken?



<!DOCTYPE html>
<html class="" lang="en-US">
<head>
<meta charset="UTF-8" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
<!-- or -->
<!-- <script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.js"></script> -->
<style type="text/css">.image-thumb {display: inline-block;margin: 10px;}</style>
</head>
<body>
<div id="product_div">
<div class="image-thumb"><img src="image/product_01.jpg" class="thumbnail-img" width="100" height="100"></div>
<div class="image-thumb"><img src="image/product_02.jpg" class="thumbnail-img" width="100" height="100"></div>
<div class="image-thumb"><img src="image/product_03.jpg" class="thumbnail-img" width="100" height="100"></div>
<div class="image-thumb"><img src="image/product_04.jpg" class="thumbnail-img" width="100" height="100"></div>
<div class="image-thumb"><img src="image/product_05.jpg" class="thumbnail-img" width="100" height="100"></div>
<div class="image-thumb"><img src="image/image/product_06.jpg" class="thumbnail-img" width="100" height="100"></div>
<div class="image-thumb"><img src="image/image/product_07.jpg" class="thumbnail-img" width="100" height="100"></div>
</div>

<script type="text/javascript">
jQuery(document).ready(function(){
if (jQuery('#product_div').length) {
jQuery('#product_div').imagesLoaded().always( function( instance ) {
console.log('all images loaded');
}).done( function( instance ) {
console.log('all images successfully loaded');
}).fail( function(instance2) {
console.log('all images loaded, at least one is broken');
}).progress( function( instance, image ) {
var result = image.isLoaded ? 'loaded' : 'broken';
console.log( 'image is => ' + result + ' for ' + image.img.src );
if(result == 'broken'){
var default_images = ["default_01.jpg","default_02.jpg","default_03.jpg","default_04.jpg","default_05.jpg"];
var new_image_name = default_images[Math.floor(Math.random()*default_images.length)];
console.log("default image is" + new_image_name); /* Random image select */
var default_img = 'default_images/' + new_image_name;
image.img.src = default_img;
}
});
}
});
</script>
</body>
</html>

Thursday, 6 December 2018

Export Database From MySQL






# Open CMD
# Step1: Change the directory folder current directory to mysql bin directory.
C:\Users\PHPKishan> cd D:\wamp64\bin\mysql\mysql5.7.19\bin ↲

# Step2: write below command line and in this cmd
D:\wamp64\bin\mysql\mysql5.7.19\bin>mysqldump --databases --user=[Username] --password [DBNAME] > [DIR PATH]\[DBNAME.sql] ↲

 EX D:\wamp64\bin\mysql\mysql5.7.19\bin>mysqldump --databases --user=root --password test_table > DB\test_table_bk.sql ↲

# Step3: Enter password
Enter password:***** ↲

# Step4: See exported database in you directory

Friday, 2 November 2018

reCAPTCHA V3 Example in PHP


<!DOCTYPE html>
<html>
<head>
</head>
<body>
<?php
## reCAPTCHA V3 key define ##
#client-side
define('RECAPTCHA_SITE_KEY', 'reCAPTCHA_site_key'); // define here reCAPTCHA_site_key
#server-side
define('RECAPTCHA_SECRET_KEY', 'reCAPTCHA_secret_key'); // define here reCAPTCHA_secret_key

class Captcha {
public function getCaptcha($SecretKey) {
$data = array(
'secret' => RECAPTCHA_SECRET_KEY,
'response' => $SecretKey
);
$verify = curl_init();
curl_setopt($verify, CURLOPT_URL, "https://www.google.com/recaptcha/api/siteverify");
curl_setopt($verify, CURLOPT_POST, true);
curl_setopt($verify, CURLOPT_POSTFIELDS, http_build_query($data));
curl_setopt($verify, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($verify, CURLOPT_RETURNTRANSFER, true);
$response_data = curl_exec($verify);
$response_data = json_decode($response_data);
curl_close($verify);
//echo "<pre>"; print_r($response_data); echo "</pre>";
return $response_data;
}
}

///////////////////////////// OR /////////////////////////////
/*
class Captcha {
public function getCaptcha($SecretKey) {
$Resposta = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=" . RECAPTCHA_SECRET_KEY . "&response={$SecretKey}");
$Retorno = json_decode($Resposta);
return $Retorno;
}
}
*/

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
//echo "<pre>"; print_r($_REQUEST); echo "</pre>";
$ObjCaptcha = new Captcha();
$Retorno = $ObjCaptcha->getCaptcha($_POST['g-recaptcha-response']);
//echo "<pre>"; print_r($Retorno); echo "</pre>";
if ($Retorno->success) {
echo '<p style="color: #0a860a;">CAPTCHA was completed successfully!</p>';
} else {
$error_codes = 'error-codes';
if (isset($Retorno->$error_codes) && in_array("timeout-or-duplicate", $Retorno->$error_codes)) {
$captcha_msg = "The verification expired due to timeout, please try again.";
} else {
$captcha_msg = "Check to make sure your keys match the registered domain and are in the correct locations.<br> You may also want to doublecheck your code for typos or syntax errors.";
}
echo '<p style="color: #f80808;">reCAPTCHA error: ' . $captcha_msg . '</p>';
}
}
?>

<div class="contact_form">
<div class="" style="margin-top:0px;margin-bottom:15px;">
<div class="" style="width:50%">
<form id="Form1" name="Form1" action="" method="POST">
<label for="fname">First Name*</label><br>
<input type="text" name="fname" id="fname" required autofocus><br><br>

<label for="lname">Last Name*</label><br>
<input type="text" name="lname" id="lname" required><br><br>

<input type="hidden" id="g-recaptcha-response" name="g-recaptcha-response"><br>
<input type="submit">
</form>
</div>
</div>
</div>

<script src="https://www.google.com/recaptcha/api.js?render=<?php echo RECAPTCHA_SITE_KEY; ?>"></script>
<script>
grecaptcha.ready(function () {
grecaptcha.execute('<?php echo RECAPTCHA_SITE_KEY; ?>', {action: 'homepage'}).then(function (token) {
document.getElementById('g-recaptcha-response').value = token;
});
});
</script>
</body>
</html>

Thursday, 1 November 2018

Multiple words of string replace with str_replace in PHP

<?php
    ## Converting utf8 characters to iso-88591 manually in PHP
    echo "<meta http-equiv='Content-Type' content='text/html; charset=UTF-8' />";   
    function str_replace_char(){ 
        $find = array('“', '’', '…', 'â€"', 'â€"', '‘', 'é', 'Â', '•', 'Ëœ', 'â€'); // en dash
        $replace = array('"', '’', '…', '—', '–', '‘', 'é', '', '•', '˜', '"'); // original
        $new_str_content = str_replace( $find,$replace,$str_content);
        return $new_str_content;
    }
   
    $string = "It’s Getting the Best of Me";
    echo $new_string = str_replace_char($string);
?>