<?php
/**
 * Метабоксы для страницы вакансий
 *
 * @package Matreshka
 */

// ============================================================
// 1. Метабокс: все тексты страницы
// ============================================================
add_action( 'add_meta_boxes', function () {
    add_meta_box(
        'matreshka_vac_texts_metabox',
        '📝 Тексты страницы вакансий',
        'matreshka_vac_texts_render',
        'page',
        'normal',
        'high'
    );
});

function matreshka_vac_texts_render( $post ) {
    wp_nonce_field( 'matreshka_vac_nonce_action', 'matreshka_vac_nonce' );
    $get = function( $key, $default = '' ) use ( $post ) {
        $val = get_post_meta( $post->ID, $key, true );
        return ( $val !== '' && $val !== false ) ? $val : $default;
    };
    ?>
    <style>
        .mvac-section { margin-bottom: 20px; padding: 16px; background: #f9f9f9; border: 1px solid #ddd; border-radius: 8px; }
        .mvac-section h3 { margin: 0 0 12px 0; font-size: 15px; color: #1d2327; border-bottom: 1px solid #ddd; padding-bottom: 8px; }
        .mvac-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
        .mvac-field { margin-bottom: 8px; }
        .mvac-field label { display: block; font-weight: 600; margin-bottom: 4px; font-size: 12px; color: #555; }
        .mvac-field input, .mvac-field textarea { width: 100%; }
    </style>

    <!-- Hero -->
    <div class="mvac-section">
        <h3>🎯 Секция Hero</h3>
        <div class="mvac-grid">
            <div class="mvac-field">
                <label>Заголовок</label>
                <input type="text" name="_vac_hero_title" value="<?php echo esc_attr( $get('_vac_hero_title', 'Работа, которая вас понимает') ); ?>" class="widefat">
            </div>
            <div class="mvac-field">
                <label>Подзаголовок</label>
                <textarea name="_vac_hero_subtitle" rows="2" class="widefat"><?php echo esc_textarea( $get('_vac_hero_subtitle', 'Присоединяйтесь к команде супермаркетов «Матрёшка» — мы ценим каждого сотрудника и создаём комфортные условия для работы и роста.') ); ?></textarea>
            </div>
        </div>
    </div>

    <!-- Why us -->
    <div class="mvac-section">
        <h3>⭐ Почему выбирают нас</h3>
        <div class="mvac-field">
            <label>Заголовок секции</label>
            <input type="text" name="_vac_why_title" value="<?php echo esc_attr( $get('_vac_why_title', 'Почему люди выбирают нас') ); ?>" class="widefat">
        </div>
        <?php
        $why_defaults = [
            ['Ценим', 'Здесь в центре внимания люди и их потребности. Мы доверяем друг другу, уважаем каждого и создаём тёплую атмосферу.'],
            ['Развиваем', 'Обучение с первого дня, наставничество и реальные карьерные перспективы. Многие руководители начинали с линейных позиций.'],
            ['Выручаем', 'Гибкий график, стабильная зарплата, скидки на продукцию, премии и бонусы — всё для комфортной работы.'],
            ['Поддерживаем', 'Официальное трудоустройство, полный соцпакет, отпускные — уверенность в завтрашнем дне.'],
        ];
        for ( $i = 1; $i <= 4; $i++ ) : $d = $why_defaults[$i-1]; ?>
            <div class="mvac-grid" style="margin-bottom: 6px;">
                <div class="mvac-field">
                    <label>Карточка <?php echo $i; ?> — Заголовок</label>
                    <input type="text" name="_vac_why_<?php echo $i; ?>_title" value="<?php echo esc_attr( $get("_vac_why_{$i}_title", $d[0]) ); ?>" class="widefat">
                </div>
                <div class="mvac-field">
                    <label>Карточка <?php echo $i; ?> — Текст</label>
                    <textarea name="_vac_why_<?php echo $i; ?>_text" rows="2" class="widefat"><?php echo esc_textarea( $get("_vac_why_{$i}_text", $d[1]) ); ?></textarea>
                </div>
            </div>
        <?php endfor; ?>
    </div>

    <!-- Stats -->
    <div class="mvac-section">
        <h3>📊 Статистика</h3>
        <div class="mvac-grid">
            <?php
            $stat_defaults = [
                ['500+', 'сотрудников в нашей команде'],
                ['10+', 'магазинов в сети'],
                ['1000+', 'довольных покупателей каждый день'],
            ];
            for ( $i = 1; $i <= 3; $i++ ) : $d = $stat_defaults[$i-1]; ?>
                <div class="mvac-field">
                    <label>Число <?php echo $i; ?></label>
                    <input type="text" name="_vac_stat_<?php echo $i; ?>_num" value="<?php echo esc_attr( $get("_vac_stat_{$i}_num", $d[0]) ); ?>" class="widefat">
                </div>
                <div class="mvac-field">
                    <label>Подпись <?php echo $i; ?></label>
                    <input type="text" name="_vac_stat_<?php echo $i; ?>_text" value="<?php echo esc_attr( $get("_vac_stat_{$i}_text", $d[1]) ); ?>" class="widefat">
                </div>
            <?php endfor; ?>
        </div>
    </div>

    <!-- Offer -->
    <div class="mvac-section">
        <h3>🎁 Что мы предлагаем</h3>
        <div class="mvac-field">
            <label>Заголовок секции</label>
            <input type="text" name="_vac_offer_title" value="<?php echo esc_attr( $get('_vac_offer_title', 'Что мы предлагаем') ); ?>" class="widefat">
        </div>
        <div class="mvac-grid">
            <?php
            $offer_defaults = [
                'Официальное оформление с первого дня',
                'Стабильная заработная плата без задержек',
                'Скидка для сотрудников на весь ассортимент',
                'Удобный график работы — подберём под вас',
                'Дружный коллектив и наставничество',
                'Карьерный рост и внутреннее обучение',
            ];
            for ( $i = 1; $i <= 6; $i++ ) : ?>
                <div class="mvac-field">
                    <label>Пункт <?php echo $i; ?></label>
                    <input type="text" name="_vac_offer_<?php echo $i; ?>" value="<?php echo esc_attr( $get("_vac_offer_{$i}", $offer_defaults[$i-1]) ); ?>" class="widefat">
                </div>
            <?php endfor; ?>
        </div>
    </div>

    <!-- Culture -->
    <div class="mvac-section">
        <h3>💛 Атмосфера и ценности</h3>
        <div class="mvac-field">
            <label>Заголовок секции</label>
            <input type="text" name="_vac_culture_title" value="<?php echo esc_attr( $get('_vac_culture_title', 'Наша атмосфера и ценности') ); ?>" class="widefat">
        </div>
        <?php
        $culture_defaults = [
            ['Живём общими ценностями', 'Клиент — партнёрство — качество — результат'],
            ['Говорим спасибо', 'Это не сложно, но важно — благодарность объединяет команду'],
            ['Совершенствуем мастерство', 'Вместе достигаем большего и растём профессионально'],
            ['Заботимся о людях', 'Покупатели, партнёры, сотрудники — в центре всего, что мы делаем'],
        ];
        for ( $i = 1; $i <= 4; $i++ ) : $d = $culture_defaults[$i-1]; ?>
            <div class="mvac-grid" style="margin-bottom: 6px;">
                <div class="mvac-field">
                    <label>Карточка <?php echo $i; ?> — Заголовок</label>
                    <input type="text" name="_vac_culture_<?php echo $i; ?>_title" value="<?php echo esc_attr( $get("_vac_culture_{$i}_title", $d[0]) ); ?>" class="widefat">
                </div>
                <div class="mvac-field">
                    <label>Карточка <?php echo $i; ?> — Текст</label>
                    <input type="text" name="_vac_culture_<?php echo $i; ?>_text" value="<?php echo esc_attr( $get("_vac_culture_{$i}_text", $d[1]) ); ?>" class="widefat">
                </div>
            </div>
        <?php endfor; ?>
    </div>

    <!-- CTA -->
    <div class="mvac-section">
        <h3>📢 Призыв к действию (CTA)</h3>
        <div class="mvac-grid">
            <div class="mvac-field">
                <label>Заголовок</label>
                <input type="text" name="_vac_cta_title" value="<?php echo esc_attr( $get('_vac_cta_title', 'Присоединяйтесь к нашей команде!') ); ?>" class="widefat">
            </div>
            <div class="mvac-field">
                <label>Текст</label>
                <textarea name="_vac_cta_text" rows="2" class="widefat"><?php echo esc_textarea( $get('_vac_cta_text', 'Приходите в ближайший магазин Матрёшка и узнайте об открытых вакансиях у администратора. Мы будем рады видеть вас в нашей команде!') ); ?></textarea>
            </div>
        </div>
    </div>

    <script>
    jQuery(function($) {
        function toggleVacMetaboxes() {
            var sel = $('#page_template').val() || $('select[name="page_template"]').val() || '';
            var show = sel === 'page-vacancies.php';
            $('#matreshka_vac_texts_metabox, #matreshka_vac_images_metabox').toggle(show);
        }
        toggleVacMetaboxes();
        $(document).on('change', '#page_template, select[name="page_template"]', toggleVacMetaboxes);
    });
    </script>
    <?php
}

// ============================================================
// 2. Метабокс: картинки вакансий
// ============================================================
add_action( 'add_meta_boxes', function () {
    add_meta_box(
        'matreshka_vac_images_metabox',
        '🖼️ Картинки вакансий',
        'matreshka_vac_images_render',
        'page',
        'normal',
        'high'
    );
});

function matreshka_vac_images_render( $post ) {
    $images = get_post_meta( $post->ID, '_vac_images', true );
    if ( ! is_array( $images ) ) {
        $images = [];
    }
    ?>
    <p class="description" style="margin-bottom: 12px;">
        Загрузите картинки вакансий. Они будут отображаться красивой сеткой на странице. Рекомендуемый размер: 800×600 или больше.
    </p>

    <div id="mvac-images-preview" style="display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 12px;">
        <?php foreach ( $images as $att_id ) :
            $url = wp_get_attachment_image_url( $att_id, 'medium' );
            if ( ! $url ) continue;
        ?>
            <div class="mvac-img-thumb" data-id="<?php echo esc_attr( $att_id ); ?>" style="position:relative; width:160px; height:120px; border-radius:10px; overflow:hidden; border:1px solid #ddd;">
                <img src="<?php echo esc_url( $url ); ?>" style="width:100%;height:100%;object-fit:cover;">
                <button type="button" class="mvac-img-remove" style="position:absolute;top:4px;right:4px;background:#dc3232;color:#fff;border:none;border-radius:50%;width:22px;height:22px;cursor:pointer;font-size:14px;line-height:1;">&times;</button>
            </div>
        <?php endforeach; ?>
    </div>

    <input type="hidden" id="mvac-images-input" name="_vac_images" value="<?php echo esc_attr( implode( ',', $images ) ); ?>">

    <button type="button" class="button button-primary" id="mvac-add-images">+ Добавить картинки</button>

    <script>
    jQuery(function($) {
        var frame;
        function refreshInput() {
            var ids = [];
            $('#mvac-images-preview .mvac-img-thumb').each(function() { ids.push($(this).data('id')); });
            $('#mvac-images-input').val(ids.join(','));
        }

        $('#mvac-add-images').on('click', function(e) {
            e.preventDefault();
            if (frame) { frame.open(); return; }
            frame = wp.media({
                title: 'Выберите картинки вакансий',
                button: { text: 'Добавить' },
                multiple: true,
                library: { type: 'image' }
            });
            frame.on('select', function() {
                frame.state().get('selection').each(function(att) {
                    var id = att.id;
                    var url = att.attributes.sizes && att.attributes.sizes.medium
                        ? att.attributes.sizes.medium.url
                        : att.attributes.url;
                    var html = '<div class="mvac-img-thumb" data-id="'+id+'" style="position:relative;width:160px;height:120px;border-radius:10px;overflow:hidden;border:1px solid #ddd;">'
                        + '<img src="'+url+'" style="width:100%;height:100%;object-fit:cover;">'
                        + '<button type="button" class="mvac-img-remove" style="position:absolute;top:4px;right:4px;background:#dc3232;color:#fff;border:none;border-radius:50%;width:22px;height:22px;cursor:pointer;font-size:14px;line-height:1;">&times;</button>'
                        + '</div>';
                    $('#mvac-images-preview').append(html);
                });
                refreshInput();
            });
            frame.open();
        });

        $(document).on('click', '.mvac-img-remove', function() {
            $(this).closest('.mvac-img-thumb').remove();
            refreshInput();
        });

        // Drag & drop sort
        if ($.fn.sortable) {
            $('#mvac-images-preview').sortable({ tolerance: 'pointer', update: function() { refreshInput(); } });
        }
    });
    </script>
    <?php
}

// ============================================================
// 3. Сохранение всех мета-данных
// ============================================================
add_action( 'save_post', function ( $post_id ) {
    if ( ! isset( $_POST['matreshka_vac_nonce'] ) ) return;
    if ( ! wp_verify_nonce( $_POST['matreshka_vac_nonce'], 'matreshka_vac_nonce_action' ) ) return;
    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return;
    if ( ! current_user_can( 'edit_post', $post_id ) ) return;

    // Text fields
    $text_fields = [
        '_vac_hero_title', '_vac_hero_subtitle',
        '_vac_why_title',
        '_vac_why_1_title', '_vac_why_1_text',
        '_vac_why_2_title', '_vac_why_2_text',
        '_vac_why_3_title', '_vac_why_3_text',
        '_vac_why_4_title', '_vac_why_4_text',
        '_vac_stat_1_num', '_vac_stat_1_text',
        '_vac_stat_2_num', '_vac_stat_2_text',
        '_vac_stat_3_num', '_vac_stat_3_text',
        '_vac_offer_title',
        '_vac_offer_1', '_vac_offer_2', '_vac_offer_3',
        '_vac_offer_4', '_vac_offer_5', '_vac_offer_6',
        '_vac_culture_title',
        '_vac_culture_1_title', '_vac_culture_1_text',
        '_vac_culture_2_title', '_vac_culture_2_text',
        '_vac_culture_3_title', '_vac_culture_3_text',
        '_vac_culture_4_title', '_vac_culture_4_text',
        '_vac_cta_title', '_vac_cta_text',
    ];

    foreach ( $text_fields as $key ) {
        if ( isset( $_POST[ $key ] ) ) {
            update_post_meta( $post_id, $key, sanitize_text_field( $_POST[ $key ] ) );
        }
    }

    // Textarea fields (allow newlines)
    $textarea_fields = [ '_vac_hero_subtitle', '_vac_cta_text' ];
    foreach ( $textarea_fields as $key ) {
        if ( isset( $_POST[ $key ] ) ) {
            update_post_meta( $post_id, $key, sanitize_textarea_field( $_POST[ $key ] ) );
        }
    }

    // Images (comma-separated IDs)
    if ( isset( $_POST['_vac_images'] ) ) {
        $raw = sanitize_text_field( $_POST['_vac_images'] );
        $ids = array_filter( array_map( 'absint', explode( ',', $raw ) ) );
        update_post_meta( $post_id, '_vac_images', $ids );
    }
});