Online Quiz Platform in laravel | Online exam system | Online quiz system in laravel | part- 4
Online quiz system in Laravel
Frontend/ExamController.php
<?php
namespace App\Http\Controllers\Frontend;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use App\Model\Quizes;
use App\Model\Questions;
use App\Model\Exams;
use App\Model\Results;
use Sentinel;
class ExamController extends Controller
{
public function __construct()
{
return $this->middleware('member');
}
public function quizList()
{
$quizes=Quizes::orderBy('id','desc')->paginate(30);
return view('frontend.exam.quiz_list',compact('quizes'));
}
public function exam($id)
{
$quiz=Quizes::where('id',$id)->where('status',1)->first();
$questions=Questions::inRandomOrder()->limit($quiz->number_of_question)->where('quizes_id',$quiz->id)->get();
return view('frontend.exam.exam',compact('questions','quiz'));
}
public function examPost(Request $request)
{
$userId=Sentinel::getUser()->id;
$date=date('Y-m-d');
$yes=0;
$no=0;
$data=$request->all();
$result=array();
for($i=1; $i<=$request->index;$i++){
if(isset($data['questions_id'.$i])){
if($exam=Exams::where('user_id',$userId)->where('questions_id',$data['questions_id'.$i])->first()){
}else{
$exam=new Exams;
}
$question=Questions::where('id',$data['questions_id'.$i])->get()->first();
if($question->answer==$data['ans'.$i])
{
$result[$data['questions_id'.$i]]='Yes';
$exam->is_ans="yes";
$yes++;
}else{
$result[$data['questions_id'.$i]]='No';
$exam->is_ans="No";
$no++;
}
$exam->user_id= $userId;
$exam->quizes_id= $question->quizes_id;
$exam->questions_id=$data['questions_id'.$i];
$exam->ans=$data['ans'.$i];
$exam->save();
}
}
if($res=Results::where('user_id',$userId)->where('quizes_id',$request->quizes_id)->first()){
}else{
$res=new Results;
}
$res->user_id= $userId;
$res->quizes_id= $request->quizes_id;
$res->date= $date;
$res->yes_ans=$yes;
$res->no_ans=$no;
$res->result_json=json_encode($result);
$res->save();
return redirect('/MyExamResult')->with('success','Thaks For Join This Exam');
}
public function examResult()
{
$userId=Sentinel::getUser()->id;
$results=Results::orderBy('id','desc')->where('user_id',$userId)->paginate(10);
return view('frontend.exam.result',compact('results'));
}
public function ResultDetails($id)
{
$userId=Sentinel::getUser()->id;
$exams=Exams::where('user_id', $userId)->where('quizes_id',$id)->get();
$quiz=Quizes::find($id);
$questions=Questions::where('quizes_id',$id)->get();
return view('frontend.exam.resultDetails',compact('exams','quiz','questions'));
}
}
Views
quiz_list.blade.php
@extends('layouts.frontend.master')
@section('title','Exam')
@section('meta')
<meta property="og:url" content="https://job.jiboneralo.com/quiz" />
<meta property="og:type" content="website" />
<meta property="og:title" content=" জব প্রস্তুতির সেরা প্লাটফর্ম " />
<meta property="og:description" content=" Exam দিন , নিজেকে যাচাই করুন " />
<meta property="og:image" content="https://job.jiboneralo.com/frontend/images/jobs22.jpg" />
@endsection
@section('banner')
<section class="page-banner services-banner">
<div class="container">
<div class="banner-header">
<h2> Exam</h2>
<span class="underline center"></span>
<p class="lead"></p>
</div>
<div class="breadcrumb">
<ul>
<li><a href="/">Home</a></li>
<li>Exam</li>
</ul>
</div>
</div>
</section>
@endsection
@section('css')
<style type="text/css">
.ul-list li:hover{
background-color: #ffffff;
color: red;
}
.ul-list li{
padding: 10px;
}
.ul-list li a{
font-size:16px;
}
</style>
@endsection
@section('content')
<section class=" ">
<div class="container">
<!-- Go to www.addthis.com/dashboard to customize your tools -->
<div class="addthis_inline_share_toolbox_v09t"></div><br>
<div class="row">
<div class="col-md-12">
<h3>Today Exam</h3><br>
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Sl</th>
<th> Exam Title </th>
<th> Exam Time </th>
<th> Total Question </th>
<th>Action </th>
</tr>
</thead>
<tbody>
@foreach($quizes as $key=>$quz)
<tr>
<td> {{++$key}} </td>
<td> {{$quz->quiz_name}}</td>
<td> {{$quz->quiz_time}}</td>
<td> {{$quz->number_of_question}}</td>
@if(Sentinel::check())
@php
$user=Sentinel::getUser()->id;
$quiz=App\Model\Results::where('user_id',$user)->where('quizes_id',$quz->id)->first();
@endphp
@if($quiz)
<td>Complete </td>
@else
<td><a href="/exam-start/{{$quz->id}}">Strat Exam</a></td>
@endif
@else
<td><a href="/exam-start/{{$quz->id}}">Strat Exam</a></td>
@endif
</tr>
@endforeach
</tbody>
</table>
</div>
{{$quizes->links()}}
</div>
</div>
</div>
</section>
@endsection
exam.blade.php
@extends('layouts.frontend.master')
@section('title','Exam')
@section('banner')
<section class="page-banner services-banner">
<div class="container">
<div class="banner-header">
<h2> Exam</h2>
<span class="underline center"></span>
<p class="lead"></p>
</div>
<div class="breadcrumb">
<ul>
<li><a href="/">Home</a></li>
<li>Exam</li>
</ul>
</div>
</div>
</section>
@endsection
@section('css')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {margin:0;height:2000px;
}
.icon-bar {
position: fixed;
top: 50%;
right: 10%;
z-index: 9999;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
@media only screen and (max-width: 800px) {
.icon-bar {
position: fixed;
top:95%;
right:0;
z-index: 9999;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
}
.icon-bar a {
display: block;
text-align: center;
padding: 16px;
transition: all 0.3s ease;
color: white;
font-size: 20px;
}
.icon-bar a:hover {
background-color: #000;
}
.facebook {
background: #3B5998;
color: white;
}
.content {
margin-left: 75px;
font-size: 30px;
}
</style>
<style type="text/css">
/*.ul-list li:nth-child(2n+1){
background-color: #b30000;
color: #ffffff;
}
.ul-list li:nth-child(2n+1){
background-color: #ff4d4d;
color: #fff;
}*/
.ul-list li:hover{
background-color: #ffffff;
color: red;
}
.ul-list li{
padding: 10px;
}
.ul-list li a{
font-size:16px;
}
</style>
@endsection
@section('content')
<section class=" " oncopy="return false;" oncut="return false;" onpaste="return false;" oncontextmenu="return false;">
<div class="container">
<div class="row">
@if($questions->count()>0)
<p>
Exam Time: <span class="js-timeout" >{{$quiz->quiz_time}}</span>
</p>
<div class="icon-bar" >
<button class="btn btn-lg">Exam Time CountDown : <span class="js-timeout"></span> </button>
</div>
<form action="/exams" method="POST" name="exam">
{{csrf_field()}}
<div class="col-md-12">
@foreach($questions as $key=>$ques)
<input type="hidden" name="questions_id{{$key+1}}" value="{{$ques->id}}">
<input type="hidden" name="ans{{$key+1}}" value="0">
<h5 > {{$key+1}}. {{$ques->question}}</h5>
<ol class="ul-list" style="list-style-type: lower-alpha;" >
@foreach($ques->optionsdata as $opt)
<li><input type="radio" name="ans{{$key+1}}" value="{{$opt->option}}" /> {{$opt->option}} </li>
@endforeach
</ol>
@endforeach
<input type="hidden" name="index" value="<?php echo $key+1 ?>">
<input type="hidden" name="quizes_id" value="{{$quiz->id}}">
</div>
<input type="submit" class="btn btn-sm" value="submit" >
</form>
@else
<h2 style="color: red;"> Opps! No Data Found</h2>
@endif
</div>
</div>
</section>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" ></script>
<script type="text/javascript">
var interval;
var form=document.forms.exam;
function countdown() {
clearInterval(interval);
interval = setInterval( function() {
var timer = $('.js-timeout').html();
timer = timer.split(':');
var minutes = timer[0];
var seconds = timer[1];
seconds -= 1;
if (minutes < 0) return;
else if (seconds < 0 && minutes != 0) {
minutes -= 1;
seconds = 59;
}
else if (seconds < 10 && length.seconds != 2) seconds = '0' + seconds;
$('.js-timeout').html(minutes + ':' + seconds);
if (minutes == 0 && seconds == 0) { clearInterval(interval); form.submit(); alert("Time Over Please Click Ok Button");}
}, 1000);
}
$('.js-timeout').text("{{ $quiz->quiz_time }}");
countdown();
</script>
@endsection
No comments