{{ define "header" }}
<section class="section">
    <div class="container">
        <h1 class="title">{{ .Title }}</h1>

        <article class="message has-text-weight-semibold">
            <div class="message-body">
                <p>At this time, yuzu can boot some commercial Switch games to varying degrees of success,
                    but your experience may vary between games and for different combinations of host hardware.</p>
                <p>
                    <a href="https://yuzu-emu.org/wiki/switch-homebrew/">Click here</a> for homebrew games you can download and test.</p>
            </div>
        </article>

        <div class="content">
            {{ .Content }}
        </div>
    </div>
</section>

<!-- Advertisement -->
<section class="hero is-info">
    <div class="hero-body">
        <div class="has-text-centered">
            <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-4126545610079023" data-ad-slot="1038554045"></ins>
        </div>
    </div>
</section>

<div class="section">
    <div class="container">
        <div id="no-js-view">
            Hi! We see that you have JavaScript disabled. We can't show you an
            updated listing of the available packages for yuzu, nor alternative
            installation methods, but here are a few links to get you started: <br />
            <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.2/yuzu_install.exe">Windows x64 Installer</a><br />
            <a href="https://github.com/yuzu-emu/yuzu-nightly/releases">Nightly releases on GitHub</a><br />
            <a href="https://github.com/yuzu-emu/yuzu-canary/releases">Canary releases on GitHub</a>
        </div>
        <div id="install-view">
            <article class="message is-danger" id="platform-unsupported">
                <div class="message-body has-text-white">
                    yuzu doesn't support your platform. If you are running Windows x64, Mac x64 or Linux x64 however,
                    choose one of the options below.
                </div>
            </article>

            <article class="message">
                <div class="message-body">
                    The yuzu installer automates the management of a yuzu installation, and is
                    recommended on supported platforms. It provides automated updating as well as shortcuts
                    in your start menu.
                </div>
            </article>

            <div class="buttons is-centered">
                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.2/yuzu_install.exe" class="button dl-button is-medium is-success" id="dl-button-windows">Download for Windows x64</a>
            </div>

            <div class="buttons is-centered">
                <!-- Show this when Flatpak/other primary installation methods are provided for Linux/Mac.
                <a class="button">
                    Other platforms
                </a>
                -->
                <a class="button" id="view-package-listing-button">
                    View package listing
                </a>
            </div>
        </div>
        <div class="columns" id="manual-package-view">
            <!-- Nightly -->
            <div class="column">
                <h3>Nightly Build
                    <span style='font-size: smaller; margin-left: 6px;'>
                        Last release was
                        <span id='last-updated-nightly'></span>
                    </span>
                </h3>

                <div id="downloads-nightly">
                </div>

                <div id="unavailable-nightly" class="is-hidden">There was a problem checking GitHub. Click the link below to view them directly.</div>
                <br />

                <div class="has-text-centered">
                    <a href="https://github.com/yuzu-emu/yuzu-nightly/releases">Click here to view previous versions...</a>
                </div>
            </div>
            <div class="column">
                <h3>Canary Build
                    <span style='font-size: smaller; margin-left: 6px;'>
                        Last release was
                        <span id='last-updated-canary'></span>
                    </span>
                </h3>

                <div id="downloads-canary">
                </div>

                <div id="unavailable-canary" class="is-hidden">There was a problem checking GitHub. Click the link below to view them directly.</div>
                <br />

                <div class="has-text-centered">
                    <a href="https://github.com/yuzu-emu/yuzu-canary/releases">Click here to view previous versions...</a>
                </div>
            </div>
        </div>
    </div>
</div>
{{ end }}

{{ define "scripts" }}
<script type="text/javascript">
    function fetchReleases() {
        getRelease('nightly');
        getRelease('canary');
    }

    fetchReleases();

    // Attempt autodetection of their operating system
    var userAgent = navigator.userAgent.toLowerCase();
    
    var allPlatforms = ["windows", "mac", "linux"];
    
    var os = "Other";
    if (userAgent.indexOf("windows") !== -1) {
        os = "Windows";
    } else if (userAgent.indexOf("mac") !== -1 && userAgent.indexOf("mobile") === -1 && userAgent.indexOf("phone") === -1) {
        os = "Mac";
    } else if (userAgent.indexOf("linux") !== -1 && userAgent.indexOf("android") === -1) {
        os = "Linux";
    }

    // Configure the views for this platform
    document.getElementById("no-js-view").style.display = "none";

    var platformButton = document.getElementById("dl-button-" + os.toLowerCase());
    if (platformButton !== null) {
        platformButton.style.display = "block";
    } else {
        document.getElementById("platform-unsupported").style.display = "block";
    }

    // Installer is not available on all platforms
    if (os === "Mac" || os === "Linux") {
        document.getElementById("install-view").style.display = "none";
        document.getElementById("manual-package-view").style.display = "flex";
    } else {
        document.getElementById("install-view").style.display = "block";
        document.getElementById("manual-package-view").style.display = "none";
    }

    document.getElementById("view-package-listing-button").addEventListener("click", function() {
        this.style.display = "none";
        document.getElementById("manual-package-view").style.display = "flex";
    });

</script>
{{ end }}