Pathl.Stona/templates/user.html

101 lines
2.5 KiB
HTML
Raw Normal View History

2026-01-30 12:33:51 +00:00
<!DOCTYPE html>
2026-01-30 17:08:36 +00:00
<html lang="pl">
2026-01-30 12:33:51 +00:00
<head>
2026-01-30 17:08:36 +00:00
<meta charset="UTF-8">
2026-01-30 12:33:51 +00:00
<title>AI Models</title>
2026-01-30 17:08:36 +00:00
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
2026-01-30 12:33:51 +00:00
</head>
<body>
2026-01-30 17:08:36 +00:00
2026-01-30 12:33:51 +00:00
<h2>Lista modeli AI</h2>
2026-01-30 17:08:36 +00:00
2026-01-30 12:33:51 +00:00
<div id="models-container">
2026-01-30 17:08:36 +00:00
{% for name, model in models.items() %}
<div class="model-card" id="model-{{name}}">
<!-- 3 KROPKI -->
<div class="menu-btn" onclick="toggleMenu('{{name}}')"></div>
<!-- WYSUWANY PANEL -->
<div class="side-menu" id="menu-{{name}}">
<h4>Akcje modelu</h4>
<input type="text" value="{{name}}" readonly>
<button onclick="goToEditor('{{name}}')">
Edytor kodu
</button>
<button onclick="toggleMenu('{{name}}')">
Zamknij
</button>
</div>
2026-01-30 12:33:51 +00:00
2026-01-30 17:08:36 +00:00
<!-- NAZWA -->
<h3>{{name}}</h3>
2026-01-30 12:33:51 +00:00
2026-01-30 17:08:36 +00:00
<!-- OPIS (Markdown -> HTML) -->
<div class="description">
{{ model.md_content | safe }}
</div>
<!-- FORMULARZ -->
<form class="predict-form">
2026-01-30 12:33:51 +00:00
{% for inp in model.inputs %}
2026-01-30 17:08:36 +00:00
<label>{{inp}}:</label>
<input name="{{inp}}">
2026-01-30 12:33:51 +00:00
{% endfor %}
<button type="submit">Wyślij</button>
2026-01-30 17:08:36 +00:00
</form>
<!-- OUTPUT -->
<div class="output" id="output-{{name}}"></div>
<!-- DOWNLOAD -->
{% if model.meta.downloadable %}
<div class="download">
<a href="/download/{{name}}/model.py" target="_blank">model.py</a> |
<a href="/download/{{name}}/description.md" target="_blank">description.md</a> |
<a href="/download/{{name}}/meta.json" target="_blank">meta.json</a>
2026-01-30 12:33:51 +00:00
</div>
2026-01-30 17:08:36 +00:00
{% endif %}
</div>
{% endfor %}
2026-01-30 12:33:51 +00:00
</div>
<script>
2026-01-30 17:08:36 +00:00
/* ---- PREDICT ---- */
2026-01-30 12:33:51 +00:00
document.querySelectorAll(".predict-form").forEach(form => {
form.addEventListener("submit", async (e) => {
e.preventDefault();
const parent = e.target.closest(".model-card");
const modelName = parent.id.replace("model-", "");
const outputDiv = parent.querySelector(".output");
const formData = new FormData(form);
const response = await fetch(`/predict/${modelName}`, {
method: "POST",
body: formData
});
const data = await response.json();
outputDiv.textContent = data.output;
});
});
2026-01-30 17:08:36 +00:00
/* ---- MENU ---- */
function toggleMenu(name) {
const menu = document.getElementById("menu-" + name);
menu.classList.toggle("open");
}
/* ---- EDITOR ---- */
function goToEditor(name) {
window.location.href = `/editor/${name}`;
}
2026-01-30 12:33:51 +00:00
</script>
2026-01-30 17:08:36 +00:00
2026-01-30 12:33:51 +00:00
</body>
</html>