search.html

<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>戳泡泡</title>
        <link rel="stylesheet" href="style/picnic.min.css">
        <link rel="stylesheet" type="text/css" href="style/main.css">
        <link rel="stylesheet" type="text/css" href="style/font.css">
        <link rel="icon" href="favicon.png">
        <script src="scripts/launchgame.js"></script>
        <script src="scripts/downloader.js"></script>
        <script src="scripts/addbeatmaplist.js"></script>
        <script src="scripts/settings.js"></script>
        <script src="scripts/jsloader.js"></script>
    </head>

    <body>
        <div class="game-area" id="game-area" hidden>
        </div>

        <div class="pause-menu" id="pause-menu" hidden>
            <div class="paused-title">paused</div>
            <div class="button-list">
                <div class="pausebutton continue" id="pausebtn-continue">
                    <div class="inner">Continue</div>
                </div>
                <div class="pausebutton retry" id="pausebtn-retry">
                    <div class="inner">Retry</div>
                </div>
                <div class="pausebutton quit" id="pausebtn-quit">
                    <div class="inner">Quit</div>
                </div>
            </div>
        </div>

        <nav id="main-nav">
            <div class="nav-link">
                <a href="index.html" class="brand">Osaka Salmon University!</a>
                <a href="new.html" class="pseudo button">最新</a>
                <a href="hot.html" class="pseudo button">热门</a>
                <a href="genre.html" class="pseudo button">分类</a>
            </div>
            <div class="nav-search">
                <form action="search.html">
                    <input type="text" id="inputtext"name="q" placeholder="谱面关键词或sid"/>
                    <input type="image" class="search-button" src="research.svg">
                </form>
            </div>
            <div class="nav-tool">
                <a href="local.html" class="pseudo button">收藏夹</a>
                <a href="faq.html" class="pseudo button">常见问题</a>
                <a href="settings.html" class="pseudo button">设置</a>
                <a onclick="document.documentElement.requestFullscreen();" class="pseudo button">进入全屏</a>
            </div>
        </nav>

        <div class="main-page" id="main-page">
            <div class="main-content">
                <div class="beatmap-list" id="beatmap-list">
                    <!-- to be filled in script -->
                </div>
                <div class="button" style="width:100%; margin-bottom: 10px;" id="btnmore">加载更多</div>
                <div class="text">推荐使用最新版本 Firefox 或 Chrome.</div>
                <div class="text">内测版v1.4.3. <a href="https://github.com/111116/osu">Github</a></div>
                <div class="text">由<a href="https://osu.sayobot.cn/">Sayobot</a>提供谱面</div>
            </div>
            <!-- <div class="side-panel">
                to be activated in script
            </div> -->
            <div class="statuslines" id="statuslines">
                <div class="progress" id="script-progress">
                    Scripts
                    <div class="lds-dual-ring"></div>
                </div>
                <div class="progress" id="skin-progress">
                    Skin
                    <div class="lds-dual-ring"></div>
                </div>
                <div class="progress" id="sound-progress">
                    Hitsounds
                    <div class="lds-dual-ring"></div>
                </div>
            </div>
        </div>
        <script>
            let url = new URL(window.location.href);
            let keyword = url.searchParams.get("q");
            // remove quotes, trailing spaces and duplicate spaces
            keyword = keyword.split('"').join(' ').trim().replace(/ +/g, ' ');
            document.getElementById("inputtext").value = keyword;
            var cur = 0;
            if (keyword == parseInt(keyword, 10)) {
                // is sid
                addBeatmapSid(keyword);
            }
            else {
                // search keyword
                addBeatmapList("https://api.sayobot.cn/beatmaplist?0=20&1=0&2=4&3=" + keyword + "&5=1");
                cur = 20;
            }
            document.getElementById("btnmore").onclick = function() {
                if (typeof(window.list_endid) == "undefined") {
                    addBeatmapList("https://api.sayobot.cn/beatmaplist?0=20&1=" + cur + "&2=4&3=" + keyword + "&5=1");
                }
                else {
                    if (window.list_endid == 0)
                        document.getElementById("btnmore").innerText = "已经没有更多了哦！";
                    else
                        addBeatmapList("https://api.sayobot.cn/beatmaplist?0=20&1=" + window.list_endid + "&2=4&3=" + keyword + "&5=1");
                }
                cur += 20;
            }
        </script>
        <!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-131269522-2"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-131269522-2');
</script>
    </body>
</html>

<!-- attribution -->
<!-- play icon made by https://www.flaticon.com/authors/those-icons -->
<!-- search icon made by https://www.flaticon.com/authors/good-ware -->