{{ define "header" }}
<link href="//cdn.jsdelivr.net/npm/font-logos@0.18/assets/font-logos.css" rel="stylesheet">

<section class="section">
    <div class="container">
        <div class="mb-6" id="download-header">
            <div class="is-flex-grow-1">
                <h1 class="title">{{ .Title }}</h1>
            </div>
            <div id="download-buttons">
                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.9/yuzu_install.exe" class="button dl-button is-medium is-success" id="dl-button-windows">
                    <span class="icon mr-1"><i class="fab fa-windows"></i></span> Download for Windows x64
                </a>
                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.9/liftinstall-31b3e7e.tar.xz" class="button dl-button is-medium is-success" id="dl-button-linux">
                    <span class="icon mr-1"><i class="fab fa-linux"></i></span> Download for Linux x64
                </a>
            </div>
        </div>

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

<section class="section pt-0">
    <div class="container">
        <div id="no-js-view">
            <article class="message is-warn">
                <div class="message-body has-text-white mb-6">
                    Hi! We see that you have JavaScript disabled. You can still use the 
                    above download links but we can't show you an updated listing of the available 
                    packages for yuzu, nor alternative installation methods, but we recommend 
                    viewing the 
                    <a href="https://github.com/yuzu-emu/yuzu-mainline/releases">Mainline releases on GitHub</a>
                </div>
            </article>
        </div>

        <div id="unsupported-platform-view">
            <article class="message is-danger" id="platform-unsupported">
                <div class="message-body has-text-white mb-6">
                    Yuzu doesn't support your platform. If you are running Windows x64 or Linux x64 however,
                    choose one of the options below.
                </div>
            </article>
        </div>
        
        <div class="columns" id="manual-package-view">
            <!-- Mainline -->
            <div class="column content">
                <h2>Builds
                    <span class="tag is-info">
                        Last release was &nbsp;
                        <span id='last-updated-mainline'></span>
                    </span>
                </h2>

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

                <div id="unavailable-mainline" 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-mainline/releases">Click here to view previous versions...</a>
                </div>
            </div>
        </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>
{{ end }}

{{ define "scripts" }}
<script type="text/javascript">
    // Show JS relevant elements
    document.getElementById("no-js-view").style.display = "none";
    document.getElementById("manual-package-view").style.display = "block";

    function fetchReleases() {
        getRelease('mainline');
    }

    fetchReleases();

    // Attempt autodetection of their operating system
    var userAgent = navigator.userAgent.toLowerCase();
    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";
    }

    switch (os) {
        case "Windows":
            document.getElementById("dl-button-linux").style.display = "none";
            break;
        case "Linux":
            document.getElementById("dl-button-windows").style.display = "none";
            break;
        default:
            document.getElementById("unsupported-platform-view").style.display = "block";
            break
    }

</script>
{{ end }}