Crocoblock / suggestions

The suggestions for CrocoBlock project
196 stars 79 forks source link

Enhance JetBooking Integration with 🟡Bricks Builder #7827

Open nreljed opened 1 month ago

nreljed commented 1 month ago

Summary

Enhance the compatibility between JetBooking and Bricks Builder to support dynamic pricing display, seamless integration of booking forms in pop-ups, and efficient data extraction for both regular and seasonal rates.

Background

While browsing Airbnb, I noticed how effective their display of dynamic information is, such as crossed-out prices and date details. As a user of Bricks Builder, I find that there is currently no straightforward way to display dynamic tags related to JetBooking. Although installing JetEngine and testing macros was considered, it proved unsuccessful. Therefore, the best option is to improve compatibility between JetBooking and Bricks Builder in future updates. in the meantime , we will work in this post to make this type of data available through shortcodes , as an experiment and tests using several AI ( gemini , claude and copilot) this is the opportunity for devs to read something different and understand how users and AI react with the plugin when options do not yet exist

/**
 * Smart Dynamic Pricing Display
 * Only shows crossed-out price when it represents a discount
 * Shortcodes: [show_dynamic_price], [show_sale_badge], [show_discount_message], [show_seasonal_dates]
 */
class Smart_Price_Display {
    public function __construct() {
        add_shortcode('show_dynamic_price', array($this, 'display_dynamic_price'));
        add_shortcode('show_sale_badge', array($this, 'show_sale_badge'));
        add_shortcode('show_discount_message', array($this, 'show_discount_message'));
        add_shortcode('show_seasonal_dates', array($this, 'show_seasonal_dates'));
    }

    public function display_dynamic_price() {
        $post_id = get_the_ID();
        $regular_price = get_post_meta($post_id, '_apartment_price', true);
        $seasonal_data = get_post_meta($post_id, 'jet_abaf_price', true);
        $seasonal_prices = !empty($seasonal_data) && isset($seasonal_data['_seasonal_prices']) ? $seasonal_data['_seasonal_prices'] : array();

        if (empty($regular_price)) {
            return '0';
        }

        $current_seasonal_price = $this->get_current_seasonal_price($seasonal_prices);

        if ($current_seasonal_price) {
            $regular_float = (float)$regular_price;
            $seasonal_float = (float)$current_seasonal_price;

            if ($regular_float > $seasonal_float) {
                return sprintf(
                    '<span style="text-decoration: line-through;">$%s</span> $%s/Night',
                    number_format($regular_float, 2, '.', ','),
                    number_format($seasonal_float, 2, '.', ',')
                );
            } else {
                return sprintf(
                    '$%s/night',
                    number_format($seasonal_float, 2, '.', ',')
                );
            }
        }

        return '$' . number_format((float)$regular_price, 2, '.', ',') . '/Night';
    }

    public function show_sale_badge() {
        $post_id = get_the_ID();
        $regular_price = get_post_meta($post_id, '_apartment_price', true);
        $seasonal_data = get_post_meta($post_id, 'jet_abaf_price', true);
        $seasonal_prices = !empty($seasonal_data) && isset($seasonal_data['_seasonal_prices']) ? $seasonal_data['_seasonal_prices'] : array();

        if (empty($regular_price)) {
            return '';
        }

        $current_seasonal_price = $this->get_current_seasonal_price($seasonal_prices);

        if ($current_seasonal_price) {
            $regular_float = (float)$regular_price;
            $seasonal_float = (float)$current_seasonal_price;

            if ($regular_float > $seasonal_float) {
                $discount_percentage = round((($regular_float - $seasonal_float) / $regular_float) * 100, 0);
                return '<span class="discount-badge">-' . $discount_percentage . '%</span>';
            }
        }

        return '';
    }

