puffinOffsetCalculator/wordpress-integration.php

<?php
/**
 * Plugin Name: Puffin Offset Calculator Widget
 * Description: Embeds the Puffin Offset Calculator into WordPress pages using shortcode
 * Version: 1.0.0
 * Author: Puffin Offset
 */

// Prevent direct access
if (!defined('ABSPATH')) exit;

class Puffin_Calculator_Widget {

    /**
     * Initialize the plugin
     */
    public function __construct() {
        // Register shortcode
        add_shortcode('puffin_calculator', array($this, 'render_calculator'));
        
        // Add widget to admin
        add_action('widgets_init', array($this, 'register_calculator_widget'));
        
        // Enqueue scripts
        add_action('wp_enqueue_scripts', array($this, 'enqueue_scripts'));
    }
    
    /**
     * Render the calculator via shortcode
     * 
     * @param array $atts Shortcode attributes
     * @return string HTML output
     */
    public function render_calculator($atts) {
        // Default attributes
        $attributes = shortcode_atts(array(
            'height' => '800px',
            'width' => '100%',
            'url' => 'http://localhost:8080', // Change to your actual Docker container URL in production
        ), $atts);
        
        // Generate iframe with responsive wrapper
        $output = '<div class="puffin-calculator-wrapper" style="position: relative; overflow: hidden; width: ' . esc_attr($attributes['width']) . ';">';
        $output .= '<iframe 
            src="' . esc_url($attributes['url']) . '" 
            width="100%" 
            height="' . esc_attr($attributes['height']) . '" 
            frameborder="0" 
            style="border: none; overflow: hidden;" 
            scrolling="no"
            title="Puffin Offset Calculator"
            class="puffin-calculator-iframe"
            allow="clipboard-read; clipboard-write"
            loading="lazy"
        ></iframe>';
        $output .= '</div>';
        
        return $output;
    }
    
    /**
     * Register the widget
     */
    public function register_calculator_widget() {
        register_widget('Puffin_Calculator_Widget_Class');
    }
    
    /**
     * Enqueue needed scripts and styles
     */
    public function enqueue_scripts() {
        // Enqueue custom styles if needed
        wp_enqueue_style(
            'puffin-calculator-styles',
            plugin_dir_url(__FILE__) . 'css/puffin-calculator.css',
            array(),
            '1.0.0'
        );
        
        // Optional: Enqueue scripts for enhanced interaction between WordPress and iframe
        wp_enqueue_script(
            'puffin-calculator-scripts',
            plugin_dir_url(__FILE__) . 'js/puffin-calculator.js',
            array('jquery'),
            '1.0.0',
            true
        );
    }
}

/**
 * Widget class for the calculator
 */
class Puffin_Calculator_Widget_Class extends WP_Widget {
    
    /**
     * Initialize the widget
     */
    public function __construct() {
        parent::__construct(
            'puffin_calculator_widget',
            'Puffin Offset Calculator',
            array('description' => 'Adds the Puffin Offset Calculator to a widget area')
        );
    }
    
    /**
     * Front-end display of the widget
     */
    public function widget($args, $instance) {
        echo $args['before_widget'];
        
        if (!empty($instance['title'])) {
            echo $args['before_title'] . apply_filters('widget_title', $instance['title']) . $args['after_title'];
        }
        
        echo do_shortcode('[puffin_calculator height="' . esc_attr($instance['height'] ?? '800px') . '" url="' . esc_url($instance['url'] ?? 'http://localhost:8080') . '"]');
        
        echo $args['after_widget'];
    }
    
    /**
     * Back-end widget form
     */
    public function form($instance) {
        $title = isset($instance['title']) ? $instance['title'] : 'Carbon Offset Calculator';
        $height = isset($instance['height']) ? $instance['height'] : '800px';
        $url = isset($instance['url']) ? $instance['url'] : 'http://localhost:8080';
        ?>
        <p>
            <label for="<?php echo $this->get_field_id('title'); ?>">Title:</label>
            <input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>">
        </p>
        <p>
            <label for="<?php echo $this->get_field_id('height'); ?>">Height:</label>
            <input class="widefat" id="<?php echo $this->get_field_id('height'); ?>" name="<?php echo $this->get_field_name('height'); ?>" type="text" value="<?php echo esc_attr($height); ?>">
        </p>
        <p>
            <label for="<?php echo $this->get_field_id('url'); ?>">Calculator URL:</label>
            <input class="widefat" id="<?php echo $this->get_field_id('url'); ?>" name="<?php echo $this->get_field_name('url'); ?>" type="text" value="<?php echo esc_url($url); ?>">
        </p>
        <?php
    }
    
    /**
     * Sanitize widget form values as they are saved
     */
    public function update($new_instance, $old_instance) {
        $instance = array();
        $instance['title'] = (!empty($new_instance['title'])) ? sanitize_text_field($new_instance['title']) : '';
        $instance['height'] = (!empty($new_instance['height'])) ? sanitize_text_field($new_instance['height']) : '800px';
        $instance['url'] = (!empty($new_instance['url'])) ? esc_url_raw($new_instance['url']) : 'http://localhost:8080';
        
        return $instance;
    }
}

// Initialize the plugin
new Puffin_Calculator_Widget();