-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathadmin2.html
110 lines (81 loc) · 2.71 KB
/
admin2.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<html>
<head>
<title>Admin</title>
<style type="text/css">
#test { float: left; width: 50%; }
.correct { color: green; }
.incorrect { color: red;}
.hidden { display: none; }
</style>
</head>
<body>
<div id="test">
<div id="trivia-question"></div>
<div id="trivia-answers"></div>
<div id="trivia-response"></div>
<button id="show" class="hidden" type="button">Show Results</button>
<button id="next" type="button">Start</button>
<button id="reset" type="button">reset</button>
</div>
<div id="leaderboard">Waiting for Teams to Join</div>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script src="/socket.io/lib/socket.io.js"></script>
<script>
var socket = io.connect('ws://' + window.location.host);
var renderQuestion = function(data){
console.log('renderQuestion', data)
var answer;
$('#trivia-question').html(data.text);
$('#trivia-answers').html('');
for (var i = 0; i < data.answers.length; i++) {
answer = $('<div>' + data.answers[i].text + '</div>');
if(data.correctAnswer >= 0 && data.correctAnswer == i){
answer.addClass('correct')
} else if(data.correctAnswer >= 0) {
answer.addClass('incorrect')
}
var appended = $('#trivia-answers').append(answer);
};
if(data.correctAnswer >= 0){
console.log('hide show', data)
$('#next').removeClass('hidden')
$('#show').addClass('hidden')
} else {
console.log('show show', data)
$('#next').html('Next').addClass('hidden')
$('#show').removeClass('hidden')
}
}
$('#next').on('click',function(){
$(this).addClass('hidden');
socket.emit('admin', { action: 'next', key: 'qwerty' });
})
$('#reset').on('click',function () {
$('#next').removeClass('hidden')
$('#show').addClass('hidden')
socket.emit('admin', { action: 'reset', key: 'qwerty' });
})
$('#show').on('click',function () {
$('#next').removeClass('hidden')
$('#show').addClass('hidden')
socket.emit('admin', { action: 'end', key: 'qwerty' });
})
socket.on('results',renderQuestion);
socket.on('question',renderQuestion);
socket.on('numresponses',function (data){
$('#trivia-response').html('Responses: ' + data.responses + ' of ' + data.teams + ' Teams')
})
socket.on('teamList', function (data){
console.log('teams', data)
if(data){
var teamNode;
$('#leaderboard').html('');
for(o in data){
teamNode = $('<div>' + data[o].name + ' ('+ data[o].correctAnswers+')</div>');
$('#leaderboard').append(teamNode);
}
}
})
</script>
</body>
</html>