<?php
/**
 * Frontend gallery template
 */

if (!defined('ABSPATH')) {
    exit;
}

$gallery_classes = array('bwg-gallery');
$gallery_classes[] = 'bwg-columns-' . $columns;
if ($lightbox) {
    $gallery_classes[] = 'bwg-lightbox-enabled';
}
if ($enable_tabs && count($tabs) > 1) {
    $gallery_classes[] = 'bwg-has-tabs';
}

$gallery_id_attr = 'bwg-gallery-' . $gallery_id;
?>

<div id="<?php echo esc_attr($gallery_id_attr); ?>" class="<?php echo esc_attr(implode(' ', $gallery_classes)); ?>" 
     data-gallery-id="<?php echo esc_attr($gallery_id); ?>"
     style="--bwg-gap: <?php echo esc_attr($gap); ?>px;">
    
    <?php if ($enable_tabs && count($tabs) > 1) : ?>
        <div class="bwg-tabs-nav">
            <?php 
            $first_tab = true;
            foreach ($tabs as $tab_name => $tab_images) : 
                $tab_slug = sanitize_title($tab_name);
            ?>
                <button class="bwg-tab-button <?php echo $first_tab ? 'active' : ''; ?>" 
                        data-tab="<?php echo esc_attr($tab_slug); ?>">
                    <?php echo esc_html($tab_name); ?>
                </button>
            <?php 
                $first_tab = false;
            endforeach; 
            ?>
        </div>
    <?php endif; ?>
    
    <div class="bwg-gallery-container">
        <?php 
        $first_tab = true;
        foreach ($tabs as $tab_name => $tab_images) : 
            $tab_slug = sanitize_title($tab_name);
        ?>
            <div class="bwg-tab-content <?php echo $first_tab ? 'active' : ''; ?>" 
                 data-tab="<?php echo esc_attr($tab_slug); ?>">
                <div class="bwg-images-grid">
                    <?php foreach ($tab_images as $image) : 
                        $image_id = $image['image_id'];
                        $thumbnail = wp_get_attachment_image_src($image_id, $global_settings['thumbnail_size']);
                        $full_image = wp_get_attachment_image_src($image_id, 'full');
                        $alt_text = get_post_meta($image_id, '_wp_attachment_image_alt', true);
                        $caption = !empty($image['caption']) ? $image['caption'] : $image['post_excerpt'];
                        
                        if (!$thumbnail) continue;
                    ?>
                        <div class="bwg-gallery-item">
                            <a href="<?php echo esc_url($full_image[0]); ?>" 
                               class="bwg-gallery-link"
                               data-caption="<?php echo esc_attr($caption); ?>"
                               data-gallery="<?php echo esc_attr($gallery_id_attr); ?>">
                                <img src="<?php echo esc_url($thumbnail[0]); ?>" 
                                     alt="<?php echo esc_attr($alt_text); ?>"
                                     loading="lazy">
                                <?php if ($atts['show_captions'] && $caption) : ?>
                                    <div class="bwg-caption"><?php echo esc_html($caption); ?></div>
                                <?php endif; ?>
                            </a>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        <?php 
            $first_tab = false;
        endforeach; 
        ?>
    </div>
</div>