<?php
/**
 * Cache module — Media tab view
 *
 * @var Blaminhor_Essentials_Module_Cache $module
 * @var array                             $settings
 *
 * @package BlaminhorEssentials
 */

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

<h2><?php esc_html_e( 'Image dimensions', 'blaminhor-essentials' ); ?></h2>
<p class="description">
	<?php esc_html_e( 'Tells the browser how big each image is going to be before it starts downloading. Result: the page no longer jumps around when an image appears (the typical "moving page" effect during loading). Directly improves your Core Web Vitals score.', 'blaminhor-essentials' ); ?>
</p>

<table class="form-table">
	<tr>
		<th scope="row"><?php esc_html_e( 'Auto-fill image dimensions', 'blaminhor-essentials' ); ?></th>
		<td>
			<label>
				<input type="checkbox" name="image_dimensions_enabled" value="1" <?php checked( ! empty( $settings['image_dimensions_enabled'] ) ); ?>>
				<?php esc_html_e( 'Inject width and height on every <img> that is missing them', 'blaminhor-essentials' ); ?>
			</label>
			<p class="description">
				<?php esc_html_e( 'Dimensions are looked up from the WordPress media library when the image is local; otherwise the plugin falls back to reading the file metadata. Resolved values are cached so it does not slow down subsequent page renders.', 'blaminhor-essentials' ); ?>
			</p>
		</td>
	</tr>
</table>

<h2><?php esc_html_e( 'Lazy loading', 'blaminhor-essentials' ); ?></h2>
<p class="description">
	<?php esc_html_e( 'WordPress already lazy-loads images and iframes. The plugin reinforces this: the first big image visible at the top of the page is loaded immediately (otherwise your Core Web Vitals score drops), and YouTube embeds are replaced with a clickable thumbnail (otherwise they download ~500 KB of code on every page, even without a click).', 'blaminhor-essentials' ); ?>
</p>

<table class="form-table">
	<tr>
		<th scope="row"><?php esc_html_e( 'Lazy load images', 'blaminhor-essentials' ); ?></th>
		<td>
			<label>
				<input type="checkbox" name="lazy_load_images" value="1" <?php checked( $settings['lazy_load_images'] ); ?>>
				<?php esc_html_e( 'Defer below-the-fold images, eager-load the LCP image', 'blaminhor-essentials' ); ?>
			</label>
			<p class="description">
				<?php esc_html_e( 'The first <img> in the body is automatically marked loading="eager" and fetchpriority="high" so it is never lazy-loaded.', 'blaminhor-essentials' ); ?>
			</p>
		</td>
	</tr>
	<tr>
		<th scope="row"><?php esc_html_e( 'Lazy load iframes', 'blaminhor-essentials' ); ?></th>
		<td>
			<label>
				<input type="checkbox" name="lazy_load_iframes" value="1" <?php checked( $settings['lazy_load_iframes'] ); ?>>
				<?php esc_html_e( 'Add loading="lazy" to iframes that don\'t already have it', 'blaminhor-essentials' ); ?>
			</label>
		</td>
	</tr>
	<tr>
		<th scope="row"><?php esc_html_e( 'YouTube facade', 'blaminhor-essentials' ); ?></th>
		<td>
			<label>
				<input type="checkbox" name="youtube_facade" value="1" <?php checked( $settings['youtube_facade'] ); ?>>
				<?php esc_html_e( 'Replace YouTube embeds with a click-to-load thumbnail', 'blaminhor-essentials' ); ?>
			</label>
			<p class="description">
				<?php esc_html_e( 'Huge performance win on pages with YouTube videos: only the thumbnail is shown initially, the full player only downloads if the visitor actually clicks the video.', 'blaminhor-essentials' ); ?>
			</p>
		</td>
	</tr>
	<tr>
		<th scope="row">
			<label for="be-lazy-exclude-classes"><?php esc_html_e( 'Exclude CSS classes', 'blaminhor-essentials' ); ?></label>
		</th>
		<td>
			<textarea id="be-lazy-exclude-classes" name="lazy_exclude_classes" rows="3" class="large-text code"><?php echo esc_textarea( $settings['lazy_exclude_classes'] ); ?></textarea>
			<p class="description"><?php esc_html_e( 'Element class names to never lazy-load. One per line. Reserved for future iteration — currently advisory.', 'blaminhor-essentials' ); ?></p>
		</td>
	</tr>
</table>
