Test wiedzy z fizyki
Sprawdź swoją wiedzę z fizyki!
Czas na wyzwanie! Rozwiąż test składający się z 50 pytań z fizyki i sprawdź, jak dobrze znasz prawa rządzące światem!
Nieważne, czy dopiero zaczynasz swoją przygodę z fizyką, czy jesteś prawdziwym pasjonatem – ten test pozwoli Ci ocenić swoje umiejętności i dowiedzieć się, gdzie jeszcze możesz się rozwijać.
Co znajdziesz w teście?
- Pytania z różnych działów fizyki: mechaniki, optyki, termodynamiki i wiele więcej!
- Zarówno zagadnienia teoretyczne, jak i praktyczne problemy do rozwiązania.
- Możliwość porównania wyników z innymi – kto z Was okaże się mistrzem fizyki?
Dlaczego warto?
- Poszerzysz swoją wiedzę.
- Znajdziesz motywację do nauki.
- Będziesz o krok bliżej do opanowania praw fizyki!
Jak obsługiwać aplikację?
Kliknij na pole odpowiedzi w każdym pytaniu a następnie kliknij następne pytanie. Przycisk będzie aktywny tylko jeśli klikniesz w pole odpowiedzi. Przed przejściem do następnego pytania zostanie podświetlona na zielono prawidłowa odpowiedź, tak aby poinformować Cię czy wybrana odpowiedź była prawidłowa czy nie. Po skończeniu testu wyświetlą się wyniki. Masz 1 minutę 40 sekund na udzielenie odpowiedzi na każde pytanie o czym informuje odliczanie. Po tym czasie jeśli niczego nie wybierzesz aplikacja uzna że nie udzielono prawidłowej odpowiedzi i przejdzie do następnego pytania. Jeśli wybierzesz odpowiedź a licznik dojdzie do zera to przejdzie do następnego pytania przyjmując odpowiedź którą wybrałeś. W każdej chwili możesz zmienić swój wybór o ile jeszcze licznik nie doszedł do zera. Kolor paska postępu odzwierciedla czas pozostały do końca.
Zacznij już teraz i przekonaj się, jak dobrze znasz fizykę!
Rozwiąż test i pokaż, co potrafisz!
Loading...
Wynik testu
Kod po stronie przeglądarki
<div id="app">
<div class="my-5">
<div class="row my-3">
<div class="col-md-6">
<label for="level" class="form-label">Poziom trudności testu</label>
<select class="form-select" id="level" v-bind:disabled="started" v-model="level">
<option value="beginner">początkujący</option>
</select>
</div>
</div>
<div class="row my-3">
<div class="col-12">
<button class="btn btn-primary" v-if="!started" v-on:click="startTest">Rozpocznij test</button>
</div>
</div>
<div class="d-flex justify-content-center" v-if="loading && firstLoad">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<h2 class="text-center" v-text="question.section" v-if="!done"></h2>
<h3 class="mt-3" v-text="question.question" v-if="!done"></h3>
<pre class="my-3 bg-light p-3" v-if="!done && (question.code != '')"><code v-text="question.code"></code></pre>
<div class="my-3" v-if="!done && (question.question != '')">
<div class="form-check">
<input class="form-check-input" type="radio" id="q1" value="A" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassA" for="q1" v-text="question.answers.A"></label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" id="q2" value="B" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassB" for="q2" v-text="question.answers.B"></label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" id="q3" value="C" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassC" for="q3" v-text="question.answers.C"></label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" id="q4" value="D" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassD" for="q4" v-text="question.answers.D"></label>
</div>
</div>
<div class="mt-4" v-if="running && !done">
<div class="d-flex">
<div class="progress me-auto w-75 mt-2" role="progressbar" aria-label="Pozostały czas" v-bind:aria-valuenow="countDownValue" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar" v-bind:class="countDownBg" v-bind:style="{width: countDownValue + '%'}" v-text="countDownText"></div>
</div>
<button type="button" class="btn btn-primary" v-on:click="nextQuestion" v-bind:disabled="buttonDisabled">
<span class="spinner-border spinner-border-sm" aria-hidden="true" v-show="loading"></span>
<span role="status">Idź dalej</span>
</button>
</div>
</div>
<div v-if="done">
<div class="alert alert-light">
<h5>Wynik testu</h5>
<div>
<p v-html="result"></p>
<div class="progress-bar" role="progressbar" aria-label="Wynik testu" v-bind:aria-valuenow="percent" aria-valuemin="0" aria-valuemax="100">
<div class="progress" v-bind:class="progressClass" v-bind:style="{width: percent + '%'}"></div>
</div>
<p class="mt-3" v-text="suggestion"></p>
</div>
</div>
</div>
</div>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
question: {
section: '',
question: '',
code: '',
answers: {
A: '',
B: '',
C: '',
D: ''
},
answer: ''
},
level: 'beginner',
picked: null,
index: 0,
max: 999999999,
result: '',
suggestion: '',
done: false,
buttonDisabled: false,
percent: 0,
progressClass: '',
validAnswer: null,
lock: false,
started: false,
running: false,
firstLoad: false,
loading: false,
//countdown
now: null,
countDownInterval: null,
countDownDate: null,
countDownText: '',
countDownBg: 'bg-success',
countDownValue: 0
},
methods: {
getOptionClass: function(opt)
{
return (this.validAnswer && (this.validAnswer === opt)) ? 'text-success fw-bold' : 'text-normal';
},
enableButton: function()
{
this.buttonDisabled = false;
},
countDown: function()
{
var self = this;
self.now = new Date().getTime();
var distance = self.countDownDate - self.now;
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.ceil((distance % (1000 * 60)) / 1000);
self.countDownText = minutes + "m " + seconds + "s";
self.countDownValue = minutes * 60 + seconds;
if (self.countDownValue < 25)
{
self.countDownBg = 'bg-danger';
}
else if ((self.countDownValue >= 25) && (self.countDownValue < 50))
{
self.countDownBg = 'bg-orange';
}
else if ((self.countDownValue >= 50) && (self.countDownValue < 75))
{
self.countDownBg = 'bg-warning';
}
else
{
self.countDownBg = 'bg-success';
}
if (distance <= 0)
{
clearInterval(self.countDownInterval);
self.countDownInterval = null;
self.countDownText = '';
self.countDownValue = 0;
//no answer
if (!self.picked)
{
self.picked = '0';
}
if (!self.lock)
{
self.nextQuestion();
}
}
},
startTest: function()
{
this.started = true;
this.firstLoad = true;
this.loading = true;
this.nextQuestion();
},
nextQuestion: function ()
{
var self = this;
self.buttonDisabled = true;
self.lock = true;
self.loading = true;
var data = {
token: '7abea3be7356c8771643ccefae7441a5c1a6f472',
level: self.level,
picked: self.picked,
index: self.index
};
axios.post(urlSite('public/ajax/app/exec/13'), data, {headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
.then(function (response) {
var data = response.data;
var done = data.meta.done;
if (done)
{
if (self.countDownInterval !== null)
{
clearInterval(self.countDownInterval);
self.countDownInterval = null;
self.countDownText = '';
self.countDownValue = 0;
}
self.progressClass = data.data.progress_class;
self.suggestion = data.data.suggestion;
setTimeout(function() {
self.done = true;
self.lock = false;
self.loading = false;
}, 2000);
}
if (self.picked)
{
self.index = data.data.index;
}
self.max = data.data.max;
self.result = data.data.result;
self.percent = data.data.percent;
self.validAnswer = data.data.valid_answer;
if (data.data.question)
{
setTimeout(function() {
self.validAnswer = null;
self.picked = null;
self.question = data.data.question;
self.countDownDate = new Date().getTime() + 100000;
if (self.countDownInterval === null)
{
self.countDownInterval = setInterval(self.countDown, 1000);
}
self.running = true;
self.lock = false;
self.firstLoad = false;
self.loading = false;
}, 2000);
}
}).catch(function(error) {
self.lock = false;
self.firstLoad = false;
self.loading = false;
BootstrapToast.show({title: 'Błąd', message: error.response.data.message, when: 'teraz', type: 'text-bg-danger'});
});
}
},
computed: {
optionClassA: function() { return this.getOptionClass('A'); },
optionClassB: function() { return this.getOptionClass('B'); },
optionClassC: function() { return this.getOptionClass('C'); },
optionClassD: function() { return this.getOptionClass('D'); }
}
});
</script>
Kod po stronie serwera
Uwaga
Kod na serwerze dla tej aplikacji jest kodem zamkniętym.
Tagi
Ocena aplikacji
Dziękujemy!
()