Diferencias

Muestra las diferencias entre dos versiones de la página.

--- en:others:contact [2026/04/30 09:47] – creado jesus
+++ en:others:contact [2026/05/06 17:42] (actual) – jesus
@@ Línea 1: / Línea 1: @@
 ~~NOTOC~~
 <html>
 <style>
-  /* --- PREMIUM CRT VISUAL ENGINE --- */
+  .pcw-page-container { background:#000b00; font-family:'Courier New', monospace; padding:10px; color:#00ff00; }
-  .pcw-page-container {
-    background-color: #000b00 !important;
+  /* --- PCWWIKI MODEM HARDWARE (RESPONSIVE) --- */
-    font-family: 'Courier New', Courier, monospace !important;
+  .modem-chassis {
-    padding: 20px;
+    background: #1a1a1a;
-    color: #00ff00 !important;
+    width: 95%;
-    border: 4px solid #1a1a1a;
+    max-width: 440px;
+    margin: 0 auto 35px; border-radius: 6px; padding: 15px; position: relative;
+    border: 1.5px solid #333; border-top: 2px solid #444;
+    box-shadow: 0 0 1px rgba(255,255,255,0.1), 0 15px 40px rgba(0,0,0,0.9);
+    display: flex; align-items: center; justify-content: space-between; gap: 10px;
+    box-sizing: border-box;
   }
-  .crt-effect { position: relative; overflow: hidden; }
+  .sch-brand-white {
-  .crt-effect::after {
+    color: #ffffff; font-family: Arial, sans-serif; font-weight: 900;
-    content: " "; position: absolute; top: 0; left: 0; bottom: 0; right: 0;
+    font-size: 13px; letter-spacing: 1px; white-space: nowrap;
-    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%),
-                linear-gradient(90deg, rgba(255, 0, 0, 0.03), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.03));
-    background-size: 100% 3px, 3px 100%; z-index: 100; pointer-events: none;
-    animation: flicker-pcw 0.15s infinite;
   }
-  @keyframes flicker-pcw { 0% { opacity: 0.98; } 100% { opacity: 1; } }
-  /* --- COMMUNICATIONS TERMINAL --- */
+  .led-bezel {
-  .contact-box {
+    background: #0a0a0a; padding: 6px 10px; border-radius: 4px; border: 1px solid #222;
-    border: 2px solid #00ff00;
+    display: flex; gap: 10px; box-shadow: inset 0 2px 5px rgba(0,0,0,0.5);
-    padding: 40px;
-    margin: 20px 0;
-    background: rgba(0, 30, 0, 0.3);
-    box-shadow: inset 0 0 50px rgba(0, 255, 0, 0.1), 0 10px 30px rgba(0,0,0,0.5);
-    position: relative;
   }
-  .terminal-header {
+  .m-led { width: 10px; height: 10px; background: #200; border-radius: 50%; position: relative; border: 1px solid rgba(255,255,255,0.05); }
-    background-color: #00ff00;
+  .m-led span { position: absolute; top: 14px; left: 50%; transform: translateX(-50%); font-size: 7px; color: #777; font-weight: bold; }
-    color: #000;
-    padding: 5px 20px;
+  .led-red { background:#f00 !important; box-shadow: 0 0 10px #f00; }
-    font-weight: bold;
+  .led-green { background:#0f0 !important; box-shadow: 0 0 10px #0f0; }
-    position: absolute;
+  .led-yellow { background:#ff0 !important; box-shadow: 0 0 10px #ff0; }
-    top: 0; left: 50%;
-    transform: translateX(-50%);
-    font-size: 0.8em;
-    letter-spacing: 2px;
-  }
-  /* --- BLINKING CURSOR --- */
+  .pwr-btn {
-  .cursor {
+    width: 40px; height: 22px; background: #2a2a2a; border: 2px solid #444;
-    display: inline-block; width: 12px; height: 18px;
+    border-radius: 4px; cursor: pointer; animation: pwr-blink 1.2s infinite;
-    background-color: #00ff00;
+    outline: none; flex-shrink: 0;
-    animation: blink 1s step-end infinite;
-    vertical-align: middle;
   }
-  @keyframes blink { 50% { opacity: 0; } }
+  @keyframes pwr-blink { 50% { border-color:#0f0; box-shadow: 0 0 12px rgba(0,255,0,0.4); } }
+  .active-btn { animation:none !important; border-color:#0f0 !important; background:#040 !important; box-shadow: inset 0 2px 5px rgba(0,0,0,0.5) !important; }
-  /* --- "CYBER-PCW" EMAIL LINK --- */
+  /* --- TERMINAL --- */
-  .email-link {
+  .contact-box {
-    color: #fff !important;
+    border: 2px solid #004400; padding: 20px;
-    font-size: 1.8em;
+    background: rgba(0,10,0,0.9); min-height: 400px; display: none;
-    text-decoration: none;
+    word-wrap: break-word;
-    font-weight: bold;
-    padding: 15px 30px;
-    border: 1px solid #00ff00;
-    display: inline-block;
-    margin: 30px 0;
-    background: rgba(0, 255, 0, 0.05);
-    transition: 0.4s;
-    text-shadow: 0 0 10px #00ff00, 0 0 20px #00ff00;
-    box-shadow: 0 0 10px rgba(0, 255, 0, 0.2);
   }
-  .email-link:hover {
+  .line-in { opacity: 0; transform: translateX(-5px); transition: 0.2s; display: inline; line-height: 1.6; font-size: 14px; }
-    background: #00ff00;
+  .block-line { display: block; margin-bottom: 12px; }
-    color: #000 !important;
+  .line-visible { opacity: 1 !important; transform: translateX(0) !important; }
-    box-shadow: 0 0 40px #00ff00;
-    transform: translateY(-5px);
+  .email-link {
+    color: #fff !important; font-size: 1.2em; text-decoration: none;
+    font-weight: bold; padding: 10px 15px; border: 1px solid #0f0;
+    display: inline-block; background: rgba(0,255,0,0.1);
+    text-shadow: 0 0 10px #0f0; margin-top: 15px; max-width: 100%; box-sizing: border-box;
   }
-  .status-line {
+  @media (max-width: 400px) {
-    font-size: 0.85em;
+    .sch-brand-white { font-size: 11px; }
-    color: #008800;
+    .led-bezel { gap: 6px; padding: 5px 8px; }
-    margin-bottom: 25px;
+    .m-led { width: 8px; height: 8px; }
-    font-style: italic;
+    .pwr-btn { width: 35px; }
   }
+</style>
-  .contribution-grid {
+<div class="pcw-page-container">
-    display: grid;
+  <div class="modem-chassis">
-    grid-template-columns: 1fr 1fr;
+    <div class="sch-brand-white">PCWWIKI <span style="font-weight:100; font-size:8px; color:#aaa;">TELECOMS</span></div>
-    gap: 15px;
+    <div class="led-bezel">
-    margin: 25px 0;
+      <div id="mr" class="m-led"><span>MR</span></div>
-    border-top: 1px solid #004400;
+      <div id="oh" class="m-led"><span>OH</span></div>
-    padding-top: 25px;
+      <div id="rd" class="m-led"><span>RD</span></div>
-  }
+      <div id="sd" class="m-led"><span>SD</span></div>
+    </div>
-  .item-cmd::before { content: "[OK] "; color: #00ff00; font-weight: bold; }
+    <button id="pwr" class="pwr-btn" onclick="handlePowerClick()" title="POWER / RESET"></button>
+  </div>
+  <div id="terminal" class="contact-box"><div id="output"></div></div>
+</div>
-</style>
+<script>
+let aCtx = null;
+let currentLine = 0;
+let isBooting = false;
+let isFinished = false;
+let abortComm = false;
-<div class="pcw-page-container crt-effect">
+const content = [
+  {t: "ATZ", s: "cmd", b: true}, {t: "OK", s: "status", b: true}, {t: "ATDT 914002800", s: "cmd", b: true},
+  {t: "CONNECT 2400/V.22bis", s: "status", b: true}, {t: "--- INCOMING DATA STREAM ---", s: "status", b: true},
+  {t: "LOADING PCWWiki PRESERVATION PROTOCOL...", s: "text", b: true},
+  {t: "SYSTEM_ID: Z80-PCW (MADRID/STOCKPORT)", s: "text", b: true},
+  {t: " ", s: "text", b: true},
+  {t: "If you have detected an anomaly in the data, ", s: "text", b: false},
+  {t: "possess software not listed in our records, ", s: "text", b: false},
+  {t: "or wish to contribute historical documentation for preservation, ", s: "text", b: false},
+  {t: "the system is ready to receive your transmission.", s: "text", b: false},
+  {t: " ", s: "text", b: true},
+  {t: "<a href='mailto:[email protected]' class='email-link'>📧 [email protected]</a>", s: "html", b: true},
+  {t: " ", s: "text", b: true},
+  {t: "NO CARRIER / SESSION END", s: "status", b: true}
+];
-  <div class="contact-box">
+function initAudio() { if(!aCtx) aCtx = new (window.AudioContext || window.webkitAudioContext)(); }
-    <div class="terminal-header">SUBSYSTEM: COMMS_PORT_J11</div>
-    <div class="status-line">
+function playDTMF(digit, start) {
-      READY> LOAD "CONTACT.BIN"<br>
+    if(abortComm) return;
-      RUNNING... Handshake successful (1200 baud)...
+    const freqs = {
-    </div>
+        '9': [852, 1477], '1': [697, 1209], '4': [770, 1209],
+        '0': [941, 1336], '2': [697, 1336], '8': [852, 1336]
+    };
+    const f = freqs[digit] || [0,0];
+    f.forEach(hz => {
+        let o = aCtx.createOscillator(); let g = aCtx.createGain();
+        o.frequency.value = hz; g.gain.setValueAtTime(0.02, start);
+        g.gain.exponentialRampToValueAtTime(0.001, start + 0.1);
+        o.connect(g); g.connect(aCtx.destination); o.start(start); o.stop(start + 0.1);
+    });
+}
-    <div style="display: flex; align-items: flex-start; gap: 30px; margin-bottom: 30px;">
+function playModemChirp(dur, baseFreq, gainVal) {
-      <div style="background: #000; border: 2px solid #00ff00; padding: 10px; box-shadow: 0 0 15px #00ff00;">
+    if(abortComm || !aCtx) return;
-        <img src="/lib/exe/fetch.php?media=logo.png" width="80" alt="PCW Contact">
+    let now = aCtx.currentTime;
-      </div>
+    let osc = aCtx.createOscillator(); let g = aCtx.createGain();
+    osc.type = 'square';
-      <div style="flex: 1;">
+    osc.frequency.setValueAtTime(baseFreq, now);
-        <h2 style="color: #00ff00; margin-top: 0; text-transform: uppercase; font-size: 1.4em;">Establish communication</h2>
+    osc.frequency.linearRampToValueAtTime(baseFreq * 1.1, now + dur);
-        <p style="line-height: 1.6; color: #aaffaa; text-align: justify;">
+    g.gain.setValueAtTime(gainVal, now);
-          This <strong>DokuWiki</strong> is the central archive for the <strong>Amstrad PCW</strong>. If you have detected an anomaly in the data, possess software that is not in our records, or want to contribute historical documentation for preservation, the system is ready to receive your transmission.
+    g.gain.exponentialRampToValueAtTime(0.001, now + dur);
-        </p>
+    osc.connect(g); g.connect(aCtx.destination);
-      </div>
+    osc.start(); osc.stop(now + dur);
-    </div>
+}
-    <div class="contribution-grid">
+async function simulatePacket(duration) {
-      <div class="item-cmd">Technical error reporting.</div>
+    let endTime = Date.now() + duration;
-      <div class="item-cmd">Disk dump submissions (.DSK).</div>
+    while(Date.now() < endTime && !abortComm) {
-      <div class="item-cmd">Scanned manuals (PDF).</div>
+        document.getElementById('rd').classList.add('led-yellow');
-      <div class="item-cmd">CP/M configuration inquiries.</div>
+        playModemChirp(0.06, 1200, 0.015);
-    </div>
+        await new Promise(r => setTimeout(r, 75));
+        document.getElementById('rd').classList.remove('led-yellow');
+        if(Math.random() > 0.65) {
+           document.getElementById('sd').classList.add('led-green');
+           playModemChirp(0.04, 2400, 0.012);
+           await new Promise(r => setTimeout(r, 45));
+           document.getElementById('sd').classList.remove('led-green');
+        }
+        await new Promise(r => setTimeout(r, 35));
+    }
+}
-    <div style="text-align: center; margin-top: 40px;">
+function startConnectionSequence() {
-      <p style="letter-spacing: 3px; font-size: 0.9em; color: #00ff00;">SEND DATA TRANSMISSION TO:</p>
+    initAudio(); if(aCtx.state === 'suspended') aCtx.resume();
-      <a href="mailto:PCWWIKI@gmail.com" class="email-link">
+    let now = aCtx.currentTime;
-        📧 PCWWIKI@gmail.com
+    abortComm = false;
-      </a>
+    document.getElementById('mr').classList.add('led-red');
-      <p style="font-size: 0.8em; color: #008800; margin-top: 10px;">
-        Awaiting input<span class="cursor"></span>
+    let dt1 = aCtx.createOscillator(); let dt2 = aCtx.createOscillator(); let dg = aCtx.createGain();
-      </p>
+    dt1.frequency.value = 350; dt2.frequency.value = 440; dg.gain.setValueAtTime(0.015, now);
-    </div>
+    dg.gain.exponentialRampToValueAtTime(0.001, now + 1);
+    dt1.connect(dg); dt2.connect(dg); dg.connect(aCtx.destination);
+    dt1.start(now); dt2.start(now); dt1.stop(now + 1); dt2.stop(now + 1);
-    <div style="margin-top: 50px; text-align: center; font-size: 0.8em; color: #004400; border-top: 1px dashed #004400; padding-top: 20px;">
+    "914002800".split('').forEach((d, i) => playDTMF(d, now + 1.2 + (i * 0.16)));
-      AMSTRAD PCW PRESERVATION PROJECT // STOCKPORT - MADRID // SYSTEM ID: Z80-PCW
-    </div>
-  </div>
+    let car = aCtx.createOscillator(); let cg = aCtx.createGain();
+    car.frequency.value = 2100; cg.gain.setValueAtTime(0, now + 3);
+    cg.gain.linearRampToValueAtTime(0.03, now + 3.1);
+    cg.gain.exponentialRampToValueAtTime(0.001, now + 5.5);
+    car.connect(cg); cg.connect(aCtx.destination);
+    car.start(now + 3); car.stop(now + 5.5);
-</div>
+    setTimeout(() => {
+        if(abortComm) return;
+        document.getElementById('oh').classList.add('led-red');
+        document.getElementById('terminal').style.display = 'block';
+        processTransmission();
+    }, 6000);
+}
+function handlePowerClick() {
+    const btn = document.getElementById('pwr');
+    if (isFinished) {
+        document.getElementById('output').innerHTML = '';
+        currentLine = 0; isFinished = false;
+        ['oh','rd','sd'].forEach(id => document.getElementById(id).className = 'm-led');
+        startConnectionSequence();
+    } else if (isBooting || document.getElementById('mr').classList.contains('led-red')) {
+        abortComm = true; isBooting = false; isFinished = false;
+        btn.classList.remove('active-btn');
+        document.getElementById('terminal').style.display = 'none';
+        document.getElementById('output').innerHTML = '';
+        currentLine = 0;
+        ['mr','oh','rd','sd'].forEach(id => document.getElementById(id).className = 'm-led');
+    } else {
+        isBooting = true; btn.classList.add('active-btn');
+        startConnectionSequence();
+    }
+}
+async function processTransmission() {
+    if (currentLine < content.length && !abortComm) {
+        const out = document.getElementById('output');
+        const lineData = content[currentLine];
+        const lineSpan = document.createElement('span');
+        lineSpan.className = 'line-in' + (lineData.b ? ' block-line' : '');
+        if(lineData.s === "cmd") lineSpan.innerHTML = `<span style="color:#555">> ${lineData.t}</span>`;
+        else if(lineData.s === "status") lineSpan.innerHTML = `<span style="color:#fff; font-weight:bold">${lineData.t}</span>`;
+        else lineSpan.innerHTML = lineData.t;
+        out.appendChild(lineSpan);
+        let trafficTime = 150 + (lineData.t.length * 12);
+        await simulatePacket(trafficTime);
+        if(!abortComm) {
+            lineSpan.classList.add('line-visible');
+            currentLine++;
+            await new Promise(r => setTimeout(r, 200 + Math.random() * 300));
+            processTransmission();
+        }
+    } else if (!abortComm) {
+        isFinished = true; isBooting = false;
+        document.getElementById('oh').classList.remove('led-red');
+    }
+}
+</script>
 </html>