Compare commits

..

No commits in common. "master" and "2.2" have entirely different histories.
master ... 2.2

27 changed files with 180 additions and 517 deletions

View File

@ -7,6 +7,7 @@ Familienduell Client / Server (NodeJs Javascript)
### -A- START DES SERVERS!
___Windows___
1. Im Ordner "server" die Datei StartServer.bat doppelklicken.
* Im Fenster das jetzt erscheint sollte: "SERVER IS UP AND RUNNING" stehen.
* Falls die Firewall fragt, solltest du die Anfrage zulassen da sonst der Client nicht verbinden kann.
@ -43,9 +44,6 @@ Q: Warum ist das Display zu Beginn schwarz, und wie kann ich das ändern?
A: Das Bild ist schwarz damit man die Intromusik starten kann und die Leute (Zuschauer) nicht schon vorher wissen was auf sie zukommt.
Dies kann (Im Controller) über die Checkbox "Blackscreen", im Bereich "Intro" kontrolliert werden.
Q: Warum bekomm ich die Fehlermeldung "node.exe wurde falsch geschrieben oder konnte nicht gefunden werden"?<br>
A: Die heruntergeladene zip Datei muss zunächst entpack werden. Rechtsklick auf die Datei -> Alles etpacken.
Q: Wie funktioniert das mit 2 oder mehr Geräten?
A: Alle Geräte müssen im gleichen Netzwerk sein. Dann verwende einfach eine Externe IP des Servers (aus dem Serverfenster) zum verbinden von einem anderen Gerät aus.
@ -71,5 +69,3 @@ Unterstützt durch: DiggerTigger, Anni & Naseile
Danke auch an:
* [flbe](https://github.com/flbe) für den Python Server
* [susgo](https://github.com/susgo) für den Finalmodus
* [ConvalAtGit](https://github.com/ConvalAtGit) für viele Verbesserungen, Redesign und zusätzliche Word und Excel Dokumente
* [fruitcoder](https://github.com/fruitcoder/) Design verbesserungen

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long

View File

@ -1,2 +0,0 @@
[InternetShortcut]
URL=http://127.0.0.1:8080/

File diff suppressed because one or more lines are too long

View File

@ -49,7 +49,7 @@ wss.on('connection', function(ws) {
console.log("~~~~~~~~ WELCOME TO SERVER ~~~~~~ s:"+subscribers.length);
ws.on('message', function(message) {
console.log('msg: ' + message);
var parts = message.toString().split("###");
var parts = message.split("###");
if(parts[0] != "fileOp") {
broadcastMessage(getClientId(), message);
} else {
@ -89,7 +89,7 @@ wss.on('connection', function(ws) {
});
function broadcastMessage(clientId, msg) {
console.log("broadcast:", msg.toString().split("###")[0], "length:", subscribers.length);
console.log("broadcast:"+msg.split("###")[0]+" length:"+subscribers.length);
for(var i=0;i<subscribers.length;i++) {
if(subscribers[i] != null)
subscribers[i].send(msg);

View File

@ -1,27 +1,11 @@
body {
font-family: monospace;
background: url(../img/background.jpg) no-repeat;
background-position: center center;
background-attachment: fixed;
background-size: cover;
display: flex;
align-items: center; /* Vertikale Zentrierung */
justify-content: center; /* Horizontale Zentrierung */
}
#allContent {
position: relative;
}
.textColor {
color:#ddff06;
color:#aeb130;
font-weight:bold;
font-size: 1.5em;
}
.bgColor{
background:#000000;
background:#525463;
}
.antwortInp, .questionIn, .questionKIn {
@ -42,115 +26,28 @@ body {
color:gray;
}
.xmarker {
font-family: Verdana, Helvetica, sans-serif;
font-weight: bold;
z-index: 3;
box-shadow: 3px 5px 35px rgba(0, 0, 0, 0.65);
border: 2px #595959 solid;
border-radius: 2px;
text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.15), 1px 1px 1px rgba(255, 255, 255, 0.20);
font-size: 2em;
background: #595959;
height: 56px;
padding-left: 12px;
padding-right: 12px;
color: rgb(66, 66, 66);
/* box-shadow: 5px 5px 5px -1px rgba(0, 0, 0, 0.65), 0 5px 5px -5px rgba(0, 0, 0, 0.65); */
}
.noIntro {
display:none;
}
.footer {
background:#ddff06;
color: #000000;
}
#buttonsDownUnder {
background: #ffffff;
padding: 20px;
margin-top: 70px;
box-shadow: 3px 5px 35px rgba(0, 0, 0, 0.65);
}
#buttonsDownUnder td{
padding: 5px;
background:#aeb130;
color:rgb(100, 100, 100);
}
.mainHeight {
position: relative;
width: 80vw;
height: 40vw;
min-height: 520px;
min-width: 1020px;
margin: auto;
margin-bottom: 50px;
z-index: 5;
border: 10px #c0c0c0 ridge;
border-radius: 2px;
box-shadow: 3px 5px 35px rgba(0, 0, 0, 0.65);
}
#timer {
background: #000000;
z-index: 5;
border: 10px #c0c0c0 ridge;
border-radius: 2px;
box-shadow: 3px 5px 35px rgba(0, 0, 0, 0.65);
}
#blackScreen {
z-index: 6;
}
#editQuestionsDiv {
border-radius: 2px;
z-index: 7;
height: 530px;
}
#answers {
overflow: hidden;
font-family: monospace;
font-size: 2.5vw;
white-space: nowrap;
}
.answer {
overflow: hidden;
white-space: nowrap;
padding-top: 55px;
padding-left: 18px;
font-size: 1.5em;
}
#displayQuestions {
overflow: hidden;
font-size: 2.5vw;
white-space: unset;
text-overflow: unset;
}
#resultFinal {
font-size: 2.5vw;
}
.questionAnswerContainer {
padding-top: 20px;
padding-left: 20px;
width: calc(100% - 20px);
}
@media (max-width: 1275px) {
#answers {
font-size: 1.5em;
}
#resultFinal {
font-size: 1.5em;
}
#displayQuestions {
white-space: nowrap;
text-overflow: ellipsis;
font-size: 1.5em;
}
position:absolute;
top:15px;
left:15px;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

