<!-- $o = Domain::class -->
@extends('layouts.app')
@section('htmlheader_title')
{{ $o->name }}
@endsection

@section('content')
	<div class="row">
		<div class="col-12">
			<h1>{{ $o->name }} <small class="float-end">Last Update: {{ $o->updated_at->format('Y-m-d H:i') }}</small></h1>

			<div class="accordion" id="accordion_homepage">
				<!-- About -->
				<div class="accordion-item">
					<h3 class="accordion-header">
						<span class="accordion-button" id="about" data-bs-toggle="collapse" data-bs-target="#collapse_about" aria-expanded="true" aria-controls="collapse_about">About</span>
					</h3>

					<div id="collapse_about" class="accordion-collapse collapse show" aria-labelledby="about" data-bs-parent="#accordion_homepage">
						<div class="accordion-body">
							<div class="float-end" style="max-height: 25em;" id="network_traffic"></div>
							{!! \Illuminate\Mail\Markdown::parse($o->homepage) !!}
						</div>
					</div>
				</div>

				<!-- Echomail -->
				<div class="accordion-item">
					<h3 class="accordion-header">
						<span class="accordion-button collapsed" id="echoareas" data-bs-toggle="collapse" data-bs-target="#collapse_echoareas" aria-expanded="false" aria-controls="collapse_echoareas">Echo Areas</span>
					</h3>

					<div id="collapse_echoareas" class="accordion-collapse collapse" aria-labelledby="echoareas" data-bs-parent="#accordion_homepage">
						<div class="accordion-body">
							@if($o->echoareas->count())
								<p>This network provides the following Echomail areas:</p>
								<table class="table monotable w-100" id="echoarea">
									<thead>
									<tr>
										<th class="w-75" colspan="4"></th>
										<th colspan="4" class="text-center">Messages</th>
									</tr>
									<tr>
										<th>Echoarea</th>
										<th>Description</th>
										<th>Last Message</th>
										<th>Area Active</th>
										<th class="text-end">Day</th>
										<th class="text-end">Week</th>
										<th class="text-end">Month</th>
										<th class="text-end">Total</th>
									</tr>
									</thead>

									<tbody>
									@foreach ($o->echoarea_stats()->groupBy('id') as $oo)
										<tr>
											<td style="width: 15%;"><a href="{{ url('echoarea/addedit',[($x=$oo->first())->id]) }}">{{ $x->name }}</a></td>
											<td>{{ $x->description }}</td>
											<td style="width: 15%;">{{ $x->last_message ? $x->last_message->format('Y-m-d H:i') : '-' }}</td>
											<td>{{ $x->active ? 'Active' : 'Archive' }}</td>
											<td class="text-end">{{ number_format($oo->where('stats','day')->pop()?->count) }}</td>
											<td class="text-end">{{ number_format($oo->where('stats','week')->pop()?->count) }}</td>
											<td class="text-end">{{ number_format($oo->where('stats','month')->pop()?->count) }}</td>
											<td class="text-end">{{ number_format($oo->sum('count')) }}</td>
										</tr>
									@endforeach
									</tbody>
								</table>
							@else
								This network doesnt have any Echomail areas (yet). Perhaps you would like to create one?
							@endif
						</div>
					</div>
				</div>

				<!-- File areas -->
				<div class="accordion-item">
					<h3 class="accordion-header">
						<span class="accordion-button collapsed" id="fileareas" data-bs-toggle="collapse" data-bs-target="#collapse_fileareas" aria-expanded="false" aria-controls="collapse_fileareas">File Areas</span>
					</h3>

					<div id="collapse_fileareas" class="accordion-collapse collapse" aria-labelledby="fileareas" data-bs-parent="#accordion_homepage">
						<div class="accordion-body">
							@if($o->fileareas->count())
								<p>This network provides the following File areas:</p>
								<table class="table monotable" id="filearea">
									<thead>
									<tr>
										<th>Filearea</th>
										<th>Description</th>
										<th>Last File Sent</th>
									</tr>
									</thead>

									<tbody>
									@foreach ($o->fileareas->sortBy('name') as $oo)
										<tr>
											<td style="width: 15%;"><a href="{{ url('filearea/addedit',[$oo->id]) }}">{{ $oo->name }}</a></td>
											<td>{{ $oo->description }}</td>
											<td style="width: 15%;">-</td>
										</tr>
									@endforeach
									</tbody>
								</table>
							@else
								This network doesnt have any File areas (yet). Perhaps you would like to create one?
							@endif
						</div>
					</div>
				</div>

				<!-- Systems -->
				<div class="accordion-item">
					<h3 class="accordion-header">
						<span class="accordion-button collapsed" id="systems" data-bs-toggle="collapse" data-bs-target="#collapse_systems" aria-expanded="false" aria-controls="collapse_systems">Systems</span>
					</h3>

					<div id="collapse_systems" class="accordion-collapse collapse" aria-labelledby="systems" data-bs-parent="#accordion_homepage">
						<div class="accordion-body">
							<p>The following systems are members of this network.</p>
							<table class="table monotable" id="system">
								<thead>
								<tr>
									<th>System</th>
									<th>Sysop</th>
									<th>Location</th>
									<th>Address</th>
									<th>Last Seen</th>
								</tr>
								</thead>

								<tbody>
								@foreach ($o->zones->sortBy('zone_id') as $oz)
									@foreach ($oz->addresses as $ao)
										<tr>
											<td><a href="{{ url('system/addedit',[$ao->system_id]) }}">{{ $ao->system->full_name($ao) }}</a> @auth<span class="float-end"><small>@if($ao->session('sespass'))<sup>{{ $ao->session('default') ? '**' : '*' }}</sup>@elseif($ao->system->setup)<sup class="success">+</sup>@endif[{{ $ao->system_id }}]</small></span>@endauth</td>
											<td>{{ $ao->system->sysop }}</td>
											<td>{{ $ao->system->location }}</td>
											<td>{{ $ao->ftn4d }}</td>
											<td>{{ $ao->system->last_session ? $ao->system->last_session->format('Y-m-d H:i') : '-' }}</td>
										</tr>
									@endforeach
								@endforeach
								</tbody>
								@auth
									<tfoot>
									<tr>
										<td colspan="5"><sup>**</sup>Default route <sup>*</sup>System defined here <sup class="success">+</sup>This system</td>
									</tr>
									</tfoot>
								@endauth
							</table>
						</div>
					</div>
				</div>

				<!-- Sign up -->
				<div class="accordion-item">
					<h3 class="accordion-header">
						<span class="accordion-button collapsed" id="signup" data-bs-toggle="collapse" data-bs-target="#collapse_signup" aria-expanded="false" aria-controls="collapse_signup">Join Network</span>
					</h3>

					<div id="collapse_signup" class="accordion-collapse collapse" aria-labelledby="signup" data-bs-parent="#accordion_homepage">
						<div class="accordion-body">
							@guest
								To start an application to join this network please <a href="{{ url('login') }}">login</a>.
							@else
								@if($user->isMember($o))
								@else
									This website is not ready to take applications yet, check back soon!
								@endif
							@endguest
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
@endsection

@section('page-css')
	@css('datatables')
	<style>
		div#collapse_about {
			min-height: 25em;
		}
		div#collapse_about .collapse{
			min-height: 0;
		}
	</style>
@append
@section('page-scripts')
	@js('datatables')
	@js('highcharts')

	<script type="text/javascript">
		$(document).ready(function() {
			$('table tr').click(function() {
				var href = $(this).find('a').attr('href');

				if (href)
					window.location = href;
			});

			$('#echoarea').DataTable({
				paging: true,
				pageLength: 25,
				searching: true,
				ordering: true,
				order: [[3,'asc'],[1,'asc']],
				conditionalPaging: {
					style: 'fade',
					speed: 500 // optional
				},
				rowGroup: {
					dataSrc: [3],
				},
				columnDefs: [
					{
						targets: [3],
						visible: false,
					},
				],
			});

			$('#filearea').DataTable({
				paging: true,
				pageLength: 25,
				searching: true,
				ordering: true,
				order: [1,'asc'],
				conditionalPaging: {
					style: 'fade',
					speed: 500 // optional
				}
			});

			$('#system').DataTable({
				paging: true,
				pageLength: 25,
				searching: true,
				ordering: true,
				order: [],
				conditionalPaging: {
					style: 'fade',
					speed: 500 // optional
				},
				language: {
					paginate: {
						previous: '&lt;&lt;',
						next: '&gt;&gt;'
					}
				}
			});
		});

		Highcharts.chart('network_traffic', {
			chart: {
				type: 'spline',
				zoomType: 'x',
				backgroundColor: '#0a0a0a',
				resetZoomButton: {
					position: {
						align: 'left',
						x: -40,
						y: -40,
					}
				}
			},
			credits: {
				enabled: false
			},
			exporting: {
				buttons: false
			},
			title: {
				text: 'FTN Network Traffic for {{ $o->name }}'
			},
			xAxis: {
				type: 'datetime',
				title: {
					text: 'Time'
				},
			},
			yAxis: {
				title: {
					text: 'Echomail'
				},
			},
			legend: {
				align: 'right',
				layout: 'vertical',
				symbolWidth: 20,
				floating: false,
				navigation: {
					arrowSize: 10
				},
			},
			plotOptions: {
				series: {
					point: {
						events: {
							click: function () {
								//window.location.href = this.series.options.website;
							}
						}
					},
					cursor: 'pointer'
				}
			},
			series: {!! $o->echoarea_total_daily()
				->groupBy('name')
				->transform(function($item,$key) { return [
					'name'=>$key,
					'dashStyle'=>'ShortDot',
					'visible'=>$item->first()->show,
					'data'=>$item->map(function($item) { return ['x'=>\Carbon\Carbon::createFromFormat('Y-m-d',$item->date)->timestamp,'y'=>$item->count]; })
				]; })
				->values() !!}
		});
	</script>
@append