<?php require_once "atp.header.php";?>

<section class="content-wrapper" data-heading="other-data" id="external">

	<!--Heading-->
	<div class="page-title">
		<h1>Expedition Import</h1>
		<p>
			Map data channels from expedition to Fastnet channels for display. <br>
			Format and channel name for each expedition channel can be adjusted <a href="externalFormats.php">here</a>.
			Expedition channel names are only used if no fastnet channel name is specified below.
		</p>
	</div>

    <!--Expedition Channels-->
    <div class="box top-wrapper">
        <div class="flex-row exp-content-header">
            <div class="flex-fourth justify-center">
                <h2>Fastnet Channel</h2>
            </div>
            <div class="flex-fourth justify-center">
                <h2>Expedition Channel</h2>
            </div>
            <div class="flex-fourth justify-center">
                <h2>Fastnet Channel Name</h2>
            </div>
            <div class="flex-fourth justify-center">
                <h2>Data</h2>
            </div>
        </div>

        <div id="expedition-content">
        </div>
    </div>

    <!--Buttons-->
	<div class="button-box" id="button-container">
		<div class="box box-bottom">
			<a id="ok-button" class="button button-gray button-medium">OK</a>
			<a id="cancel-button" class="button button-gray button-medium">Cancel</a>
			<a id="apply-button" class="button button-gray button-medium">Apply</a>
		</div>
	</div>


</section>

<script type="text/javascript" src="/js/atp.external-channels.js?v=<?php echo VERSION_NUMBER;?>" defer></script>
<script>
$(document).ready(function() {
	let model = new ExternalModel();
	let controller = new ExternalController(model);
	let view = new ExternalView(controller);
});
</script>

<?php require_once "footer.php"?>