    public function show_discount_message() {
        $post_id = get_the_ID();
        $regular_price = get_post_meta($post_id, '_apartment_price', true);
        $seasonal_data = get_post_meta($post_id, 'jet_abaf_price', true);
        $seasonal_prices = !empty($seasonal_data) && isset($seasonal_data['_seasonal_prices']) ? $seasonal_data['_seasonal_prices'] : array();
        $current_seasonal_price = $this->get_current_seasonal_price($seasonal_prices);

        if ($current_seasonal_price && $regular_price > $current_seasonal_price) {
            $discount = $regular_price - $current_seasonal_price;
            foreach ($seasonal_prices as $season) {
                if ($season['price'] == $current_seasonal_price) {
                    $startDate = date('d/m/Y', $season['startTimestamp']);
                    $endDate = date('d/m/Y', $season['endTimestamp']);
                    return '<span style="display: flex; padding: 10px 20px; border: 1px solid #ddd; border-radius: 5px; font-size: 16px; align-content: flex-start; flex-direction: row; gap: 10px;">
                        <i style="font-size: 50px; color: var(--bricks-color-1aeaf4);" class="brxe-icon ti-alarm-clock"></i>
                        Save $' . number_format($discount, 2) . ' for stays between ' . $startDate . ' and ' . $endDate . '
                    </span>';
                }
            }
        }

        return '';
    }

    public function show_seasonal_dates() {
        $post_id = get_the_ID();
        $seasonal_data = get_post_meta($post_id, 'jet_abaf_price', true);
        $seasonal_prices = !empty($seasonal_data) && isset($seasonal_data['_seasonal_prices']) ? $seasonal_data['_seasonal_prices'] : array();

        $current_seasonal_price = $this->get_current_seasonal_price($seasonal_prices);

        if ($current_seasonal_price) {
            foreach ($seasonal_prices as $season) {
                if ($season['price'] == $current_seasonal_price) {
                    $startDate = date('d/m/Y', $season['startTimestamp']);
                    $endDate = date('d/m/Y', $season['endTimestamp']);
                    return '<span style="display: flex; align-items: center; gap: 10px;">
                        <i style="font-size: 20px; color: var(--bricks-color-1aeaf4);" class="brxe-icon ti-alarm-clock"></i>
                        Seasonal Offer: ' . $startDate . ' - ' . $endDate . '
                    </span>';
                }
            }
        }

        return '';
    }

    private function get_current_seasonal_price($seasonal_prices) {
        if (empty($seasonal_prices) || !is_array($seasonal_prices)) {
            return false;
        }

        $current_timestamp = current_time('timestamp');

        foreach ($seasonal_prices as $season) {
            if (isset($season['startTimestamp']) && isset($season['endTimestamp']) && isset($season['price'])) {
                if ($current_timestamp >= $season['startTimestamp'] && $current_timestamp <= $season['endTimestamp']) {
                    return $season['price'];
                }
            }
        }

        return false;
    }
}

// Initialize the class
new Smart_Price_Display();

Current Issues

Dynamic Pricing Display:

  1. There is no way to display dynamic tags concerning JetBooking.
  2. Proposed shortcodes: [show_dynamic_price], [show_sale_badge], [show_discount_message], [show_seasonal_dates].

Jetform/Booking in Popups:

  1. Jetform does not work inside popups (both shortcodes and widgets jetform are broken).
  2. Current workaround: using a simple button to post_url#booking, which works but is not ideal.

Data Extraction for Booking Rates:

  1. Successfully extracted regular booking rates but failed to extract seasonal rates.
  2. Need to find the missing values or identify what’s required to extract seasonal rates elegantly and conditionally.

Proposed Solutions

Dynamic Pricing Display:

Implement support for the proposed shortcodes to display various types of dynamic pricing information.

With these shortcodes, you can dynamically display a variety of information, including seasonal pricing and current dates. Refer to the screenshot for a detailed breakdown.

figure 1

Jetform/Booking in Popups:

Capture d'écran 2024-10-29 193535 Capture d'écran 2024-10-29 191323

for the moment my vision to make everything accessible and user-friendly from a popup is not possible because of these two problems for the moment I have inserted a simple button to post_url#booking we hope these details will be corrected or taken into account

popup bug jetform

Data Extraction jet_booking_display_rates_shortcode

