<?php
if (session_status() !== PHP_SESSION_ACTIVE) {
    session_start();
}

// Replicate the exact logic from header.php
if (!defined('WEB_BASE_PATH')) {
    $scriptName = $_SERVER['SCRIPT_NAME'] ?? '';
    if (strpos($scriptName, '/emporio-sport/') === 0 || $scriptName === '/emporio-sport' || $scriptName === '/emporio-sport/index.php') {
        define('WEB_BASE_PATH', '/emporio-sport');
    } else {
        define('WEB_BASE_PATH', '');
    }
}

?>
<!DOCTYPE html>
<html>
<head>
    <title>Web Path Debug</title>
    <style>
        body { font-family: Arial; margin: 20px; }
        .box { border: 1px solid #ccc; padding: 20px; margin: 20px 0; background: #f9f9f9; }
        code { background: #f0f0f0; padding: 5px 10px; border-radius: 3px; font-family: monospace; }
    </style>
</head>
<body>
    <h1>🔍 Web Path Debug</h1>
    
    <div class="box">
        <h3>Server Info</h3>
        <p>SCRIPT_NAME: <code><?php echo htmlspecialchars($_SERVER['SCRIPT_NAME']); ?></code></p>
        <p>REQUEST_URI: <code><?php echo htmlspecialchars($_SERVER['REQUEST_URI']); ?></code></p>
        <p>PHP_SELF: <code><?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?></code></p>
    </div>
    
    <div class="box">
        <h3>WEB_BASE_PATH Constant</h3>
        <p>WEB_BASE_PATH: <code><?php echo htmlspecialchars(WEB_BASE_PATH); ?></code></p>
        <p style="color: green; font-weight: bold;">✓ Value is: "<strong><?php echo htmlspecialchars(WEB_BASE_PATH); ?></strong>"</p>
    </div>
    
    <div class="box">
        <h3>API URL That Will Be Used</h3>
        <p>The JavaScript will use this URL:</p>
        <p><code><?php echo htmlspecialchars(WEB_BASE_PATH); ?>/api_set_preference.php</code></p>
        
        <h4>Test Direct Access:</h4>
        <button onclick="testAPI()">Test API Call</button>
        <div id="output"></div>
    </div>
    
    <script>
    function testAPI() {
        const apiUrl = '<?php echo htmlspecialchars(WEB_BASE_PATH); ?>/api_set_preference.php';
        document.getElementById('output').innerHTML = '<p>Testing: ' + apiUrl + '</p>';
        
        fetch(apiUrl, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ type: 'language', value: 'en' })
        })
        .then(r => {
            document.getElementById('output').innerHTML += '<p>Status: ' + r.status + '</p>';
            return r.json();
        })
        .then(data => {
            document.getElementById('output').innerHTML += '<p style="color: green;">✓ Success!</p><pre>' + JSON.stringify(data, null, 2) + '</pre>';
        })
        .catch(e => {
            document.getElementById('output').innerHTML += '<p style="color: red;">✗ Error: ' + e.message + '</p>';
        });
    }
    </script>
</body>
</html>
