mirror of
https://codeberg.org/VnPower/PixivFE
synced 2024-12-06 19:16:23 +01:00
perennial
297 lines
21 KiB
HTML
297 lines
21 KiB
HTML
{{- extends "layout/default" }}
|
|
{{- block body() }}
|
|
<div class="row justify-content-center mb-5">
|
|
<div class="col-12 col-lg-9">
|
|
<div class="mb-4">
|
|
<h1 class="h3 fw-bold mb-3">Settings</h1>
|
|
<p class="card-text">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>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-12 col-lg-3 mb-3 mb-lg-0">
|
|
<!-- Tabs -->
|
|
<nav class="nav nav-pills nav-fill d-flex flex-column fw-bold" id="settingsTabs" role="tablist">
|
|
<button class="btn btn-dark rounded-pill border-0 flex-fill fw-bold mb-1 active" id="account-tab" data-bs-toggle="tab" data-bs-target="#account" type="button" role="tab" aria-controls="account" aria-selected="true">Account</button>
|
|
|
|
<button class="btn btn-dark rounded-pill border-0 flex-fill fw-bold mb-1" id="site-tab" data-bs-toggle="tab" data-bs-target="#site" type="button" role="tab" aria-controls="site" aria-selected="false">Site</button>
|
|
|
|
<button class="btn btn-dark rounded-pill border-0 flex-fill fw-bold mb-1" id="novels-tab" data-bs-toggle="tab" data-bs-target="#novels" type="button" role="tab" aria-controls="novels" aria-selected="false">Novels</button>
|
|
|
|
<button class="btn btn-dark rounded-pill border-0 flex-fill fw-bold" id="advanced-settings-tab" data-bs-toggle="tab" data-bs-target="#advanced-settings" type="button" role="tab" aria-controls="advanced-settings" aria-selected="false">Advanced settings</button>
|
|
</nav>
|
|
</div>
|
|
<div class="col-12 col-lg-9">
|
|
<div class="card border-0">
|
|
<div class="card-body rounded-5 bg-body-tertiary p-4">
|
|
<!-- Tab content -->
|
|
<div class="tab-content" id="settingsTabsContent">
|
|
<!-- Account Tab -->
|
|
<div class="tab-pane fade show active" id="account" role="tabpanel" aria-labelledby="account-tab">
|
|
<ul class="list-group list-group-flush">
|
|
<h2 class="h4 fw-bold mb-4">Account</h2>
|
|
<li class="list-group-item bg-body-tertiary pt-0 pb-4 px-0">
|
|
<h3 class="h5 fw-bold mb-3">Log in</h3>
|
|
<p>
|
|
Log in with your Pixiv account's cookie to access the features below.
|
|
To learn how to obtain your cookie, please see
|
|
<a href="https://pixivfe-docs.pages.dev/obtaining-pixivfe-token/">the guide on obtaining your PixivFE token</a>.
|
|
</p>
|
|
<p>Supported features (for now):</p>
|
|
<ul class="mb-3">
|
|
<li>Discovery page</li>
|
|
<li>Landing page</li>
|
|
<li>Like/Bookmark</li>
|
|
</ul>
|
|
<p>
|
|
Cookies will be saved on your browser, and will expire after a fixed period of time.
|
|
</p>
|
|
<form action="/settings/token" method="post">
|
|
<div class="mb-3">
|
|
<label for="token" class="form-label"><span class="fw-bold">PixivFE token</span></label>
|
|
<input type="text" class="form-control" id="token" placeholder="123456_AaBbccDDeeFFggHHIiJjkkllmMnnooPP">
|
|
<div id="tokenHelpBlock" class="form-text">
|
|
The underscore separates your member ID (left side) from a random string (right side).
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary rounded-pill">Log in</button>
|
|
</form>
|
|
</li>
|
|
<li class="list-group-item bg-body-tertiary pt-4 pb-0 px-0">
|
|
<h3 class="h5 fw-bold mb-3">Log out</h3>
|
|
<p>
|
|
To securely end your session, click the 'Log out!' button. This will
|
|
immediately remove your session token.
|
|
</p>
|
|
<form action="/settings/logout" method="post">
|
|
<button type="submit" class="btn btn-danger rounded-pill">Log out!</button>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Site Tab -->
|
|
<div class="tab-pane fade" id="site" role="tabpanel" aria-labelledby="site-tab">
|
|
<ul class="list-group list-group-flush">
|
|
<h2 class="h4 fw-bold mb-4">Site</h2>
|
|
|
|
<li class="list-group-item bg-body-tertiary pt-0 pb-4 px-0">
|
|
<h3 class="h5 fw-bold mb-3">Image proxy server</h3>
|
|
<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 'Save Changes'.
|
|
</p>
|
|
{{ if .ProxyCheckEnabled == false }}
|
|
<div class="alert alert-warning" role="alert">
|
|
<p>
|
|
<i class="bi bi-exclamation-triangle-fill"></i> This PixivFE instance has been configured to <span class="fw-bold">not</span> check the list of built-in image proxies (<a href="https://pixivfe-docs.pages.dev/hosting/environment-variables/#pixivfe_proxy_check_enabled" class="text-decoration-none"><code class="bg-dark-subtle rounded p-1">PIXIVFE_PROXY_CHECK_ENABLED=false</code></a> has been set).
|
|
</p>
|
|
<p class="mb-0">
|
|
All image proxies will be shown by default, regardless of their actual state.
|
|
</p>
|
|
</div>
|
|
{{- else -}}
|
|
<p>
|
|
This PixivFE instance has been configured to check the list of built-in image proxies every {{ .ProxyCheckInterval }}.
|
|
</p>
|
|
<p>
|
|
Image proxies that fail this check will not be shown unless "Show all proxy servers" is enabled.
|
|
</p>
|
|
{{- end -}}
|
|
<form action="/settings/imageServer" method="post">
|
|
<div class="mb-3 form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" role="switch" id="show-all-proxies">
|
|
<label class="form-check-label" for="show-all-proxies">Show all proxy servers</label>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="image-proxy" class="form-label">Select image proxy server</label>
|
|
<select class="form-select" id="image-proxy" name="image-proxy" required data-proxy-check-enabled="{{ .ProxyCheckEnabled }}">
|
|
<option value="" data-proxy-type="working">/proxy/i.pximg.net (built-in proxy)</option>
|
|
{{- range .WorkingProxyList }}
|
|
<option value="{{.}}" data-proxy-type="working">{{.}}</option>
|
|
{{- end }}
|
|
{{- range .ProxyList }}
|
|
<option value="{{.}}" data-proxy-type="all" style="display: none;">{{.}}</option>
|
|
{{- end }}
|
|
</select>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="custom-image-proxy" class="form-label">Custom image proxy server</label>
|
|
<input type="text" class="form-control" id="custom-image-proxy" name="custom-image-proxy" placeholder="https://example.com" autocomplete="off">
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Save changes</button>
|
|
</form>
|
|
</li>
|
|
|
|
<li class="list-group-item bg-body-tertiary py-4 px-0">
|
|
<h3 class="h5 fw-bold mb-3">Open artworks in new tab</h3>
|
|
<form action="/settings/thumbnailToNewTab" method="post">
|
|
<div class="mb-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="ttnt" id="ttnt-y" value="_blank">
|
|
<label class="form-check-label" for="ttnt-y">Yes</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="ttnt" id="ttnt-n" value="_self">
|
|
<label class="form-check-label" for="ttnt-n">No</label>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Submit</button>
|
|
</form>
|
|
</li>
|
|
<li class="list-group-item bg-body-tertiary py-4 px-0">
|
|
<h3 class="h5 fw-bold mb-3">Artwork preview pop-ups</h3>
|
|
<p><span class="fw-bold">Requires Javascript.</span></p>
|
|
<form action="/settings/artworkPreview" method="post">
|
|
<div class="mb-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="app" id="app-c" value="cover">
|
|
<label class="form-check-label" for="app-c">
|
|
Cover
|
|
<small class="d-block text-muted">Open the previewer when you click into the thumbnails</small>
|
|
</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="app" id="app-b" value="button">
|
|
<label class="form-check-label" for="app-b">
|
|
Button
|
|
<small class="d-block text-muted">Add a button at the bottom-right of the thumbnails and open the previewer when you click into it</small>
|
|
</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="app" id="app-d" value="disable">
|
|
<label class="form-check-label" for="app-d">
|
|
Disable
|
|
<small class="d-block text-muted">No previewing</small>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Submit</button>
|
|
</form>
|
|
</li>
|
|
<li class="list-group-item bg-body-tertiary pt-4 pb-0 px-0">
|
|
<h3 class="h5 fw-bold mb-3">Filter artworks</h3>
|
|
<p>When submitted, unchecked options will be disabled and vice-versa.</p>
|
|
<form action="/settings/filter" method="post">
|
|
{{- hideR18 := CookieList["pixivfe-HideArtR18"] }}
|
|
{{- hideR18G := CookieList["pixivfe-HideArtR18G"] }}
|
|
{{- hideAI := CookieList["pixivfe-HideArtAI"] }}
|
|
<div class="mb-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="filter-r18" name="filter-r18" value="1" {{- if hideR18 != "" }}checked{{- end }}>
|
|
<label class="form-check-label" for="filter-r18">Hide R18</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="filter-r18g" name="filter-r18g" value="1" {{- if hideR18G != "" }}checked{{- end }}>
|
|
<label class="form-check-label" for="filter-r18g">Hide R18G</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="filter-ai" name="filter-ai" value="1" {{- if hideAI != "" }}checked{{- end }}>
|
|
<label class="form-check-label" for="filter-ai">Hide AI-generated artworks</label>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Submit</button>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Novels Tab -->
|
|
<div class="tab-pane fade" id="novels" role="tabpanel" aria-labelledby="novels-tab">
|
|
<ul class="list-group list-group-flush">
|
|
<h2 class="h4 fw-bold mb-4">Novels</h2>
|
|
<li class="list-group-item bg-body-tertiary p-0 mb-4">
|
|
<h3 class="h5 fw-bold mb-3">Font family</h3>
|
|
<form action="/settings/novelFontType" method="post">
|
|
<div class="mb-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="font-type" id="font-type-mincho" value="mincho">
|
|
<label class="form-check-label" for="font-type-mincho">Mincho</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="font-type" id="font-type-gothic" value="gothic">
|
|
<label class="form-check-label" for="font-type-gothic">Gothic</label>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary mb-4">Submit</button>
|
|
</form>
|
|
</li>
|
|
<li class="list-group-item bg-body-tertiary p-0">
|
|
<h3 class="h5 fw-bold mb-3">Force text orientation</h3>
|
|
<form action="/settings/novelViewMode" method="post">
|
|
<div class="mb-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="view-mode" id="tx-ori-h" value="1">
|
|
<label class="form-check-label" for="tx-ori-h">Horizontal</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="view-mode" id="tx-ori-v" value="2">
|
|
<label class="form-check-label" for="tx-ori-v">Vertical</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="view-mode" id="tx-ori-n" value="">
|
|
<label class="form-check-label" for="tx-ori-n">Don't force (default from Pixiv)</label>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Submit</button>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Advanced Settings Tab -->
|
|
<div class="tab-pane fade" id="advanced-settings" role="tabpanel" aria-labelledby="advanced-settings-tab">
|
|
<ul class="list-group list-group-flush">
|
|
<li class="list-group-item bg-body-tertiary p-0 mb-4">
|
|
<h2 class="h4 fw-bold mb-4">Advanced settings</h2>
|
|
<h3 class="h5 fw-bold mb-3">Cookie values</h3>
|
|
<p class="mb-4">
|
|
Please note that some cookies here such as ShowArtR18,
|
|
ShowArtR18G, and ShowArtAI are for features still under development.
|
|
</p>
|
|
{{- range k, v := CookieList }}
|
|
<div class="mb-3">
|
|
<h3 class="h6 fw-bold">{{k}}</h3>
|
|
<form action="/settings/set-cookie" method="post" class="row g-2">
|
|
<div class="col-auto">
|
|
<input type="hidden" name="key" value="{{k}}" />
|
|
<input type="text" class="form-control" name="value" value="{{v}}" />
|
|
</div>
|
|
<div class="col-auto">
|
|
<button type="submit" class="btn btn-primary">Set</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
{{- end }}
|
|
</li>
|
|
<li class="list-group-item bg-body-tertiary p-0">
|
|
<h3 class="h5 fw-bold mb-3">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>
|
|
<!-- Save raw settings -->
|
|
<form action="/settings/raw" method="post">
|
|
<div class="mb-3">
|
|
<textarea class="form-control" name="raw" rows="10">{{range k, v := CookieList}} {{k}}={{v}}{{end}}
|
|
</textarea>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Set raw settings</button>
|
|
</form>
|
|
<!-- Reset all -->
|
|
<form action="/settings/reset-all" method="post" class="mt-3">
|
|
<button type="submit" class="btn btn-danger">Reset all cookies/preferences</button>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{- end }}
|