<%- include("../../partials/header.ejs") %>
<script type="application/ld+json">
{
    "@context": "http://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Home",
        "item": "<%= baseURL %><%= linkPrefix %>"
    }, {
        "@type": "ListItem",
        "position": 2,
        "name": "Bot",
        "item": "<%= baseURL %><%= linkPrefix %>/bots"
    }, {
        "@type": "ListItem",
        "position": 2,
        "name": "Submit",
        "item": "<%= baseURL %><%= linkPrefix %>/bots/submit"
    }]
}
</script>
<link href="/css/theme/<%= preferredTheme %>/form.css?v=<%= cssVersion %>" media="screen, print" rel="stylesheet">
<link rel="stylesheet" data-name="vs/editor/editor.main" href="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.20.0/min/vs/editor/editor.main.min.css" integrity="sha512-XjO5XYWl8u7tYF3CItEHgoWh8rtQmDeSzPJq4+4PIrbak7TiqeKbWv/4ZwHZ1HAf5dIWHXoguA/jobn2psKZ7w==" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js" integrity="sha512-/DXTXr6nQodMUiq+IUJYCt2PPOUjrHJ9wFrqpJ3XkgPNOZVfMok7cRw6CSxyCQxXn6ozlESsSh1/sMCTF1rL/g==" crossorigin="anonymous" async></script><%- include("../../partials/nav.ejs") %>
<section class="hero is-black">
    <div class="hero-body">
        <br>
        <div class="container has-text-centered">
            <h1 class="title">
                <span class="icon is-medium iconalign">
                    <i aria-hidden="true" class="fas fa-plus has-text-default"></i>
                </span>
                <br>
                <span><%= title %></span>
            </h1>
            <h2 class="subtitle">
                <%= subtitle %>
            </h2>
            <% if (showResubmitNote) { %>
                <p class="subtitle is-6">
                    <%- __("page.bots.submit.resubmitNote", {
                        a: `<a href="${linkPrefix}/users/@me#archived-bots" class="has-text-info">`,
                        ea: '</a>'
                    }) %>
                </p>
            <% } %>
        </div>
    </div>