BIN
web/img/schweinchen.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 116 KiB

BIN
web/img/schweinchen1.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

BIN
web/img/schweinchen2.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 84 KiB

View File

@ -7,76 +7,82 @@
<script type="text/javascript" src="./js/typed.js"></script>
<script type="text/javascript" src="./js/main.js"></script>
<script type="text/javascript" src="./js/components.js"></script>
<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="./css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./css/main.css">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body style="padding:10px;">
<div id="allContent">
<!-- Select between display and controller -->
<div id="startDiv" style="width: 500px; margin: auto;">
<h1 style="font-size: 5em;">Familienduell</h1>
<h1 style="font-size: 5em;">Familien Duell</h1>
<button id="displayBtn" style="font-size: 2em; width:500px;"><i class="fa fa-desktop"></i> DISPLAY</button><br>
<button id="controllerBtn" style="font-size: 2em; width:500px; margin-top:2px;"><i class="fa fa-keyboard-o"></i> CONTROLLER</button>
</div>
<!-- container with all questions, answers, pigs, countdown, intro image, points-->
<div class="topContainer bgColor textColor mainHeight" style="display:none" id="display">
<img id="schweinchen1Img" style="height: 75%; top: 12.5%; position: absolute; left:0; right:0; margin-left: auto; margin-right: auto; display: none; overflow: hidden;" src="./img/schweinchen1.png">
<img id="schweinchen2Img" style="height: 75%; top: 12.5%; position: absolute; left:0; right:0; margin-left: auto; margin-right: auto; display: none;" src="./img/schweinchen2.png">
<img id="schweinchen3Img" style="height: 75%; top: 12.5%; position: absolute; left:0; right:0; margin-left: auto; margin-right: auto; display: none;" src="./img/schweinchen3.png">
<!-- question text is injected in `loadQuestionToGui(index:)` (server.js) -->
<div id="displayQuestions" class="textColor questionAnswerContainer">
</div>
<!-- answer divs are injected in `loadQuestionToGui(index:)` (server.js) -->
<div id="answers" class="questionAnswerContainer">
<hr id="DHR" style="margin:0px; width:100%; position:relative; top:3px; border-top:1px solid black;">
</div>
<div class="bgColor textColor mainHeight" style="display:none; position:relative; width: 1000px; margin: auto;" id="display">
<img id="schweinchenImg" style="margin-left: 200px; margin-top: 70px; display: none;" src="./img/schweinchen.jpg">
<img id="schweinchen1Img" style="margin-left: 200px; margin-top: 70px; display: none;" src="./img/schweinchen1.jpg">
<img id="schweinchen2Img" style="margin-left: 200px; margin-top: 70px; display: none;" src="./img/schweinchen2.jpg">
<div id="displayQuestions" class="textColor">
</div>
<div id="result" style="position:absolute; bottom:65px; right:38px; font-size: 1.5em;">
<div id="answers">
</div>
<div class="noIntro" id="result" style="position:absolute; bottom:115px; right:38px; font-size: 1.5em;">
<div style="float:left; padding-right: 20px;" class="header_summe">SUMME</div>
<div style="float:left; font-size: 0.8em; position: relative; top: 12; left:14px; color: red; cursor:pointer;" class="controller" id="pointsToTheLeft"><i class="fa fa-chevron-left"></i></div>
<div class="noIntro" style="width:50px; float: left; text-align:right;" id="SumRes">0</div>
<div style="float:left; font-size: 0.8em; position: relative; top: 12; color: red; cursor:pointer;" class="controller" id="pointsToTheRight"><i class="fa fa-chevron-right"></i></div>
</div>
<div id="resultFinal" style="position:absolute; bottom:95px; width:100%; font-size: 1.5em; display: none;">
<div style="display: flex;justify-content: center;">
<div class="noIntro" style="width:6%; float: left; text-align:center;" id="SumRes_player1">0</div>
<div class="noIntro" style="width:6%; float: right; text-align:center;" id="SumRes_player2">0</div>
</div>
<div class="noIntro" id="resultFinal" style="position:absolute; bottom:115px; right:465px; font-size: 1.5em; display: none;">
<div class="noIntro" style="width:50px; float: left; text-align:right;" id="SumRes_player1"></div>
<div class="noIntro" style="width:50px; float: left; text-align:right;" id="SumRes_player2"></div>
</div>
<div id="timer" style="position:absolute; top: 50%; left: 50%; width: 400px; margin-left: -200px; margin-top: -143px; text-align: center; padding: 0px 30px 10px 30px; font-size: 200px; display: none;">
20
</div>
<div class="noIntro footer" id="footer1" style="position:absolute; bottom:0px; width:100%; height:50px; font-size: 2em;">
<div style="position:absolute; left:35px; top: -5px;" class="pointsLeft">0</div>
<div style="position:absolute; left:50%; width: 80px; margin-left: -40px; top: -5px; text-align: center" id="pointsCenter">0</div>
<div style="position:absolute; right:35px; top: -5px;" class="pointsRight">0</div>
<div class="noIntro footer" id="footer1" style="position:absolute; bottom:50px; width:100%; height:50px; font-size: 2em;">
<div style="position:absolute; left:5px; top: -5px;" class="pointsLeft">0</div>
<div style="position:absolute; right:5px; top: -5px;" class="pointsRight">0</div>
</div>
<!--<div class="noIntro footer" id="footer2" style="position:absolute; bottom:108px; width:100%; height:5px;"></div>-->
<div class="xmarker noIntro" style="position: absolute; bottom: -64px; left: 34px" ></div>
<div class="xmarker noIntro" style="position: absolute; bottom: -64px; right: 34px" ></div>
<img style="position: absolute; top: 0px; width: 100%; height: 100%;" class="intro" src="./img/logo.png">
</div>
<!-- controller container -->
<div class="noIntro footer" id="footer2" style="position:absolute; bottom:108px; width:100%; height:5px;"></div>
<div class="xmarker noIntro" style="position: absolute; bottom: 0px; left: 34; font-size: 2em; background: #525463; height: 50px; padding-left: 12px; padding-right: 12px; color: rgb(127, 115, 115);" ></div>
<div class="xmarker noIntro" style="position: absolute; bottom: 0px; right: 34; font-size: 2em; background: #525463; height: 50px; padding-left: 12px; padding-right: 12px; color: rgb(127, 115, 115);" ></div>
<img style="position: absolute; top: 0px;" class="intro mainHeight" src="./img/logo.png">
</div>
<div style="display:none;" class="controller">
<div id="editQuestionsDiv" style="display:none; background: rgba(214, 205, 205, 0.95); padding-left:20px; position: absolute; top: 0px; width: 99%; min-height: 100%;">
<i id="closeFragenEditorIcon" style="position: fixed; right: 30px; top: 10px; font-size: 1.2em; cursor:pointer;" class="fa fa-caret-square-o-down"></i>
<h1 style="margin-left:50px;">Frageneditor</h1>
<div>
<ul id="fragenListe">
</ul>
</div>
<div >
<button style="margin-left:50px;" id="addNewQuestionBtn">Neue Frage hinzufügen!</button>
<button style="margin-left:50px; position:fixed; top: 10px; right: 100; font-size: 2em;" id="saveNewQuestions">Speichern!</button>
</div>
</div><br><br><br>
<div id="buttonsDownUnder">
<table border="1">
<tr>
<!-- <td><b>Global</b></td>
<td><b>Server</b></td> -->
<td><b>Global</b></td>
<td><b>Server</b></td>
<td><b>Intro</b></td>
<td><b>Schweinchen</b></td>
<td><b>Optionen</b></td>
<td><b><label for="modeFinal">Finalmodus</b> </label><input id="modeFinal" type="checkbox" style="vertical-align: text-bottom" /> <button style="float:right;" id="finalmodusInfoBtn">Info</button></td>
<td><b>Spielende</b></td>
<td><b>Finalmodus</b> <input id="modeFinal" type="checkbox"> <button style="float:right;" id="finalmodusInfoBtn">Info</button></td>
</tr>
<tr>
<!-- <td><img id="toggleSoundImg" style="cursor:pointer;" width="35px;" src="./img/soundOn.png"></td>
<td><img id="serverSoundImg" style="cursor:pointer;" width="35px;" src="./img/soundOn.png"></td> -->
<td><img id="toggleSoundImg" style="cursor:pointer;" width="35px;" src="./img/soundOn.png"></td>
<td><img id="serverSoundImg" style="cursor:pointer;" width="35px;" src="./img/noSound.png"></td>
<td>
<button style=" display: block" id="startIntroBtn"><i class="fa fa-play"></i> Intro!</button><br>
<label for="blackScreenCheck">Blackscreen:</label> <input id="blackScreenCheck" checked="checked" type="checkbox" style="vertical-align: text-bottom" />
<button style="margin-top: 12px; display: block" id="stopIntroBtn"><i class="fa fa-stop"></i> Intro!</button><br>
<button id="startIntroBtn"><i class="fa fa-play"></i> Intro!</button><br>
<button id="stopIntroBtn"><i class="fa fa-stop"></i> Intro!</button><br>
<img width="20px;" src="./img/noSound.png">
<input id="introVolume" style="width: 50px;" type="range" value="10" name="points" min="0" max="10">
<img width="20px;" src="./img/soundOn.png"><br>
Blackscreen: <input id="blackScreenCheck" checked="checked" type="checkbox">
</td>
<td>
Multiplikator: <input id="pointMultiplicator" type="number" name="" value="1" style="width: 50px;"><br>
@ -84,6 +90,9 @@
<button id="startScheinchenbtn2" value="2"><i class="fa fa-play"></i> Schweinchen (2x)</button><br>
<button id="startScheinchenbtn3" value="3"><i class="fa fa-play"></i> Schweinchen (3x)</button><br>
<button id="stopScheinchenbtn"><i class="fa fa-stop"></i> Schweinchen</button><br>
<img width="20px;" src="./img/noSound.png">
<input id="schweinchenVolume" style="width: 50px;" type="range" value="10" name="points" min="0" max="10">
<img width="20px;" src="./img/soundOn.png">
</td>
<td>
<button id="clearAllFailsBtn">Clear all Fails!</button><br><br>
@ -94,38 +103,33 @@
<tr>
<td>Punkte Rechts: </td> <td><input style="width:50px;" id="mPunkteRight" type="number" value="0"></td><td><button id="newRightPoints">ok</button></td>
</tr>
<tr>
<td>Punkte Summe: </td> <td><input style="width:50px;" id="mPunkteSum" type="number" value="0"></td><td><button id="newSumRes">ok</button></td>
</tr>
</table>
</td>
<td>
<!-- <button id="startAnswerDuplicateBtn"><i class="fa fa-play"></i> Antwort doppelt</button><br>
<button id="startAnswerFailBtn"><i class="fa fa-play"></i> Antwort falsch</button><br>
<img width="20px;" src="./img/noSound.png">
<input id="answerFailVolume" style="width: 50px;" type="range" value="10" name="points" min="0" max="10">
<img width="20px;" src="./img/soundOn.png"> -->
<img width="20px;" src="./img/soundOn.png">
<div>
<label for="spieler1">Spieler 1:</label> <input class="playerTgl finalElement" disabled="true" checked="true" type="radio" value="1" name="fmod" id="spieler1" style="vertical-align: text-bottom" /> <button id="showTimerBtn" disabled="true" class="finalElement">Timer anzeigen</button><br>
<label for="spieler2">Spieler 2:</label> <input class="playerTgl finalElement" disabled="true" type="radio" value="2" name="fmod" id="spieler2" style="vertical-align: text-bottom" /> <button id="startTimerBtn" disabled="true" class="finalElement"><i class="fa fa-play"></i> Timer starten</button><br>
<label for="finalFragenSelect">Frage:</label> <select class="finalElement" disabled="true" id="finalFragenSelect">
<lable>Spieler 1 (links): <input class="playerTgl finalElement" disabled="true" checked="true" type="radio" value="1" name="fmod"></lable><br>
<lable>Spieler 2 (rechts): <input class="playerTgl finalElement" disabled="true" type="radio" value="2" name="fmod"></lable><br>
Frage: <select class="finalElement" disabled="true" id="finalFragenSelect">
<option value="0"> 1</option>
<option value="1"> 2</option>
<option value="2"> 3</option>
<option value="3"> 4</option>
<option value="4"> 5</option>
</select> <button id="stopTimerBtn" disabled="true" class="finalElement"><i class="fa fa-stop"></i> Timer stoppen</button><br>
Alternative Antwort:<br> <input class="finalElement" id="alternateAnswer" maxlength="20" disabled="true" type="text" name=""><button class="finalElement" id="alternateAnswerBtn" disabled="true">setzen</button><br><input type="number" class="finalElement" id="altPointsFinal" disabled="true" placeholder="Alt. Punkte" value="0"><button class="finalElement" id="alternateAnswerPBtn" disabled="true">setzen</button>
</select><br>
Alternative Antwort:<br> <input class="finalElement" id="alternateAnswer" maxlength="20" disabled="true" type="text" name=""><button class="finalElement" id="alternateAnswerBtn" disabled="true">setzen</button><br><input type="number" class="finalElement" id="altPointsFinal" disabled="true" placeholder="Alt. Punkte" value=""><button class="finalElement" id="alternateAnswerPBtn" disabled="true">setzen</button>
</div>
</td>
<td>
<button id="showFinalScores">Show Final Scores</button><br><br>
</td>
</tr>
</table>
<br>
<table>
<tr>
<td><b>Fragenliste:</b><br>
<select style="min-width: 400px;" size="5" id="questionsSelect">
<select style="min-width: 400px;" size="5" id="questionsSelcet">
</select>
</td>
@ -140,26 +144,12 @@
</div>
</div>
<div id="editQuestionsDiv" style="display:none; background: rgba(205, 205, 205, 0.95); padding-left:20px; position: absolute; top: 0px; width: 100%; min-height: 100%;">
<h1 style="margin-left:50px;">Frageneditor</h1>
<div>
<ul id="fragenListe">
</ul>
</div>
<div >
<button style="margin-left:50px; margin-bottom: 50px;" id="addNewQuestionBtn">Neue Frage hinzufügen!</button>
<button style="margin-left:50px; position:fixed; top: 20px; right: 200px; font-size: 2em;" id="saveNewQuestions">Speichern!</button>
<button id="closeFragenEditorIcon" style="margin-left:50px; position:fixed; top: 20px; right: 30px; font-size: 2em;" id="saveNewQuestions">Schließen</button>
<!-- <i id="closeFragenEditorIcon" style="position: fixed; right: 30px; top: 10px; font-size: 1.2em; cursor:pointer;" class="fa fa-caret-square-o-down"></i> -->
</div>
</div>
<div id="connected" style="position:fixed; left:0px; top:0px; padding:5px; display:none;"></div>
<div id="notConnected" style="position:absolute; left:0px; top:0px; padding:5px;"><img width="50px" src="./img/notConnected.png"></div>
<div id="connected" style="position:absolute; left:0px; top:0px; padding:5px; display:none;"></div>
<div id="blackScreen" style="display:none; position:absolute; left:0px; top:0px; width:100%; height:100%; background:black;"></div>
</div>
<div id="printScreen" style="display:none; position:absolute; left:0px; top:0px; width:100%; height:100%; background:white;">
<div id="printDiv"></div>
</div>
<div id="blackScreen" style="display:none; position:absolute; left:0px; top:0px; width:100%; height:100%; background:black;"></div>
<div id="notConnected" style="position:absolute; left:0px; top:0px; padding:5px;"><img width="50px" src="./img/notConnected.png"></div>
</body>
</html>

