{{ define "content" }}
<link href="/static/css/pages/routing.css" rel="stylesheet">

<nav class="navbar navbar-expand-md">
  <span class=" btn btn-nav-icon-text navbar-toggler" role="button" data-bs-toggle="collapse" data-bs-target="#navbarToggler" aria-controls="navbarToggler" aria-expanded="false" aria-label="Toggle navigation">
    <i class="icon-menu"></i>Menu
  </span>
    <div class="collapse navbar-collapse" id="navbarToggler">
        <ul class="navbar-nav me-auto mb-lg-0">
            <li>
                <button onclick="" class="btn btn-nav-icon" id="menuButton" data-toggle="tooltip" data-placement="bottom" title="Navigation menu"><i class="icon-menu" id="menuImage"></i></button>
            </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="sourcesButton" data-toggle="tooltip" data-placement="bottom" title="Sources"><i class="icon-sources" id="sourcesImage"></i></button>
            </li>
            <li>
                <button class="btn-nav-icon btn-alias" id="aliasesButton" data-toggle="tooltip" data-placement="bottom" title="Alias" disabled>
                    <i class="icon-aliases" id="aliasesImg"></i> <!-- Icon id must have "Img" suffix when using some common Ui code, e.g. setButtonIdDisabled. -->
                </button>
            </li>
            <li>
            <span class="col-data-input">
                <div class="select-wrapper-toolbar">
                    <select class="custom-select custom-select-alias" name="channelAliasSelect" id="aliasSetSelect" onchange="">
                        <option value="0">None</option>
                    </select>
                </div>
            </span>
        </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="copyButton" data-toggle="tooltip" data-placement="bottom" title="Copy"><i class="icon-copy icon-btn" id="copyImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="pasteButton" data-toggle="tooltip" data-placement="bottom" title="Paste"><i class="icon-copy-paste icon-btn" id="pasteImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="patternsButton" data-toggle="tooltip" data-placement="bottom" title="Patterns"><i class="icon-patterns icon-btn" id="patternsImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="presetButton" data-toggle="tooltip" data-placement="bottom" title="Preset"><i class="icon-preset icon-btn" id="presetImage" style="opacity: 1"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="viewPresetButton" data-toggle="tooltip" data-placement="bottom" title="View preset"><i class="icon-preset-view icon-btn" id="viewPresetImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="clearPresetButton" data-toggle="tooltip" data-placement="bottom" title="Clear preset"><i class="icon-preset-clear icon-btn" id="clearPresetImage"></i></button>
            </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-take" id="takeButton" data-toggle="tooltip" data-placement="bottom" title="TAKE">TAKE</button>
            </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon btn-lock" id="lockButton" data-toggle="tooltip" data-placement="bottom" title="Lock"><i class="icon-lock icon-btn" id="lockImage" style="opacity: 1"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon btn-protect" id="protectButton" data-toggle="tooltip" data-placement="bottom" title="Protect"><i class="icon-protect icon-btn" id="protectImage"></i></button>
            </li>

            <li>
                <button onclick="" class="btn btn-nav-icon" id="salvoButton" data-toggle="tooltip" data-placement="bottom" title="Salvo"><i class="icon-salvos icon-btn" id="salvoImage"></i></button>
            </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="colVisButton" data-toggle="tooltip" data-placement="bottom" title="Column visibility"><i class="icon-table-column icon-btn" id="colVisImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="findFilterButton" data-toggle="tooltip" data-placement="bottom" title="Find & filter"><i class="icon-find-and-filter icon-btn" id="findFilterImage"></i></button>
            </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="pathButton" data-toggle="tooltip" data-placement="bottom" title="Routing path"><i class="icon-path icon-btn" id="pathImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="importButton" data-toggle="tooltip" data-placement="bottom" title="Import"><i class="icon-import icon-btn" id="importImage"></i></button>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="exportButton" data-toggle="tooltip" data-placement="bottom" title="Export"><i class="icon-export icon-btn" id="exportImage"></i></button>
            </li>
            <li>
                <span><i class="icon-separator"></i></span>
            </li>
            <li>
                <button onclick="" class="btn btn-nav-icon" id="configButton" data-toggle="tooltip" data-placement="bottom" title="Settings"><i class="icon-config icon-btn" id="configImage"></i></button>
            </li>
        </ul>
    </div>
</nav>

<div class="grid-wrapper">
    <h1 style="color: white">Page Under Construction</h1>
    <div id="routingGrid" style="height: 100%;" class="ag-theme-balham-dark"></div>
</div>

<script type="text/javascript" charset="utf-8">

    const columnDefs = [];

    const gridOptions = {};

    //init table datasource once DOM content is loaded
    document.addEventListener('DOMContentLoaded', function () {

    });

</script>

{{ end }}