<?php
/**
 * BaseCloud Boost — CDN Settings View (v8)
 * Cloudflare + BunnyCDN dual integration
 *
 * @package BaseCloud\Boost
 */

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

$opts = (array) get_option( BCBOOST_OPTIONS_KEY, [] );
?>
<div class="bcboost-wrap">
<?php include BCBOOST_DIR . 'admin/views/partials/header.php'; ?>

<div class="bcboost-tab-content">

	<div class="bcboost-page-header">
		<div>
			<h2 class="bcboost-page-title"><?php esc_html_e( 'CDN Integration', 'basecloud-boost' ); ?></h2>
			<p class="bcboost-page-subtitle"><?php esc_html_e( 'Connect your CDN so edge caches purge automatically with local cache.', 'basecloud-boost' ); ?></p>
		</div>
	</div>

	<form method="post" action="<?php echo esc_url( admin_url( 'admin-post.php' ) ); ?>">
		<?php wp_nonce_field( 'BCBOOST_save_settings' ); ?>
		<input type="hidden" name="action" value="BCBOOST_save_settings">
		<input type="hidden" name="BCBOOST_tab_checkboxes" value="cdn_enabled,bunnycdn_enabled,bunnycdn_optimizer">

		<!-- ── Cloudflare ─────────────────────────────────────────────────── -->
		<div class="bcboost-card bcboost-cdn-provider-card" id="bcboost-cf-card">
			<div class="bcboost-cdn-provider-header">
				<div class="bcboost-cdn-provider-logo">
					<svg class="bcboost-cdn-logo-icon bcboost-cdn-logo-icon--cf" viewBox="0 0 24 24" fill="none" aria-hidden="true">
						<path d="M20.5 11.5c0-4.14-3.36-7.5-7.5-7.5S5.5 7.36 5.5 11.5c0 .17.01.34.02.5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2h-2.52c.01-.16.02-.33.02-.5z" fill="rgba(245,130,32,0.2)" stroke="#f58220" stroke-width="1.5"/>
						<path d="M16 12.5H5.5c-.28 0-.5.22-.5.5v1a2 2 0 0 0 2 2h9a2 2 0 0 0 2-2v-1c0-.28-.22-.5-.5-.5z" fill="rgba(245,130,32,0.3)" stroke="#f58220" stroke-width="1.2"/>
					</svg>
					<div>
						<h2 class="bcboost-cdn-name">Cloudflare</h2>
						<p class="bcboost-cdn-tagline"><?php esc_html_e( 'Global CDN with automatic cache purge', 'basecloud-boost' ); ?></p>
					</div>
				</div>
				<label class="bcboost-toggle" title="Enable Cloudflare">
					<input type="checkbox" name="cdn_enabled" id="cdn_enabled" value="1"
						<?php checked( ! empty( $opts['cdn_enabled'] ) ); ?>>
					<span class="bcboost-toggle-slider"></span>
				</label>
			</div>

			<div class="bcboost-cdn-description">
				<div class="bcboost-cdn-desc-icon" aria-hidden="true">
					<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
				</div>
				<p><?php esc_html_e( 'When enabled, BaseCloud Boost will automatically purge your Cloudflare edge cache whenever the local page cache is cleared — keeping visitors served with fresh content worldwide.', 'basecloud-boost' ); ?></p>
			</div>

			<div class="bcboost-cdn-fields" id="bcboost-cf-fields">
				<div class="bcboost-field">
					<label for="cloudflare_zone_id" class="bcboost-field-label">
						<span class="bcboost-field-label-icon" aria-hidden="true">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>
						</span>
						<?php esc_html_e( 'Zone ID', 'basecloud-boost' ); ?>
					</label>
					<input type="text" id="cloudflare_zone_id" name="cloudflare_zone_id"
						value="<?php echo esc_attr( $opts['cloudflare_zone_id'] ?? '' ); ?>"
						class="bcboost-input bcboost-input--wide" placeholder="a1b2c3d4e5f6a1b2c3d4e5f6a1b2c3d4" autocomplete="off">
					<p class="bcboost-field-hint"><?php esc_html_e( 'Cloudflare Dashboard → select your domain → Overview → bottom-right panel.', 'basecloud-boost' ); ?></p>
				</div>

				<div class="bcboost-field">
					<label for="cloudflare_api_token" class="bcboost-field-label">
						<span class="bcboost-field-label-icon" aria-hidden="true">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4"/></svg>
						</span>
						<?php esc_html_e( 'API Token', 'basecloud-boost' ); ?>
					</label>
					<?php $cf_token_set = \BaseCloud\Boost\Core\Crypto::has_secret( (string) ( $opts['cloudflare_api_token'] ?? '' ) ); ?>
					<input type="password" id="cloudflare_api_token" name="cloudflare_api_token"
						value="" autocomplete="new-password"
						class="bcboost-input bcboost-input--wide"
						placeholder="<?php echo $cf_token_set ? esc_attr__( 'Saved & encrypted — leave blank to keep', 'basecloud-boost' ) : '••••••••••••••••'; ?>">
					<p class="bcboost-field-hint"><?php esc_html_e( 'Profile → API Tokens → Create Token → Cache Purge template. Only "Cache Purge" permission is required.', 'basecloud-boost' ); ?></p>
					<div class="bcboost-cdn-test-row">
						<button type="button" id="bcboost-test-cloudflare" class="bcboost-btn bcboost-btn--glass bcboost-btn--small">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="20 6 9 17 4 12"/></svg>
							<?php esc_html_e( 'Test Connection', 'basecloud-boost' ); ?>
						</button>
						<span id="bcboost-cf-test-result" class="bcboost-cdn-test-result" aria-live="polite"></span>
					</div>
				</div>

				<div class="bcboost-cdn-ttl-row">
					<div class="bcboost-field">
						<label for="cdn_browser_ttl" class="bcboost-field-label"><?php esc_html_e( 'Browser Cache TTL', 'basecloud-boost' ); ?></label>
						<div class="bcboost-input-unit">
							<input type="number" id="cdn_browser_ttl" name="cdn_browser_ttl" min="0" step="60"
								value="<?php echo esc_attr( $opts['cdn_browser_ttl'] ?? 3600 ); ?>"
								class="bcboost-input">
							<span class="bcboost-input-unit-label">sec</span>
						</div>
						<p class="bcboost-field-hint"><?php esc_html_e( 'Default: 3600 (1 hour)', 'basecloud-boost' ); ?></p>
					</div>
					<div class="bcboost-field">
						<label for="cdn_edge_ttl" class="bcboost-field-label"><?php esc_html_e( 'Edge Cache TTL', 'basecloud-boost' ); ?></label>
						<div class="bcboost-input-unit">
							<input type="number" id="cdn_edge_ttl" name="cdn_edge_ttl" min="0" step="60"
								value="<?php echo esc_attr( $opts['cdn_edge_ttl'] ?? 86400 ); ?>"
								class="bcboost-input">
							<span class="bcboost-input-unit-label">sec</span>
						</div>
						<p class="bcboost-field-hint"><?php esc_html_e( 'Default: 86400 (24 hours)', 'basecloud-boost' ); ?></p>
					</div>
				</div>
			</div>
		</div>

		<!-- ── BunnyCDN ───────────────────────────────────────────────────── -->
		<div class="bcboost-card bcboost-cdn-provider-card" id="bcboost-bunny-card">
			<div class="bcboost-cdn-provider-header">
				<div class="bcboost-cdn-provider-logo">
					<svg class="bcboost-cdn-logo-icon bcboost-cdn-logo-icon--bunny" viewBox="0 0 24 24" fill="none" aria-hidden="true">
						<!-- Bunny silhouette as abstract ears + body -->
						<ellipse cx="9" cy="5" rx="2.5" ry="5" fill="rgba(255,165,0,0.15)" stroke="#ff9a00" stroke-width="1.4"/>
						<ellipse cx="15" cy="5" rx="2.5" ry="5" fill="rgba(255,165,0,0.15)" stroke="#ff9a00" stroke-width="1.4"/>
						<ellipse cx="12" cy="15" rx="6" ry="7" fill="rgba(255,165,0,0.1)" stroke="#ff9a00" stroke-width="1.5"/>
						<circle cx="10" cy="12.5" r="1" fill="#ff9a00"/>
						<circle cx="14" cy="12.5" r="1" fill="#ff9a00"/>
					</svg>
					<div>
						<h2 class="bcboost-cdn-name">BunnyCDN</h2>
						<p class="bcboost-cdn-tagline"><?php esc_html_e( 'Ultra-fast global content delivery network', 'basecloud-boost' ); ?></p>
					</div>
				</div>
				<label class="bcboost-toggle" title="Enable BunnyCDN">
					<input type="checkbox" name="bunnycdn_enabled" id="bunnycdn_enabled" value="1"
						<?php checked( ! empty( $opts['bunnycdn_enabled'] ) ); ?>>
					<span class="bcboost-toggle-slider"></span>
				</label>
			</div>

			<div class="bcboost-cdn-description">
				<div class="bcboost-cdn-desc-icon" aria-hidden="true">
					<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/></svg>
				</div>
				<p><?php esc_html_e( 'When enabled, BaseCloud Boost automatically purges your BunnyCDN Pull Zone whenever the local cache is cleared — delivering blazing-fast cached responses from 114+ global PoPs.', 'basecloud-boost' ); ?></p>
			</div>

			<div class="bcboost-cdn-fields" id="bcboost-bunny-fields">

				<div class="bcboost-cdn-setup-steps">
					<div class="bcboost-setup-step">
						<span class="bcboost-step-num">1</span>
						<span><?php esc_html_e( 'Go to bunny.net → Account Settings → API', 'basecloud-boost' ); ?></span>
					</div>
					<div class="bcboost-setup-step">
						<span class="bcboost-step-num">2</span>
						<span><?php esc_html_e( 'Copy your Account API Key', 'basecloud-boost' ); ?></span>
					</div>
					<div class="bcboost-setup-step">
						<span class="bcboost-step-num">3</span>
						<span><?php esc_html_e( 'Go to CDN → your Pull Zone → General to find the Pull Zone ID', 'basecloud-boost' ); ?></span>
					</div>
				</div>

				<div class="bcboost-field">
					<label for="bunnycdn_api_key" class="bcboost-field-label">
						<span class="bcboost-field-label-icon" aria-hidden="true">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4"/></svg>
						</span>
						<?php esc_html_e( 'Account API Key', 'basecloud-boost' ); ?>
					</label>
					<?php $bunny_key_set = \BaseCloud\Boost\Core\Crypto::has_secret( (string) ( $opts['bunnycdn_api_key'] ?? '' ) ); ?>
					<input type="password" id="bunnycdn_api_key" name="bunnycdn_api_key"
						value="" autocomplete="new-password"
						class="bcboost-input bcboost-input--wide"
						placeholder="<?php echo $bunny_key_set ? esc_attr__( 'Saved & encrypted — leave blank to keep', 'basecloud-boost' ) : '••••••••••••••••••••••••••••••••••••'; ?>">
					<p class="bcboost-field-hint"><?php esc_html_e( 'The account-level API Key from bunny.net → Account Settings → API. Do not use the Pull Zone security key.', 'basecloud-boost' ); ?></p>
				</div>

				<div class="bcboost-field">
					<label for="bunnycdn_pull_zone_id" class="bcboost-field-label">
						<span class="bcboost-field-label-icon" aria-hidden="true">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>
						</span>
						<?php esc_html_e( 'Pull Zone ID', 'basecloud-boost' ); ?>
					</label>
					<input type="text" id="bunnycdn_pull_zone_id" name="bunnycdn_pull_zone_id"
						value="<?php echo esc_attr( $opts['bunnycdn_pull_zone_id'] ?? '' ); ?>"
						class="bcboost-input" placeholder="123456" autocomplete="off" inputmode="numeric">
					<p class="bcboost-field-hint"><?php esc_html_e( 'Numeric ID found at bunny.net → CDN → your Pull Zone → General Settings.', 'basecloud-boost' ); ?></p>
					<div class="bcboost-cdn-test-row">
						<button type="button" id="bcboost-test-bunnycdn" class="bcboost-btn bcboost-btn--glass bcboost-btn--small">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="20 6 9 17 4 12"/></svg>
							<?php esc_html_e( 'Test Connection', 'basecloud-boost' ); ?>
						</button>
						<span id="bcboost-bunny-test-result" class="bcboost-cdn-test-result" aria-live="polite"></span>
					</div>
				</div>

				<div class="bcboost-field">
					<label for="bunnycdn_hostname" class="bcboost-field-label">
						<span class="bcboost-field-label-icon" aria-hidden="true">
							<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12.55a11 11 0 0 1 14.08 0"/><path d="M1.42 9a16 16 0 0 1 21.16 0"/><path d="M8.53 16.11a6 6 0 0 1 6.95 0"/><circle cx="12" cy="20" r="1"/></svg>
						</span>
						<?php esc_html_e( 'CDN Hostname', 'basecloud-boost' ); ?>
						<span class="bcboost-field-badge"><?php esc_html_e( 'Enables URL Rewriting', 'basecloud-boost' ); ?></span>
					</label>
					<input type="text" id="bunnycdn_hostname" name="bunnycdn_hostname"
						value="<?php echo esc_attr( $opts['bunnycdn_hostname'] ?? '' ); ?>"
						class="bcboost-input bcboost-input--wide" placeholder="yourzone.b-cdn.net" autocomplete="off">
					<p class="bcboost-field-hint"><?php esc_html_e( 'Your Pull Zone hostname from bunny.net → CDN → your Pull Zone → General → Hostnames. When set, BaseCloud Boost rewrites all wp-content and wp-includes asset URLs to load directly from BunnyCDN — this is what makes the CDN actually serve your assets.', 'basecloud-boost' ); ?></p>
				</div>

				<div class="bcboost-field bcboost-field--toggle">
					<label class="bcboost-toggle-label" for="bunnycdn_optimizer">
						<input type="checkbox" name="bunnycdn_optimizer" id="bunnycdn_optimizer" value="1"
							<?php checked( ! empty( $opts['bunnycdn_optimizer'] ) ); ?>>
						<span><?php esc_html_e( 'Bunny Optimizer is enabled on this Pull Zone', 'basecloud-boost' ); ?></span>
					</label>
					<p class="bcboost-field-hint"><?php esc_html_e( 'Enable this if you have turned on the Bunny Optimizer add-on for this Pull Zone (bunny.net → your Pull Zone → Optimizer). The Optimizer converts images to WebP/AVIF at the edge, per browser, with automatic fallback. When enabled, BaseCloud Boost stands down its own image-format conversion (it will not rewrite images to .webp or generate WebP copies) so the two never overlap — the edge handles next-gen images for every visitor. CDN URL rewriting still applies.', 'basecloud-boost' ); ?></p>
				</div>
			</div>
		</div>

		<div class="bcboost-form-footer">
			<button type="submit" class="bcboost-btn bcboost-btn--primary">
				<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/><polyline points="17 21 17 13 7 13 7 21"/><polyline points="7 3 7 8 15 8"/></svg>
				<?php esc_html_e( 'Save CDN Settings', 'basecloud-boost' ); ?>
			</button>
		</div>

	</form>

</div><!-- .bcboost-tab-content -->
</div><!-- .bcboost-wrap -->

<?php // CDN test scripts are enqueued via wp_add_inline_script in Admin_Controller. ?>