View File

@ -2,8 +2,7 @@ function init_xmarker() {
var c =0;
$.each($(".xmarker"), function() {
for(var i=0; i<3;i++) {
var span = $('<span class="marker'+(c)+'" style="cursor:pointer; position:relative; top:-5px; padding-left: 4px; padding-right: 4px">X</span>');
var span = $('<span class="marker'+(c)+'" style="cursor:pointer; position:relative; top:-5px; padding-left: 4px; padding-right: 4px">X</span>');
var span = $('<span class="marker'+(c)+'" style="cursor:pointer; position:relative; top:-5px; padding-right: 5px;">X</span>');
console.log("sow"+i);
(function() {

File diff suppressed because one or more lines are too long

View File

@ -5,9 +5,6 @@ var answerFail = null;
var schweinchenVolume = 1;
var answerFailVolume = 1;
var schweinchen = null;
// when the points for a round are assigned, we still want to show the other answers but no points should be calculated by that time
// reset when changing a question
var currentRoundPointsResolved = false;
$(document).ready(function() {
$( "#fragenListe" ).sortable();
@ -36,26 +33,10 @@ $(document).ready(function() {
wsSend("setPlayer2ForFinalMode", player);
});
$("#startAnswerFailBtn").click(function() {
$("#startAnswerFailBtn").click(function() {
wsSend("startAnswerFail", "");
});
$("#startAnswerDuplicateBtn").click(function() {
wsSend("startAnswerDuplicate", "");
});
$("#showTimerBtn").click(function() {
wsSend("showTimer", "");
});
$("#startTimerBtn").click(function() {
wsSend("startTimer", "");
});
$("#stopTimerBtn").click(function() {
wsSend("stopTimer", "");
});
$("#answerFailVolume").on("input", function() {
var v = parseFloat($(this).val()) / 10;
wsSend("setAnswerFailVolume", v);
@ -102,42 +83,18 @@ $(document).ready(function() {
});
$("#upQicon").click(function() {
var index = $("#questionsSelect>option:selected").index();
var index = $("#questionsSelcet>option:selected").index();
index--;
if (isFinalMode) {
var questionSelected = $("#finalFragenSelect").val();
questionSelected--;
if (questionSelected < 0) {
// $("#finalFragenSelect").val(0);
} else {
$("#finalFragenSelect").val(questionSelected)
}
}
if (index > 0) {
setFrageIndex(index);
}
setFrageIndex(index);
});
$("#downQicon").click(function() {
var index = $("#questionsSelect>option:selected").index();
var index = $("#questionsSelcet>option:selected").index();
index++;
if (isFinalMode) {
var questionSelected = $("#finalFragenSelect").val();
questionSelected++;
if (questionSelected > 4) {
// $("#finalFragenSelect").val(0);
} else {
$("#finalFragenSelect").val(questionSelected)
}
}
if (index < 8) {
setFrageIndex(index);
}
setFrageIndex(index);
});
$("#questionsSelect").on("change", function() {
$("#questionsSelcet").on("change", function() {
changeFrage();
});
@ -166,7 +123,6 @@ $(document).ready(function() {
var points = parseFloat($(".pointsRight").text()) + parseFloat($("#SumRes").text())*$("#pointMultiplicator").val();
wsSend("setRightPoints", points);
$("#SumRes").text("0");
$("#pointsCenter").text("0");
});
$("#newLeftPoints").click(function() {
@ -177,10 +133,6 @@ $(document).ready(function() {
wsSend("setRightPoints", $("#mPunkteRight").val());
});
$("#newSumRes").click(function() {
wsSend("setSumRes", $("#mPunkteSum").val());
});
$("#alternateAnswerBtn").click(function(){
var is = $("#finalFragenSelect").val();
var answer = $("#alternateAnswer").val();
@ -201,27 +153,10 @@ $(document).ready(function() {
function setFinalMode(status){
isFinalMode = status == "true" ? true : false;
$(".finalElement").attr("disabled", !isFinalMode);
var index = $("#questionsSelect>option:selected").index();
var index = $("#questionsSelcet>option:selected").index();
index = index > 0 ? index : 0;
$("#answers").empty();
// automatically select first of the final questions (index 3)
if (isFinalMode < 3) {
index = 3;
}
loadQuestionToGui(index);
// manually select option once final mode starts
if (isFinalMode) {
if (index >= 0 && index < $("#questionsSelect").find("option").length) {
$("#questionsSelect").find("option").removeAttr("selected");
$($("#questionsSelect").find("option")[index]).prop("selected", "true");
}
if ($("#questionsSelect>option:selected").index() == -1 && $("#questionsSelect").find("option")[0]) {
$($("#questionsSelect").find("option")[0]).prop("selected", "true");
}
}
}
function setPlayer2(value){
@ -245,8 +180,6 @@ function showQuestionsAsPrint() {
function setLeftPoints(newPoints) {
$(".pointsLeft").text(newPoints);
$("#mPunkteLeft").val(newPoints);
$("#sumRes").text("0");
$("#pointsCenter").text("0");
if(sounds && (display || serverSound)) {
audio = new Audio('./sounds/zahlRichtig.ogg');
audio.play();
@ -256,97 +189,31 @@ function setLeftPoints(newPoints) {
function setRightPoints(newPoints) {
$(".pointsRight").text(newPoints);
$("#mPunkteRight").val(newPoints);
$("#sumRes").text("0");
$("#pointsCenter").text("0");
if(sounds && (display || serverSound)) {
audio = new Audio('./sounds/zahlRichtig.ogg');
audio.play();
}
}
function setSumRes(newSumRes) {
$('#SumRes').text(newSumRes);
$("#mPunkteSum").val(newSumRes);
recalcSum(0);
}
function startAnswerFail() {
if (sounds && (display || serverSound)) {
answerFail = new Audio('./sounds/failOriginal.ogg');
if(sounds && (display || serverSound)) {
answerFail = new Audio('./sounds/failFinal.ogg');
answerFail.volume = answerFailVolume;
answerFail.play();
}
}
function startAnswerDuplicate() {
if (sounds && (display || serverSound)) {
answerDuplicate = new Audio('./sounds/failFinal.ogg');
answerDuplicate.volume = answerFailVolume;
answerDuplicate.play();
}
}
function showTimer() {
if (display) {
if (player2) {
$("#timer").text("25");
} else {
$("#timer").text("20");
}
$("#timer").fadeIn();
}
}
function startTimer() {
if (display) {
var timer = parseInt($("#timer").text());
if ((timer == 20 && !player2) || (player2 && timer == 25)) {
if (sounds && (display || serverSound)) {
// window.document.timerTick = new Audio('./sounds/tick.ogg');
// window.document.timerTick.volume = answerFailVolume;
// window.document.timerTick.play();
}
window.document.timerId = setInterval(function() { startTimer(); }, 1000);
}
timer--;
if (timer > 0) {
$("#timer").text(timer);
} else {
clearInterval(window.document.timerId);
// window.document.timerTick.pause();
// window.document.timerTick.currentTime = 0;
$("#timer").fadeOut();
if (sounds && (display || serverSound)) {
timerEnd = new Audio('./sounds/failOriginal.ogg');
timerEnd.volume = answerFailVolume;
timerEnd.play();
}
}
}
}
function stopTimer() {
if (display) {
clearInterval(window.document.timerId);
// window.document.timerTick.pause();
// window.document.timerTick.currentTime = 0;
$("#timer").fadeOut();
}
}
function startSchweinchen() {
if (runde == 2){
$("#schweinchen2Img").show("blind", { direction: "left" }, 1500);
$("#schweinchen2Img").show();
} else if (runde == 3){
$("#schweinchen3Img").show("blind", { direction: "left" }, 1500);
$("#schweinchenImg").show();
} else {
$("#schweinchen1Img").show("blind", { direction: "left" }, 1500);
$("#schweinchen1Img").show();
}
$("#answers").hide();
$("#displayQuestions").hide();
$("#result").hide();
$(".footer").hide();
if(sounds && (display || serverSound)) {
schweinchen = new Audio('./sounds/schweinchen.ogg');
@ -356,15 +223,15 @@ function startSchweinchen() {
}
function stopSchweinchen() {
var index = $("#questionsSelect>option:selected").index();
$("#questionsSelect").val(index+1);
var index = $("#questionsSelcet>option:selected").index();
$("#questionsSelcet").val(index+1);
changeFrage();
$("#schweinchen3Img").stop(true, true).hide();
$("#schweinchen1Img").stop(true, true).hide();
$("#schweinchen2Img").stop(true, true).hide();
$("#result").show();
$(".footer").show("blind", { direction: "left" }, 1500);
$("#schweinchenImg").hide();
$("#schweinchen1Img").hide();
$("#schweinchen2Img").hide();
$("#answers").show();
$("#displayQuestions").show();
if(schweinchen) {
schweinchen.pause();
}
@ -372,7 +239,10 @@ function stopSchweinchen() {
function hideIntro() {
$(".noIntro").show();
$(".intro").fadeOut();
$(".intro").hide();
if(!$("#modeFinal").is(":checked")) {
$("#resultFinal").hide();
}
if(intro) {
intro.pause();
}
@ -380,7 +250,7 @@ function hideIntro() {
function showIntro() {
$(".noIntro").hide();
$(".intro").fadeIn();
$(".intro").show();
if(sounds && (display || serverSound)) {
intro = new Audio('./sounds/intro.ogg');
intro.volume = introVolume;
@ -389,84 +259,80 @@ function showIntro() {
}
function fillFragenSelect() {
$("#questionsSelect").empty();
$("#questionsSelcet").empty();
for(var i=0;i<fragen.length;i++) {
$("#questionsSelect").append('<option value="'+i+'">'+fragen[i]["kuerzel"]+'</option>');
$("#questionsSelcet").append('<option value="'+i+'">'+fragen[i]["kuerzel"]+'</option>');
}
}
function setFrageIndex(index) {
if (index >= 0 && index < $("#questionsSelect").find("option").length) {
$("#questionsSelect").find("option").removeAttr("selected");
$($("#questionsSelect").find("option")[index]).prop("selected", "true");
}
if ($("#questionsSelect>option:selected").index() == -1 && $("#questionsSelect").find("option")[0]) {
$($("#questionsSelect").find("option")[0]).prop("selected", "true");
if(index >= 0 && index < $("#questionsSelcet").find("option").length) {
$("#questionsSelcet").find("option").removeAttr("selected");
$($("#questionsSelcet").find("option")[index]).prop("selected", "true");
}
if($("#questionsSelcet>option:selected").index() == -1 && $("#questionsSelcet").find("option")[0] )
$($("#questionsSelcet").find("option")[0]).prop("selected", "true");
changeFrage();
}
function changeFrage() {
var index = $("#questionsSelect>option:selected").index();
var index = $("#questionsSelcet>option:selected").index();
wsSend("loadQuestion", index);
wsSend("clearAllFailsBtn", "");
wsSend("resetPointsResolvedFlag", "false");
}
function loadQuestionToGui(index) {
$("#schweinchen3Img").hide();
$("#schweinchenImg").hide();
$("#schweinchen1Img").hide();
$("#schweinchen2Img").hide();
$("#answers").empty();
$(".pointsLeft").toggle(!isFinalMode);
$(".pointsRight").toggle(!isFinalMode);
$(".xmarker").toggle(!isFinalMode);
$('.footer').toggle(!isFinalMode);
$('.xmarker').toggle(!isFinalMode);
$("#ResSum_player1").toggle(isFinalMode);
$("#ResSum_player2").toggle(isFinalMode);
if (isFinalMode){
$("#resultFinal").show();
$(".footer").hide();
} else {
if (!isFinalMode){
$("#resultFinal").hide();
} else {
$("#resultFinal").show();
}
$("#result").toggle(!isFinalMode);
if(index > -1) {
$("#displayQuestions").html(fragen[index]["frage"]);
if (isFinalMode && display){
if (isFinalMode){
$("#displayQuestions").hide();
} else {
$("#displayQuestions").show("blind", { direction: "left" }, 1500);
$("#displayQuestions").show();
}
var anzahlFragen = fragen[index]["antworten"].length;
if (isFinalMode) {
anzahlFragen = 5;
}
for (var i = 0; i < anzahlFragen; i++) {
if(isFinalMode || fragen[index]["antworten"][i]["antwort"] != "") {
if (isFinalMode) {
var oneLine = $('<div>' +
'<div style="width: 44%; float: left; text-align: center" class="answer"></div>' +
'<div style="width: 6%; float: left; text-align: center" class="points"></div>' +
'<div style="width: 6%; float: left; text-align: center" class="points_player2"></div>' +
'<div style="width: 44%; float: left; text-align: center" class="answer_player2"></div>' +
var answerLength = isFinalMode&&display ? 5 : fragen[index]["antworten"].length;
for(var i=0;i<answerLength;i++) {
if(fragen[index]["antworten"][i]["antwort"] != "") {
if (!isFinalMode) {
var oneLine = $('<div style="height:55px">' +
'<div style="width: 52px; float: left;" class="nr">' + (i + 1) + '.</div>' +
'<div style="width: 860px; float: left;" class="answer"></div>' +
'<div style="width: 52px; float: left;" class="points"></div>' +
'</div>');
} else {
var oneLine = $('<div>' +
'<div style="width: 5%; text-align: center; float: left;" class="nr">' + (i + 1) + '.</div>' +
'<div style="width: 89%; text-align: center; float: left" class="answer"></div>' +
'<div style="width: 6%; float: left; text-align: right" class="points"></div>' +
var oneLine = $('<div style="margin-left: 20px; height:55px">' +
'<div style="margin-left: 15px; width: 400px; float: left;" class="answer"></div>' +
'<div style="width: 52px; float: left;" class="points"></div>' +
'<div style="width: 65px; float: left;" class="points_player2"></div>' +
'<div style="width: 400px; float: left;" class="answer_player2"></div>' +
'</div>');
}
if(display && !player2) {
oneLine.find(".answer").text("..............................................................................................................");
oneLine.find(".points").text("--");
if (isFinalMode) {
oneLine.find(".answer").text("_ _ _ _ _ _ _ _ _ _ _");
} else {
oneLine.find(".answer").text("_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _");
}
oneLine.find(".points").text("--");
if (isFinalMode){
oneLine.find(".points_player2").text("--");
oneLine.find(".answer_player2").text("..............................................................................................................");
// oneLine.find(".answer_player2").text("_ _ _ _ _ _ _ _ _ _ _");
oneLine.find(".answer_player2").text("_ _ _ _ _ _ _ _ _ _ _");
}
} else if (!display) {
oneLine.find(".answer").html('<span class="markOnHover">'+getAnswerString(fragen[index]["antworten"][i]["antwort"])+'</span>');
@ -479,13 +345,17 @@ function loadQuestionToGui(index) {
if (isFinalMode){
is = $("#finalFragenSelect").val();
}
wsSend("setAnswer", is+"###"+frage["antworten"][is2]["antwort"]);
if($(this).find(".markOnHover").length>0) { //Dont send twice
wsSend("setAnswer", is+"###"+frage["antworten"][is2]["antwort"]);
}
});
oneLine.find(".points").click(function() {
if (isFinalMode){
is = $("#finalFragenSelect").val();
}
wsSend("setAnz", is+"###"+frage["antworten"][is2]["anz"]);
if($(this).find(".markOnHover").length>0) { //Dont send twice
wsSend("setAnz", is+"###"+frage["antworten"][is2]["anz"]);
}
});
})();
}
@ -494,8 +364,7 @@ function loadQuestionToGui(index) {
}
}
if (!isFinalMode) {
$("#SumRes").text("0");
$("#answers").show("blind", { direction: "left" }, 1500);
$("#SumRes").text("0");
}
if(!display)
$("#resultFinal").hide();
@ -519,18 +388,17 @@ function setAnswer(index, answer) {
}
answer = getAnswerString(answer);
var el = $($("#answers").find(answer_select)[index]);
//el.empty();
el.empty();
if(sounds && (display || serverSound)) {
audio = new Audio('./sounds/textRichtig.ogg');
audio.play();
}
el.typed({
strings: [answer],
typeSpeed: 10,
overwrite: true,
typeSpeed: 1,
showCursor: false,
cursorChar: "",
fadeOut: false,
fadeOut: true,
fadeOutDelay: 0,
});
}
@ -571,47 +439,23 @@ function recalcSum(s) {
});
$("#SumRes_player1").text(p1p);
$("#SumRes_player2").text(p2p);
if (display) {
$("#pointsCenter").text(p1p + p2p);
} else {
$("#pointsCenter").text("");
}
} else {
$(sum_selector).text(parseFloat($(sum_selector).text())+parseFloat(s));
$("#pointsCenter").text(parseFloat($(sum_selector).text())*runde);
}
}
// Add the scores from the final rounds to the current scores from previous rounds
function showFinalScores() {
$("#answers").hide();
$("#displayQuestions").hide();
$("#result").hide();
$("#resultFinal").hide();
$("#pointsCenter").hide();
$(".pointsLeft").show();
$(".pointsRight").show();
const leftFinalScore = parseFloat($("#SumRes_player1").text());
const rightFinalScore = parseFloat($("#SumRes_player2").text());
$(".pointsLeft").text(parseFloat($(".pointsLeft").text()) + leftFinalScore);
$(".pointsRight").text(parseFloat($(".pointsRight").text()) + rightFinalScore);
// show final scores with blinds
$(".footer").show("blind", { direction: "left" }, 1500);
}
function getAnswerString(str) {
var anz = str.length;
if(anz%2==0) {
str+="_";
}
anz = str.length;
var maxLength = 40;
if (isFinalMode){
while(str.length < 24) {
str = " " + str;
}
} else {
str += " ";
while(str.length < 47) {
str += ".";
}
maxLength = 20;
}
while(str.length < maxLength) {
str+= " _";
}
return str;
}

View File

@ -139,8 +139,6 @@
// Check if there is some text in the element, if yes start by backspacing the default message
if (elContent.length == 0) {
self.typewrite(self.strings[self.sequence[self.arrayPos]], self.strPos);
} else if (self.options && self.options.overwrite) {
self.typewrite(self.strings[self.sequence[self.arrayPos]], self.strPos);
} else {
self.backspace(elContent, elContent.length);
}
@ -167,17 +165,13 @@
this.init();
},
// pass current string state to each function, types 1 char per call, if overwrite is true the existing string will be replaced char by char
typewrite: function(curString, curStrPos, curOverwritePos) {
// pass current string state to each function, types 1 char per call
typewrite: function(curString, curStrPos) {
// exit when stopped
if (this.stop === true) {
return;
}
if (!curOverwritePos) {
curOverwritePos = curStrPos;
}
if (this.fadeOut && this.el.classList.contains(this.fadeOutClass)) {
this.el.classList.remove(this.fadeOutClass);
this.cursor.classList.remove(this.fadeOutClass);
@ -269,9 +263,6 @@
// start typing each new char into existing string
// curString: arg, self.el.html: original text inside element
var nextString = curString.substr(0, curStrPos + 1);
if (self.options && self.options.overwrite) {
nextString += self.el.textContent.substr(curOverwritePos + 1);
}
if (self.attr) {
self.el.setAttribute(self.attr, nextString);
} else {
@ -286,9 +277,8 @@
// add characters one by one
curStrPos++;
curOverwritePos++;
// loop the function
self.typewrite(curString, curStrPos, curOverwritePos);
self.typewrite(curString, curStrPos);
}
// end of character pause
}, charPause);
@ -446,9 +436,7 @@
var self = this;
clearInterval(self.timeout);
var id = this.el.getAttribute('id');
if (!self.options || !self.options.overwrite) {
this.el.textContent = '';
}
this.el.textContent = '';
if (typeof this.cursor !== 'undefined' && typeof this.cursor.parentNode !== 'undefined') {
this.cursor.parentNode.removeChild(this.cursor);
}
@ -498,8 +486,6 @@
backSpeed: 0,
// shuffle the strings
shuffle: false,
// existing text will be overwritten instead of removing it first
overwrite: false,
// time before backspacing
backDelay: 500,
// Fade out instead of backspace

View File

@ -8,7 +8,7 @@ var sounds = true;
var ws;
var display = true;
var audio = null;
var serverSound = true;
var serverSound = false;
var isFinalMode = false;
var player2 = false;
var runde = 1;
@ -21,13 +21,6 @@ if(window.location.href.indexOf("viewonly")!==-1) {
$(document).ready(function() {
$("#displayBtn").click(function() {
if (this.requestFullScreen) {
this.requestFullScreen();
} else if (this.mozRequestFullScreen) {
this.mozRequestFullScreen();
} else if (this.webkitRequestFullScreen) {
this.webkitRequestFullScreen();
}
$("#startDiv").hide();
$("#display").show();
$(".controller").hide();
@ -40,23 +33,12 @@ $(document).ready(function() {
$("#display").show();
$(".controller").show();
display = false;
// nice css manipulation 🤢#hack
$(".mainHeight").css("width", 1020);
$(".mainHeight").css("height", 520);
$(".mainHeight").css("padding-top", "");
$("#answers").css("font-size", "1.5em");
$("#displayQuestions").css("font-size", "1.5em");
});
$("#clearAllFailsBtn").click(function() {
wsSend("clearAllFailsBtn", "");
});
$("#showFinalScores").click(function() {
wsSend("showFinalScores", "");
});
$("#toggleSoundImg").click(function() {
wsSend("toggleSound", "");
});
@ -104,29 +86,24 @@ var connectWs = function() {
return null;
}
ws.onmessage = async function (event) {
console.log("msg: "+event.data.toString())
let tempSt = event.data.toString();
if(typeof(tempSt) != "string") {
tempSt = await new Response(tempSt).text()
}
messageParts_a = tempSt.split("###");
ws.onmessage = function (event) {
console.log("msg: "+event.data)
messageParts_a = event.data.split("###");
var key = messageParts_a[0];
var value = messageParts_a[1];
if(key =="setFail") {
if($(".marker"+value).css("color") == "rgb(66, 66, 66)") {
if($(".marker"+value).css("color") == "rgb(127, 115, 115)") {
$(".marker"+value).css("color","rgb(211, 16, 16)");
if(sounds && (display || serverSound)) {
audio = new Audio('./sounds/fail.ogg');
audio.play();
}
} else {
$(".marker"+value).css("color","rgb(66, 66, 66)");
$(".marker"+value).css("color","rgb(127, 115, 115)");
}
} else if(key == "clearAllFailsBtn") {
$.each($(".xmarker").find("span"), function() {
$(this).css("color","rgb(66, 66, 66)");
$(this).css("color","rgb(127, 115, 115)");
});
} else if(key == "toggleSound") {
if(sounds) {
@ -138,8 +115,6 @@ var connectWs = function() {
$("#toggleSoundImg").attr("src", "./img/soundOn.png");
sounds = true;
}
} else if(key == "showFinalScores") {
showFinalScores()
} else if(key == "file") {
if(value == "fragen.txt") {
try {
@ -170,18 +145,8 @@ var connectWs = function() {
setLeftPoints(value);
} else if(key == "setRightPoints") {
setRightPoints(value);
} else if(key == "setSumRes") {
setSumRes(value);
} else if(key == "startAnswerFail") {
startAnswerFail();
} else if(key == "startAnswerDuplicate") {
startAnswerDuplicate();
} else if(key == "showTimer") {
showTimer();
} else if(key == "startTimer") {
startTimer();
} else if(key == "stopTimer") {
stopTimer();
} else if(key == "setAnswerFailVolume") {
answerFailVolume = value;
if(answerFail != null)
@ -195,13 +160,8 @@ var connectWs = function() {
if(schweinchen != null)
schweinchen.volume = schweinchenVolume;
} else if(key == "toggleBlackScreen") {
if (display) {
if ($("#blackScreen").css("display") === "none") {
$("#blackScreen").fadeIn(500);
} else {
$("#blackScreen").fadeOut(6000);
}
// $("#blackScreen").toggle();
if(display) {
$("#blackScreen").toggle();
}
} else if (key == "toggleFinalMode"){
setFinalMode(value);

Binary file not shown.

BIN
web/sounds/fail_old.ogg Normal file

Binary file not shown.