Generate Live Preview of number & total fields embedded by merge tags in Gravity Form's HTML field

gravityxl-live-html-preview.php

/**
 * @package Gravity XL Live Html Preview
 * @version 1.0
 * @name gravity -gravity_xl-live-html-preview
 * @author Gravity XL
 */
/**
 * Make html field show live calculations and totals embedded
 *
 */
if (!class_exists('Gravity_XL_Live_Html_Preview')) {

    class Gravity_XL_Live_Html_Preview
    {


        public $is_script_load = false;

        /**
         * Class construct to initiate all hooks & loading dependecies
         */
        public function __construct()
        {

            // make sure we're running the required minimum version of Gravity Forms
            if (!property_exists('GFCommon', 'version') || !version_compare(GFCommon::$version, '1.8', '>='))
                return;

            //start snippet functionality
            add_action('init', array($this, 'initHooks'));


        }

        public function initHooks()
        {


            /** Gform merge tags to decode merge tags and convert them to html */
            add_action('gform_replace_merge_tags', array($this, 'gxl_lhp_replace_tags'), 50, 7);

            /** Pre render script for JS loading  */
            add_action('gform_pre_render', array($this, 'gxl_lhp_maybe_push_script'));


        }


        /**
         * Hooked into `gform_pre_render`
         * To render JS for each form.
         * Deals with change events in gravity forms for numeric field and total fields & modifies corresponding html field
         * @param $form Gform Object
         * @return mixed
         */
        public function gxl_lhp_maybe_push_script($form)
        {

            ?>
            <script type="text/javascript">

                /**
                 * for number fields
                 */

                if (typeof gform !== "undefined") {
                    gform.addAction('gform_post_calculation_events', function (matches, formulaField, formId, calcObj) {

                        if (formId !== <?php echo rgar($form, 'id');?>) {
                            return;
                        }


                        jQuery("#input_" + formId + "_" + formulaField.field_id).on('change', function () {


                            var ID = this.id;
                            var config = {};
                            if (ID === "") {
                                return false;
                            }

                            var parsedArray = ID.split("_");

                            config = {
                                formId: parsedArray[1],
                                field_id: parsedArray[2],
                                input_id: parsedArray[3]
                            };
                            if (jQuery("#gform_wrapper_" + config.formId + " span.gxl_number_preview[data-id='" + config.field_id + "']").length > 0) {
                                jQuery("#gform_wrapper_" + config.formId + " span.gxl_number_preview[data-id='" + config.field_id + "']").html(this.value);
                            }
                        });

                        jQuery("#input_" + formId + "_" + formulaField.field_id).trigger('change');

                    });
                }


                /**
                 * For product total
                 */
                if (typeof gform !== "undefined") {
                    gform.addFilter('gform_product_total', function (price, FormID) {


                        if (FormID != <?php echo rgar($form, 'id');?>) {
                            console.log("here");
                            return price;
                        }


                        if (jQuery("#gform_wrapper_" + FormID + " span.gxl_total_preview").length > 0) {
                            jQuery("#gform_wrapper_" + FormID + " span.gxl_total_preview").html(gformFormatMoney(price));
                        }
                        return price;
                    });
                }


            </script>


            <?php
            return $form;
        }


        /**
         * Hooked into `gform_replace_merge_tags`
         * Replaces merge tags into html that works as preview wrapper
         * @param $text text to decode merge tag for
         * @param $form Form object Gform
         * @param $entry Entry object
         * @param $url_encode is_encoded
         * @param $esc_html is_html_escaped
         * @param $nl2br is_nl_to_br
         * @param $format Foramt
         * @return mixed text
         */
        public function gxl_lhp_replace_tags($text, $form, $entry, $url_encode, $esc_html, $nl2br, $format)
        {
            preg_match_all("/\{GXL Live Preview Number(.*?)\}/", $text, $matches, PREG_SET_ORDER);


            foreach ($matches as $match) {
                $splittedinput = explode(":", $match[1]);

                $text = str_replace($match[0], sprintf("<span class='gxl_number_preview' data-id='%d' ></span>", $splittedinput[1]), $text);
                $is_script_load = true;
            }

            preg_match_all("/\{GXL Live Preview Total(.*?)\}/", $text, $matches_total, PREG_SET_ORDER);


            foreach ($matches_total as $match) {
                $splittedinput = explode(":", $match[1]);

                $text = str_replace($match[0], sprintf("<span class='gxl_total_preview' data-id='%d' ></span>", $splittedinput[1]), $text);
                $is_script_load = true;
            }


            return $text;
        }
    }

}

new Gravity_XL_Live_Html_Preview();