From 5ec97d282918ff6f479b3189e41359e2616554d1 Mon Sep 17 00:00:00 2001 From: LeonardoServers Date: Sun, 12 Apr 2026 23:55:07 +0200 Subject: [PATCH] index --- code.html | 211 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 211 insertions(+) create mode 100644 code.html diff --git a/code.html b/code.html new file mode 100644 index 0000000..330388e --- /dev/null +++ b/code.html @@ -0,0 +1,211 @@ + + + + + + + + + + + +

<!DOCTYPE html>

+

<html lang="it">

+

<head>

+

    <meta charset="UTF-8">

+

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

+

    <title>Analizzatore Equazioni - Leonardo Pasini</title>

+

    <style>

+

        /* --- STILI INTERFACCIA GRAFICA --- */

+

        body {

+

            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

+

            background-color: #f4f7f6;

+

            margin: 0;

+

            min-height: 100vh;

+

            display: flex;

+

            flex-direction: column;

+

            color: #2c3e50;

+

        }

+


+

        #main-app { flex: 1; display: flex; justify-content: center; align-items: center; width: 100%; }

+


+

        .container {

+

            background: white; padding: 2.5rem; border-radius: 15px;

+

            box-shadow: 0 10px 25px rgba(0,0,0,0.05); max-width: 400px; width: 90%; text-align: center;

+

        }

+


+

        h2 { margin-top: 0; color: #34495e; }

+

        .input-group { margin: 30px 0; display: flex; justify-content: center; align-items: center; gap: 12px; }

+

        input { width: 80px; padding: 12px; border: 2px solid #ecf0f1; border-radius: 8px; text-align: center; font-size: 1.1rem; outline: none; }

+


+

        .btn-solve {

+

            background-color: #3498db; color: white; border: none; padding: 14px;

+

            border-radius: 8px; cursor: pointer; font-size: 1rem; width: 100%; font-weight: bold; transition: 0.3s;

+

        }

+

        .btn-solve:hover { background-color: #2980b9; }

+


+

        #result { margin-top: 25px; padding: 15px; border-radius: 10px; display: none; font-weight: 600; line-height: 1.6; }

+

        .determinata { background-color: #d4edda; color: #155724; }

+

        .indeterminata { background-color: #fff3cd; color: #856404; }

+

        .impossibile { background-color: #f8d7da; color: #721c24; }

+


+

        .footer { margin-top: 40px; padding-top: 20px; border-top: 1px solid #f1f1f1; font-size: 0.8rem; color: #95a5a6; }

+


+

        .btn-show-code {

+

            position: fixed; bottom: 30px; right: 30px; background-color: #00bcd4;

+

            color: white; border: none; padding: 12px 24px; border-radius: 50px;

+

            cursor: pointer; box-shadow: 0 4px 12px rgba(0,188,212,0.3); font-size: 0.9rem; font-weight: bold; z-index: 100;

+

        }

+


+

        /* --- STILI PAGINA CODICE --- */

+

        #code-view { display: none; background-color: #f4f7f6; width: 100%; min-height: 100vh; padding: 40px; box-sizing: border-box; }

+


+

        .code-container {

+

            max-width: 950px; margin: 0 auto 30px auto; background: white; padding: 30px; border-radius: 12px;

+

            box-shadow: 0 5px 15px rgba(0,0,0,0.05); overflow-x: auto; white-space: pre;

+

            font-family: 'Consolas', 'Monaco', monospace; font-size: 0.9rem; line-height: 1.5;

+

        }

+


+

        /* BOX WEBSERVER */

+

        .static-notes-box {

+

            max-width: 950px; margin: 0 auto 50px auto; background: #ffffff; padding: 25px; border-radius: 12px;

+

            box-shadow: 0 5px 15px rgba(0,0,0,0.05); border-left: 5px solid #00bcd4;

+

        }

+


+

        .static-notes-box h3 { margin-top: 0; color: #00bcd4; font-size: 1.2rem; }

+

        .static-notes-box p { line-height: 1.6; color: #444; }

+


+

        .back-arrow { color: #3498db; cursor: pointer; font-weight: bold; margin-bottom: 20px; display: block; max-width: 950px; margin-left: auto; margin-right: auto; }

+


+

        /* Syntax Highlighting */

+

        .hl-tag { color: #d73a49; } .hl-str { color: #032f62; } .hl-comm { color: #6a737d; font-style: italic; }

+

        .hl-key { color: #d73a49; font-weight: bold; }

+

        .math-focus { background-color: #fff9c4; border-left: 4px solid #fbc02d; display: block; width: 100%; }

+

    </style>

+

</head>

+

<body>

+


+

<div id="main-app">

+

    <div class="container">

+

        <h2>Analisi Equazione</h2>

+

        <p style="color: #7f8c8d; font-size: 0.9rem;">Risolvi la forma normale <b>ax = b</b></p>

+


+

        <div class="input-group">

+

            <input type="number" id="valA" placeholder="a">

+

            <span style="font-size: 1.2rem; font-weight: bold; color: #bdc3c7;">x =</span>

+

            <input type="number" id="valB" placeholder="b">

+

        </div>

+


+

        <button class="btn-solve" onclick="analizza()">Verifica Tipo</button>

+


+

        <div id="result"></div>

+


+

        <footer class="footer">

+

            <p>2026 - Leonardo Pasini</p>

+

            <p><i>Studio delle Equazioni di Primo Grado Numeriche Intere</i></p>

+

        </footer>

+

    </div>

+

    <button class="btn-show-code" onclick="toggleCode(true)">Mostra HTML</button>

+

</div>

+


+

<div id="code-view">

+

    <div class="back-arrow" onclick="toggleCode(false)">← Torna all'Analizzatore</div>

+


+

    <div class="code-container" id="code-display"></div>

+


+

    <div class="static-notes-box">

+

        <h3>WebServer</h3>

+

        <p>

+

            Nginx: <b>Online</b>

+

        </p>

+

        <p>

+

            CDN:  <b>Cloudflare</b>

+

        </p>

+

        <p>

+

            Server ID:  <b>mshp</b>

+

        </p>

+

    </div>

+

</div>

+


+

<script id="math-logic">

+

    /* --- LOGICA MATEMATICA --- */

+

    function analizza() {

+

        const a = parseFloat(document.getElementById('valA').value);

+

        const b = parseFloat(document.getElementById('valB').value);

+

        const resDiv = document.getElementById('result');

+


+

        if (isNaN(a) || isNaN(b)) {

+

            alert("Inserisci entrambi i valori");

+

            return;

+

        }

+


+

        resDiv.style.display = "block";

+

        resDiv.className = "";

+


+

        if (a !== 0) {

+

            let x = b / a;

+

            resDiv.classList.add('determinata');

+

            if (x === 0) {

+

                resDiv.innerHTML = `DETERMINATA<br>x = 0<br><small>(Attenzione! L’equazione è verificata per valore nullo)</small>`;

+

            } else {

+

                resDiv.innerHTML = `DETERMINATA<br>x = ${x}`;

+

            }

+

        } else if (b === 0) {

+

            resDiv.classList.add('indeterminata');

+

            resDiv.innerHTML = `INDETERMINATA<br>0x = 0 (Sempre vera)`;

+

        } else {

+

            resDiv.classList.add('impossibile');

+

            resDiv.innerHTML = `IMPOSSIBILE<br>0x = ${b} (Mai vera)`;

+

        }

+

    }

+

</script>

+


+

<script>

+

    /* --- GESTIONE INTERFACCIA --- */

+

    function toggleCode(show) {

+

        const app = document.getElementById('main-app');

+

        const codeView = document.getElementById('code-view');

+


+

        if (show) {

+

            let code = document.documentElement.outerHTML;

+


+

            // Sanificazione per visualizzazione testo

+

            code = code.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");

+


+

            // Syntax Highlighting

+

            code = code.replace(/(&lt;!--.*?--&gt;)/g, '<span class="hl-comm">$1</span>');

+

            code = code.replace(/("[^"]*")/g, '<span class="hl-str">$1</span>');

+

            code = code.replace(/(&lt;\/?[a-z1-6]+)/gi, '<span class="hl-tag">$1</span>');

+


+

            const keywords = ["function", "const", "let", "if", "else", "return"];

+

            keywords.forEach(key => {

+

                const reg = new RegExp(`\\b${key}\\b`, 'g');

+

                code = code.replace(reg, `<span class="hl-key">${key}</span>`);

+

            });

+


+

            // Focus sulla matematica

+

            const startKey = "function analizza()";

+

            const endKey = "resDiv.innerHTML = `IMPOSSIBILE&lt;br&gt;0x = ${b} (Mai vera)`;\n        }\n    }";

+

            code = code.replace(startKey, `<span class="math-focus">${startKey}`);

+

            code = code.replace(endKey, `${endKey}</span>`);

+


+

            document.getElementById('code-display').innerHTML = code;

+

            app.style.display = 'none';

+

            codeView.style.display = 'block';

+

            window.scrollTo(0,0);

+

        } else {

+

            app.style.display = 'flex';

+

            codeView.style.display = 'none';

+

        }

+

    }

+

</script>

+


+

</body>

+

</html>

+ +