<?php
/**
 * User Profile Layout 3 - Centered Profile with Blue Theme
 *
 * @since 4.2.0
 *
 * Available variables:
 * @var array $template_data Complete data including user info and settings
 * @var array $user User data array
 */

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

// Get centralized profile data
$profile_data = wpuf_ud_get_profile_data( $template_data['user'], $template_data, 'layout-3' );
$user = $profile_data['user'];
$config = $profile_data['template_config'];
$user_meta = $profile_data['user_meta'];
$contact_info = $profile_data['contact_info'];
$social_media = $profile_data['social_media'];
$navigation = $profile_data['navigation'];
$tab_config = $profile_data['tab_config'];

// Legacy variables for backward compatibility
$show_avatar = $config['show_avatar'];
$enable_tabs = $config['enable_tabs'];
$default_tabs = $config['default_tabs'];
$default_active_tab = $config['default_active_tab'];
$avatar_size = $config['avatar_size'];
$custom_tab_labels = $config['custom_tab_labels'];

?>

<div class="wpuf-profile-layout-3">
    <!-- Back Button -->
    <div class="!wpuf-max-w-6xl !wpuf-mx-auto !wpuf-px-4 !wpuf-mb-8">
        <button onclick="wpuf_ud_goBack()" class="wpuf-back-button !wpuf-inline-flex !wpuf-items-center !wpuf-px-4 !wpuf-py-2 !wpuf-text-sm !wpuf-font-medium !wpuf-text-gray-600 !wpuf-bg-white !wpuf-border !wpuf-border-gray-300 !wpuf-rounded-lg hover:!wpuf-bg-gray-50 hover:!wpuf-text-blue-600 !wpuf-transition-colors !wpuf-shadow-sm">
            <svg class="!wpuf-w-4 !wpuf-h-4 !wpuf-mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/>
            </svg>
            <?php esc_html_e( 'Back to Directory', 'wpuf-pro' ); ?>
        </button>
    </div>

    <!-- Main Content Container -->
    <div class="!wpuf-max-w-6xl !wpuf-mx-auto !wpuf-px-4">
        <!-- Profile Header Card -->
        <div class="!wpuf-bg-transparent !wpuf-rounded-lg !wpuf-mb-12">
            <div class="!wpuf-flex !wpuf-items-start !wpuf-justify-between">
                <!-- Left Side: Avatar and Info -->
                <div class="!wpuf-flex !wpuf-flex-col !wpuf-text-left">
                    <!-- Avatar -->
                    <?php if ( $show_avatar ) : ?>
                    <div class="!wpuf-flex-shrink-0 !wpuf-mb-4">
                        <div class="!wpuf-w-32 !wpuf-h-32 !wpuf-rounded-full !wpuf-border-4 !wpuf-border-white !wpuf-overflow-hidden !wpuf-bg-white">
                            <?php
                            $size = 128;
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/user-avatar.php';
                            ?>
                        </div>
                    </div>
                    <?php endif; ?>

                    <!-- User Info -->
                    <div class="!wpuf-flex !wpuf-flex-col !wpuf-text-left">
                        <h1 class="!wpuf-text-3xl !wpuf-font-bold !wpuf-text-gray-900 !wpuf-mb-2">
                            <?php echo esc_html( $user_meta['display_name'] ); ?>
                        </h1>

                        <!-- Contact Info -->
                        <div class="!wpuf-flex !wpuf-flex-wrap !wpuf-gap-4 !wpuf-text-sm !wpuf-text-gray-600 !wpuf-mb-4">
                            <?php foreach ( $contact_info as $contact_key => $contact_item ) : ?>
                                <?php if ( $contact_key === 'website' ) : ?>
                                    <span>
                                        <a href="<?php echo esc_url( $contact_item['value'] ); ?>" target="_blank"><?php echo esc_html( $contact_item['display_value'] ); ?></a>
                                    </span>
                                <?php elseif ( $contact_key === 'email' ) : ?>
                                    <span>
                                        <a href="mailto:<?php echo esc_html( $contact_item['value'] ); ?>"><?php echo esc_html( $contact_item['display_value'] ); ?></a>
                                    </span>
                                <?php endif; ?>
                            <?php endforeach; ?>
                        </div>

                    </div>
                </div>

                <!-- Right Side: Message Button and Social Icons -->
                <div class="!wpuf-flex !wpuf-flex-col !wpuf-items-end !wpuf-gap-4">
                    <!-- Message and Edit Profile Buttons -->
                    <div class="!wpuf-flex !wpuf-items-center !wpuf-gap-2.5">
                        <?php if ( $navigation['can_message'] && $navigation['message_link'] ) : ?>
                        <!-- Message Button -->
                        <a href="<?php echo esc_url( $navigation['message_link'] ); ?>" target="_blank" class="!wpuf-h-11 !wpuf-px-6 !wpuf-py-2.5 !wpuf-bg-blue-500 !wpuf-text-white !wpuf-rounded-lg hover:!wpuf-bg-blue-600 !wpuf-transition-colors !wpuf-flex !wpuf-items-center !wpuf-gap-2.5 !wpuf-text-sm !wpuf-font-medium !wpuf-no-underline">
                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M8.625 9.75C8.625 9.95711 8.45711 10.125 8.25 10.125C8.04289 10.125 7.875 9.95711 7.875 9.75C7.875 9.54289 8.04289 9.375 8.25 9.375C8.45711 9.375 8.625 9.54289 8.625 9.75ZM8.625 9.75H8.25M12.375 9.75C12.375 9.95711 12.2071 10.125 12 10.125C11.7929 10.125 11.625 9.95711 11.625 9.75C11.625 9.54289 11.7929 9.375 12 9.375C12.2071 9.375 12.375 9.54289 12.375 9.75ZM12.375 9.75H12M16.125 9.75C16.125 9.95711 15.9571 10.125 15.75 10.125C15.5429 10.125 15.375 9.95711 15.375 9.75C15.375 9.54289 15.5429 9.375 15.75 9.375C15.9571 9.375 16.125 9.54289 16.125 9.75ZM16.125 9.75H15.75M2.25 12.7593C2.25 14.3604 3.37341 15.754 4.95746 15.987C6.04357 16.1467 7.14151 16.27 8.25 16.3556V21L12.4335 16.8165C12.6402 16.6098 12.9193 16.4923 13.2116 16.485C15.1872 16.4361 17.1331 16.2678 19.0425 15.9871C20.6266 15.7542 21.75 14.3606 21.75 12.7595V6.74056C21.75 5.13946 20.6266 3.74583 19.0425 3.51293C16.744 3.17501 14.3926 3 12.0003 3C9.60776 3 7.25612 3.17504 4.95747 3.51302C3.37342 3.74593 2.25 5.13956 2.25 6.74064V12.7593Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                            </svg>
                            <?php esc_html_e( 'Message', 'wpuf-pro' ); ?>
                        </a>
                        <?php endif; ?>

                        <!-- Edit Profile Button (shows only for own profile) -->
                        <?php if ( $navigation['is_own_profile'] && $navigation['edit_profile_link'] ) : ?>
                        <a href="<?php echo esc_url( $navigation['edit_profile_link'] ); ?>" class="!wpuf-inline-block !wpuf-h-11 !wpuf-px-6 !wpuf-py-2.5 !wpuf-bg-blue-500 !wpuf-text-white !wpuf-rounded-lg hover:!wpuf-bg-blue-600 !wpuf-transition-colors !wpuf-text-sm !wpuf-font-medium !wpuf-no-underline !wpuf-leading-[21px]">
                            <?php esc_html_e( 'Edit Profile', 'wpuf-pro' ); ?>
                        </a>
                        <?php endif; ?>
                    </div>

                    <!-- Social Icons -->
                    <?php if ( $social_media['has_social'] ) : ?>
                    <div class="!wpuf-flex !wpuf-items-center !wpuf-gap-3">
                        <?php foreach ( $social_media['user_social'] as $field => $social_item ) : ?>
                            <a href="<?php echo esc_url( $social_item['url'] ); ?>" target="_blank"
                               class="!wpuf-text-blue-500 hover:!wpuf-text-blue-600 !wpuf-transition-colors">
                                <?php echo $social_item['icon_html']; ?>
                            </a>
                        <?php endforeach; ?>
                    </div>
                    <?php endif; ?>
                </div>
            </div>

            <!-- Bio Section - Full Width -->
            <?php if ( $user_meta['bio'] ) : ?>
            <div class="!wpuf-mt-1 !wpuf-text-left">
                <?php
                $full_bio = $user_meta['bio'];
                $word_count = str_word_count( $full_bio );
                $needs_toggle = $word_count > 150;
                $bio_id = 'bio-' . $user->ID . '-' . uniqid();
                ?>

                <?php if ( $needs_toggle ) : ?>
                    <p class="!wpuf-text-sm !wpuf-text-gray-400 !wpuf-leading-relaxed">
                        <span class="wpuf-bio-excerpt" id="<?php echo esc_attr( $bio_id . '-excerpt' ); ?>">
                            <?php
                            $trimmed_text = wp_trim_words( $full_bio, 150, '' );
                            echo esc_html( $trimmed_text );
                            ?>...
                        </span>
                        <span class="wpuf-bio-full" id="<?php echo esc_attr( $bio_id . '-full' ); ?>" style="display: none;">
                            <?php echo esc_html( $full_bio ); ?>
                        </span>
                        <button type="button"
                                onclick="wpuf_toggleBio('<?php echo esc_js( $bio_id ); ?>')"
                                id="<?php echo esc_attr( $bio_id . '-btn' ); ?>"
                                class="!wpuf-text-sm !wpuf-font-medium !wpuf-text-blue-500 hover:!wpuf-text-blue-600 !wpuf-transition-colors !wpuf-bg-transparent !wpuf-border-0 !wpuf-p-0 !wpuf-cursor-pointer !wpuf-ml-1">
                            <?php esc_html_e( 'Show More', 'wpuf-pro' ); ?>
                        </button>
                        <button type="button"
                                onclick="wpuf_toggleBio('<?php echo esc_js( $bio_id ); ?>')"
                                id="<?php echo esc_attr( $bio_id . '-btn-less' ); ?>"
                                style="display: none;"
                                class="!wpuf-text-sm !wpuf-font-medium !wpuf-text-blue-500 hover:!wpuf-text-blue-600 !wpuf-transition-colors !wpuf-bg-transparent !wpuf-border-0 !wpuf-p-0 !wpuf-cursor-pointer !wpuf-ml-1">
                            <?php esc_html_e( 'Show Less', 'wpuf-pro' ); ?>
                        </button>
                    </p>
                <?php else : ?>
                    <p class="!wpuf-text-sm !wpuf-text-gray-400 !wpuf-leading-relaxed">
                        <?php echo esc_html( $full_bio ); ?>
                    </p>
                <?php endif; ?>
            </div>
            <?php endif; ?>
        </div>

        <!-- Tab Navigation -->
        <?php if ( $enable_tabs && ! empty( $default_tabs ) ) : ?>
        <div class="!wpuf-bg-transparent !wpuf-rounded-lg !wpuf-mb-12">
            <div class="!wpuf-border-t !wpuf-border-gray-200"></div>
            <nav class="!wpuf-flex !wpuf-justify-left !wpuf-border-b !wpuf-border-gray-200">
                <?php foreach ( $default_tabs as $tab ) : ?>
                    <?php
                    // Skip activity tab if User Activity module is not active
                    if ( $tab === 'activity' && ! class_exists( 'WPUF_User_Activity' ) ) {
                        continue;
                    }

                    if ( in_array( $tab, [ 'comments', 'posts', 'file', 'message', 'about', 'activity' ] ) ) :
                    ?>
                        <button class="wpuf-tab-button-3 <?php echo $tab === $default_active_tab ? 'active' : ''; ?> !wpuf-px-8 !wpuf-py-4 !wpuf-text-sm !wpuf-font-medium !wpuf-text-gray-500 hover:!wpuf-text-blue-500 !wpuf-transition-colors !wpuf-relative hover:!wpuf-bg-transparent active:!wpuf-bg-transparent !wpuf-bg-transparent"
                                data-tab="<?php echo esc_attr( $tab ); ?>">
                            <?php
