A simple system for creating multiple-choice questions for an audience to answer on their phones. Responses are tallied and displayed in real-time. https://openquestion.netsyms.com
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

128 lines
5.1 KiB

<?php
include __DIR__ . "/../bits/navbar.php";
?>
<style nonce="<?php echo $SECURE_NONCE; ?>">
.progress {
height: 2vh;
}
</style>
<div class="container">
<?php if (!$database->has('questions', ['qcode' => $arg1])) { ?>
<div class="alert alert-warning">Whoops! There isn't a question with that ID code.</div>
<?php
die();
}
?>
<?php
$qid = $database->get('questions', 'qid', ['qcode' => $arg1]);
?>
<div class="row mt-4">
<div class="col-12 col-md-6">
<h1><?php echo $database->get('questions', 'qtext', ['qid' => $qid]); ?></h1>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-body">
<h5><?php
$url = ""; //(isset($_SERVER['https']) && $_SERVER['https'] != "" ? "https" : "http") . "://";
$url .= $_SERVER['HTTP_HOST'];
$url .= SITE_PATH . "respond";
echo $url;
?></h5>
<h3>Code: <?php echo $arg1; ?></h3>
</div>
</div>
</div>
</div>
<div class="nav nav-tabs">
<a class="nav-item nav-link active" data-toggle="tab" href="#totals" role="tab">Totals</a>
<a class="nav-item nav-link" data-toggle="tab" href="#results" role="tab">Results</a>
</div>
<div class="tab-content">
<div class="list-group tab-pane fade show active" id="totals" role="tabpanel">
<?php
$total = $database->count('responses', ['qid' => $qid]);
$answers = $database->select('answers', ['aid', 'atext'], ['qid' => $qid]);
$colors = ["primary", "success", "danger", "info", "warning"];
$color = -1;
foreach ($answers as $a) {
$color++;
if ($color > count($colors) - 1) {
$color = 0;
}
$votes = $database->count('responses', ['aid' => $a['aid']]);
?>
<div class="list-group-item">
<h3 class="d-flex"><?php echo $a['atext']; ?> <span class="small ml-auto" id="votes_<?php echo $a['aid']; ?>"><?php echo $votes; ?> votes</span></h3>
<style nonce="<?php echo $SECURE_NONCE; ?>">
#progress_<?php echo $a['aid']; ?> {
width: <?php echo ($votes / $total) * 100.0; ?>%;
}
</style>
<div class="progress">
<div id="progress_<?php echo $a['aid']; ?>" class="progress-bar bg-<?php echo $colors[$color]; ?>" role="progressbar"></div>
</div>
</div>
<?php
}
?>
</div>
<div class="tab-pane fade card-columns pt-3" id="results" role="tabpanel">
<?php
$color = -1;
foreach ($answers as $a) {
$color++;
if ($color > count($colors) - 1) {
$color = 0;
}
?>
<div class="card border-<?php echo $colors[$color]; ?>">
<div class="card-body">
<h4 class="card-title text-<?php echo $colors[$color]; ?>"><?php echo $a['atext']; ?></h4>
<div class="list-group" id="answer_<?php echo $a['aid']; ?>_list">
<?php
$users = $database->select('responses', 'name', ['aid' => $a['aid']]);
foreach ($users as $u) {
if ($u == null) {
$u = "Anonymous";
}
?>
<div class="list-group-item">
<?php echo $u; ?>
</div>
<?php
}
?>
</div>
</div>
</div>
<?php
}
?>
</div>
</div>
</div>
<script nonce="<?php echo $SECURE_NONCE; ?>">
setInterval(function () {
$.getJSON('<?php echo SITE_PATH; ?>getresults.php', {
qid: <?php echo $qid; ?>
}, function (data) {
var answers = data['answers'];
var responses = data['responses'];
for (var i = 0; i < answers.length; i++) {
$('#progress_' + answers[i]['id']).css('width', answers[i]['percent']);
$('#votes_' + answers[i]['id']).text(answers[i]['votes'] + " votes");
}
for (var i = 0; i < responses.length; i++) {
$('#answer_' + responses[i]['aid'] + "_list").html("");
}
for (var i = 0; i < responses.length; i++) {
$('#answer_' + responses[i]['aid'] + "_list").append("<div class=\"list-group-item\">" + responses[i]['name'] + "</div>");
}
});
}, 1000);
</script>