@extends('layouts.fillform')
@section('heading')
{{ $data->reference }}
@endsection
@section('logo')
{{ $data->logo }}
@endsection
@section('content')
	<div class="container">

		<div class="card card-outline card-info">

			<div class="card-header mb-2">

				<h4>
					@lang('messages.make_payment')

				</h4>

			</div>

			<div class="card-body">

				<h5>

					@if($data->amount != 0)

						<span class="currency">
							@lang('messages.amount') MK {{ $data->amount }}
						</span>
					@else

						(<span class="currency">

							0000

						</span>)

					@endif

        		</h5>

				<ul>

					<li>

						@lang('messages.payment_reference') : {{ $data->reference }}

					</li>

				</ul>



				<div id="accordion">

					@foreach($payment_gateways as $k => $v)

						<div class="card" >

						    <div class="card-header" id="pheaderdiv_{{$k}}">

								<h5 class="mb-0">

						        <button class="btn btn-link" data-toggle="collapse" data-target="#paymentcdiv_{{$k}}" aria-expanded="" aria-controls="paymentcdiv_{{$k}}">

						          <b>@lang('messages.pay_via', ['method' => $v])</b>

						        </button>

								</h5>

						    </div>

						    <div id="paymentcdiv_{{$k}}" class="collapse" aria-labelledby="pheaderdiv_{{$k}}" data-parent="#accordion">

						    	<div class="card-body">

							        @php

										$view = 'payments.partials.pay_'.$k;

									@endphp

									@includeIf($view)

						    	</div>

							</div>

						</div>

					@endforeach

				</div>

			</div>

		</div>

	</div>

@endsection

@section('footer')

<script src="https://js.stripe.com/v3/"></script>

<script type="text/javascript">

	$(document).ready(function(){

		//notification after payment failure

		/*@if (!empty(session('status')) && session('status')['success'] == 1)

            var msg = '{!!session('status')['msg']!!}';

            toastr.success(msg);

        @elseif(!empty(session('status')) && session('status')['success'] == 0)

        	var msg = '{!!session('status')['msg']!!}';

            toastr.error(msg);

        @endif

		$('span.currency').each(function(index, element){

			var money = __formatCurrency($(this).text());

			$(this).text(money);

		});

		// stripe payment integration

		var stripe = Stripe('{{config("constants.STRIPE_PUB_KEY")}}');

		var stripe_payment_session_id = ''

		@if(!empty($stripe_payment_session))

			stripe_payment_session_id = '{{$stripe_payment_session->id}}';

		@endif

		$(document).on('click', '#checkout-stripe', function() {

			stripe.redirectToCheckout({

			  // Make the id field from the Checkout Session creation API response

			  // available to this file, so you can provide it as parameter here

			  // instead of the CHECKOUT_SESSION_ID placeholder.

			  sessionId: stripe_payment_session_id

			}).then(function (result) {

			  // If `redirectToCheckout` fails due to a browser or network

			  // error, display the localized error message to your customer

			  // using `result.error.message`.

			  toastr.error(result.error.message);

			});

		});

		*/



		$('#frm_globeAM').on('submit',function(e){

			e.preventDefault();

			$("#showStatus").modal('hide');

			$("#div_errmsg").hide();

			$("#showStatus #div_payment_req_status").html('');

			$("#showStatus").modal({

				backdrop: 'static',

				keyboard: false

			});

				$.post("/payment/{{ $data->type }}/{{ $data->id }}/globeAM-payment", $('#frm_globeAM').serialize(), function( data ) {

				if(data.success){

					var hash = data.hash;

					var return_url = data.return_url;

					$("#showStatus #div_payment_req_status").html(data.msg);

					if(hash.length > 10){

						$.post( "/payment/globeAM-payment-verify/"+hash, {  }, function( data ) {

						if(data.success && data.status == 'APPROVED'){

							document.location = return_url+"?reference="+hash;

						}else{

							$("#showStatus").modal('hide');

							$("#div_errmsg").html('<div class="alert alert-danger">'+data.msg+'</div>');

							$("#div_errmsg").show();

						}

						}, "json");

					}

				}else{

					$("#showStatus").modal('hide');

					$("#div_errmsg").html('<div class="alert alert-danger">Something went wrong. Transaction was not initiated.</div>');

					$("#div_errmsg").show();

				}

			}, 'json');

		});



		$('#frm_globeTNM').on('submit',function(e){

			e.preventDefault();

			$("#showTNMStatus").modal('hide');

			$("#div_errmsg").hide();

			$("#showTNMStatus #div_payment_req_status").html('');

			$("#showTNMStatus").modal({

				backdrop: 'static',

				keyboard: false

			});

				$.post("/payment/{{ $data->type }}/{{ $data->id }}/globeTNM-payment", $('#frm_globeTNM').serialize(), function( data ) {

				if(data.success){

					var hash = data.hash;

					var return_url = data.return_url;

					$("#showTNMStatus #div_payment_req_status").html(data.msg);

					if(hash.length > 10){

						$.post( "/payment/globeTNM-payment-verify/"+hash, {  }, function( data ) {

							if(data.success && data.status == 'APPROVED'){

								document.location = return_url+"?reference="+hash;

							}else{

								$("#showTNMStatus").modal('hide');

								$("#div_TNMerrmsg").html('<div class="alert alert-danger">'+data.msg+'</div>');

								$("#div_TNMerrmsg").show();

							}

						}, "json");

					}

				}else{

					$("#showTNMStatus").modal('hide');

					$("#div_errmsg").html('<div class="alert alert-danger">Something went wrong. Transaction was not initiated.</div>');

					$("#div_errmsg").show();

				}

			}, 'json');

		});

	});

</script>

@endsection