echo esc_html( wpuf_ud_get_tab_label( $tab, $profile_data ) );
                            ?>
                        </button>
                    <?php endif; ?>
                <?php endforeach; ?>
            </nav>
        </div>

        <!-- Tab Content -->
        <div class="!wpuf-bg-transparent !wpuf-rounded-lg">
            <div class="wpuf-tab-content-3">
                <!-- Comments Tab -->
                <?php if ( in_array( 'comments', $default_tabs ) ) : ?>
                    <div class="wpuf-tab-content-comments" style="<?php echo $default_active_tab !== 'comments' ? 'display: none;' : ''; ?>">
                        <?php
                        if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/comments-3.php' ) ) {
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/comments-3.php';
                        } else {
                            // Fallback to comments-2
                            if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/comments-2.php' ) ) {
                                include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/comments-2.php';
                            }
                        }
                        ?>
                    </div>
                <?php endif; ?>

                <!-- Posts Tab -->
                <?php if ( in_array( 'posts', $default_tabs ) ) : ?>
                    <div class="wpuf-tab-content-posts" style="<?php echo $default_active_tab !== 'posts' ? 'display: none;' : ''; ?>">
                        <?php
                        if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/posts-3.php' ) ) {
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/posts-3.php';
                        } else {
                            // Fallback to posts-2
                            if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/posts-2.php' ) ) {
                                include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/posts-2.php';
                            }
                        }
                        ?>
                    </div>
                <?php endif; ?>

                <!-- File Tab -->
                <?php if ( in_array( 'file', $default_tabs ) ) : ?>
                    <div class="wpuf-tab-content-file" style="<?php echo $default_active_tab !== 'file' ? 'display: none;' : ''; ?>">
                        <?php
                        $tab_title = __( 'Files', 'wpuf-pro' );
                        if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file-3.php' ) ) {
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file-3.php';
                        } elseif ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file-2.php' ) ) {
                            // Fallback to file-2
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file-2.php';
                        } elseif ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file-1.php' ) ) {
                            // Fallback to file-1
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file-1.php';
                        } elseif ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file.php' ) ) {
                            // Fallback to old template
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/file.php';
                        }
                        ?>
                    </div>
                <?php endif; ?>

                <!-- About Tab -->
                <?php if ( in_array( 'about', $default_tabs ) ) : ?>
                    <div class="wpuf-tab-content-about" style="<?php echo $default_active_tab !== 'about' ? 'display: none;' : ''; ?>">
                        <?php
                        if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/about-3.php' ) ) {
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/about-3.php';
                        } else {
                            // Fallback to about-2
                            if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/about-2.php' ) ) {
                                include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/about-2.php';
                            }
                        }
                        ?>
                    </div>
                <?php endif; ?>

                <!-- Message Tab -->
                <?php if ( in_array( 'message', $default_tabs ) ) : ?>
                    <div class="wpuf-tab-content-message" style="<?php echo $default_active_tab !== 'message' ? 'display: none;' : ''; ?>">
                        <div class="!wpuf-text-center !wpuf-py-8">
                            <p class="!wpuf-text-gray-500"><?php esc_html_e( 'Message functionality coming soon.', 'wpuf-pro' ); ?></p>
                        </div>
                    </div>
                <?php endif; ?>

                <!-- Activity Tab -->
                <?php if ( in_array( 'activity', $default_tabs ) && class_exists( 'WPUF_User_Activity' ) ) : ?>
                    <div class="wpuf-tab-content-activity" style="<?php echo $default_active_tab !== 'activity' ? 'display: none;' : ''; ?>">
                        <?php
                        if ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/activity-3.php' ) ) {
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/activity-3.php';
                        } elseif ( file_exists( WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/activity.php' ) ) {
                            // Fallback to general activity template
                            include WPUF_UD_TEMPLATES . '/shortcodes/profile/template-parts/activity.php';
                        }
                        ?>
                    </div>
                <?php endif; ?>
            </div>
        </div>
        <?php endif; ?>
    </div>
</div>

<!-- Tab Switching JavaScript -->
<script type="text/javascript">
jQuery(document).ready(function($) {
    // Function to get URL parameter
    function getUrlParameter(name) {
        name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
        var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
        var results = regex.exec(location.search);
        return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
    }

    // Function to build clean URL for tab switching
    function buildCleanTabUrl(targetTab) {
        var currentUrl = new URL(window.location.href);

        // Define pagination parameters for each tab
        var tabPaginationParams = {
            'posts': ['posts_page'],
            'comments': ['comments_page'],
            'activity': ['cpage'],
            'about': [],
            'file': [],
            'message': []
        };

        // Get directory-related parameters to preserve (these persist across all tabs)
        var directoryParams = ['dir_page', 'orderby', 'order', 'search'];

        // Start with a clean URL (path only)
        var cleanUrl = new URL(currentUrl.origin + currentUrl.pathname);

        // Always add the target tab
        cleanUrl.searchParams.set('tab', targetTab);

        // Preserve directory-related parameters across all tabs
        directoryParams.forEach(function(param) {
            var value = currentUrl.searchParams.get(param);
            if (value) {
                cleanUrl.searchParams.set(param, value);
            }
        });

        // Only preserve pagination params relevant to the target tab
        if (tabPaginationParams[targetTab]) {
            tabPaginationParams[targetTab].forEach(function(param) {
                var value = currentUrl.searchParams.get(param);
                if (value) {
                    cleanUrl.searchParams.set(param, value);
                }
            });
        }

        return cleanUrl.toString();
    }

    // IMPORTANT: Always prioritize tab parameter from URL over any other detection
    var urlTab = getUrlParameter('tab');

    // If no explicit tab parameter, check for pagination parameters that indicate a specific tab
    if (!urlTab) {
        if (getUrlParameter('cpage')) {
            urlTab = 'activity'; // cpage is used by activity pagination
        } else if (getUrlParameter('posts_page')) {
            urlTab = 'posts';
        } else if (getUrlParameter('comments_page')) {
            urlTab = 'comments';
        }
    }

    if (urlTab) {
        // Activate the tab from URL
        var $targetTabButton = $('.wpuf-tab-button-3[data-tab="' + urlTab + '"]');
        if ($targetTabButton.length) {
            // Remove active class from all tabs
            $('.wpuf-tab-button-3').removeClass('active');

            // Add active class to target tab
            $targetTabButton.addClass('active');

            // Hide all tab content
            $('.wpuf-tab-content-3 > div').hide();

            // Show target tab content
            $('.wpuf-tab-content-' + urlTab).show();
        }
    }

    // Tab switching functionality for layout 3
    $('.wpuf-tab-button-3').on('click', function(e) {
        e.preventDefault();

        var targetTab = $(this).data('tab');
        var $tabsContainer = $(this).closest('.wpuf-profile-layout-3');

        // Remove active class from all tab buttons
        $tabsContainer.find('.wpuf-tab-button-3').removeClass('active');

        // Add active class to clicked tab button
        $(this).addClass('active');

        // Hide all tab content
        $tabsContainer.find('.wpuf-tab-content-3 > div').hide();

        // Show target tab content
        $tabsContainer.find('.wpuf-tab-content-' + targetTab).show();

        // Update URL without reloading page
        if (history.pushState) {
            var cleanUrl = buildCleanTabUrl(targetTab);
            history.pushState({tab: targetTab}, '', cleanUrl);
        }
    });
});
</script>

<style>
.wpuf-tab-button-3 {
    position: relative;
}
.wpuf-tab-button-3:focus {
    outline: none;
}
.wpuf-tab-button-3::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 3px;
    background-color: transparent;
    transition: background-color 0.2s;
}
.wpuf-tab-button-3.active {
    color: #3B82F6; /* Blue-500 */
}
.wpuf-tab-button-3.active::after {
    background-color: #3B82F6; /* Blue-500 */
}
</style>

<script type="text/javascript">
// Back button functionality
function wpuf_ud_goBack() {
    // Try to use browser history first to preserve pagination and other parameters
    // But skip referrer method if we have dir_page parameter (ensures clean URL reconstruction)
    var currentUrl = new URL(window.location.href);
    var hasDirPage = currentUrl.searchParams.has('dir_page');

    if (!hasDirPage && document.referrer && document.referrer.includes(window.location.hostname)) {
        var referrerUrl = new URL(document.referrer);

        // Check if referrer is the directory page
        var referrerPath = referrerUrl.pathname.replace(/\/+$/, '');
        var currentPath = currentUrl.pathname.replace(/\/[^\/]+\/?$/, '').replace(/\/+$/, '');

        // If coming from directory page, use referrer but remove tab and cpage parameters
        if (referrerPath === currentPath ||
            referrerUrl.searchParams.has('page') ||
            referrerUrl.searchParams.has('orderby') ||
            referrerUrl.searchParams.has('order') ||
            referrerUrl.searchParams.has('search')) {

            // Remove tab and activity-related parameters from referrer URL
            referrerUrl.searchParams.delete('tab');
            referrerUrl.searchParams.delete('cpage');
            window.location.href = referrerUrl.toString();
            return;
        }
    }

    // Fallback: construct directory URL preserving directory parameters
    var currentUrl = window.location.href;
    var url = new URL(currentUrl);

    // Check for dir_page parameter to restore directory pagination
    var dirPage = url.searchParams.get('dir_page');

    // Save directory-related parameters
    var preserveParams = {};
    ['orderby', 'order', 'search', 'filter'].forEach(function(param) {
        if (url.searchParams.has(param)) {
            preserveParams[param] = url.searchParams.get(param);
        }
    });

    // Remove ALL query parameters first
    url.search = '';

    // Get the base directory path by removing user identifier
    // For URLs like /new-user-directory/admin/, we want /new-user-directory/
    var pathParts = url.pathname.split('/').filter(part => part !== '');

    // Check if last part looks like a username or user ID (not 'page')
    if (pathParts.length > 0) {
        var lastPart = pathParts[pathParts.length - 1];
        // If the last part is not 'page' and not a number following 'page', it's likely a user identifier
        if (lastPart !== 'page' && !(pathParts.length > 1 && pathParts[pathParts.length - 2] === 'page')) {
            pathParts.pop();
        }
    }

    // Rebuild the base directory path
    url.pathname = '/' + pathParts.join('/') + '/';

    // If we have a dir_page parameter, add it to the path for clean URL pagination
    if (dirPage && dirPage > 1) {
        // Ensure we don't double-add /page/ if it's already there
        if (!url.pathname.includes('/page/')) {
            url.pathname = url.pathname.replace(/\/$/, '') + '/page/' + dirPage + '/';
        }
    }

    // Re-add preserved directory parameters
    Object.keys(preserveParams).forEach(function(param) {
        url.searchParams.set(param, preserveParams[param]);
    });

    // Navigate to directory listing with preserved parameters
    window.location.href = url.toString();
}

// Bio toggle functionality
function wpuf_toggleBio(bioId) {
    var excerpt = document.getElementById(bioId + '-excerpt');
    var full = document.getElementById(bioId + '-full');
    var showBtn = document.getElementById(bioId + '-btn');
    var hideBtn = document.getElementById(bioId + '-btn-less');

    if (full.style.display === 'none') {
        // Show full bio
        excerpt.style.display = 'none';
        full.style.display = 'inline';
        showBtn.style.display = 'none';
        hideBtn.style.display = 'inline';
    } else {
        // Show excerpt
        excerpt.style.display = 'inline';
        full.style.display = 'none';
        showBtn.style.display = 'inline';
        hideBtn.style.display = 'none';
    }
}
</script>