</section>
<div class="container">
    <div class="section">
        <article id="errors" style="display: none;" class="message is-danger">
            <div class="message-body content has-background-primary">
                <ul id="errorList" style="margin-top: unset;">
                    
                </ul>
            </div>
        </article>
        
        <form method="POST">
            <h3 class="is-size-3 has-text-default">
                <%= __("page.form.category.generalInfo") %>
            </h3>
            <br>
            <div class="field">
                <label class="label has-text-default"><span id="idText"><%= __("page.bots.generalInfo.clientID") %></span> <span class="has-text-danger">*</span></label>
                <p id="idDetails" style="padding-bottom: 10px;" class="is-size-7 has-text-default">
                    <%= __("page.bots.generalInfo.clientID.detailsEdit") %>
                </p>
                <p class="control has-icons-left has-icons-right" required>
                    <input id="id" class="input is-rounded" type="text" name="id" placeholder="568254611354419211">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-hashtag"></i>
                    </span>
                </p>
                <p id="appName" style="margin-top: 10px;" class="is-size-7 has-text-default"></p>
            </div>
            <br>
            <label class="label has-text-default"><%= __("page.bots.generalInfo.scopes") %> <span class="has-text-danger">*</span></label>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-default" type="checkbox" id="bot" name="bot">
                <label class="has-text-default" for="bot"><%= __("common.bot") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-default" type="checkbox" id="slashcommands" name="slashcommands">
                <label class="has-text-default" for="slashcommands"><%= __("common.applicationCommands") %></label>
            </div>
            <br>
            <div class="field" id="clientIDBlock" style="display: none">
                <label class="label has-text-default"><%= __("page.bots.generalInfo.clientID") %></label>
                <p style="padding-bottom: 10px;" class="is-size-7 has-text-default">
                    <%= __("page.bots.generalInfo.clientID.details") %>
                </p>
                <p class="control has-icons-left has-icons-right">
                    <input id="clientID" class="input is-rounded" type="text" name="clientID" placeholder="568254611354419211">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-hashtag"></i>
                    </span>
                </p>
                <br>
            </div>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.generalInfo.editors") %> <span class="has-text-default">(<%= __("common.form.spaceSeparated") %>)</span></label>
                <p style="padding-bottom: 10px;" class="is-size-7 has-text-default">
                    <%= __("page.bots.generalInfo.editors.notice") %>
                </p>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_editors" class="input is-rounded" type="text" name="editors" placeholder="<%= __("page.bots.generalInfo.editors.placeholder") %>">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-user"></i>
                    </span>
                </p>
            </div>
            <br>
            <div class="field" id="prefixBlock">
                <label class="label has-text-default"><%= __("page.bots.generalInfo.prefix") %></label>
                <p class="control has-icons-left has-icons-right" required>
                    <input id="form_prefix" class="input is-rounded" type="text" name="prefix" placeholder="!" maxlength="32">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-paper-plane"></i>
                    </span>
                </p>
                <br>
            </div>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.generalInfo.library") %> <span class="has-text-danger">*</span></label>
                <div class="control has-icons-left">
                    <div class="select is-rounded">
                        <select id="form_library" name="library" required>
                            <option value="" disabled selected><%= __("common.select") %></option>
                            <% for (const lib of libraries) { %><option value="<%- lib._id %>"><%- lib._id %></option><% } %>
                        </select>
                    </div>
                    <div class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-book"></i>
                    </div>
                </div>
            </div>
            <br>
            <label class="label has-text-default"><%= __("common.tags") %></label>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-link" type="checkbox" id="fun" name="fun">
                <label class="has-text-link" for="fun"><%= __("page.bots.tag.fun") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-info" type="checkbox" id="social" name="social">
                <label class="has-text-info" for="social"><%= __("page.bots.tag.social") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-success" type="checkbox" id="economy" name="economy">
                <label class="has-text-success" for="economy"><%= __("page.bots.tag.economy") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-orange" type="checkbox" id="utility" name="utility">
                <label class="has-text-orange" for="utility"><%= __("page.bots.tag.utility") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-danger" type="checkbox" id="moderation" name="moderation">
                <label class="has-text-danger" for="moderation"><%= __("page.bots.tag.moderation") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-magenta" type="checkbox" id="multipurpose" name="multipurpose">
                <label class="has-text-magenta" for="multipurpose"><%= __("page.bots.tag.multipurpose") %></label>
            </div>
            <div class="field">
                <input class="is-checkradio is-circle has-background-color is-pink" type="checkbox" id="music" name="music">
                <label class="has-text-pink" for="music"><%= __("common.tags.music") %></label>
            </div>
            <br>
            <br>
            <h3 class="is-size-3 has-text-default">
                <%= __("page.form.category.links") %>
            </h3>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.invite") %></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_invite" class="input is-rounded" type="text" name="invite" placeholder="<%= __("page.bots.invite.placeholder") %>">
                    <span class="icon is-small is-left">
                <i aria-hidden="true" class="fas fa-link"></i>
            </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.website") %></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_website" class="input is-rounded" type="text" name="website" placeholder="https://watchanimeattheoffice.com">
                    <span class="icon is-small is-left">
                <i aria-hidden="true" class="fas fa-globe"></i>
            </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.donate") %></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_donationUrl"  class="input is-rounded" type="text" name="donationUrl" placeholder="https://bigbeans.solutions">
                    <span class="icon is-small is-left">
                <i aria-hidden="true" class="fas fa-dollar-sign"></i>
            </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.supportServer") %></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_supportServer" class="input is-rounded" type="text" name="supportServer" placeholder="https://discord.gg/someawesumsupportservhor">
                    <span class="icon is-small is-left">
                <i aria-hidden="true" class="fas fa-heart"></i>
            </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.git") %></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_repo" class="input is-rounded" type="text" name="repo" placeholder="https://github.com/awsumpersunorpage/awsumrepo">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-code-branch"></i>
                    </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.privacyPolicy") %> <span class="has-text-danger">*</span></label>
                <p style="padding-bottom: 10px" class="is-size-7 has-text-default">
                    <%- __("page.bots.privacyPolicy.required", {
                        a: '<a class="has-text-info" target="blank" rel="noopener" href="https://gist.github.com/advaith1/58c61df8f4c7ba984fc72945f0aa5f9c">',
                        ea: "</a>"
                    }) %>
                </p>
                <p class="control has-icons-left">
                    <input id="form_privacyPolicy" class="input is-rounded" type="text" name="privacyPolicy" placeholder="!privacy or https://discord.bot/privacy">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-user-secret"></i>
                    </span>
                </p>
            </div>
            <br>
            <br>
            <h3 class="is-size-3 has-text-default"><%= __("common.social") %></h3>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("common.social.twitter") %></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_twitter" class="input is-rounded" type="text" name="twitter" placeholder="bestbot" maxlength="15">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="far fa-at"></i>
                    </span>
                </p>
            </div>
            <br>
            <br>
            <h3 class="is-size-3 has-text-default"><%= __("page.form.category.theme") %></h3>
            <br>
            <div class="field">
                <label for="customColorSwitch" class="label has-text-default"><%= __("page.bots.theme.useCustomColor") %></label>
                <p style="padding-bottom: 10px;" class="is-size-7 has-text-default">
                    <%= __("page.bots.theme.useCustomColor.details") %>
                </p>
                <input id="form_customColourSwitch" type="checkbox" name="useCustomColour" class="switch is-rounded is-info">
                <label for="form_customColourSwitch"></label>
            </div>
            <br>
            <div class="field" id="customColor" style="display: none">
                <label class="label has-text-default"><%= __("page.bots.theme.color") %></label>
                <p style="padding-bottom: 10px;" class="is-size-7 has-text-default">
                    <%= __("page.bots.theme.color.details") %>
                </p>
                <p class="control">
                    <input id="form_colour" class="backdrop" name="colour" type="color" value="#BA2EFF" style="width:30%; background-color: transparent; border-color: transparent;">
                </p>
                <br>
            </div>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.theme.bannerURL") %></label>
                <p class="control has-icons-left">
                    <input id="form_banner" class="input is-rounded" type="text" name="banner" placeholder="https://discord.bot/files/banner.png">
                    <span class="icon is-small is-left">
                        <i aria-hidden="true" class="fas fa-image"></i>
                    </span>
                </p>
            </div>
            <br>
            <br>
            <h3 class="is-size-3 has-text-default">
                <%= __("common.widgetbot") %>
            </h3>
            <h4 class="is-size-6">
                <a class="has-text-info" rel="noopener" target="_blank" onclick="inviteWB(window, 350, 600);">
                    <%= __("common.widgetbot.invite") %>
                </a>
            </h4>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("common.widgetbot.form.guildID") %> <span class="has-text-orange">* (<%= __("common.widgetbot.form.require") %>)</span></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_widgetServer" class="input is-rounded" type="text" name="widgetServer" placeholder="568567800910839811">
                    <span class="icon is-small is-left">
                        <i class="fas fa-users"></i>
                    </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("common.widgetbot.form.channelID") %> <span class="has-text-orange">* (<%= __("common.widgetbot.form.require") %>)</span></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_widgetChannel" class="input is-rounded" type="text" name="widgetChannel" placeholder="625554238596186112">
                    <span class="icon is-small is-left">
                <i class="fas fa-comments-alt"></i>
            </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("common.widgetbot.form.moreOptions") %></label>
                <p style="cursor: pointer; padding-bottom: 10px;" onclick="window.open('https://docs.widgetbot.io/embed/crate/options/');" target="_blank" rel="noopener" class="is-size-7 has-text-default">
                    <%= __("common.widgetbot.form.docs") %>
                </p>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_widgetOptions" class="input is-rounded" type="text" name="widgetOptions" placeholder="">
                    <span class="icon is-small is-left">
                        <i class="fas fa-cogs"></i>
                    </span>
                </p>
            </div>
            <br>
            <br>
            <h3 class="is-size-3 has-text-default">
                <%= __("page.form.category.descriptions") %>
            </h3>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.shortDesc") %> <span class="has-text-danger">*</span></label>
                <p class="control has-icons-left has-icons-right">
                    <input id="form_shortDescription" class="input is-rounded" type="text" name="shortDescription" placeholder="<%= __("page.bots.shortDesc.placeholder") %>" required maxlength="200">
                    <span class="icon is-small is-left">
                <i aria-hidden="true" class="fas fa-comment-dots"></i>
            </span>
                </p>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.longDesc") %> (<%= __("common.form.htmlMarkdown") %>) <span class="has-text-danger">*</span></label>
                <div onkeyup="monacoToField();" id="longDescEditor" class="editorBackdrop" style="width:99%;height:500px;"></div>
                <textarea hidden name="longDescription" id="longDesc" required></textarea>
            </div>
            <br>
            <div class="field">
                <label class="label has-text-default"><%= __("page.bots.modNotes") %></label>
                <p style="padding-bottom: 10px;" class="is-size-7 has-text-default">
                    <%= __("page.bots.modNotes.placeholder") %>
                </p>
                <div onkeyup="monacoToField();" id="modNotesEditor" class="editorBackdrop" style="width:99%;height:300px;"></div>
                <textarea hidden name="modNotes" id="modNotes"></textarea>
            </div>
            <div style="padding-bottom: 10px;">
                <span style="font-size: 12px;" class="has-text-default">
                    <%- __("common.form.joinServer.full", {
                        a: "",
                        ea: ""
                    }) %>
                </span>
            </div>
            <div class="field is-grouped">
                <div class="buttons">
                    <a id="submitButton" onclick="doSubmit();" class="button is-success">
                        <span class="icon">
                            <i aria-hidden="true" class="fas fa-check-circle"></i>
                        </span>
                        <span><%= __("common.submit") %></span>
                    </a>
                    <a id="cancelButton" href="/users/@me" class="button is-danger">
                        <span class="icon">
                            <i aria-hidden="true" class="fas fa-times-circle"></i>
                        </span>
                        <span><%= __("common.cancel") %></span>
                    </a>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    const bot = document.querySelector('#bot')
    const slashcommands = document.querySelector('#slashcommands')
    const prefixBlock = document.querySelector('#prefixBlock')
    const clientIDBlock = document.querySelector('#clientIDBlock')
    const id = document.querySelector('#id')
    const idText = document.querySelector('#idText')
    const idDetails = document.querySelector('#idDetails')
    const clientID = document.querySelector('#clientID')
    const name = document.querySelector('#appName')
    const shortDesc = document.querySelector('#form_shortDescription')
    const privacy = document.querySelector('#form_privacyPolicy')
    const invite = document.querySelector('#form_invite')

    const onScopeChange = () => {
        clientIDDisplayCheck()
        if (!bot.checked && slashcommands.checked) {
            prefixBlock.style.display = 'none'
        } else {
            prefixBlock.style.display = 'inherit'
        }
    }

    const clientIDDisplayCheck = () => {
        if (bot.checked && id.value > 0 && BigInt(id.value) < 234395307759108106n) {
            clientIDBlock.style.display = 'inherit'
            idText.innerText = '<%= __("page.bots.generalInfo.id") %>'
            idDetails.innerText = "<%- __('page.bots.generalInfo.id.details') %>"
        } else {
            clientIDBlock.style.display = 'none'
            idText.innerText = '<%= __("page.bots.generalInfo.clientID") %>'
            idDetails.innerText = '<%= __("page.bots.generalInfo.clientID.detailsEdit") %>'
        }
    }

    id.addEventListener('change', async () => {
        clientIDDisplayCheck()

        if (!id.value) return name.innerText = ""

        if (isNaN(id.value) || id.value.includes(' ')) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerText = '<%= __("common.error.bot.arr.invalidID") %>'
            scroll(0, 0);
        } else if (id.value.length > 32) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerHTML = '<%= __("common.error.bot.arr.idTooLong") %>'
            scroll(0, 0);
        } else if (await (await fetch(`./${id.value}/exists`)).json()) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerText = '<%= __("common.error.bot.conflict") %>'
            scroll(0, 0);
        } else {
            document.getElementById("errors").style.display = "none";
            getApp(id.value)
        }
    })

    const getApp = async id => {
        const app = await (await fetch(`https://discord.com/api/v9/applications/${id}/rpc`)).json()
        if (!app.id) return

        name.innerText = app.name

        if (app.bot_public === false) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerText = '<%- __("common.error.bot.arr.notPublic") %>'
            scroll(0, 0);
        } else if (bot.checked && !('bot_public' in app)) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerText = '<%= __("common.error.bot.arr.noBot") %>'
            scroll(0, 0);
        } else {
            document.getElementById("errors").style.display = "none";
            if (!shortDesc.value && app.description) shortDesc.value = app.description
            if (!privacy.value && app.privacy_policy_url) privacy.value = app.privacy_policy_url

            if (app.install_params) {
                const scopes = app.install_params.scopes
                if (scopes.includes('bot')) bot.checked = true
                if (scopes.includes('applications.commands')) slashcommands.checked = true

                if (!invite.value)
                    invite.value = `https://discord.com/api/oauth2/authorize?client_id=${id}&scope=${scopes.join('+')}${app.install_params.permissions !== '0' ? `&permissions=${app.install_params.permissions}` : ''}`
            } else if (!invite.value && app.custom_install_url) invite.value = app.custom_install_url

            ;['fun', 'social', 'economy', 'utility', 'moderation', 'multipurpose', 'music'].forEach(tag => {
                if (app.tags.some(t => t.toLowerCase() === tag)) document.getElementById(tag).checked = true
            })
        }
    }

    clientID.addEventListener('change', async () => {
        if (isNaN(clientID.value) || clientID.value.includes(' ')) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerText = '<%= __("common.error.bot.arr.invalidClientID") %>'
            scroll(0, 0);
        } else if (clientID.value.length > 32) {
            document.getElementById("errors").style.display = "block";
            document.getElementById("errorList").innerHTML = '<%= __("common.error.bot.arr.clientIDTooLong") %>'
            scroll(0, 0);
        } else {
            document.getElementById("errors").style.display = "none";
            getApp(clientID.value)
        }
    })

    bot.addEventListener('change', onScopeChange)
    slashcommands.addEventListener('change', onScopeChange)

    const useCustomColour = document.querySelector('#form_customColourSwitch')
    const customColour = document.querySelector('#customColor')
    useCustomColour.addEventListener('change', () => {
        if(useCustomColour.checked) {
            customColour.style.display = 'inherit'
        } else customColour.style.display = 'none'
    })
    const warn = event => {
        event.preventDefault()
        event.returnValue=''
    }
    addEventListener('beforeunload', warn)
    document.querySelector('form').onsubmit = () => removeEventListener('beforeunload', warn)
    MonacoEnvironment = {getWorkerUrl: () => '/js/monaco.js'}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.20.0/min/vs/loader.min.js" integrity="sha512-gWqaPfGsZiCkYB6e5mNN4SMRpEvLGItLBqgOAoyLSKtDxWS2O1YPcOeGTy8d8l00gqc8rVue9ae/ncZqhmfj4g==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.20.0/min/vs/editor/editor.main.nls.min.js" integrity="sha512-4XY3/LL6Plkq2tXMnatY+se07ZhwFMkZehD5Z68HrKoSL3BTyLDjwFomhUWixKu8VUw6jWe/8RXT1WtH95lLFg==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.20.0/min/vs/editor/editor.main.min.js" integrity="sha512-CK3czr9gLG2z/ygdSM+gNenkN9AShfpW4gMjVyY06VgFHLoc4OCoO92Z8UkcBwVX0ufoYbJw3IVs1mHfXQeI3g==" crossorigin="anonymous"></script>
