<?php
if ( ! defined( 'ABSPATH' ) ) exit;


/**
 * FLINK_Elementor_Meta_Box
 *
 * Adds a small meta box to the post/page editor that lets the user
 * preview (dry-run) and apply internal linking on Elementor-built pages,
 * directly from the editor — no external diagnostic script required.
 *
 *  - Elementor support is part of the linking engine, which ships in both
 *    Free and Paid. This UI must be available wherever that engine runs.
 *
 * Design choices:
 *  - The box only appears when the current post is actually built with
 *    Elementor (post_uses_elementor). Classic posts already link on save
 *    and don't need a manual trigger here.
 *  - It calls the existing AJAX handler `flink_elementor_preview`
 *    (FLINK_Ajax::elementor_preview), which does the dry-run by default
 *    and only writes when explicitly told to apply. No new server logic.
 *  - Dry-run IGNORES the origen filter on purpose (so the user can always
 *    preview), but APPLY respects it — exactly mirroring the handler. We
 *    surface that distinction in the UI copy so the result isn't confusing
 *    when a page can't actually be linked from under current settings.
 *  - Pure DOM JS, no jQuery. CSS + JS inlined: the box is tiny and keeping
 *    it self-contained avoids adding stray asset files to the build.
 *  - Namespaced `flink-elem-*` to avoid collisions.
 *
 * @since v4.6.65
 */
class FLINK_Elementor_Meta_Box {

    /**
     * Boot: register the meta box. Idempotent.
     */
    public function init() {
        add_action( 'add_meta_boxes', array( $this, 'register' ), 10, 2 );
    }

    /**
     * Register the box for post/page types — only when the post is built
     * with Elementor. Other post types and classic posts are skipped.
     *
     * @param string       $post_type Current post type.
     * @param WP_Post|null $post      Current post object (passed by the action).
     */
    public function register( $post_type, $post = null ) {
        $supported = (array) apply_filters( 'flink_elementor_box_post_types', array( 'post', 'page' ) );
        if ( ! in_array( $post_type, $supported, true ) ) {
            return;
        }

        if ( ! $post ) {
            global $post;
        }
        if ( ! $post || empty( $post->ID ) ) {
            return;
        }

        // Only Elementor-built posts. We check the same flag the engine
        // uses (_elementor_edit_mode === 'builder') via the linker helper
        // when available, with a direct meta fallback.
        $is_elementor = ( get_post_meta( $post->ID, '_elementor_edit_mode', true ) === 'builder' );
        if ( ! $is_elementor ) {
            return;
        }

        add_meta_box(
            'flink_elementor_panel',
            __( 'Internal linking (Elementor)', '4linking-free' ),
            array( $this, 'render' ),
            $post_type,
            'side',
            'default',
            array(
                '__back_compat_meta_box'             => false,
                '__block_editor_compatible_meta_box' => true,
            )
        );
    }

