<?php

class RmPictureElement extends OxyEl {

    function init() {
        // مكان للتهيئة الأولية إذا لزم الأمر
    }

    function afterInit() {
        // بعد التهيئة، مثل إزالة أزرار أو غيرها إذا أردت
    }

    function name() {
        return 'RM Picture';
    }
    
    function slug() {
        return "rm-picture-element";
    }

    function icon() {
        return CT_FW_URI . '/toolbar/UI/oxygen-icons/add-icons/image.svg';
    }

    function button_place() {
        return "other";
    }

    function button_priority() {
        return '';
    }

    function render($options, $defaults, $content) {
        $image_small    = isset($options['image_small']) ? rm_oxy_fetchDynamicData($options['image_small']) : "";
        $image_medium   = isset($options['image_medium']) ? rm_oxy_fetchDynamicData($options['image_medium']) : "";
        $image_default  = isset($options['image_default']) ? rm_oxy_fetchDynamicData($options['image_default']) : "";
        $image_alt      = (isset($options['image_alt']) && $options['image_alt']) ? rm_oxy_fetchDynamicData($options['image_alt']) : rm_oxy_fetchDynamicData("[oxygen data='title']");
        
        $image_alt = ($image_alt) ?: get_the_title();

        $get_image_src = function($img,$size='full') {
            if (is_numeric($img) && intval($img) > 0) {
                $src = wp_get_attachment_image_src(intval($img), $size);
                return $src ? $src[0] : '';
            }
            return $img;
        };

        $image_small = $get_image_src($image_small, 'medium_large');

        if (empty($image_medium) && !empty($image_default)) {
            $image_medium = $image_default;
        }
        
        if ($image_medium) {
            $image_medium = $get_image_src($image_medium, 'medium_large');
        }

        if ($image_default) {
            $image_default = $get_image_src($image_default, 'full');
        }
        else {
            $image_default = $image_medium ?: $image_small ?: '';
        }

        ?>
        <picture class="rm-picture-element">
            <?php if ($image_small) : ?>
                <source media="(max-width:465px)" srcset="<?php echo esc_url($image_small); ?>">
            <?php endif; ?>
            <?php if ($image_medium) : ?>
                <source media="(max-width:769px)" srcset="<?php echo esc_url($image_medium); ?>">
            <?php endif; ?>
            <img src="<?php echo esc_url($image_default); ?>" alt="<?php echo esc_attr($image_alt); ?>" style="width:100%;">
        </picture>
        <?php
    }

    function controls() {

        $this->addOptionControl(
            array(
                "type" => 'textfield',
                "name" => __('Small image'),
                "slug" => 'image_small',
                "default" => '',
                'shortcode' => true,
            )
        )->rebuildElementOnChange()
        ->setParam('dynamicdatacode', rm_file_with_data("ISTImageSmall", "image", "oxy-rm-picture-element_image_small"));

        $this->addOptionControl(
            array(
                "type" => 'textfield',
                "name" => __('Medium image'),
                "slug" => 'image_medium',
                "default" => '',
                'shortcode' => true,
            )
        )->rebuildElementOnChange()
        ->setParam('dynamicdatacode', rm_file_with_data("ISTImageMedium", "image", "oxy-rm-picture-element_image_medium"));

        $this->addOptionControl(
            array(
                "type" => 'textfield',
                "name" => __('Default image'),
                "slug" => 'image_default',
                "default" => '',
                'shortcode' => true,
            )
        )->rebuildElementOnChange()
        ->setParam('dynamicdatacode', rm_file_with_data("ISTImageDefault", "image", "oxy-rm-picture-element_image_default"));

        $this->addOptionControl(
            array(
                "type" => 'textfield',
                "name" => __('Alt'),
                "slug" => 'image_alt',
                "default" => '',
                'shortcode' => true,
            )
        )->rebuildElementOnChange()
        ->setParam('dynamicdatacode', rm_file_with_data("ISTImageAlt", "content", ""));

    }

    function defaultCSS() {
        // يمكن إضافة css هنا أو ربط ملف css خارجي
        // return file_get_contents(__DIR__ . '/' . basename(__FILE__, '.php') . '.css');
    }
}

add_filter("oxy_base64_encode_options", function($items) { 
    $items = array_merge($items, array('oxy-counter_start2', 'oxy-counter_end', 'oxy-ou_video_image')); 
    return $items;
});

new RmPictureElement();
