generated from karsten.jeppesen/KAJE-Template
Quizzer-8: Migrating to .NET 10
This commit is contained in:
208
Quizzer-8/Quizzer/Pages/Index.cshtml
Normal file
208
Quizzer-8/Quizzer/Pages/Index.cshtml
Normal file
@@ -0,0 +1,208 @@
|
||||
@page
|
||||
@model IndexModel
|
||||
@{
|
||||
ViewData["Title"] = "Quizzer";
|
||||
}
|
||||
<div class="container-fluid">
|
||||
@if (Model.ucnData.theRole == "teacher" || Model.ucnData.theRole == "developer")
|
||||
{
|
||||
<div class="col-lg-12" style="background-color:cornflowerblue">
|
||||
<h1>@Model.myFullName: Teacher</h1>
|
||||
</div>
|
||||
}
|
||||
@if (Model.ucnData.theRole == "student" || Model.ucnData.theRole == "developer")
|
||||
{
|
||||
// STUDENT PATH
|
||||
@if (Model.StudentState == "QuizzSelect")
|
||||
{
|
||||
<div class="row">
|
||||
<div class="col-xxl-12" style="background-color: cornflowerblue">
|
||||
<h1 style="text-align:center">Quizz Management</h1>
|
||||
</div>
|
||||
<div class="col-xxl-12" style="background-color: cornflowerblue">
|
||||
@Model.myFullName, @Model.ucnData.theClass.FirstOrDefault()
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<table class="table table-striped table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Description</th>
|
||||
<th>Your Score</th>
|
||||
<th>Max Score</th>
|
||||
<th>Reset</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@foreach (var item in Model.PageTests)
|
||||
{
|
||||
<tr>
|
||||
<td>
|
||||
<div class="form-group">
|
||||
<form asp-page="" method="post">
|
||||
<input type="hidden" name="email" value="@item.Journal.PID" />
|
||||
<input type="hidden" name="value" value="@item.Journal.QuizzID" />
|
||||
@if (item.Journal.IsOpen == 1)
|
||||
{
|
||||
<input type="hidden" name="action" value="startTest" />
|
||||
<button type="button" class="btn btn-outline-primary" onclick="javascript:this.form.submit()">Take Quizz</button>
|
||||
}
|
||||
else
|
||||
{
|
||||
<input type="hidden" name="action" value="reviewTest" />
|
||||
<button type="button" class="btn btn-outline-primary" onclick="javascript:this.form.submit()">Review</button>
|
||||
}
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
@item.Text
|
||||
</td>
|
||||
<td>
|
||||
@item.Journal.Score
|
||||
</td>
|
||||
<td>
|
||||
@item.Journal.ScoreAcc
|
||||
</td>
|
||||
<td>
|
||||
@if (item.Journal.Anonymous)
|
||||
{
|
||||
<form asp-page="" method="post">
|
||||
<input type="hidden" name="email" value="@item.Journal.PID" />
|
||||
<input type="hidden" name="target" value="@item.Journal.QuizzID" />
|
||||
<input type="hidden" name="action" value="deleteMyTest" />
|
||||
<button type="button" class="btn btn-warning" onclick="javascript:this.form.submit()">Reset Test</button>
|
||||
</form>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
// if review has been selected then show it
|
||||
@if (Model.PageMCQuestionReview != null)
|
||||
{
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<h2>Review</h2>
|
||||
</div>
|
||||
</div>
|
||||
@for (int qindex = 0; qindex < Model.PageMCQuestionReview.Count; qindex++)
|
||||
{
|
||||
<div class="row" style="background-color:white; opacity: 0.8">
|
||||
<div class="col-lg-12">
|
||||
<table class="table table-striped table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 10%"></th>
|
||||
<th>@Model.PageMCQuestionReview[qindex].QuestionText</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@for (int aindex = 0; aindex < Model.PageMCResponseReview[qindex].Count; aindex++)
|
||||
{
|
||||
<tr>
|
||||
<td>
|
||||
@if (Model.PageMCResponseReview[qindex][aindex])
|
||||
{
|
||||
<i class="bi bi-caret-right-fill" />
|
||||
}
|
||||
</td>
|
||||
@if (Model.PageMCQuestionReview[qindex].AList[aindex].Aok)
|
||||
{
|
||||
<td style="background-color:lightgreen">
|
||||
@Model.PageMCQuestionReview[qindex].AList[aindex].Atxt
|
||||
</td>
|
||||
}
|
||||
else
|
||||
{
|
||||
<td>
|
||||
@Model.PageMCQuestionReview[qindex].AList[aindex].Atxt
|
||||
</td>
|
||||
}
|
||||
</tr>
|
||||
}
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
@if (Model.StudentState == "QuizzRunning")
|
||||
{
|
||||
// We are doing a Quizz
|
||||
<div class="row" style="background-color:white; opacity: 0.8">
|
||||
<div class="col-lg-12">
|
||||
<h2 style="text-align:center">@Model.PageMCQuestion.QuestionText</h2>
|
||||
</div>
|
||||
<form method="post">
|
||||
<input type="hidden" name="action" value="registerAnswer" />
|
||||
<input type="hidden" name="quizzInProgress" value="@Model.PageQuizzID" />
|
||||
<table class="table">
|
||||
@for (int indx = 0; indx < @Model.PageMCQuestion.AList.Count(); indx++)
|
||||
{
|
||||
<tr>
|
||||
<td><input asp-for="@Model.PageMCQuestion.AList[@Model.PageMCRandomized[@indx]].Aok" /></td>
|
||||
<td>@Model.PageMCQuestion.AList[@Model.PageMCRandomized[@indx]].Atxt</td>
|
||||
</tr>
|
||||
}
|
||||
</table>
|
||||
<button type="submit" class="btn btn-success" name="action" value="create"><i class="bi bi-forward"></i></button>
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@if (Model.PageChartConnectors != null)
|
||||
{
|
||||
@if (Model.PageChartConnectors.Count > 2)
|
||||
{
|
||||
<div class="row">
|
||||
<div class="col-xxl-12">
|
||||
<h2>Visual</h2><br />
|
||||
<canvas id="myChart" width="400" height="400"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
@section scripts {
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script>
|
||||
var chartdata = @Html.Raw(Json.Serialize(Model.PageChartConnectors));
|
||||
var theLabels = [];
|
||||
var theDatas = [];
|
||||
var theBackgrounds = [];
|
||||
var theBorders = [];
|
||||
$.each(chartdata, function (index, value) {
|
||||
theLabels.push(value.chartLabel);
|
||||
theDatas.push(value.chartData);
|
||||
theBackgrounds.push(value.chartBackground.toString())
|
||||
theBorders.push(value.chartBorder.toString())
|
||||
});
|
||||
var ctx = document.getElementById('myChart').getContext('2d');
|
||||
var theOptions = {
|
||||
responsive: false,
|
||||
maintainAspectRatio: true,
|
||||
scale: {
|
||||
ticks: {
|
||||
min: 0,
|
||||
max: 100
|
||||
}
|
||||
}
|
||||
};
|
||||
var chart = new Chart(ctx, {
|
||||
type: 'polarArea',
|
||||
options: theOptions,
|
||||
data: {
|
||||
labels: theLabels,
|
||||
datasets: [{
|
||||
label: 'demo',
|
||||
backgroundColor: theBackgrounds,
|
||||
borderColor: theBorders,
|
||||
data: theDatas
|
||||
}]
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
Reference in New Issue
Block a user