andras/fizika
1
0
Fork 0
Code Issues Pull requests 2 Projects Releases Packages Wiki Activity Actions

Use API

Browse source
This commit is contained in:
Andras Schmelczer 2025-08-31 13:32:58 +01:00
parent 30825d4ee1
commit 567ffea181
No known key found for this signature in database
GPG key ID: FC8F2C3D3D1A718C
7 changed files with 157 additions and 86 deletions
Download patch file Download diff file Expand all files Collapse all files

143
frontend/js/fizika.js
View file

@ -25,68 +25,91 @@ async function ajaxLoad(type) {
$("#loadingGif").show();
let result = "";
if (type == 1) {
var source =
"^" + $("#evszam").val() + $("#honap").val() + $("#feladat").val() + "$";
for (var i = 0; i <= 3; i++) {
source = source.replace("all", ".*");
console.log(source);
try {
if (type == 1) {
var source =
"^" + $("#evszam").val() + $("#honap").val() + $("#feladat").val() + "$";
for (var i = 0; i <= 3; i++) {
source = source.replace("all", ".*");
console.log(source);
}
result = await loadQuestions(true, undefined, source, 1000000);
} else if (type == 2) {
result = await loadQuestions(
false,
[
"mk",
"md",
"me",
"mf",
"mr",
"h",
"es",
"ee",
"ev",
"m",
"o",
"ah",
"am",
"cs",
"v",
],
undefined,
15
);
} else {
var NOQ = $("#numberof").val() ? $("#numberof").val() : 15;
categories = [
$("#mk").prop("checked") ? "mk" : "",
$("#md").prop("checked") ? "md" : "",
$("#me").prop("checked") ? "me" : "",
$("#mf").prop("checked") ? "mf" : "",
$("#mr").prop("checked") ? "mr" : "",
$("#h").prop("checked") ? "h" : "",
$("#es").prop("checked") ? "es" : "",
$("#ee").prop("checked") ? "ee" : "",
$("#ev").prop("checked") ? "ev" : "",
$("#m").prop("checked") ? "m" : "",
$("#o").prop("checked") ? "o" : "",
$("#ah").prop("checked") ? "ah" : "",
$("#am").prop("checked") ? "am" : "",
$("#cs").prop("checked") ? "cs" : "",
$("#v").prop("checked") ? "v" : "",
];
result = await loadQuestions(false, categories, undefined, NOQ);
}
result = await loadQuestions(true, undefined, source, 1000000);
} else if (type == 2) {
result = await loadQuestions(
false,
[
"mk",
"md",
"me",
"mf",
"mr",
"h",
"es",
"ee",
"ev",
"m",
"o",
"ah",
"am",
"cs",
"v",
],
undefined,
15
);
} else {
var NOQ = $("#numberof").val() ? $("#numberof").val() : 15;
categories = [
$("#mk").prop("checked") ? "mk" : "",
$("#md").prop("checked") ? "md" : "",
$("#me").prop("checked") ? "me" : "",
$("#mf").prop("checked") ? "mf" : "",
$("#mr").prop("checked") ? "mr" : "",
$("#h").prop("checked") ? "h" : "",
$("#es").prop("checked") ? "es" : "",
$("#ee").prop("checked") ? "ee" : "",
$("#ev").prop("checked") ? "ev" : "",
$("#m").prop("checked") ? "m" : "",
$("#o").prop("checked") ? "o" : "",
$("#ah").prop("checked") ? "ah" : "",
$("#am").prop("checked") ? "am" : "",
$("#cs").prop("checked") ? "cs" : "",
$("#v").prop("checked") ? "v" : "",
];
result = await loadQuestions(false, categories, undefined, NOQ);
}
$("#loadingGif").hide();
$("#content").html(result);
$("#state2").hide();
if (
result !=
'<div class="buttonwrapper"><b style="font-size: 2rem;">Nem található a keresésnek megfelelő feladat!</b></div>'
) {
$("#megoldas").show();
$("#state").html("Feladatok sikeresen letöltve!");
$("#loadingGif").hide();
$("#content").html(result);
$("#state2").hide();
if (
result !=
'<div class="buttonwrapper"><b style="font-size: 2rem;">Nem található a keresésnek megfelelő feladat!</b></div>'
) {
$("#megoldas").show();
$("#state").html("Feladatok sikeresen letöltve!");
}
} catch (error) {
$("#loadingGif").hide();
$("#content").html(`
<div class="buttonwrapper">
<b style="font-size: 1.5rem; color: #dc3545;">
Nem sikerült betölteni a feladatokat
</b>
<p style="margin-top: 1rem; color: #666;">
${error.message}
</p>
<p style="margin-top: 0.5rem; color: #666;">
Ellenőrizd az internetkapcsolatot vagy próbáld újra.
</p>
<button class="button" onclick="location.reload()" style="margin-top: 1rem;">
Újrapróbálás
</button>
</div>
`);
$("#state").html("Hiba a feladatok betöltésekor");
console.error('Quiz loading error:', error);
}
}

49
frontend/js/load.js
View file

@ -1,5 +1,20 @@
let questions = null;
const API_BASE = window.location.hostname === 'localhost' ? 'http://localhost:3001' : 'https://your-backend-domain.com';
// Auto-detect API base URL
const getApiBase = () => {
const protocol = window.location.protocol;
const hostname = window.location.hostname;
// If running on localhost, assume backend is on port 3001
if (hostname === 'localhost' || hostname === '127.0.0.1') {
return `${protocol}//${hostname}:3001`;
}
// For production, assume backend is on same origin
return "https://fizika-backend.schmelczer.dev"
};
const API_BASE = getApiBase();
const loadQuestions = async (
isSearch,
@ -9,10 +24,25 @@ const loadQuestions = async (
) => {
if (questions === null) {
try {
questions = await (await fetch(`${API_BASE}/api/fizika`)).json();
const response = await fetch(`${API_BASE}/api/fizika`);
if (!response.ok) {
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
}
questions = await response.json();
console.log('Questions loaded from backend API');
} catch (error) {
console.error('Failed to load questions from API, falling back to local file:', error);
questions = await (await fetch("fizika.json")).json();
console.warn('Failed to load questions from API, falling back to local file:', error);
try {
const fallbackResponse = await fetch("fizika.json");
if (!fallbackResponse.ok) {
throw new Error(`Local file not available: ${fallbackResponse.status}`);
}
questions = await fallbackResponse.json();
console.log('Questions loaded from local fallback file');
} catch (fallbackError) {
console.error('Both API and local file failed:', fallbackError);
throw new Error('Unable to load quiz data from either backend API or local file');
}
}
}
@ -38,7 +68,7 @@ const loadQuestions = async (
<div class="feladat card" id="feladat${id}">
<h2 style="float: left;">${i + 1}.</h2><h2>${source}</h2>
<pre>${description}</pre>
${image ? `<img src="${API_BASE}/api/pics/${image}"><br>` : ""}
${image ? `<img src="${API_BASE}/api/pics/${image}" onerror="this.src='pics/${image}'"><br>` : ""}
<form id="form${id}"">
<input type="radio" id="rad1" name="group">
<label id="label${id}" class="rad1">${a}</label>
@ -49,14 +79,13 @@ const loadQuestions = async (
<input type="radio" id="rad3" name="group">
<label id="label${id}" class="rad3">${c}</label>
<br>
${
d
? `
${d
? `
<input type="radio" id="rad4" name="group">
<label id="label${id}" class="rad4">${d}</label>
<br>`
: ""
}
: ""
}
</form>
<script type="text/javascript">
$(document).ready(function(){