Diferencias

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

--- de:others:kontakt [2026/04/30 09:48] – creado jesus
+++ de:others:kontakt [2026/05/06 17:43] (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 (ADAPTIV) --- */
-    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; } }
-  /* --- KOMMUNIKATIONS-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;
-  }
-  /* --- BLINKENDER 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.1em; 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;">DATENFERNÜBERTRAGUNG</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: "--- EINGEHENDER DATENSTROM ---", s: "status", b: true},
+  {t: "LADE PCWWiki ERHALTUNGSPROTOKOLL...", s: "text", b: true},
+  {t: "SYSTEM_ID: Z80-PCW (MADRID/STOCKPORT)", s: "text", b: true},
+  {t: " ", s: "text", b: true},
+  {t: "Sollten Sie eine Anomalie in den Daten entdeckt haben, ", s: "text", b: false},
+  {t: "Software besitzen, die nicht in unseren Registern steht, ", s: "text", b: false},
+  {t: "oder historische Dokumente zur Erhaltung beisteuern wollen, ", s: "text", b: false},
+  {t: "ist das System bereit, Ihre Übertragung zu empfangen.", 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 / SITZUNGSENDE", 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 "KONTAKT.BIN"<br>
+    if(abortComm) return;
-      RUNNING... Handshake erfolgreich (1200 Baud)...
+    const freqs = { '9': [852, 1477], '1': [697, 1209], '4': [770, 1209], '0': [941, 1336], '2': [697, 1336], '8': [852, 1336] };
-    </div>
+    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 Kontakt">
+    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;">Kommunikation aufbauen</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);
-          Diese <strong>DokuWiki</strong> ist das zentrale Archiv für den <strong>Amstrad PCW</strong> (Schneider Joyce). Falls Sie Unstimmigkeiten in den Daten gefunden haben, Software besitzen, die noch nicht in unseren Registern geführt wird, oder historische Dokumente zur Erhaltung beisteuern möchten, ist das System bereit für Ihre Übertragung.
+    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">Technische Fehlermeldungen.</div>
+    let endTime = Date.now() + duration;
-      <div class="item-cmd">Einsendung von Disk-Dumps (.DSK).</div>
+    while(Date.now() < endTime && !abortComm) {
-      <div class="item-cmd">Gescannte Handbücher (PDF).</div>
+        document.getElementById('rd').classList.add('led-yellow');
-      <div class="item-cmd">Fragen zur CP/M-Konfiguration.</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;">DATENÜBERTRAGUNG SENDEN AN:</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;">
-        Warte auf Eingabe<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>