| Ambos lados, revisión anteriorRevisión previaPróxima revisión | Revisión previa |
| de:software:system [2026/05/04 16:41] – jesus | de:software:system [2026/05/05 18:26] (actual) – borrado jesus |
|---|
| ~~NOTOC~~ | |
| <html> | |
| <style> | |
| .system-terminal { background-color: #000b00; font-family: 'Courier New', monospace; padding: 30px; color: #00ff00; border: 2px solid #004400; display: flex; flex-direction: column; align-items: center; position: relative; } | |
| .main-system-title { font-size: 2.2em; color: #00ff00; text-align: center; text-transform: uppercase; font-weight: 900; margin-bottom: 20px; text-shadow: 0 0 15px rgba(0, 255, 0, 0.7); } | |
| .selector-panel { background: rgba(0, 40, 0, 0.3); border: 2px solid #00ff00; padding: 15px; text-align: center; border-radius: 4px; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; } | |
| .btn-model { background: transparent; color: #00ff00; border: 1px solid #00ff00; padding: 6px 12px; cursor: pointer; font-family: 'Courier New', monospace; font-weight: bold; transition: 0.3s; font-size: 12px; } | |
| .btn-model:hover, .btn-model.active { background: #00ff00 !important; color: #000 !important; box-shadow: 0 0 10px #00ff00; } | |
| .lang-selector { margin-bottom: 20px; display: flex; gap: 15px; justify-content: center; min-height: 50px; } | |
| .flag-btn { width: 60px; height: auto; cursor: pointer; border: 1px solid #004400; transition: 0.3s; filter: grayscale(0.7); padding: 2px; background: #111; } | |
| .flag-btn:hover, .flag-btn.active { filter: grayscale(0); border-color: #00ff00; transform: scale(1.1); box-shadow: 0 0 10px #00ff00; } | |
| #display-screen { border: 1px solid #004400; background: rgba(0,20,0,0.2); width: 100%; min-height: 280px; padding: 20px; box-sizing: border-box; } | |
| .disk-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 15px; justify-items: center; } | |
| .disk-item { text-align: center; font-size: 10px; color: #00ff00; font-weight: bold; } | |
| .disk-item img { border: 1px solid #00ff00; background: #000; width: 130px; height: auto; display: block; margin: 0 auto 5px auto; } | |
| </style> | |
| |
| <div class="system-terminal"> | |
| <div class="main-system-title">DISCOS DE SISTEMA</div> | |
| <div class="selector-panel"> | |
| <button class="btn-model" onclick="seleccionarPCW('8000', this)">PCW 8256</button> | |
| <button class="btn-model" onclick="seleccionarPCW('8000', this)">PCW 8512</button> | |
| <button class="btn-model" onclick="seleccionarPCW('9512', this)">PCW 9512</button> | |
| <button class="btn-model" onclick="seleccionarPCW('9256', this)">PCW 9256</button> | |
| <button class="btn-model" onclick="seleccionarPCW('9512+', this)">PCW 9512+</button> | |
| <button class="btn-model" onclick="seleccionarPCW('10', this)">PCW 10</button> | |
| <button class="btn-model" onclick="seleccionarPCW('16', this)">PCW 16</button> | |
| </div> | |
| <div id="lang-container" class="lang-selector"></div> | |
| <div id="display-screen"><div style="text-align:center; padding-top:100px; opacity:0.5;">SELECCIONE MODELO:</div></div> | |
| </div> | |
| |
| <script> | |
| var pcwActual = ''; | |
| var rutaBanderas = "/lib/exe/fetch.php?media=botones:"; | |
| var rutaDiscos = "/lib/exe/fetch.php?media=sistema:discos:imagenes:"; | |
| |
| function seleccionarPCW(modelo, boton) { | |
| pcwActual = modelo; | |
| var botones = document.getElementsByClassName('btn-model'); | |
| for (var i = 0; i < botones.length; i++) { botones[i].classList.remove('active'); } | |
| boton.classList.add('active'); | |
| document.getElementById('display-screen').innerHTML = '<div style="text-align:center; padding-top:100px; opacity:0.5;">SELECCIONE IDIOMA:</div>'; | |
| var contenedor = document.getElementById('lang-container'); | |
| contenedor.innerHTML = ''; | |
| | |
| var listaIdiomas = (modelo === '8000') ? | |
| [{id:'es', img:'españa.jpg'}, {id:'en', img:'reino_unido.jpg'}, {id:'de', img:'alemania.jpg'}, {id:'fr', img:'francia.jpg'}] : | |
| [{id:'en', img:'reino_unido.jpg'}]; | |
| |
| listaIdiomas.forEach(function(lang) { | |
| var img = document.createElement('img'); | |
| img.src = rutaBanderas + lang.img; | |
| img.className = 'flag-btn'; | |
| img.onclick = function() { | |
| var flags = document.getElementsByClassName('flag-btn'); | |
| for (var j = 0; j < flags.length; j++) { flags[j].classList.remove('active'); } | |
| this.classList.add('active'); | |
| mostrarDiscos(lang.id); | |
| }; | |
| contenedor.appendChild(img); | |
| }); | |
| } | |
| |
| function mostrarDiscos(idLang) { | |
| var pantalla = document.getElementById('display-screen'); | |
| var html = ''; | |
| | |
| if (pcwActual === '8000') { | |
| html = '<div class="disk-grid">' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_' + idLang + '_side1.jpg">DISCO 1</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_' + idLang + '_side2.jpg">DISCO 2</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_' + idLang + '_side3.jpg">DISCO 3</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_' + idLang + '_side4.jpg">DISCO 4</div>' + | |
| '</div>'; | |
| } else if (pcwActual === '9512+') { | |
| html = '<div class="disk-grid">' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'locoscript2_9512plus_bubblejet_disk_front.jpg">LOCO FRONT</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'locoscript2_9512plus_bubblejet_disk_back.jpg">LOCO BACK</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'cpm_plus_9512plus_bubblejet_disk_front.jpg">CPM FRONT</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'cpm_plus_9512plus_bubblejet_disk_back.jpg">CPM BACK</div>' + | |
| '</div>'; | |
| } else if (pcwActual === '9512') { | |
| html = '<div class="disk-grid">' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_9512_en_disc1.jpg">DISCO 1</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_9512_en_disc2.jpg">DISCO 2</div>' + | |
| '</div>'; | |
| } else if (pcwActual === '10') { | |
| html = '<div class="disk-grid">' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_10_en_disc2.jpg">DISCO 1</div>' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_10_en_disc1.jpg">DISCO 2</div>' + | |
| '</div>'; | |
| } else if (pcwActual === '16') { | |
| html = '<div class="disk-grid">' + | |
| '<div class="disk-item"><img src="' + rutaDiscos + 'systemdisk_16_en_rescue.jpg">RESCUE DISK</div>' + | |
| '</div>'; | |
| } else { | |
| html = '<div style="text-align:center; padding-top:100px; opacity:0.5;">CONTENIDO NO DISPONIBLE_</div>'; | |
| } | |
| pantalla.innerHTML = html; | |
| } | |
| </script> | |
| </html> | |
| |