@extends('layouts.master')

@section('content')
<style>
	.radio-label {
		position: absolute;
		margin: -2px 0px 0px 7px;
		cursor: pointer;
	}

	.radio {
		margin-top: -4px;
	}
</style>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
	<!-- Content Header (Page header) -->
	<div class="content-header">
		<div class="container-fluid">
			<div class="row mb-2">
				<div class="col-sm-6">
					<h1 class="m-0 text-dark">{{ trans('breadcrumbs.Create Game') }}</h1>
				</div>
				<!-- /.col -->
				<div class="col-sm-3"></div>
				<div class="col-sm-3">
					<ol class="breadcrumb float-sm-right">
						<li class="breadcrumb-item">{{ Breadcrumbs::render('Create Game') }}</li>
					</ol>
				</div>
				<!-- /.col -->
			</div>
			<!-- /.row -->
		</div>
		<!-- /.container-fluid -->
	</div>
	<!-- /.content-header -->

	<section class="content">
		<div class="card" id="filterDiv">
			<div class="card-header">
				<form id="createGame-form">
					<h3 class="card-title">{{ trans('game.Game Configuration') }}</h3>
					<div class="card-primary card-form-1">
						<div class="card-body">
							@csrf
							<div class="form-col-1">
								{{ Form::label('tableName', trans('game.Table name'), ['class' => 'required']) }}
								{{ Form::text('tableName', '', ['id' => 'tableName', 'class' => 'form-control', 'placeholder' => trans('game.Table name')]) }}
								<span id="tableName-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('gameType',  trans('game.Game type'), ['class' => 'required'])}}
								{{ Form::select('gameType', $gameType, '', ['class' => 'form-control select2', 'id' => 'gameType', 'placeholder' => 'Select']) }}
								<span id="gameType-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('currencyType',  trans('game.Currency type'), ['class' => 'required'])}}
								{{ Form::select('currencyType', $currencyType, '', ['class' => 'form-control select2', 'id' => 'currencyType', 'placeholder' => 'Select']) }}
								<span id="currencyType-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('minimumPlayers',  trans('game.Minimum Players'), ['class' => 'required'])}}
								{{ Form::select('minimumPlayers', $minimumPlayers, '', ['class' => 'form-control select2', 'id' => 'minimumPlayers', 'placeholder' => 'Select']) }}
								<span id="minimumPlayers-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('maximumPlayers',  trans('game.Maximum Players'), ['class' => 'required'])}}
								{{ Form::select('maximumPlayers', $maximumPlayers, '', ['class' => 'form-control select2', 'id' => 'maximumPlayers', 'placeholder' => 'Select']) }}
								<span id="maximumPlayers-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('status',  trans('game.Status'), ['class' => 'required'])}}
								{{ Form::select('status', $status, '', ['class' => 'form-control select2', 'id' => 'status', 'placeholder' => 'Select']) }}
								<span id="status-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('smallBlind', trans('game.Small Blind'), ['class' => 'required']) }}
								{{ Form::text('smallBlind', '', ['id' => 'smallBlind', 'class' => 'form-control number', 'maxlength' => '5']) }}
								<span id="smallBlind-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('bigBlind', trans('game.Big Blind'), ['class' => 'required']) }}
								{{ Form::number('bigBlind', '', ['id' => 'bigBlind', 'class' => 'form-control number', 'readonly' => 'readonly']) }}
								<span id="bigBlind-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1"></div>
							<div class="form-col-1">
								<label class="radio"><input type="checkbox" name="straddle" value="1"><span class="radio-label">{{ trans('game.Straddle') }}</span></label>
							</div>
							<div class="form-col-1">
								<label class="radio"><input type="checkbox" name="anonymusTable" value="1"><span class="radio-label">{{ trans('game.Anonymous Table') }}</span></label>
							</div>
							<div class="form-col-1">
								<label class="radio"><input type="checkbox" name="runItTwice" value="1"><span class="radio-label">{{ trans('game.Run It Twice') }}</span></label>
							</div>
							<div class="form-col-1">
								{{ Form::label('minimumBuyIn', trans('game.Minimum (Buy-in)'), ['class' => 'required']) }}
								{{ Form::text('minimumBuyIn', '', ['id' => 'minimumBuyIn', 'class' => 'form-control number', 'maxlength' => '3']) }}
								<span id="minimumBuyIn-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('maximumBuyIn', trans('game.Maximum (Buy-in)'), ['class' => 'required']) }}
								{{ Form::text('maximumBuyIn', '', ['id' => 'maximumBuyIn', 'class' => 'form-control number', 'maxlength' => '5']) }}
								<span id="maximumBuyIn-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('limit',  trans('game.Limit'), ['class' => 'required'])}}
								{{ Form::select('limit', $limit, '', ['class' => 'form-control select2', 'id' => 'limit', 'placeholder' => 'Select']) }}
								<span id="limit-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('rake', trans('game.Rake (%)'), ['class' => 'required']) }}
								{{ Form::text('rake', '', ['id' => 'rake', 'class' => 'form-control number', 'maxlength' => '3']) }}
								<span id="rake-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('rakeHeadsUp', trans('game.Rake (Heads up%)'), ['class' => 'required']) }}
								{{ Form::text('rakeHeadsUp', '', ['id' => 'rakeHeadsUp', 'class' => 'form-control number', 'maxlength' => '3']) }}
								<span id="rakeHeadsUp-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('rakeCap', trans('game.Rake Cap(<=3)'), ['class' => 'required']) }}
								{{ Form::text('rakeCap', '', ['id' => 'rakeCap', 'class' => 'form-control number', 'maxlength' => '5']) }}
								<span id="rakeCap-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('rakeCap1', trans('game.Rake Cap(>3)'), ['class' => 'required']) }}
								{{ Form::text('rakeCap1', '', ['id' => 'rakeCap1', 'class' => 'form-control number', 'maxlength' => '5']) }}
								<span id="rakeCap1-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('rakeCap2', trans('game.Rake Cap(>6)'), ['class' => 'required']) }}
								{{ Form::text('rakeCap2', '', ['id' => 'rakeCap2', 'class' => 'form-control number', 'maxlength' => '5']) }}
								<span id="rakeCap2-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('antibankingTime',  trans('game.Antibanking Time'), ['class' => 'required'])}}
								<select class="form-control select2" id="antibankingTime" name="antibankingTime">
									@for ($i = 1; $i <= 60; $i++) <option value="{{ $i }}">{{ $i }} mins</option>
										@endfor
								</select>
								<span id="antibankingTime-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('sitOutTime',  trans('game.Sit Out Time'), ['class' => 'required'])}}
								<select class="form-control select2" id="sitOutTime" name="sitOutTime">
									@for ($i = 1; $i <= 60; $i++) <option value="{{ $i }}">{{ $i }} mins</option>
										@endfor
								</select>
								<span id="sitOutTime-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('playerTime',  trans('game.Player Time'), ['class' => 'required'])}}
								<select class="form-control select2" id="playerTime" name="playerTime">
									@for ($i = 1; $i <= 60; $i++) <option value="{{ $i }}">{{ $i }} sec</option>
										@endfor
								</select>
								<span id="playerTime-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('extraTime',  trans('game.Extra Time'), ['class' => 'required'])}}
								<select class="form-control select2" id="extraTime" name="extraTime">
									@for ($i = 1; $i <= 60; $i++) <option value="{{ $i }}">{{ $i }} sec</option>
										@endfor
								</select>
								<span id="extraTime-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1">
								{{ Form::label('disconnectingTime',  trans('game.Disconnecting Time'), ['class' => 'required'])}}
								<select class="form-control select2" id="disconnectingTime" name="disconnectingTime">
									@for ($i = 1; $i <= 60; $i++) <option value="{{ $i }}">{{ $i }} sec</option>
										@endfor
								</select>
								<span id="disconnectingTime-error" class="error-help-block"></span>
							</div>
							<div class="form-col-1 password">
								{{ Form::label('password', trans('game.Password'), ['class' => 'required']) }}
								{{ Form::password('password', ['id' => 'password', 'class' => 'form-control password', 'maxlength' => '15']) }}
								<span id="password-error" class="error-help-block"></span>
							</div>
						</div>
					</div>

					<div class="card-primary card-form-1">
						<div class="card-body">
							<div class="button_sec" id="form-buttons">
								<button class="btn btn-primary" id="createGame-form-submit">{{ trans('game.Create') }}</button>
								<button class="btn btn-default" id="createGame-form-clear">{{ trans('layout.Clear') }}</button>
							</div>
							<div class="button_sec" id="form-loader" style="display:none">
								<img style="height: 65px;width: 65px;" src="{{ asset('img/lg.double-ring-spinner.gif') }}">
							</div>
						</div>
					</div>
				</form>
			</div>
			<!-- /.card-body -->
		</div>
	</section>