function jet_booking_display_rates_shortcode() {
    $post_id = get_the_ID();
    $price_rates = new JET_ABAF\Advanced_Price_Rates($post_id);
    $rates = $price_rates->get_rates();
    $regular_price = get_post_meta($post_id, '_apartment_price', true);
    $seasonal_data = new JET_ABAF\Seasonal_Price(get_post_meta($post_id));
    $seasonal_rates = $seasonal_data->get_price();

    ob_start();

    // Debug information (can be removed in production)
    echo '<div class="debug-info" style="border: 1px solid red; padding: 10px; margin: 10px 0;">';
    echo '<h3>Debug Information</h3>';
    echo '<p><strong>Regular Price:</strong> $' . number_format($regular_price, 2) . '</p>';
    echo '<p><strong>Seasonal Rates:</strong><pre>' . print_r($seasonal_rates, true) . '</pre></p>';
    echo '</div>';

    // Seasonal Rates
    if (!empty($seasonal_rates)) {
        echo '<div class="jet-booking-seasonal-rates">';
        echo '<h3>Seasonal Booking Rates</h3>';
        echo '<ul>';
        foreach ($seasonal_rates as $season) {
            $price_difference = $regular_price - $season['price'];
            echo '<li>';
            echo '<strong>' . esc_html(date('d/m/Y', $season['start']) . ' - ' . date('d/m/Y', $season['end'])) . '</strong>: $' . number_format($season['price'], 2);
            if ($price_difference > 0) {
                echo ' ~ save $' . number_format($price_difference, 2);
            }
            echo '</li>';
        }
        echo '</ul>';
        echo '</div>';
    }

    // Regular Rates
    if (!empty($rates)) {
        echo '<div class="jet-booking-rates-list">';
        echo '<h3>Regular Booking Rates</h3>';
        echo '<ul>';
        foreach ($rates as $rate) {
            $price_difference = $regular_price - $rate['value'];
            echo '<li class="rate-item">';
            echo sprintf(
                '%d nights: $%s %s',
                $rate['duration'],
                number_format($rate['value'], 2),
                $price_difference > 0 ? '~ save $' . number_format($price_difference, 2) : ''
            );
            echo '</li>';
        }
        echo '</ul>';
        echo '</div>';
    } elseif (empty($seasonal_rates) && empty($rates)) {
        echo '<p>No rates available at this time.</p>';
    }

    return ob_get_clean();
}
add_shortcode('jet_booking_rates', 'jet_booking_display_rates_shortcode');

// Function to get seasonal rates (unchanged)
function get_seasonal_rates($post_id) {
    $post_meta = get_post_meta($post_id);
    $seasonal_data = new JET_ABAF\Seasonal_Price($post_meta);
    $seasonal_prices = $seasonal_data->get_price();

    return $seasonal_prices;
}

Purpose of jet_booking_display_rates_shortcode

The goal of this shortcode is to extract information on rate prices. As shown in the accompanying image, I successfully extracted the Regular Booking Rates, but the Seasonal Rates remain elusive. After extensive attempts, including using various AI models, the correct values for the seasonal rates are still unidentified.

figure 2

Current Status:

Successfully extracted Regular Booking Rates. Unable to extract Seasonal Rates despite thorough attempts. i Stopped the search for missing values temporarily.

Request for Assistance:

If any developer notices a missing value or understands what needs to be inserted, your insight would be greatly appreciated. I believe something crucial is missing, but its exact value remains unknown. pointing-leonardo-di-caprio

Usage Concerns: I will find it one way or another understanding how to use them in an elegant and conditional manner

If you find this work interesting and useful, your contribution would be greatly appreciated. This is my first booking project, and I've never worked with a booking plugin before. The first one that came to mind was JetBooking. However, as you've seen, it's not easy to work without dynamic tags and support with Bricks Builder. Enhancing compatibility will allow us to leverage the full power of conditions in Bricks and improve styling, eliminating the need for unattractive shortcodes.

Thank you for your support and contributions.

awebguy99 commented 4 weeks ago

+1 Bricks is getting massively popular (even more once v2 has been released).