<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Recommendations {{ profile }} {{ date }}</title>
    <link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css">
    <style>
        div {
            page-break-after: auto;
            page-break-inside: avoid;
        }

        h2 {
            page-break-before: always;
        }

        h3 {
            page-break-before: always;
        }

        @page {
            margin: 0;
            padding: 5rem;
            @bottom-center {
                content: "Page " counter(pageNumber);
            }
        }
    </style>
</head>
<body>

<header>
    <h1>Rightsizing Recommendations</h1>
    <p>For <strong>{{ profile }}</strong> account on <strong>{{ date }}</strong></p>
</header>

<main>
    <div id="toc"></div>
    {% if recommendations_ecs %}
        <div>
            <h2>ECS Services</h2>

            <p>Under-provisioned services may lead to slow response times and run-away scaling,
                while over-provisioned services will lead to higher than expected costs for running
                your application.</p>

            {% if act_on_ecs %}
                {{ act_on_ecs }}
            {% endif %}

            {% for service in recommendations_ecs %}
                {% include 'recommendations/recommendations_ecs.html.jinja' %}
            {% endfor %}
        </div>
    {% endif %}

    {% if recommendations_rds %}
        <div>
            <h2>RDS Databases</h2>

            <p>Under-provisioned databases may lead to slow response times for your applications,
                while over-provisioned services will lead to higher than expected costs for running
                your application.</p>

            {% if act_on_rds %}
                {{ act_on_rds }}
            {% endif %}

            {% for service in recommendations_rds %}
                {% include 'recommendations/recommendations_rds.html.jinja' %}
            {% endfor %}
        </div>
    {% endif %}

    {% if recommendations_trusted_advisor %}
        <div>
            <h2>Trusted Advisor</h2>

            <p>Trusted advisor provides recommendations for individual resources and general AWS
                account settings.</p>

            {% for recommendation in recommendations_trusted_advisor %}
                {% include 'recommendations/recommendations_trusted_advisor.html.jinja' %}
            {% endfor %}
        </div>
    {% endif %}
</main>

<footer>
    <p>Generated by {{ user }} on {{ date }}</p>
</footer>

<script src="https://cdn.jsdelivr.net/npm/slugify@1.6.6/slugify.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/link2aws@1.0.22/link2aws.js"></script>
<script>
    (function () {
        const tableOfContents = document.getElementById('toc');

        const list = document.createElement('ul');

        [...document.getElementsByTagName('h2')].forEach(el => {
            el.id = slugify(el.innerText, {lower: true});

            const link = document.createElement('a');
            link.innerText = el.innerText;
            link.href = `#${el.id}`;
            const item = document.createElement('li');
            item.appendChild(link);

            const subList = document.createElement('ul');

            [...el.parentElement.getElementsByTagName('h3')].forEach(el => {
                el.id = slugify(el.innerText, {lower: true});

                const link = document.createElement('a');
                link.innerHTML = `${el.innerText}`;
                if (el.dataset.finding !== undefined) {
                    link.innerHTML += ` <small>${el.dataset.finding}</small>`;
                }
                link.href = `#${el.id}`;
                const item = document.createElement('li');
                item.appendChild(link);

                subList.appendChild(item);
            });

            list.appendChild(item);
            list.appendChild(subList);
        });

        tableOfContents.appendChild(list);


        [...document.getElementsByTagName('a')].forEach(el => {
            if (el.href.startsWith('arn:')) {
                const arn = new ARN(el.href);
                el.href = arn.consoleLink;
                el.target = "_blank";
            }
        });
    })();
</script>
</body>
</html>
