<style>
    body, html {
        margin: 0;
        padding: 0;
        height: 100%;
        overflow: hidden;
    }
    .media-container {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 80vh; /* Adjust the height as needed */
		margin: 0 auto;
		max-width: 100%; /* Ensures that the media does not exceed the width of the screen */
	}

	.media-item {
		max-width: 100%; /* Ensures that the media scales down if it's too wide for the screen */
		max-height: 100%; /* Ensures that the media scales down if it's too tall for the screen */
		object-fit: contain; /* Ensures that the aspect ratio of the media is preserved */
	}

	.download-btn {
		position: absolute;
		bottom: 10px; /* Distance from the bottom of the media container */
		left: 50%;
		transform: translateX(-50%); /* Centers the button horizontally */
		padding: 8px 16px;
		background-color: #007bff;
		color: white;
		text-decoration: none;
		border-radius: 4px;
		cursor: pointer;
	}

	.download-btn:hover {
	 	background-color: #0056b3;
	}
</style>

<div class="media-container">
	<?php
		$extension = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));

		switch ($extension) {
			case 'jpg':
	        case 'jpeg':
	        case 'png':
	        case 'gif':
	            echo "<img class='media-item' src='" . base_url('products/get-document/'.$secure_token) . "' alt='Image'>";
	            break;
	        case 'mp4':
	        case 'mov':
	            echo "<video class='media-item' controls src='" . base_url('products/get-document/'.$secure_token) . "'></video>";
	            break;
	        case 'mp3':
	        case 'wav':
	            echo "<audio class='media-item' controls src='" . base_url('products/get-document/'.$secure_token) . "'></audio>";
	            break;
	        case 'pdf':
	            echo "<object class='media-item' data='" . base_url('products/get-document/'.$secure_token) . "' type='application/pdf' width='600' height='400'></object>";
	            break;
	        // Add more cases as needed for other file types
	        default:
	            echo "<a class='media-item' href='" . base_url('products/get-document/'.$secure_token) . "'>Download File</a>";
	            break;
		}
	?>

	<button class="download-btn" id="download-btn">Download</button>
</div>

<script>
    document.addEventListener("DOMContentLoaded", function() {
        // Get the download button
        var downloadBtn = document.getElementById("download-btn");

        // Add click event listener to the download button
        downloadBtn.addEventListener("click", function() {
            // Create an anchor element
            var anchor = document.createElement("a");
            anchor.href = '<?php echo base_url('products/get-document/'.$secure_token); ?>';
            anchor.download = '<?php echo $file_name; ?>'; // Specify the filename to be downloaded
            anchor.click(); // Trigger the click event to initiate download
        });
    });
</script>