<script>var longDescEditor=monaco.editor.create(document.getElementById("longDescEditor"),{language:"markdown"});var modNotesEditor=monaco.editor.create(document.getElementById("modNotesEditor"));function monacoToField(){var o=window.longDescEditor.getValue();$("#longDesc").val(o);var y=window.modNotesEditor.getValue();$("#modNotes").val(y)}monaco.editor.setTheme("<%= monacoTheme %>");function inviteWB(win,w,h){const y=win.top.outerHeight/2+win.top.screenY-(h/2);const x=win.top.outerWidth/2+win.top.screenX-(w/2);return win.open("https://add.widgetbot.io/","Invite WidgetBot",`toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=${ w }, height=${ h }, top=${ y }, left=${ x }`)}</script>
<script>
function doSubmit() {
    monacoToField();
    document.getElementById("errors").style.display = "none";
    document.getElementById("submitButton").classList.add("is-loading");
    document.getElementById("cancelButton").setAttribute("disabled", true);
    document.getElementById("cancelButton").removeAttribute("href");

    async function fetchPOST(url = '', data = {}) {
            const response = await fetch(url, {
                method: "POST",
                mode: "cors", 
                cache: "no-cache", 
                credentials: "same-origin",
                headers: {
                    "Content-Type": "application/json"
                },
                redirect: "follow",
                referrerPolicy: "no-referrer",
                body: JSON.stringify(data)
            });

            return response.json();
        }
        
        let modNotes = document.getElementById("modNotes").value;

        fetchPOST("<%= linkPrefix %>/bots/submit", {
            bot: document.getElementById("bot").checked,
            slashCommands: document.getElementById("slashcommands").checked,

            id: document.getElementById("id").value,
            clientID: document.getElementById("clientID").value,

            prefix: document.getElementById("form_prefix").value,
            library: document.getElementById("form_library").value,
            editors: document.getElementById("form_editors").value,

            fun: document.getElementById("fun").checked,
            social: document.getElementById("social").checked,
            economy: document.getElementById("economy").checked,
            utility: document.getElementById("utility").checked,
            moderation: document.getElementById("moderation").checked,
            multipurpose: document.getElementById("multipurpose").checked,
            music: document.getElementById("music").checked,
            
            shortDescription: document.getElementById("form_shortDescription").value,
            longDescription: document.getElementById("longDesc").value,

            modNotes: modNotes,

            supportServer: document.getElementById("form_supportServer").value,
            website: document.getElementById("form_website").value,
            donationUrl: document.getElementById("form_donationUrl").value,
            repo: document.getElementById("form_repo").value,
            invite: document.getElementById("form_invite").value,

            twitter: document.getElementById("form_twitter").value,
            privacyPolicy: document.getElementById("form_privacyPolicy").value,
            
            useCustomColour: document.getElementById("form_customColourSwitch").checked,
            colour: document.getElementById("form_colour").value,
            banner: document.getElementById("form_banner").value,

            widgetChannel: document.getElementById("form_widgetChannel").value,
            widgetOptions: document.getElementById("form_widgetOptions").value,
            widgetServer: document.getElementById("form_widgetServer").value
        })
        .then(data => {
            if (!data || data.error === true) {
                document.getElementById("errors").style.display = "block";
                document.getElementById("errorList").innerHTML = data.errors.map(err => `<li>${err}</li>`).join('');
                scroll(0, 0);
                document.getElementById("submitButton").classList.remove("is-loading");
                document.getElementById("cancelButton").removeAttribute("disabled");
                document.getElementById("cancelButton").setAttribute("href", `/users/@me`);
            } else {
                removeEventListener("beforeunload", warn);
                window.location = `/bots/${document.getElementById("id").value}`;
            }
        });
}
</script>
<%- include("../../partials/footer.ejs") %>
