javascript — увеличение времени таймера при отправке формы

Итак, у меня есть страница, на которой пользователь может посмотреть на определенный элемент, и на этой странице он может увидеть время, оставшееся до таймера обратного отсчета (что делается в сценарии js), и сделать ставку для этого элемента, нажав на кнопку кнопка «сделать ставку» Таким образом, время для подачи заявок на этот предмет увеличивается. Поэтому, когда он это делает, он автоматически перенаправляется на ту же страницу, и все перезагружается, и таймер правильно показывает увеличенное время. Но, например, другие пользователи также могут делать ставки, тогда определенный пользователь также должен видеть увеличение времени на странице, когда другие пользователи делают ставки. Я пытаюсь сделать это через Pusher и Echo. Пока что Pusher и Echo работают нормально. Мне просто нужно как-то перезагрузить крайний срок переменной в скрипте через Echo и снова сделать инициализацию часов при проведении аукциона. Как я могу сделать так, чтобы эта переменная присваивала себе новое значение всякий раз, когда кто-либо делает ставку?
Вот что я сделал

auction.blade.php

@extends('layouts.front')

@section('content')
<div>
<h2>
{{ $auction->name }}
</h2>
<hr>
<div class="row">
<div>
<table class="table table-aukcija table-clear">
<tbody>
<tr>
<td>Time remaining:</td>
<td class="counter_polje">
<strong id="clockdiv"></strong>
<br>
<small><em>( {{ date($auction->end_date) }} )</em></small>
</td>
</tr>
<tr>
<td>Num of offers:</td>
<td>{{ $auction->offers }} offers
</tr>
</tbody></table>

<table class="table table-aukcija table-nudjenje table-clear">
<tbody>
<tr>
<td colspan="2" class="table-nudjenje-biding">

<form id="formMojaPonuda" name="formMojaPonuda" action="{{ asset('/auctions/'.$auction->id.'/offer') }}" method="POST" enctype="multipart/form-data">
{{ csrf_field() }}
<div class="input-group">
<input type="hidden" name="minBid" id="minBid" value="{{ $auction->id }}">
<input type="hidden" name="minBid" id="minBid" value="{{ $auction->name }}">
<input type="hidden" name="minBid" id="minBid" value="{{ $auction->descript }}">
<input type="hidden" name="minBid" id="minBid" value="{{ $auction->price }}">
<input type="hidden" name="minBid" id="minBid" value="{{ $auction->end_date }}">
<input name="txtIznos" id="bidValue" type="text" autocomplete="off" placeholder="(min. RSD 1.50)" class="form-control">
<span class="input-group-btn">
<button type="submit" class="btn btn-success">Make a bid</button>
</span>
</div>
</form></td></tr></tbody></table></div></div></div></div>

<div id="app"></div>
<script src="{{ asset('js/app.js') }}"></script>

<script type="text/javascript">
Echo.channel('auctions')
.listen('AuctionMade', e => {
console.log('Auction has been made');
console.log(e);
});
</script>

<script type="text/javascript">
//var deadline = 'September 31 2018 23:59:59 GMT+0100';
var deadline = '<?php echo date($auction->end_date) ?>';
getTimeRemaining(endtime){
var t = Date.parse(endtime) - Date.parse(new Date());
var seconds = Math.floor( (t/1000) % 60 );
var minutes = Math.floor( (t/1000/60) % 60 );
var hours = Math.floor( (t/(1000*60*60)) % 24 );
var days = Math.floor( t/(1000*60*60*24) );
return {
'total': t,
'days': days,
'hours': hours,
'minutes': minutes,
'seconds': seconds
};
}

function initializeClock(id, endtime){
var clock = document.getElementById(id);
var timeinterval = setInterval(function(){
var t = getTimeRemaining(endtime);
/*    clock.innerHTML = 'days: ' + t.days + '<br>' +
'hours: '+ t.hours + '<br>' +
'minutes: ' + t.minutes + '<br>' +
'seconds: ' + t.seconds;
*/
clock.innerHTML = t.days + ' dana ' +
t.hours + ' sati '+
t.minutes + ' minuta ' +
t.seconds + ' sekundi ';
if(t.total<=0){
clearInterval(timeinterval);
}
},1000);
}

initializeClock('clockdiv', deadline);

</script>
@endsection

AuctionMade.php

class AuctionMade implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;

/**
* Create a new event instance.
*
* @return void
*/
public function __construct()
{
//
}

/**
* Get the channels the event should broadcast on.
*
* @return Channel|array
*/
public function broadcastOn()
{
return new Channel('auctions');
}

}

Auction.php (модель)

class Auction
{

public $id;
public $name;
public $descript;
public $meta_name;
public $meta_keyword;
public $price;
public $pic;
public $end_date;
public $offers;
public $offered_by;

public function getAll(){
$result =
DB::table('auctions')
->select('*')
->get();
return $result;
}

public function get(){
$result =
DB::table('auctions')
->select('*')
->where('id', '=', $this->id)
->first();
return $result;
}

//********************** COUNTS NUMBER OF AUCTIONS *****************************

public static function count(){
$result =
DB::table('auctions')
->count();
return $result;
}

public function increment($id){
$result =
DB::table('auctions')
->where('id', $id)
->update([
'offers' => DB::raw('offers + 1'),
'offered_by' => $this->offered_by,
'end_date' => $this->end_date
]);
return $result;
}

}

AuctionController.php

class AuctionController extends Controller
{

private $data = [];

public function show($id)
{
$auction = new Auction();
$auction->id = $id;
$this->data['auction'] = $auction->get();
return view('pages.auction', $this->data);
}

public function offer($id, Request $request){
$auction = new Auction();
$auction->id = $id;
$offered_by = $request->session()->get('user', 'id')[0];
$auction->offered_by = $offered_by->id;
$auction->end_date = Carbon::parse($auction->get()->end_date)->addSecond(7);
$auction->increment($id);
AuctionMade::dispatch();
return redirect()->route('auctionSingle', ['id' => $id]);
}

}

0

Решение

Задача ещё не решена.

Другие решения

Других решений пока нет …

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector