<!doctype html>
<title>Elite Dangerous: Ship Registry</title>
<html>
<head>
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
<script src="{{ asset('js/ships.js') }}" defer></script>
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('css/ships.css') }}" rel="stylesheet">
</head>
<body>
@if ($message = Session::get('success'))
<div class="alert alert-success alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
{{ $message }}
</div>
@endif
@if ($message = Session::get('error'))
<div class="alert alert-danger alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
{{ $message }}
</div>
@endif
@if ($message = Session::get('warning'))
<div class="alert alert-warning alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
{{ $message }}
</div>
@endif
@if ($message = Session::get('info'))
<div class="alert alert-info alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
{{ $message }}
</div>
@endif
@if ($errors->any())
<div class="alert alert-danger">
<button type="button" class="close" data-dismiss="alert">×</button>
Check the following errors :(
</div>
@endif
<div class="container">
<nav class="navbar navbar-dark bg-dark">
<span class="navbar-brand mb-0 h1">Elite Dangerous: Ship Registry</span>
<button type="button" class="btn btn-outline-primary" data-target="#addShip" data-toggle="modal" align="right">Add Ship</button>
</nav>
<br>
<table id="shipsTable" class="table table-bordered table-hover">
<thead class="thead-dark">
<tr>
<th scope="col">@sortablelink('shipId', 'Ship ID')</th>
<th scope="col">@sortablelink('shipName', 'Ship Name')</th>
<th scope="col">@sortablelink('shipOwner', 'Ship Owner')</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
@foreach ($ships as $ship)
<tr>
<td>{{ $ship->shipId }}</td>
<td>{{ $ship->shipName }}</td>
<td>{{ $ship->shipOwner }}</td>
<td>
<button type="button" class="btn bi bi-wrench" data-target="#editShip-{{ $ship->id }}" data-toggle="modal"><x-bi-tools/></button>
<button type="button" class="btn" data-target="#deleteShip-{{ $ship->id }}" data-toggle="modal"><x-bi-trash/></button>
</td>
</tr>
<!-- Edit Ship Confirmation Modal -->
<div class="modal fade" id="editShip-{{ $ship->id }}" tabindex="-1" role="dialog" aria-labelledby="editShip-{{ $ship->id }}" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="editShip-{{ $ship->id }}">{{ $ship->shipId }} / {{ $ship->shipName }} - Edit Ship</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post" action="/">
@csrf
<div class="form-group">
<label for="shipId">Ship ID</label>
<input name="shipId" type="text" class="form-control" id="shipId" value="{{ $ship->shipId }}" required>
</div>
<div class="form-group">
<label for="shipName">Ship Name</label>
<input name="shipName" type="text" class="form-control" id="shipName" value="{{ $ship->shipName }}"required>
</div>
<div class="form-group">
<label for="shipOwner">Ship Owner</label>
<input name="shipOwner" type="text" class="form-control" id="shipOwner" value="{{ $ship->shipOwner }}"required>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button name="editShip" value="{{ $ship->id }}" type="submit" class="btn btn-primary">Save changes</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- Delete Ship Confirmation Modal -->
<div class="modal fade" id="deleteShip-{{ $ship->id }}" tabindex="-1" role="dialog" aria-labelledby="deleteShip-{{ $ship->id }}" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteShipLabel-{{ $ship->id }}">{{ $ship->shipId }} / {{ $ship->shipName }} - Confirm Delete Ship?</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form method="post" action="/">
@csrf
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Nope.</button>
<button name="deleteShip" value="{{ $ship->id }}" type="submit" class="btn btn-primary btn-danger">Yep.</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
</tbody>
</table>
{!! $ships->appends(\Request::except('page'))->render() !!}
</div>
<!-- Add Ship Modal -->
<div class="modal fade" id="addShip" tabindex="-1" role="dialog" aria-labelledby="addShip" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="addShipLabel">Add Ship</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post" action="/">
@csrf
<div class="form-group">
<label for="shipId">Ship ID</label>
<input name="shipId" type="text" class="form-control" id="shipId" required>
</div>
<div class="form-group">
<label for="shipName">Ship Name</label>
<input name="shipName" type="text" class="form-control" id="shipName" required>
</div>
<div class="form-group">
<label for="shipOwner">Ship Owner</label>
<input name="shipOwner" type="text" class="form-control" id="shipOwner" required>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button name="addShip" value="addShip" type="submit" class="btn btn-primary">Save changes</button>
</div>
</form>
</div>
</div>
</div>
</div>
</body>
</html>