    /**
     * Render the box: an intro line, two buttons (preview / apply), and an
     * empty results area the JS fills in. The nonce is embedded for the
     * AJAX call (same nonce action the rest of the admin uses).
     *
     * @param WP_Post $post The current post.
     */
    public function render( $post ) {
        $post_id  = (int) $post->ID;
        $nonce    = wp_create_nonce( 'flink_nonce' );
        $ajax_url = admin_url( 'admin-ajax.php' );

        // Inform the user whether APPLY will actually link from this page
        // under current settings. Dry-run always previews, but apply obeys
        // the origen-type filter. This avoids the "preview shows links but
        // apply does nothing" confusion documented in the Elementor brief.
        $origen_tipo = get_option( 'flink_origen_tipo', 'post' );
        $can_apply   = ( $origen_tipo === 'any' );
        if ( ! $can_apply ) {
            $tipos     = array_map( 'trim', explode( ',', (string) $origen_tipo ) );
            $can_apply = in_array( get_post_type( $post_id ), $tipos, true );
        }
        ?>
        <div class="flink-elem-box"
             data-postid="<?php echo esc_attr( $post_id ); ?>"
             data-nonce="<?php echo esc_attr( $nonce ); ?>"
             data-ajaxurl="<?php echo esc_url( $ajax_url ); ?>">

            <p class="flink-elem-intro">
                <?php esc_html_e( 'Preview which internal links would be inserted into the text and HTML widgets of this page, without saving anything. Then you can apply them.', '4linking-free' ); ?>
            </p>

            <?php if ( ! $can_apply ) : ?>
                <p class="flink-elem-warn">
                    <?php
                    printf(
                        /* translators: %s: post type slug */
                        esc_html__( 'Notice: with the current source-type settings, this page (%s) is not linked when applying. The preview works anyway. To link from this type, add it in Settings → General → source types.', '4linking-free' ),
                        esc_html( get_post_type( $post_id ) )
                    );
                    ?>
                </p>
            <?php endif; ?>

            <div class="flink-elem-actions">
                <button type="button" class="button button-secondary flink-elem-preview">
                    <?php esc_html_e( 'Preview', '4linking-free' ); ?>
                </button>
                <button type="button" class="button button-primary flink-elem-apply" disabled>
                    <?php esc_html_e( 'Apply now', '4linking-free' ); ?>
                </button>
            </div>

            <div class="flink-elem-status" aria-live="polite"></div>
            <div class="flink-elem-results"></div>
        </div>

        <style>
            .flink-elem-box .flink-elem-intro { margin: 0 0 10px; color: #50575e; font-size: 12px; }
            .flink-elem-box .flink-elem-warn {
                margin: 0 0 10px; padding: 8px 10px; font-size: 12px;
                background: #fcf3d6; border-left: 3px solid #dba617; color: #674e00;
            }
            .flink-elem-box .flink-elem-actions { display: flex; gap: 8px; margin-bottom: 10px; }
            .flink-elem-box .flink-elem-status { font-size: 12px; color: #50575e; min-height: 16px; }
            .flink-elem-box .flink-elem-status.is-error { color: #b32d2e; }
            .flink-elem-box .flink-elem-status.is-ok { color: #1a7f37; }
            .flink-elem-box .flink-elem-results { margin-top: 8px; }
            .flink-elem-box .flink-elem-results table { width: 100%; border-collapse: collapse; font-size: 11px; }
            .flink-elem-box .flink-elem-results th,
            .flink-elem-box .flink-elem-results td {
                text-align: left; padding: 4px 6px; border-bottom: 1px solid #e0e0e0; vertical-align: top;
            }
            .flink-elem-box .flink-elem-results th { color: #646970; font-weight: 600; }
            .flink-elem-box .flink-elem-count { font-weight: 600; }
            .flink-elem-box .button.is-busy { opacity: .6; pointer-events: none; }
        </style>

        <script>
        (function () {
            var box = document.getElementById('flink_elementor_panel');
            if (!box) return;
            var root = box.querySelector('.flink-elem-box');
            if (!root || root.__flinkInited) return;
            root.__flinkInited = true;

            var postId  = root.getAttribute('data-postid');
            var nonce   = root.getAttribute('data-nonce');
            var ajaxUrl = root.getAttribute('data-ajaxurl');

            var btnPreview = root.querySelector('.flink-elem-preview');
            var btnApply   = root.querySelector('.flink-elem-apply');
            var statusEl   = root.querySelector('.flink-elem-status');
            var resultsEl  = root.querySelector('.flink-elem-results');

            function setStatus(msg, kind) {
                statusEl.textContent = msg || '';
                statusEl.className = 'flink-elem-status' + (kind ? ' is-' + kind : '');
            }
            function busy(on) {
                [btnPreview, btnApply].forEach(function (b) {
                    if (on) b.classList.add('is-busy'); else b.classList.remove('is-busy');
                });
            }
            function escapeHtml(s) {
                return String(s).replace(/[&<>"']/g, function (c) {
                    return ({ '&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;' })[c];
                });
            }

            function request(apply) {
                busy(true);
                setStatus(apply ? 'Aplicando…' : 'Previsualizando…');
                var body = new URLSearchParams();
                body.append('action', 'flink_elementor_preview');
                body.append('nonce', nonce);
                body.append('post_id', postId);
                body.append('apply', apply ? '1' : '0');

                fetch(ajaxUrl, {
                    method: 'POST',
                    credentials: 'same-origin',
                    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                    body: body.toString()
                })
                .then(function (r) { return r.json(); })
                .then(function (res) {
                    busy(false);
                    if (!res || !res.success) {
                        setStatus((res && res.data) ? res.data : 'Error inesperado.', 'error');
                        return;
                    }
                    var d = res.data;
                    render(d, apply);
                })
                .catch(function () {
                    busy(false);
                    setStatus('Error de red.', 'error');
                });
            }

            function render(d, applied) {
                var n = parseInt(d.inserted, 10) || 0;
                var w = parseInt(d.widgets, 10) || 0;

                if (applied) {
                    if (d.saved) {
                        setStatus(
                            '<?php /* translators: 1: number of links, 2: number of widgets */ echo esc_js( __( '%1$d link(s) applied in %2$d widget(s).', '4linking-free' ) ); ?>'
                                .replace('%1$d', n).replace('%2$d', w),
                            'ok'
                        );
                    } else {
                        setStatus('<?php echo esc_js( __( 'Nothing was applied (source setting or exclusion).', '4linking-free' ) ); ?>', 'error');
                    }
                    btnApply.disabled = true;
                } else {
                    if (n > 0) {
                        setStatus(
                            '<?php /* translators: 1: number of links, 2: number of widgets */ echo esc_js( __( 'Preview: %1$d link(s) would be inserted into %2$d widget(s).', '4linking-free' ) ); ?>'
                                .replace('%1$d', n).replace('%2$d', w),
                            'ok'
                        );
                        btnApply.disabled = false;
                    } else {
                        setStatus('<?php echo esc_js( __( 'Preview: no link would be inserted.', '4linking-free' ) ); ?>', null);
                        btnApply.disabled = true;
                    }
                }

                // Build the per-widget table from the (already escaped) rows.
                var rows = Array.isArray(d.rows) ? d.rows : [];
                if (!rows.length) { resultsEl.innerHTML = ''; return; }
                var html = '<table><thead><tr>'
                    + '<th><?php echo esc_js( __( 'Widget', '4linking-free' ) ); ?></th><th><?php echo esc_js( __( 'Type', '4linking-free' ) ); ?></th><th><?php echo esc_js( __( 'Links', '4linking-free' ) ); ?></th>'
                    + '</tr></thead><tbody>';
                rows.forEach(function (row) {
                    html += '<tr>'
                        + '<td>' + escapeHtml(row.widget_id || '') + '</td>'
                        + '<td>' + escapeHtml(row.type || '') + '</td>'
                        + '<td class="flink-elem-count">' + (parseInt(row.inserted, 10) || 0) + '</td>'
                        + '</tr>';
                });
                html += '</tbody></table>';
                resultsEl.innerHTML = html;
            }

            btnPreview.addEventListener('click', function () { request(false); });
            btnApply.addEventListener('click', function () {
                if (!window.confirm('<?php echo esc_js( __( 'Apply internal links to this page? The Elementor content will be saved.', '4linking-free' ) ); ?>')) return;
                request(true);
            });
        })();
        </script>
        <?php
    }
}