PixivFE/views/pages/settings.jet.html

<div class="container" data-hx-boost="false">
  <h1>Settings</h1>
  <p>
    PixivFE uses <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies">cookies</a> to store your
    preferences, which you can change on this page to customize your experience on this instance.
  </p>
  <!-- General settings -->
  <div class="tabs">
    <input id="account" class="hidden" type="radio" name="tabsSG" checked>
    <label for="account">Account</label>
    <div class="tabs-content">
      <h2 id="login">Login</h2>
      <p>Supported features (for now):</p>
      <ul>
        <li>Discovery page</li>
        <li>Landing page</li>
        <li>Like/Bookmark</li>
      </ul>
      <p>
        Log in with your Pixiv account's cookie to access features above.
        To learn how to obtain your cookie, please see
        <a href="https://pixivfe.pages.dev/obtaining-pixivfe-token/">the guide on obtaining your PixivFE token</a>.
      </p>
      <p>
        Keep in mind that logins will expire whenever the server is updated, so you
        may need to log in again if the server has been restarted recently.
      </p>
      <form action="/settings/token" method="post">
        <input type="text" name="token" autocomplete="off" />
        <input type="submit" value="Remember account cookie (until next server restart)" />
      </form>
      <hr />
      <h2>Logout</h2>
      <p>
        To securely end your session, click the 'Logout!' button. This will
        immediately remove your session token.
      </p>
      <form action="/settings/logout" method="post">
        <input type="submit" value="Logout!" />
      </form>
    </div>
    <!--  -->
    <input id="site" class="hidden" type="radio" name="tabsSG">
    <label for="site">Site</label>
    <div class="tabs-content">

      <h2>Image proxy server</h2>
      <p>
        Choose how images are loaded in PixivFE by selecting either the built-in
        proxy or one of the provided external proxy servers. If you prefer, you can
        also specify a custom proxy server by entering its URL and clicking 'Use
        Custom Proxy'.
      </p>
      <div class="form-field">
        <form action="/settings/imageServer" method="post">
          <label>
            <input type="radio" name="image-proxy" required="true" value="" />
            No (use built-in proxy)
          </label>
          {{ range ProxyList }}
          <label>
            <input type="radio" name="image-proxy" required="true" value="{{.}}" />
            {{.}}
          </label>
          {{ end }}
          <input type="submit" value="Use selected proxy" />
        </form>
        <br />
        <form action="/settings/imageServer" method="post">
          <label for="image-proxy">
            Custom image proxy server
            <input type="text" name="image-proxy" required="true" placeholder="https://example.com"
              autocomplete="off" />
          </label>
          <input type="submit" value="Use custom proxy" />
        </form>
      </div>
      <h2>Open artworks in new tab</h2>
      <form action="/settings/thumbnailToNewTab" method="post">
        <input id="ttnt-y" type="radio" name="ttnt" value="_blank" />
        <label for="ttnt-y">Yes</label>
        <br />
        <input id="ttnt-n" type="radio" name="ttnt" value="_self" />
        <label for="ttnt">No</label>
        <br />
        <input type="submit" value="Submit" />
      </form>
      <h2>Artwork preview pop-ups</h2>
      <p><b>Require Javascript.</b></p>
      <form action="/settings/artworkPreview" method="post">
        <input id="app-c" type="radio" name="app" value="cover" />
        <label for="app-c">
          Cover
          <small>Open the previewer when you click into the thumbnails</small>
        </label>
        <br />
        <input id="app-b" type="radio" name="app" value="button" />
        <label for="app-b">
          Button
          <small>Add a button at the bottom-right of the thumbnails and open the previewer when you click into
            it</small>
        </label>
        <br />
        <input id="app-d" type="radio" name="app" value="disable" />
        <label for="app-d">
          Disable
          <small>No previewing</small>
        </label>
        <br />
        <input type="submit" value="Submit" />
      </form>
    </div>
    <!--  -->
    <input id="novels" class="hidden" type="radio" name="tabsSG">
    <label for="novels">Novels</label>
    <div class="tabs-content">
      <h2>Font family</h2>
      <form action="/settings/novelFontType" method="post">
        <input id="font-type-mincho" type="radio" name="font-type" value="mincho" />
        <label for="font-type-mincho">Mincho</label>
        <br />
        <input id="font-type-gothic" type="radio" name="font-type" value="gothic" />
        <label for="font-type-gothic">Gothic</label>
        <br />
        <input type="submit" value="Submit" />
      </form>
      <hr />
      <h2>Force text orientation</h2>
      <form action="/settings/novelViewMode" method="post">
        <input id="tx-ori-h" type="radio" name="view-mode" value="1" />
        <label for="tx-ori-h">Horizontal</label>
        <br />
        <input id="tx-ori-v" type="radio" name="view-mode" value="2" />
        <label for="tx-ori-v">Vertical</label>
        <br />
        <input id="tx-ori-n" type="radio" name="view-mode" value="" />
        <label for="tx-ori-n">Don't force (default from Pixiv)</label>
        <br />
        <input type="submit" value="Submit" />
      </form>
    </div>
  </div>

  <!-- End of general settings -->
  <h2>Current cookie values</h2>
  <div>
    <h3>Cookie list</h3>
    Please note that some cookies here such as ShowArtR18,
    ShowArtR18G, and ShowArtAI are for features still under development.
  </div>
  {{ range k, v := CookieList }}
  <div class="settings-set-cookie">
    <h3>{{k}}</h3>
    <form action="/settings/set-cookie" method="post">
      <input type="hidden" name="key" value="{{k}}" />
      <input type="text" name="value" value="{{v}}" />
      <input type="submit" value="Set" />
    </form>

  </div>
  {{ end }}
  <div>

    <h3>Raw settings</h3>
    <p>
      You can save your current cookie values to quickly set your settings on other compatible instances,
      or if the current instance's cookies went expired.
    </p>
    <p>Invalid values will be ignored.</p>
    <form action="/settings/raw" method="post">
      <textarea name="raw" rows="10" cols="80">{{range k, v := CookieList}}&#10;{{k}}={{v}}{{end}}
      </textarea>
      <input type="submit" value="Set raw settings" />
    </form>
  </div>
  <form action="/settings/reset-all" method="post">
    <input class="critical" type="submit" value="Reset all cookies/preferences" />
  </form>
</div>