Python: simple http server, localhost only

gistfile1.py

import sys
import BaseHTTPServer
from SimpleHTTPServer import SimpleHTTPRequestHandler

HandlerClass = SimpleHTTPRequestHandler
ServerClass  = BaseHTTPServer.HTTPServer
Protocol     = "HTTP/1.0"

if sys.argv[1:]:
    port = int(sys.argv[1])
else:
    port = 8000
server_address = ('127.0.0.1', port)

HandlerClass.protocol_version = Protocol
httpd = ServerClass(server_address, HandlerClass)

sa = httpd.socket.getsockname()
print "Serving HTTP on", sa[0], "port", sa[1], "..."
httpd.serve_forever()

<title>ASD Segariu</title> <script src="app.js" defer></script>

ASD SEGARIU

🏟️Calendario 📰News 📷Immagini 👥Squadra 🎟️Biglietti 💬Tifosi

// ASD Segariu Web App: Funzioni di routing e rendering sezioni

document.addEventListener('DOMContentLoaded', () => {
showSection('calendario');
});

function showSection(section) {
document.querySelectorAll('.bottom-nav button').forEach(btn => btn.classList.remove('active'));
document.getElementById('tab-' + section).classList.add('active');

let html = "";
switch(section) {
case 'calendario':
html = <h2>Calendario partite</h2> <section class="match"> <strong>Sab 28 Aprile 2024</strong><br> <img src="assets/logo.png" alt="ASD Segariu" style="width:24px;vertical-align:middle;"> ASD Segariu <b>2</b> - <b>1</b> EuroAcil villasor </section> <section class="match"> <strong>Dom 27 Aprile 2023</strong><br> <img src="assets/logo.png" alt="ASD Segariu" style="width:24px;vertical-align:middle;"> ASD Segariu vs Arcuent </section> <div style="font-size:0.95em;color:#666;">Stadio Comunale</div>;
break;
case 'news':
html = <h2>News & Comunicazioni</h2> <section class="news-item"><b>Allenamento mercoledì</b><br><small>To @turnimistol 18.23</small></section> <section class="news-item"><b>Torneo "Piero Orru"</b><br><small>Tragric 2024</small></section> <section class="news-item"><b>Raduno per il ritiro</b><br><small>10 aprile 2024</small></section>;
break;
case 'gallery':
html = <h2>Galleria foto</h2> <div class="gallery-grid"> <img src="assets/team1.jpg" alt=""> <img src="assets/team2.jpg" alt=""> <img src="assets/team3.jpg" alt=""> <img src="assets/team4.jpg" alt=""> </div>;
break;
case 'squadra':
html = <h2>Squadra & Staff</h2> <div class="player"><img src="assets/user.png" alt=""><div>Gianluca Carboni</div></div> <div class="player"><img src="assets/user.png" alt=""><div>Samuele Buettas</div></div> <div class="player"><img src="assets/user.png" alt=""><div>Giorgio Tribbia</div></div> <div class="player"><img src="assets/user.png" alt=""><div>Ivan Durin</div></div>;
break;
case 'biglietti':
html = <h2>Biglietti & Merchandising</h2> <div class="buys"> <button>🎟️ Acquista biglietti</button> <button>👕 Merchandising</button> </div>;
break;
case 'tifosi':
html = <h2>Aree Tifosi</h2> <form onsubmit="addComment(event)"> <input type="text" id="comment-input" placeholder="Scrivi un commento..." required style="width:70%;padding:8px;"> <button type="submit">Invia</button> </form> <div id="comments"> <div class="comment"><img src="assets/user.png" alt=""><div><b>Dino Noris</b><br>Forza Segariu!</div></div> <div class="comment"><img src="assets/user.png" alt=""><div><b>Giulia</b><br>Non vedo l'ora di domenica!</div></div> </div>;
break;
}
document.getElementById('content').innerHTML = html;
}

function addComment(e) {
e.preventDefault();
const val = document.getElementById('comment-input').value.trim();
if(val) {
document.getElementById('comments').innerHTML += <div class="comment"><img src="assets/user.png" alt=""><div><b>Tu</b><br>${val}</div></div>;
document.getElementById('comment-input').value = '';
}
}