<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Terabox Embed</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
        }

        .container {
            width: 80%;
            margin: 20px auto;
            padding: 20px;
            background-color: #fff;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }

        input[type="text"] {
            width: 80%;
            padding: 10px;
            font-size: 16px;
            margin-bottom: 10px;
        }

        #embed-container {
            margin-top: 20px;
            display: none;
            text-align: center;
        }

        iframe {
            width: 100%;
            height: 400px;
            border: none;
        }

        .error {
            color: red;
            font-weight: bold;
        }

        .btn {
            margin-top: 10px;
            padding: 10px 20px;
            background-color: #4CAF50;
            color: white;
            border: none;
            cursor: pointer;
            font-size: 16px;
            border-radius: 5px;
        }

        .btn:disabled {
            background-color: #ddd;
            cursor: not-allowed;
        }

        .copy-link {
            margin-top: 10px;
        }

        #share-link {
            display: none;
            margin-top: 10px;
            font-size: 16px;
        }
    </style>
</head>
<body>

<div class="container">
    <h2>Terabox Embed Video</h2>
    <p>Enter the Terabox share link below, and the video will play automatically:</p>
    
    <input type="text" id="terabox-link" placeholder="Enter Terabox link">

    <!-- Error message display -->
    <div id="error-message" class="error" style="display: none;"></div>

    <div id="embed-container">
        <h3>Your Terabox Content:</h3>
        <iframe id="terabox-iframe" allowfullscreen></iframe>
        
        <!-- Button to copy embed code -->
        <button id="copy-btn" class="btn" onclick="copyEmbedCode()">Copy Embed Code</button>
        
        <!-- Button to show share link -->
        <button id="share-btn" class="btn" onclick="showShareLink()">Share Link</button>

        <!-- Display Shareable Link -->
        <div id="share-link">
            <a href="" id="share-url" target="_blank">Share this link</a>
        </div>
    </div>
</div>

<script>
    document.getElementById("terabox-link").addEventListener("input", function() {
        embedTerabox();
    });

    function embedTerabox() {
        var link = document.getElementById("terabox-link").value;
        var iframe = document.getElementById("terabox-iframe");
        var embedContainer = document.getElementById("embed-container");
        var errorMessage = document.getElementById("error-message");

        // Hide previous error message if any
        errorMessage.style.display = "none";
        embedContainer.style.display = "none";
        document.getElementById("share-link").style.display = "none";  // Hide share link section

        if (link.trim() === "") {
            return; // No error, just don't embed anything
        }

        // Validate if the link contains 'teraboxlink.com/s/'
        if (!link.includes("teraboxlink.com/s/")) {
            errorMessage.textContent = "Invalid Terabox link! Please check the URL.";
            errorMessage.style.display = "block";
            return;
        }

        // Extract the 'surl' from the link
        var surl = link.split("s/")[1]; // Extract after "s/" part
        
        // Validate surl (check if it's alphanumeric and not just empty)
        if (!surl || !/^[a-zA-Z0-9_-]+$/.test(surl)) {
            errorMessage.textContent = "Invalid Terabox link! The URL doesn't contain valid file identifier.";
            errorMessage.style.display = "block";
            return;
        }

        // Remove the first '1' if it exists
        if (surl.charAt(0) === '1') {
            surl = surl.substring(1);
        }

        // Create the embed URL
        var embedURL = "https://1024terabox.com/sharing/embed?surl=" + surl + "&resolution=720&autoplay=true&mute=false";

        // Set the iframe source
        iframe.src = embedURL;

        // Display the embedded content
        embedContainer.style.display = "block";

        // Enable the "Copy Embed Code" and "Share Link" buttons
        document.getElementById("copy-btn").disabled = false;
        document.getElementById("share-btn").disabled = false;
    }

    function copyEmbedCode() {
        var iframeSrc = document.getElementById("terabox-iframe").src;
        var embedCode = `<iframe width="100%" height="400" src="${iframeSrc}" frameborder="0" allowfullscreen></iframe>`;
        navigator.clipboard.writeText(embedCode).then(function() {
            alert("Embed code copied to clipboard!");
        }).catch(function(error) {
            alert("Error copying embed code: " + error);
        });
    }

    function showShareLink() {
        var iframeSrc = document.getElementById("terabox-iframe").src;
        var shareUrl = "https://1024terabox.com/sharing/embed?surl=" + iframeSrc.split("surl=")[1] + "&resolution=720&autoplay=true&mute=false";
        var shareLink = document.getElementById("share-url");
        shareLink.href = shareUrl;
        shareLink.textContent = shareUrl;
        document.getElementById("share-link").style.display = "block";
    }
</script>

</body>
</html>