</div>
@endsection
@section('javascript')
@include('datatablejs')

<script type="text/javascript">
	$('.password').hide();
	$(document).on('change', '.form-control', function() {
		$(this).closest('div').find('.error-help-block').html('');
	});
	$(".number").keydown(function(event) {
		if (event.shiftKey == true) {
			event.preventDefault();
			return;
		}
		if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190 || event.keyCode == 110) {} else {
			event.preventDefault();
			return;
		}

		if (($(this).val().length == 0) && (event.keyCode == 190 || event.keyCode == 110)) {
			event.preventDefault();
			return;
		}

		if (($(this).val().indexOf('.') != -1) && (event.keyCode == 190 || event.keyCode == 110)) {
			event.preventDefault();
			return;
		}
	});

	$(document).on('change', '#gameType', function() {
		var gameType = $("#gameType").val();
		if (gameType.length == 0) {
			$("#gameType-error").html('Please select the game type');
			return;
		}
		$("#gameType-error").html('');
		$('#password').val('');

		if ((gameType == '9') || (gameType == '10')) {
			$('.password').show();
		} else {
			$('.password').hide();
		}
	});

	$(document).on('change', '#smallBlind', function() {
		var num = $(this).val();
		if (num.length == 0) {
			$('#bigBlind').val('');
		} else {
			$('#bigBlind').val(num * 2);
		}
	});

	function showErrorMessage(message) {
		$('.error-help-block').html('');
		var i = 1;
		var element = '';
		$.each(message, function(k, v) {
			$("#" + k + "-error").html(v);
			if (i == 1) {
				element = "#" + k;
			}
			i++;
		});

		var topOffset = $(element).parent().offset();
		if (topOffset != undefined) {
			$([document.documentElement, document.body]).animate({
				scrollTop: topOffset.top
			}, 1000);
		}

		return;
	}

	$(document).on('click', '#createGame-form-submit', function(e) {
		e.preventDefault();

		var formData = new FormData($('#createGame-form')[0]);

		$.ajax({
			type: 'POST',
			url: "{{ route('game.store') }}",
			data: formData,
			dataType: 'JSON',
			contentType: false,
			processData: false,
			beforeSend: function() {
				$("#form-buttons").hide();
				$("#form-loader").show();
			},
			success: function(response) {
				var message = response.msg;
				var status = response.status;
				if (status == 422) {
					showErrorMessage(message);
					return;
				}
				if (status == 200) {
					swal(message, {
						icon: "success",
					});
				} else {
					swal(message, {
						icon: "warning",
					});
				}
				$('.error-help-block').html('');
				$('#createGame-form-clear').trigger('click');
			},
			error: function() {
				swal("{{ trans('layout.Something went wrong') }}", {
					icon: "warning",
				});
			},
			complete: function() {
				$("#form-loader").hide();
				$("#form-buttons").show();
			}
		});
	});

	$(document).on('click', '#createGame-form-clear', function(e) {
		e.preventDefault();
		$('.error-help-block').html('');
		$('.select2').select2('destroy');
		$('input[type=checkbox]').prop('checked', false);
		$(this).closest('form').find("input[type=text], input[type=number], textarea, select").val('');
		$('.select2').select2({
			placeholder: "Select",
			allowClear: true
		});
	});
</script>
@stop