Update code.html
This commit is contained in:
418
code.html
418
code.html
@@ -1,211 +1,219 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="it">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta http-equiv="Content-Style-Type" content="text/css">
|
||||
<title></title>
|
||||
<meta name="Generator" content="Cocoa HTML Writer">
|
||||
<meta name="CocoaVersion" content="2685.1">
|
||||
<style type="text/css">
|
||||
p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; -webkit-text-stroke: #000000}
|
||||
p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; -webkit-text-stroke: #000000; min-height: 14.0px}
|
||||
span.s1 {font-kerning: none}
|
||||
span.s2 {font: 12.0px 'Lucida Grande'; font-kerning: none}
|
||||
<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; }
|
||||
|
||||
/* --- STILI RISULTATO E DIDATTICA --- */
|
||||
#result { margin-top: 25px; padding: 20px; border-radius: 10px; display: none; font-weight: 600; line-height: 1.6; text-align: left; }
|
||||
.result-title { font-size: 1.1rem; display: block; margin-bottom: 5px; }
|
||||
.result-value { font-size: 1.3rem; display: block; margin-bottom: 10px; }
|
||||
.zero-highlight { background-color: #2c3e50; color: #ffffff; padding: 2px 8px; border-radius: 4px; font-family: monospace; }
|
||||
.didattica { display: block; font-weight: 400; font-size: 0.9rem; margin-top: 10px; border-top: 1px solid rgba(0,0,0,0.1); padding-top: 10px; }
|
||||
|
||||
.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;
|
||||
}
|
||||
.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>
|
||||
<p class="p1"><span class="s1"><!DOCTYPE html></span></p>
|
||||
<p class="p1"><span class="s1"><html lang="it"></span></p>
|
||||
<p class="p1"><span class="s1"><head></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><meta charset="UTF-8"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><meta name="viewport" content="width=device-width, initial-scale=1.0"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><title>Analizzatore Equazioni - Leonardo Pasini</title></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><style></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>/* --- STILI INTERFACCIA GRAFICA --- */</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>body {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>background-color: #f4f7f6;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>margin: 0;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>min-height: 100vh;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>display: flex;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>flex-direction: column;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>color: #2c3e50;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>#main-app { flex: 1; display: flex; justify-content: center; align-items: center; width: 100%; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.container {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>background: white; padding: 2.5rem; border-radius: 15px;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>box-shadow: 0 10px 25px rgba(0,0,0,0.05); max-width: 400px; width: 90%; text-align: center;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>h2 { margin-top: 0; color: #34495e; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.input-group { margin: 30px 0; display: flex; justify-content: center; align-items: center; gap: 12px; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>input { width: 80px; padding: 12px; border: 2px solid #ecf0f1; border-radius: 8px; text-align: center; font-size: 1.1rem; outline: none; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.btn-solve {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>background-color: #3498db; color: white; border: none; padding: 14px;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>border-radius: 8px; cursor: pointer; font-size: 1rem; width: 100%; font-weight: bold; transition: 0.3s;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.btn-solve:hover { background-color: #2980b9; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>#result { margin-top: 25px; padding: 15px; border-radius: 10px; display: none; font-weight: 600; line-height: 1.6; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.determinata { background-color: #d4edda; color: #155724; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.indeterminata { background-color: #fff3cd; color: #856404; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.impossibile { background-color: #f8d7da; color: #721c24; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.footer { margin-top: 40px; padding-top: 20px; border-top: 1px solid #f1f1f1; font-size: 0.8rem; color: #95a5a6; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.btn-show-code {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>position: fixed; bottom: 30px; right: 30px; background-color: #00bcd4;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>color: white; border: none; padding: 12px 24px; border-radius: 50px;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>cursor: pointer; box-shadow: 0 4px 12px rgba(0,188,212,0.3); font-size: 0.9rem; font-weight: bold; z-index: 100;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>/* --- STILI PAGINA CODICE --- */</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>#code-view { display: none; background-color: #f4f7f6; width: 100%; min-height: 100vh; padding: 40px; box-sizing: border-box; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.code-container {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>max-width: 950px; margin: 0 auto 30px auto; background: white; padding: 30px; border-radius: 12px;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>box-shadow: 0 5px 15px rgba(0,0,0,0.05); overflow-x: auto; white-space: pre;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>font-family: 'Consolas', 'Monaco', monospace; font-size: 0.9rem; line-height: 1.5;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>/* BOX WEBSERVER */</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.static-notes-box {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>max-width: 950px; margin: 0 auto 50px auto; background: #ffffff; padding: 25px; border-radius: 12px;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>box-shadow: 0 5px 15px rgba(0,0,0,0.05); border-left: 5px solid #00bcd4;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.static-notes-box h3 { margin-top: 0; color: #00bcd4; font-size: 1.2rem; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.static-notes-box p { line-height: 1.6; color: #444; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.back-arrow { color: #3498db; cursor: pointer; font-weight: bold; margin-bottom: 20px; display: block; max-width: 950px; margin-left: auto; margin-right: auto; }</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>/* Syntax Highlighting */</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.hl-tag { color: #d73a49; } .hl-str { color: #032f62; } .hl-comm { color: #6a737d; font-style: italic; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.hl-key { color: #d73a49; font-weight: bold; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>.math-focus { background-color: #fff9c4; border-left: 4px solid #fbc02d; display: block; width: 100%; }</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></style></span></p>
|
||||
<p class="p1"><span class="s1"></head></span></p>
|
||||
<p class="p1"><span class="s1"><body></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><div id="main-app"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><div class="container"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><h2>Analisi Equazione</h2></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><p style="color: #7f8c8d; font-size: 0.9rem;">Risolvi la forma normale <b>ax = b</b></p></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><div class="input-group"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><input type="number" id="valA" placeholder="a"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><span style="font-size: 1.2rem; font-weight: bold; color: #bdc3c7;">x =</span></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><input type="number" id="valB" placeholder="b"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></div></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><button class="btn-solve" onclick="analizza()">Verifica Tipo</button></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><div id="result"></div></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><footer class="footer"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><p>2026 - Leonardo Pasini</p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><p><i>Studio delle Equazioni di Primo Grado Numeriche Intere</i></p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></footer></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></div></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><button class="btn-show-code" onclick="toggleCode(true)">Mostra HTML</button></span></p>
|
||||
<p class="p1"><span class="s1"></div></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><div id="code-view"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><div class="back-arrow" onclick="toggleCode(false)"></span><span class="s2">←</span><span class="s1"> Torna all'Analizzatore</div></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><div class="code-container" id="code-display"></div></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><div class="static-notes-box"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><h3>WebServer</h3></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>Nginx: <b>Online</b></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>CDN:<span class="Apple-converted-space"> </span><b>Cloudflare</b></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span><p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>Server ID:<span class="Apple-converted-space"> </span><b>mshp</b></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></p></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span></div></span></p>
|
||||
<p class="p1"><span class="s1"></div></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><script id="math-logic"></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>/* --- LOGICA MATEMATICA --- */</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>function analizza() {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const a = parseFloat(document.getElementById('valA').value);</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const b = parseFloat(document.getElementById('valB').value);</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const resDiv = document.getElementById('result');</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>if (isNaN(a) || isNaN(b)) {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>alert("Inserisci entrambi i valori");</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>return;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.style.display = "block";</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.className = "";</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>if (a !== 0) {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>let x = b / a;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.classList.add('determinata');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>if (x === 0) {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.innerHTML = `DETERMINATA<br>x = 0<br><small>(Attenzione! L’equazione è verificata per valore nullo)</small>`;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>} else {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.innerHTML = `DETERMINATA<br>x = ${x}`;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>} else if (b === 0) {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.classList.add('indeterminata');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.innerHTML = `INDETERMINATA<br>0x = 0 (Sempre vera)`;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>} else {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.classList.add('impossibile');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>resDiv.innerHTML = `IMPOSSIBILE<br>0x = ${b} (Mai vera)`;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p1"><span class="s1"></script></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><script></span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>/* --- GESTIONE INTERFACCIA --- */</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>function toggleCode(show) {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const app = document.getElementById('main-app');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const codeView = document.getElementById('code-view');</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>if (show) {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>let code = document.documentElement.outerHTML;</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>// Sanificazione per visualizzazione testo</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>// Syntax Highlighting</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(/(&lt;!--.*?--&gt;)/g, '<span class="hl-comm">$1</span>');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(/("[^"]*")/g, '<span class="hl-str">$1</span>');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(/(&lt;\/?[a-z1-6]+)/gi, '<span class="hl-tag">$1</span>');</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const keywords = ["function", "const", "let", "if", "else", "return"];</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>keywords.forEach(key => {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const reg = new RegExp(`\\b${key}\\b`, 'g');</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(reg, `<span class="hl-key">${key}</span>`);</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>});</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>// Focus sulla matematica</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const startKey = "function analizza()";</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>const endKey = "resDiv.innerHTML = `IMPOSSIBILE&lt;br&gt;0x = ${b} (Mai vera)`;\n<span class="Apple-converted-space"> </span>}\n<span class="Apple-converted-space"> </span>}";</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(startKey, `<span class="math-focus">${startKey}`);</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>code = code.replace(endKey, `${endKey}</span>`);</span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>document.getElementById('code-display').innerHTML = code;</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>app.style.display = 'none';</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>codeView.style.display = 'block';</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>window.scrollTo(0,0);</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>} else {</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>app.style.display = 'flex';</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>codeView.style.display = 'none';</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p1"><span class="s1"><span class="Apple-converted-space"> </span>}</span></p>
|
||||
<p class="p1"><span class="s1"></script></span></p>
|
||||
<p class="p2"><span class="s1"></span><br></p>
|
||||
<p class="p1"><span class="s1"></body></span></p>
|
||||
<p class="p1"><span class="s1"></html></span></p>
|
||||
|
||||
<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>
|
||||
/* tracking-start */
|
||||
(function() {
|
||||
var u = document.createElement('script');
|
||||
u.async = true;
|
||||
u.src = 'https://analytics.leoservers.ovh/script.js';
|
||||
u.setAttribute('data-website-id', 'a6cb39fd-c916-47a5-8e2e-6b7520fa4e02');
|
||||
document.head.appendChild(u);
|
||||
})();
|
||||
/* tracking-end */
|
||||
|
||||
/* --- 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 = `
|
||||
<span class="result-title">✅ DETERMINATA (Soluzione Nulla)</span>
|
||||
<span class="result-value">x = <span class="zero-highlight">0</span></span>
|
||||
<span class="didattica">
|
||||
Hai inserito <b>${a}x = ${b}</b>. Molti studenti si bloccano vedendo lo zero, ma questa equazione è <b>perfettamente determinata</b>. <br><br>
|
||||
Il coefficiente <i>a</i> vale <b>${a}</b> (che è diverso da zero), quindi possiamo isolare la <i>x</i>. La particolarità è che il termine noto <i>b</i> è 0. L'unica domanda da farsi è: <i>"Quale numero moltiplicato per ${a} dà come risultato 0?"</i> <br><br>
|
||||
Per la <b>legge di annullamento del prodotto</b>, se una moltiplicazione dà zero, almeno uno dei fattori deve essere zero. Siccome ${a} non è zero, l'incognita <i>x</i> <b>deve essere rigorosamente 0</b>.
|
||||
</span>`;
|
||||
} else {
|
||||
resDiv.innerHTML = `
|
||||
<span class="result-title">✅ DETERMINATA</span>
|
||||
<span class="result-value">x = ${x}</span>
|
||||
<span class="didattica">
|
||||
Hai inserito <b>${a}x = ${b}</b>. Questa equazione è <b>determinata</b> perché il coefficiente dell'incognita (<i>a = ${a}</i>) è diverso da zero. Questo ci garantisce matematicamente l'esistenza di <b>una e una sola soluzione</b>.<br><br>
|
||||
Applicando il <b>secondo principio di equivalenza</b>, possiamo dividere entrambi i membri per ${a} senza alterare l'uguaglianza. Facendo l'operazione <b>${b} / ${a}</b>, isoliamo la <i>x</i> e scopriamo che il suo valore esatto è <b>${x}</b>.
|
||||
</span>`;
|
||||
}
|
||||
} else if (b === 0) {
|
||||
resDiv.classList.add('indeterminata');
|
||||
resDiv.innerHTML = `
|
||||
<span class="result-title">⚠️ INDETERMINATA</span>
|
||||
<span class="result-value">0x = 0</span>
|
||||
<span class="didattica">
|
||||
Sia <i>a</i> che <i>b</i> sono zero. L'equazione diventa <b>0x = 0</b> (ovvero 0 = 0).
|
||||
Qualsiasi numero moltiplicato per zero darà sempre zero, quindi l'uguaglianza è sempre vera per <b>infinite soluzioni</b>.
|
||||
</span>`;
|
||||
} else {
|
||||
resDiv.classList.add('impossibile');
|
||||
resDiv.innerHTML = `
|
||||
<span class="result-title">🚫 IMPOSSIBILE</span>
|
||||
<span class="result-value">0x = ${b}</span>
|
||||
<span class="didattica">
|
||||
Hai inserito <i>a = 0</i> e <i>b = ${b}</i>. L'equazione dice che <b>0 moltiplicato per x deve fare ${b}</b>.
|
||||
Poiché zero moltiplicato per qualunque numero fa sempre zero, non otterremo mai ${b}. <b>Nessuna soluzione</b>.
|
||||
</span>`;
|
||||
}
|
||||
}
|
||||
/* --- GESTIONE INTERFACCIA --- */
|
||||
function toggleCode(show) {
|
||||
const app = document.getElementById('main-app');
|
||||
const codeView = document.getElementById('code-view');
|
||||
|
||||
if (show) {
|
||||
let code = document.documentElement.outerHTML;
|
||||
|
||||
/* stealth-start */
|
||||
code = code.replace(/\/\* tracking-start \*\/[\s\S]*?\/\* tracking-end \*\//g, "");
|
||||
code = code.replace(/\/\* stealth-start \*\/[\s\S]*?\/\* stealth-end \*\//g, "");
|
||||
/* stealth-end */
|
||||
|
||||
code = code.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
|
||||
code = code.replace(/(<!--.*?-->)/g, '<span class="hl-comm">$1</span>');
|
||||
code = code.replace(/("[^"]*")/g, '<span class="hl-str">$1</span>');
|
||||
code = code.replace(/(<\/?[a-z1-6]+)/gi, '<span class="hl-tag">$1</span>');
|
||||
|
||||
const keywords = ["function", "const", "let", "if", "else", "return"];
|
||||
keywords.forEach(key => {
|
||||
code = code.replace(new RegExp(`\\b${key}\\b`, 'g'), `<span class="hl-key">${key}</span>`);
|
||||
});
|
||||
|
||||
const startKey = "function analizza()";
|
||||
const endKey = "Nessuna soluzione</b>.\n </span>`;\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>
|
||||
Reference in New Issue
Block a user