Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FIX: File structure #47

Closed
wants to merge 3 commits into from
Closed

FIX: File structure #47

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
c9030c9
FIX: file structure
bj-jiwrajka Jan 3, 2024
29816ae
Restore readme
bj-jiwrajka Jan 4, 2024
3df9db7
change ui for theme switch
bj-jiwrajka Jan 5, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
77 changes: 0 additions & 77 deletions Dark/README.md
View file
Open in desktop

This file was deleted.

7 changes: 3 additions & 4 deletions Dark/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,17 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Kviz: A quiz app</title>
<link rel="icon" href="./assets/logo-kviz.jpg" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<a class="btn" href="/Dark/index.html">Dark Theme</a>
<div class="container">
<div id="home" class="flex-center flex-column">
<img src="kviz-1 (9).png" style="height: 80px;"/>
<img src="../assets/dark.png" style="height: 80px;"/>
<h1>Kviz</h1>
<a class="btn" href="game.html">Play</a>
<a class="btn" href="highscore.html">High Scores</a>
</div>
</div>
</div></div>
</body>
</html>
Binary file removed Dark/logo-kviz.jpg
View file
Open in desktop
Binary file not shown.
77 changes: 0 additions & 77 deletions Light/README.md
View file
Open in desktop

This file was deleted.

23 changes: 23 additions & 0 deletions Light/game.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,9 @@
height: 12rem;
animation: spin 2s linear infinite;
}
.alert {
animation: bounceTimer 1.2s infinite ease-in-out;
}

@keyframes spin {
0% {
Expand All @@ -109,6 +112,26 @@
bottom: 0.8em;
}

@keyframes bounceTimer {

0%,
100% {
transform: scale(1);
}

25% {
transform: scale(1.5);
}

50% {
transform: scale(1);
}

75% {
transform: scale(1.5);
}
}

@media screen and (max-width: 600px) {
.container {
padding: 20px;
Expand Down
2 changes: 1 addition & 1 deletion Light/game.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
<div id="hud-item" class="time">
<div class="timer">
<div class="time_left_txt">Time Left</div>
<div class="timer_sec">15</div>
<div class="timer_sec" id="timer">15</div>
</div>
<div class="time_line"></div>
</div>
Expand Down
58 changes: 32 additions & 26 deletions Light/game.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ startGame = () => {
getNewQuestion();
game.classList.remove('hidden');
loader.classList.add('hidden');
next_btn.classList.remove("show");
next_btn.classList.remove("show");
};

const next_btn = document.querySelector("footer .next_btn");
Expand All @@ -99,14 +99,14 @@ getNewQuestion = () => {

availableQuesions.splice(questionIndex, 1);
acceptingAnswers = true;
clearInterval(counter);
clearInterval(counterLine);
startTimer(timeValue);
startTimerLine(widthValue);
timeText.textContent = "Time Left";
clearInterval(counter);
clearInterval(counterLine);
startTimer(timeValue);
startTimerLine(widthValue);
timeText.textContent = "Time Left";
};

next_btn.onclick = ()=>{
next_btn.onclick = () => {
getNewQuestion();
}

Expand All @@ -121,8 +121,8 @@ choices.forEach((choice) => {
const classToApply =
selectedAnswer == currentQuestion.answer ? 'correct' : 'incorrect';

clearInterval(counter);
clearInterval(counterLine);
clearInterval(counter);
clearInterval(counterLine);

if (classToApply === 'correct') {
incrementScore(CORRECT_BONUS);
Expand All @@ -137,44 +137,50 @@ choices.forEach((choice) => {
getNewQuestion();
}, 1000);
});
next_btn.classList.add("show");
next_btn.classList.add("show");
});

function startTimer(time) {
counter = setInterval(timer, 1000);
function timer() {
timeCount.textContent = time; time--;
if (time < 9) {
timeCount.textContent = time; time--;
if (time < 9) {
let addZero = timeCount.textContent;
timeCount.textContent = "0" + addZero;
timeCount.textContent = "0" + addZero;
}
if (time <= 0) {
clearInterval(counter);
if (time <= 0) {
clearInterval(counter);
getNewQuestion();
timeText.textContent = "Time Off";
const allOptions = choices.children.length;
let correcAns = questions[questionCounter].answer;
timeText.textContent = "Time Off";
const allOptions = choices.children.length;
let correcAns = questions[questionCounter].answer;
for (i = 0; i < allOptions; i++) {
if (choices.children[i].textContent == correcAns) {
choices.children[i].setAttribute("class", "option correct");
choices.children[i].insertAdjacentHTML("beforeend", tickIconTag);
if (choices.children[i].textContent == correcAns) {
choices.children[i].setAttribute("class", "option correct");
choices.children[i].insertAdjacentHTML("beforeend", tickIconTag);
console.log("Time Off: Auto selected correct answer.");
}
}
for (i = 0; i < allOptions; i++) {
choices.children[i].classList.add("disabled");
choices.children[i].classList.add("disabled");
}
}
if (time < 5) {
document.getElementById("timer").classList.add("alert");
}
else {
document.getElementById("timer").classList.remove("alert");
}
}
}

function startTimerLine(time) {
counterLine = setInterval(timer, 29);
function timer() {
time += 1;
time_line.style.width = time + "px";
if (time > 549) {
clearInterval(counterLine);
time += 1;
time_line.style.width = time + "px";
if (time > 549) {
clearInterval(counterLine);
}
}
}
Expand Down
21 changes: 0 additions & 21 deletions Light/index.html
View file
Open in desktop

This file was deleted.

Binary file removed Light/logo-kviz.jpg
View file
Open in desktop
Binary file not shown.
Binary file removed Light/sounds/correctAns.mp3
View file
Open in desktop
Binary file not shown.
Binary file removed Light/sounds/wrongAns.mp3
View file
Open in desktop
Binary file not shown.
2 changes: 1 addition & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,4 +40,4 @@ https://user-images.githubusercontent.com/98908906/206414690-4c8a9f10-3130-4741-



Please refer to the above video for demo.
Please refer to the above video for demo.
0 Dark/kviz-1 (9).png → assets/dark.png
View file
Open in desktop
File renamed without changes
Binary file removed assets/kviz.png
View file
Open in desktop
Binary file not shown.
0 Light/kviz-1 (8).png → assets/light.png
View file
Open in desktop
File renamed without changes
0 Dark/sounds/correctAns.mp3 → assets/sounds/correctAns.mp3
View file
Open in desktop
File renamed without changes.
0 Dark/sounds/wrongAns.mp3 → assets/sounds/wrongAns.mp3
View file
Open in desktop
File renamed without changes.
17 changes: 7 additions & 10 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,13 @@
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<div id="home" class="flex-center flex-column">
<h1>Kviz</h1>
<div class="flex-row">
<a class="btn" href="/Dark/index.html">Dark Theme</a>
<a class="btn" href="/Light/index.html">Light Theme</a>
</div>
</div>
<a class="btn" href="/Dark/index.html">Dark Theme</a>
<div class="container">
<div id="home" class="flex-center flex-column">
<img src="../assets/light.png" style="height: 80px;"/>
<h1>Kviz</h1>
<a class="btn" href="/Light/game.html">Play</a>
<a class="btn" href="/Light/highscore.html">High Scores</a>
</div>

<!-- <script src="toggle.js"></script> -->
</body>
</html>