Skip to content
Snippets Groups Projects
Commit b5ce48ec authored by rxn-yud-u1's avatar rxn-yud-u1
Browse files

Init commit

parents
No related branches found
No related tags found
No related merge requests found
Showing
with 267 additions and 0 deletions
File added
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Verbinden</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" sizes="64x64" href="./imageFiles/parrot-icon.png">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<script src="script.js"></script>
</head>
<body onload="initConnectTask()">
<div class="container-fluid ps-4">
<div class="row">
<div class="col-12 p-4">
<h3 id="taskName">Aufgabe 1 von Rhythmik</h3>
</div>
</div>
<div class="row row-cols-2 justify-content-end">
<div class="col-8 taskField">
<div class="row">
<div class="col-8 p-4 pb-1 mx-4 my-0">
<p id="description">Verbinde die Becher zu den zugehörigen Rhythmen.</p>
</div>
</div>
<div class="row mx-5 justify-content-center align-items-center">
<div class="col-4 mx-5 backArrowEnlarge">
<img id="1" onclick="connectLine(this)" src="./imageFiles/verbinden/1.png"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="2" onclick="connectLine(this)" src="./imageFiles/verbinden/6.png"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="3" src="./imageFiles/verbinden/2.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="4" src="./imageFiles/verbinden/7.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="5" src="./imageFiles/verbinden/3.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="6" src="./imageFiles/verbinden/8.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="7" src="./imageFiles/verbinden/4.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="8" src="./imageFiles/verbinden/9.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="9" src="./imageFiles/verbinden/5.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div class="col-4 mx-5 backArrowEnlarge">
<img id="10" src="./imageFiles/verbinden/10.png" onclick="connectLine(this)"
class="connectingItems" alt="">
</div>
<div id="trashBinConnect">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="currentColor"
class="bi bi-trash backArrowEnlarge" viewBox="0 0 16 16" id="clear"
style="margin-left:10px; margin-top:15px; color: #ff7978" onclick="removeAllLines()">
<path
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
<path fill-rule="evenodd"
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
</svg>
</div>
</div>
</div>
<div class="col-4 justify-content-center align-items-center">
<div id="loraBubbleConnect" class="talk-bubble tri-right round right-in">
<div class="talktext" style="padding: 25px">
<p id="loraTextConnect"></p>
</div>
</div>
<img src="./imageFiles/Parrot-links.png" class="img-fluid" style="max-width: 260px;">
<div class="hintField" style="margin-top: 50px">
<h4 id="hintHeader" style="text-align: center">Tipps</h4>
<p id="hint">Ein Becher bildet einen Ton ab. Stell dir vor du würdest die Becher auf den Tisch
klopfen. Du hast einen Fehler gemacht? Klicke auf den Mülleimer, um deine Antwort zu löschen.
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-12 text-center">
<button onclick="checkConnectTask()" type="button" class="btn btn-lg btn-light enlarge"
style="text-align: center; margin-top: 18px; background-color: #6ebca8; border: none;">Weiter</button>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous">
</script>
<nav class="navbar fixed-bottom navbar-light pt-0 pb-0 ps-5 pe-5">
<a class="navbar-brand enlarge" href="#" onclick="getNotenlehreTask()">
<div data-toggle="tooltip" data-placement="top" title="Notenlehre">
<img src="icons/music-notes-vector-icon.png" class="opacity-100" width="30" alt="">
</div>
</a>
<a class="navbar-brand enlarge" href="#" onclick="getRhythmikTask()">
<div data-toggle="tooltip" data-placement="top" title="Rhythmik">
<img src="icons/eight-rest-in-music.png" height="25" alt="">
</div>
</a>
<a class="navbar-brand enlarge" href="#" onclick="getInstrumentenkundeTask(1)">
<div data-toggle="tooltip" data-placement="top" title="Instrumentenkunde">
<img src="icons/piano-keyboard-musical-instrument-vector-icon.png" width="35" alt="">
</div>
</a>
<a class="navbar-brand enlarge" href="#">
<div data-toggle="tooltip" data-placement="auto" title="Singübungen">
<img src="icons/free-choir-kids-vector-illustration.png" width="60" alt="">
</div>
</a>
<a class="navbar-brand" href="#" style="max-width: 40px" onclick="toProgress()">
<div data-toggle="tooltip" data-placement="top" title="Fortschritt">
<svg xmlns="http://www.w3.org/2000/svg" width="25" fill="currentColor"
class="bi bi-pie-chart-fill enlarge" viewBox="0 0 16 16">
<path
d="M15.985 8.5H8.207l-5.5 5.5a8 8 0 0 0 13.277-5.5zM2 13.292A8 8 0 0 1 7.5.015v7.778l-5.5 5.5zM8.5.015V7.5h7.485A8.001 8.001 0 0 0 8.5.015z" />
</svg>
</div>
</a>
<a class="navbar-brand enlarge" href="#" onclick="logoutUser()">
<div data-toggle="tooltip" data-placement="top" title="Abmelden">
<svg xmlns="http://www.w3.org/2000/svg" width="30" fill="currentColor" class="bi bi-box-arrow-right"
viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0v2z" />
<path fill-rule="evenodd"
d="M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z" />
</svg>
</div>
</a>
</nav>
</body>
</html>
\ No newline at end of file
draw.html 0 → 100644
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="icon" type="image/png" sizes="64x64" href="./imageFiles/parrot-icon.png">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<title>Zeichnen</title>
</head>
<body>
<div class="container-fluid ps-4">
<div class="row">
<div class="col-12 p-4">
<h3 id="taskName">Aufgabe 1 von Notenlehre</h3>
</div>
</div>
<div class="row">
<div class="col-8 taskField">
<div class="row">
<div class="col-8 p-4 mx-4">
<p id="description">Zeichne den Notenschlüssel nach.</p>
</div>
</div>
<div id="canvasContainer">
<canvas id="canvas"></canvas>
</div>
<div id="clearCanvas">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="currentColor"
class="bi bi-trash backArrowEnlarge" viewBox="0 0 16 16" id="clear"
style="margin-left:10px; margin-top:15px; color: #ff7978" onclick="clearCanvas()">
<path
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
<path fill-rule="evenodd"
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
</svg>
</div>
</div>
<div class="col-4 justify-content-center align-items-center">
<div class="talk-bubble tri-right round right-in">
<div class="talktext" style="padding: 25px">
<p id="loraText">Viel Spaß beim Zeichnen!</p>
</div>
</div>
<img src="./imageFiles/Parrot-links.png" class="img-fluid" style="max-width: 260px;">
<div class="hintField" style="margin-top: 50px">
<h4 id="hintHeader" style="text-align: center">Tipps</h4>
<p id="hint">Zeichne der gestrichelten Linie nach, am besten fängst du von innen an. Einen Mülleimer
zum Löschen findest du rechts vom Bild.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-12 text-center">
<button type="button" class="btn btn-lg btn-light enlarge"
style="text-align: center; margin-top: 18px; background-color: #6ebca8; border: none;">Weiter</button>
</div>
</div>
</div>
<nav class="navbar fixed-bottom navbar-light pt-0 pb-0 ps-5 pe-5">
<a class="navbar-brand enlarge" href="#" onclick="getNotenlehreTask()">
<div data-toggle="tooltip" data-placement="top" title="Notenlehre">
<img src="icons/music-notes-vector-icon.png" class="opacity-100" width="30" alt="">
</div>
</a>
<a class="navbar-brand enlarge" href="#" onclick="getRhythmikTask()">
<div data-toggle="tooltip" data-placement="top" title="Rhythmik">
<img src="icons/eight-rest-in-music.png" height="25" alt="">
</div>
</a>
<a class="navbar-brand enlarge" href="#" onclick="getInstrumentenkundeTask(1)">
<div data-toggle="tooltip" data-placement="top" title="Instrumentenkunde">
<img src="icons/piano-keyboard-musical-instrument-vector-icon.png" width="35" alt="">
</div>
</a>
<a class="navbar-brand enlarge" href="#">
<div data-toggle="tooltip" data-placement="auto" title="Singübungen">
<img src="icons/free-choir-kids-vector-illustration.png" width="60" alt="">
</div>
</a>
<a class="navbar-brand" href="#" style="max-width: 40px" onclick="toProgress()">
<div data-toggle="tooltip" data-placement="top" title="Fortschritt">
<svg xmlns="http://www.w3.org/2000/svg" width="25" fill="currentColor"
class="bi bi-pie-chart-fill enlarge" viewBox="0 0 16 16">
<path
d="M15.985 8.5H8.207l-5.5 5.5a8 8 0 0 0 13.277-5.5zM2 13.292A8 8 0 0 1 7.5.015v7.778l-5.5 5.5zM8.5.015V7.5h7.485A8.001 8.001 0 0 0 8.5.015z" />
</svg>
</div>
</a>
<a class="navbar-brand enlarge" href="#" onclick="logoutUser()">
<div data-toggle="tooltip" data-placement="top" title="Abmelden">
<svg xmlns="http://www.w3.org/2000/svg" width="30" fill="currentColor" class="bi bi-box-arrow-right"
viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0v2z" />
<path fill-rule="evenodd"
d="M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z" />
</svg>
</div>
</a>
</nav>
<script src="./script.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa"
crossorigin="anonymous"></script>
</body>
</html>
\ No newline at end of file
File added
File added
icons/eight-rest-in-music.png

68.8 KiB

icons/free-choir-kids-vector-illustration.png

98.4 KiB

icons/music-notes-vector-icon.png

51.5 KiB

icons/piano-keyboard-musical-instrument-vector-icon.png

290 KiB

imageFiles/Parrot-links.png

203 KiB

imageFiles/background.jpg

262 KiB

imageFiles/gitarre.png

1.43 MiB

imageFiles/klavier.png

4.36 MiB

imageFiles/notenSchluessel.png

6.42 MiB

imageFiles/orchester.png

7.41 MiB

imageFiles/orchesterLoesungen.png

9.31 MiB

imageFiles/parrot-icon.png

132 KiB

File added
imageFiles/verbinden/1.png

446 KiB

imageFiles/verbinden/10.png

261 KiB

0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment