<!doctype html>
<html>
    <head>
        <title>Update</title>
        <link rel="stylesheet" type="text/css" href="style.css"/>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script type="text/javascript" src="api.js"></script>
    </head>
    <body>
        <div class="topnav">
            <a href="/" class="active">AhoyDTU</a>
            <a href="javascript:void(0);" class="icon" onclick="topnav()">
                <span></span>
                <span></span>
                <span></span>
            </a>
            <div id="topnav" class="hide"></div>
        </div>
        <div id="content" class="content">
            <div>
                Make sure that you have noted all your settings before starting an update. New versions may have changed their memory layout which can break your existing settings.<br/>
                <br/>
                <a href="/get_setup" target="_blank">Download your settings (JSON file)</a>
            </div>
            <br/><br/>
            <form method="POST" action="/update" enctype="multipart/form-data" accept-charset="utf-8">
                <input type="file" name="update"><input type="submit" value="Update">
            </form>
        </div>
        <div id="footer">
            <p class="left">&copy 2022</p>
            <p class="right" id="version"></p>
        </div>
        <script type="text/javascript">

            function topnav() {
                toggle("topnav");
            }

            function parseMenu(obj) {
                var e = document.getElementById("topnav");
                e.innerHTML = "";
                for(var i = 0; i < obj["name"].length; i ++) {
                    e.appendChild(link(obj["link"][i], obj["name"][i]));
                }
            }

            function parseSys(obj) {
                document.getElementById("version").appendChild(
                    link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
                );
            }

            function parse(obj) {
                if(null != obj) {
                    parseMenu(obj["menu"]);
                    parseSys(obj["system"]);
                }
            }

            getAjax("/api/index", parse);
        </script>
    </body>
</html>