<?php $diLd = now()->copy()->endOfDay()->timestamp; ?>
<?php
	$last_time = \Carbon\Carbon::parse($user->next_claim);
	$now = \Carbon\Carbon::now();
	$difference = $last_time->diffInHours($now);
	if( $last_time > $now){
		$diLd = $last_time->timestamp;
	}
?>
<?php $sTime = date( 'r', $diLd );?>
<?php
	$pendingIncome = 'pending_income'; 
	if(config('settings')->cur_text != 'NGN'){
		$pendingIncome = 'usdt_pending_income'; 
	}
?>
@extends($activeTemplate.'layouts.home')

@push('style')
<link rel="stylesheet" href="{{ asset('users/assets/trade/css/team.css') }}{{$catch}}" >
<style>
.page7-content{position:relative;width:100%;height:100%;z-index:1;}
.page7-container::before{margin-top:-10vh!important;content:'';position:absolute;width:420px;height:300px;background-image:conic-gradient(transparent, transparent, transparent, #283f37);animation:animate 4s linear infinite;}
.page7-container::after{margin-top:-10vh!important;content:'';position:absolute;width:420px;height:300px;background-image:conic-gradient(transparent, transparent, transparent, #283f37);animation:animate 4s linear infinite;animation-delay:-2s;}
.animatedborder{position:absolute;inset:5px;background:#96a6ce;z-index:1;opacity:0.9;border-radius:8px;}
.page7-container{display:flex;justify-content:center;position:relative;margin-bottom:5vh!important;font-size:15px!important;text-align:center;position:relative;border-radius:5%!important;box-shadow:0 4px 8px rgba(181, 46, 46, 0.2);margin:20px 0px;padding:20px;overflow:hidden;}
.page7-container-title{font-size:1rem;font-weight:bold;color:#ffffff;margin-bottom:15px;}
.page7-reward-value{font-size:1.5rem;color:#ffca28;margin-bottom:10px;}
.page7-percentage{justify-content:center;font-size:1.1rem;color:#ffffff;margin-bottom:10px;display:flex;align-items:center;}
.page7-digital-clock{font-size:1rem!important;color:#ffffff;margin-top:15px;}
.page7-clock-section{display:flex;justify-content:center;}
.page7-clock-part{display:flex;flex-direction:column;align-items:center;margin:0 8px;}
.page7-clock-number{font-size:0.85rem;color:var(--title-font-color);font-weight:700;}
.page7-clock-label{font-size:0.7rem;}
@media screen and (max-width: 480px){
.page7-container{max-width:100%;padding:15px;}
}
@keyframes animate{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
</style>
@endpush


@section('content')

@php $link = route('invite', ['code' => auth()->user()->ref_code]); @endphp

<div data-v-af01384a="">
	<div id="home" data-v-c35495fc="" data-v-af01384a="" style="background:#f3f4f6;border-radius:0 0 8px 8px">
		<div class="bg" data-v-c35495fc="" style="height:18vmin"></div>
		<div class="main" data-v-c35495fc="">
			<div class="titleBar" data-v-c35495fc="">
				<div class="left" data-v-c35495fc="">
					<a data-href="{{ route('user.home')}}" data-v-c35495fc="" class="linkBTN text-white">←</a>
				</div>
				<div class="right" data-v-c35495fc="" style="margin-top: -15px;margin-right: -.75rem;">
					<a data-href="{{ route('user.profile')}}" class="linkBTN right" data-v-c35495fc="" style=""><img src="{{getImage(imagePath()['logoIcon']['path'] .'/logo.png')}}{{$catch}}" alt="" data-v-c35495fc="" style="height:36px;height: 37px; border-radius:5px 0 0px 5px;width: auto;" /></a>
				</div>
			</div>
			<div data-v-af01384a="">
				<div id="team" data-v-c6f9d966="" data-v-af01384a="" class="">
					<div class="containerh" data-v-c6f9d966="">
						<div class="part2" data-v-385ac480="" data-v-c6f9d966="" style="margin-left:0px;">
							<div class="top_lv_VIEw" data-v-385ac480=""><i class="left_icon" data-v-385ac480=""></i><span data-v-385ac480="">Deposit Fund</span></div>
							<div class="m" data-v-385ac480="" style="background: #FFF;margin-bottom: -10px;">
								<div class="item" data-v-385ac480=""><span data-v-385ac480="">Deposit balance</span><span data-v-385ac480="">{{ config('settings')->cur_sym }}{{ getAmount($userBalance['main']) }}</span></div>
								<div href="" class="item rightItme" data-v-385ac480=""><span data-v-385ac480="">Earning balance</span><span data-v-385ac480="">{{ config('settings')->cur_sym }}{{ getAmount($userBalance['income']) }}</span></div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="page7-container">
				<span class="animatedborder"></span>
				<div class="page7-content">
					<?php if( $last_time < $now){ ?>
					<div class="page7-reward-value curReward">Click the start trade to initiate a bot to trade for you for the next 12 hours.</div>
					<a class="btn btn-1 btn2 linkBTN" id="start-trade" data-href="{{ route('user.trade.now',time()) }}" data-id="20" data-v-fd62a59a="" style="background: #761297;">
						<iconify-icon width="30" height="30" icon="hugeicons:money-receive-square" style="color: #FFFFFF;"></iconify-icon>
						<span>START TRADE</span>
					</a>
					<?php }else { ?>
					<div class="page7-container-title">Product Rewards</div>
					<div class="page7-reward-value curReward">{{ config('settings')->cur_sym }}{{ showAmount($user->$pendingIncome,4) }}</div>

					<div class="page7-digital-clock" id="counter">
						<div class="page7-clock-section" id="timeDiv">
							<div class="page7-clock-part">
								<span class="page7-clock-number pTHours">20:</span>
								<span class="page7-clock-label">Hours</span>
							</div>
							<div class="page7-clock-part">
								<span class="page7-clock-number pTMinutes">23:</span>
								<span class="page7-clock-label">Minutes</span>
							</div>
							<div class="page7-clock-part">
								<span class="page7-clock-number pTSeconds">57</span>
								<span class="page7-clock-label">Seconds</span>
							</div>
						</div>
					</div>

					<div class="function">
						<div style="margin-top:10px">
							<a class="btn btn-1 btn2" id="whatsapp-share" data-url="{{ $link }}" data-id="20" data-v-fd62a59a="">
								<iconify-icon width="30" height="30" icon="hugeicons:money-receive-square" style="color: #FFFFFF;"></iconify-icon>
								<span>CLAIM PROFIT</span>
							</a>
						</div>
					</div>
					<?php } ?>
				</div>
			</div>
		
			<div class="message-box" style="margin-top: 0px;">
				@foreach($logs as $log)
					@php
						$plan = $log->plan;
						$nextTime = \Carbon\Carbon::parse($log->next_return_date);
						$formattedDateTime = \Carbon\Carbon::parse($log->created_at)->format('d.m.y H:i');
						$formattedNextDateTime = \Carbon\Carbon::parse($log->next_return_date)->format('d M H:i A');
					@endphp

			<div class="page7-container">
				<span class="animatedborder"></span>
				<div class="page7-content">
				<div href="javascript:void(0);" class="message" style="padding: 0;background-color:transparent;box-shadow: none;border-radius: 0px;">
					<div >
						<img src="{{ asset('assets') }}/{{ $plan->img }}" alt="avatar">
						<div>
							<div>
								<p><strong>{{ $plan->name }}</strong></p>
								<iconify-icon width="15" height="15" icon="ep:d-arrow-right"></iconify-icon>
							</div>
							<div>
								<p style="display: contents;"><span>Invested</span> <span> {{ $formattedDateTime }}</span> </p>
							</div>
							<div>
								<p style="display: contents;"><span>Duration</span> <span> {{ ($log->total_return/2) }} Days</span> </p>
							</div>
							<div>
								<p style="display: contents;"><span>Earned</span> <span> <b>{{ $plan->cur_sym }}{{ getAmount($log->earned) }}</b></span> </p>
							</div>
						</div>
					</div>
				</div>
				</div>
				</div>
				@endforeach
			</div>
			
			<div class="message-box" style="margin-top: 0px;">
				<div class="invitation-link">
					<p>
						NOTE: Earning Profit is returns within 12 hours and its for the total purhased products.
					</p>
				</div>
			</div>
			
		</div>
	</div>
</div>

@endsection

@push('script')
<script>
    $('#whatsapp-share').on('click', function() {
        var url = $(this).data('url');
		$.ajax({
			type: "POST",
			url: "{{ route('user.collect.income') }}",
			data: {
                _token: '{{ csrf_token() }}'
			},
			beforeSend: function() {
				loading.showLoading({type: 2,tip: "Checking..."});
			},
			success: function(data) {
				loading.hideLoading();
                modalMessage(data.message, 200, data.link);
			},
			error: function(xhr, status, error) {
                var data = JSON.parse(xhr.responseText);
                var responseMessage = data.message
                modalMessage(responseMessage);
				loading.hideLoading();
			},
			fail: function() {
				loading.hideLoading();
				modalMessage("Request Failed");
			}
		});
		
    });
	
		function gtTRg(etime) {
		  const total = Date.parse(etime) - Date.parse(new Date());
		  const seconds = Math.floor((total / 1000) % 60);
		  const minutes = Math.floor((total / 1000 / 60) % 60);
		  const hours = Math.floor((total / (1000 * 60 * 60)) % 24);
		  return {total,hours,minutes,seconds};
		}

		function itlCk(id, ends) {
		  const clock = document.getElementById(id);
		  const hoursSpan = clock.querySelector('.pTHours');
		  const minutesSpan = clock.querySelector('.pTMinutes');
		  const secondsSpan = clock.querySelector('.pTSeconds');

		  function utCk() {
			const t = gtTRg(ends);

			hoursSpan.innerHTML = (t.hours+':').slice(-3);
			minutesSpan.innerHTML = (t.minutes+':').slice(-3);
			secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
			
			if (t.total <= 1) {
				clearInterval(timeinterval);
				return false;
			}
		  }

		  utCk();
		  const timeinterval = setInterval(utCk, 1000);
		}

		const deadline = new Date(Date.parse('{{$sTime}}'));
		<?php if( $last_time > $now){ ?>
		itlCk('timeDiv', deadline);
		<?php } ?>
</script>
@endpush