Conversor de tiempo HTML de Wayback Machine

533 gasfdsafdadf

Abrir en el editor Publica tu código

Conversor de tiempo HTML de Wayback Machine

Recomendado

18 December 2025

Código fuente HTML5 del juego Monkey Mart

6 December 2024

Página de inicio - Casa de lujo

19 February 2026

Formulario de inicio de sesión holográfico 3D HTML

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Wayback Machine Time Converter</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            background-color: #f4f4f9;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }
        .converter-card {
            background: white;
            padding: 2rem;
            border-radius: 8px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            width: 100%;
            max-width: 500px;
        }
        h1 {
            font-size: 1.5rem;
            color: #333;
            margin-bottom: 1.5rem;
            text-align: center;
        }
        .field {
            margin-bottom: 1rem;
        }
        label {
            display: block;
            font-size: 0.875rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
            color: #666;
        }
        input {
            width: 100%;
            padding: 0.75rem;
            border: 1px solid #ddd;
            border-radius: 4px;
            box-sizing: border-box;
            font-family: monospace;
        }
        .button-group {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            margin-top: 1rem;
        }
        button {
            padding: 0.75rem;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-weight: bold;
            transition: background 0.2s;
        }
        .btn-primary { background-color: #007bff; color: white; }
        .btn-primary:hover { background-color: #0056b3; }
        .btn-secondary { background-color: #6c757d; color: white; }
        .btn-secondary:hover { background-color: #5a6268; }
        #result-link {
            margin-top: 1.5rem;
            padding: 1rem;
            background: #e9ecef;
            border-radius: 4px;
            word-break: break-all;
            font-size: 0.9rem;
            display: none;
        }
        a { color: #007bff; text-decoration: none; }
        a:hover { text-decoration: underline; }
    </style>
</head>
<body>

<div class="converter-card">
    <h1>Wayback Time Converter</h1>
    
    <div class="field">
        <label>Target URL</label>
        <input type="text" id="targetUrl" placeholder="https://example.com" value="https://google.com">
    </div>

<div class="field">
        <label>Human Readable Date (Local)</label>
        <input type="datetime-local" id="humanDate">
    </div>

<div class="field">
        <label>Wayback Timestamp (YYYYMMDDhhmmss)</label>
        <input type="text" id="wbTimestamp" placeholder="20230101120000">
    </div>

<div class="button-group">
        <button class="btn-primary" onclick="convertToWayback()">Date to Timestamp</button>
        <button class="btn-secondary" onclick="convertFromWayback()">Timestamp to Date</button>
    </div>

<div id="result-link">
        <strong>Wayback URL:</strong><br>
        <a id="finalUrl" target="_blank" href="#"></a>
    </div>
</div>

// Set default date to now
    window.onload = () => {
        const now = new Date();
        now.setMinutes(now.getMinutes() - now.getTimezoneOffset());
        humanDateInput.value = now.toISOString().slice(0, 16);
    };

function formatToWB(date) {
        const pad = (n) => n.toString().padStart(2, '0');
        return date.getUTCFullYear() +
               pad(date.getUTCMonth() + 1) +
               pad(date.getUTCDate()) +
               pad(date.getUTCHours()) +
               pad(date.getUTCMinutes()) +
               pad(date.getUTCSeconds());
    }

function convertToWayback() {
        const date = new Date(humanDateInput.value);
        if (isNaN(date.getTime())) return alert("Invalid Date");
        
        const ts = formatToWB(date);
        wbTimestampInput.value = ts;
        updateLink(ts);
    }

function convertFromWayback() {
        const ts = wbTimestampInput.value.trim();
        if (ts.length < 8) return alert("Timestamp too short");

const year = ts.substring(0, 4);
        const month = ts.substring(4, 6) - 1 || 0;
        const day = ts.substring(6, 8) || 1;
        const hour = ts.substring(8, 10) || 0;
        const min = ts.substring(10, 12) || 0;
        const sec = ts.substring(12, 14) || 0;

const date = new Date(Date.UTC(year, month, day, hour, min, sec));
        
        // Adjust for local display in datetime-local input
        const localDate = new Date(date.getTime() - (date.getTimezoneOffset() * 60000));
        humanDateInput.value = localDate.toISOString().slice(0, 16);
        updateLink(ts);
    }

</body>
</html>

CSS