mirror of
https://codeberg.org/VnPower/PixivFE
synced 2024-12-06 19:16:23 +01:00
Optimization: make the switcher code shorter #9
This commit is contained in:
VnPower
@@ -1,10 +1,11 @@
|
||||
<div class="container">
|
||||
<h2>Discover works</h2>
|
||||
<div class="switcher">
|
||||
{{ url := "/discovery?mode=" }}
|
||||
<span class="switch-title">Filter</span>
|
||||
<a href="/discovery?mode=all" class="switch-button">All</a>
|
||||
<a href="/discovery?mode=safe" class="switch-button">Safe</a>
|
||||
<a href="/discovery?mode=r18" class="switch-button">R-18</a>
|
||||
<a href="{{url}}all" class="switch-button">All</a>
|
||||
<a href="{{url}}safe" class="switch-button">Safe</a>
|
||||
<a href="{{url}}r18" class="switch-button">R-18</a>
|
||||
</div>
|
||||
<div>{{ include "small-tn" Artworks }}</div>
|
||||
<div class="pagination">
|
||||
|
||||
+75
-54
@@ -1,63 +1,84 @@
|
||||
<div class="container">
|
||||
<h2>{{ Title }}</h2>
|
||||
<h2>{{ Title }}</h2>
|
||||
|
||||
<div class="switcher">
|
||||
<span class="switch-title">Content</span>
|
||||
<a href="/ranking?content=all&mode={{ Mode }}&page=1" class="switch-button">Overall</a>
|
||||
<a href="/ranking?content=illust&mode={{ Mode }}&page=1" class="switch-button">Illustrations</a>
|
||||
<a href="/ranking?content=manga&mode={{ Mode }}&page=1" class="switch-button">Mangas</a>
|
||||
</div>
|
||||
<br />
|
||||
<div class="switcher">
|
||||
{{ url := "/ranking?mode=" + Mode + "&page=1&content=
|
||||
<span class="switch-title">Content</span>
|
||||
<a href="{{ url }}all" class="switch-button">Overall</a>
|
||||
<a href="{{ url }}illust" class="switch-button">Illustrations</a>
|
||||
<a href="{{ url }}manga" class="switch-button">Mangas</a>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
<div class="switcher">
|
||||
<span class="switch-title">Modes</span>
|
||||
<a href="/ranking?content={{ Content }}&mode=daily&page=1" class="switch-button">Daily</a>
|
||||
<a href="/ranking?content={{ Content }}&mode=weekly&page=1" class="switch-button">Weekly</a>
|
||||
<a href="/ranking?content={{ Content }}&mode=monthly&page=1" class="switch-button">Monthly</a>
|
||||
<a href="/ranking?content={{ Content }}&mode=rookie&page=1" class="switch-button">Rookie</a>
|
||||
<span class="switch-seperator"></span>
|
||||
<a href="/ranking?content={{ Content }}&mode=daily_r18&page=1" class="switch-button">Daily (R-18)</a>
|
||||
<a href="/ranking?content={{ Content }}&mode=weekly_r18&page=1" class="switch-button">Weekly (R-18)</a>
|
||||
</div>
|
||||
<br />
|
||||
<div class="switcher">
|
||||
{{ url := "/ranking?content=" + Content + "&page=1&mode=
|
||||
<span class="switch-title">Modes</span>
|
||||
<a href="{{ url }}daily" class="switch-button">Daily</a>
|
||||
<a href="{{ url }}weekly" class="switch-button">Weekly</a>
|
||||
<a href="{{ url }}monthly" class="switch-button">Monthly</a>
|
||||
<a href="{{ url }}rookie" class="switch-button">Rookie</a>
|
||||
<span class="switch-seperator"></span>
|
||||
<a href="{{ url }}daily_r18" class="switch-button">Daily (R-18)</a>
|
||||
<a href="{{ url }}weekly_r18" class="switch-button">Weekly (R-18)</a>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
{{ range Items }}
|
||||
<div class="artwork-thumbnail-small artwork-thumbnail artwork-mobile">
|
||||
<div class="artwork-rank-circle">{{ .Rank }}</div>
|
||||
{{ if toInt(.Pages) > 1 }}
|
||||
<div class="artwork-page-count"><span>⧉ {{ .Pages }}</span></div>
|
||||
{{ end }}
|
||||
<a href="/artworks/{{ .ID }}">
|
||||
<img src="{{ .Image }}" alt="{{ .Title }}" class="artwork-master-image" />
|
||||
</a>
|
||||
{{ range Items }}
|
||||
<div class="artwork-thumbnail-small artwork-thumbnail artwork-mobile">
|
||||
<div class="artwork-rank-circle">{{ .Rank }}</div>
|
||||
{{ if toInt(.Pages) > 1 }}
|
||||
<div class="artwork-page-count"><span>⧉ {{ .Pages }}</span></div>
|
||||
{{ end }}
|
||||
<a href="/artworks/{{ .ID }}">
|
||||
<img src="{{ .Image }}" alt="{{ .Title }}" class="artwork-master-image" />
|
||||
</a>
|
||||
|
||||
<a class="artwork-thumbnail-title" href="/artworks/{{ .ID }}">
|
||||
<h3 class="no-margin">{{ .Title }}</h3>
|
||||
</a>
|
||||
<a href="/users/{{ .ArtistID }}" class="artwork-thumbnail-artist flex"><img src="{{ .ArtistAvatar }}"
|
||||
alt="{{ .ArtistName }}" class="artwork-thumbnail-artist-avatar border-rounded" />
|
||||
{{ .ArtistName }}</a>
|
||||
</div>
|
||||
<a class="artwork-thumbnail-title" href="/artworks/{{ .ID }}">
|
||||
<h3 class="no-margin">{{ .Title }}</h3>
|
||||
</a>
|
||||
<a href="/users/{{ .ArtistID }}" class="artwork-thumbnail-artist flex"
|
||||
><img
|
||||
src="{{ .ArtistAvatar }}"
|
||||
alt="{{ .ArtistName }}"
|
||||
class="artwork-thumbnail-artist-avatar border-rounded"
|
||||
/>
|
||||
{{ .ArtistName }}</a
|
||||
>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="pagination">
|
||||
{{ if Page <= 1 }} <a href="#" class="pagination-button disabled">First</a>
|
||||
<a href="#" class="pagination-button disabled">Previous</a>
|
||||
{{ else }}
|
||||
<a
|
||||
href="/ranking?content={{ Content }}&mode={{ Mode }}&page=1"
|
||||
class="pagination-button"
|
||||
>First</a
|
||||
>
|
||||
<a
|
||||
href="/ranking?content={{ Content }}&mode={{ Mode }}&page={{ dec(Page) }}"
|
||||
class="pagination-button"
|
||||
>Previous</a
|
||||
>
|
||||
{{ end }}
|
||||
|
||||
<div class="pagination">
|
||||
{{ if Page <= 1 }} <a href="#" class="pagination-button disabled">First</a>
|
||||
<a href="#" class="pagination-button disabled">Previous</a>
|
||||
{{ else }}
|
||||
<a href="/ranking?content={{ Content }}&mode={{ Mode }}&page=1" class="pagination-button">First</a>
|
||||
<a href="/ranking?content={{ Content }}&mode={{ Mode }}&page={{ dec(Page) }}"
|
||||
class="pagination-button">Previous</a>
|
||||
{{ end }}
|
||||
<a href="#" class="pagination-button disabled">{{ Page }}</a>
|
||||
|
||||
<a href="#" class="pagination-button disabled">{{ Page }}</a>
|
||||
|
||||
{{ if Page == 10 }}
|
||||
<a href="#" class="pagination-button disabled">Next</a>
|
||||
<a href="#" class="pagination-button disabled">Last</a>
|
||||
{{ else }}
|
||||
<a href="/ranking?content={{ Content }}&mode={{ Mode }}&page={{ inc(Page) }}"
|
||||
class="pagination-button">Next</a>
|
||||
<a href="/ranking?content={{ Content }}&mode={{ Mode }}&page=10" class="pagination-button">Last</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if Page == 10 }}
|
||||
<a href="#" class="pagination-button disabled">Next</a>
|
||||
<a href="#" class="pagination-button disabled">Last</a>
|
||||
{{ else }}
|
||||
<a
|
||||
href="/ranking?content={{ Content }}&mode={{ Mode }}&page={{ inc(Page) }}"
|
||||
class="pagination-button"
|
||||
>Next</a
|
||||
>
|
||||
<a
|
||||
href="/ranking?content={{ Content }}&mode={{ Mode }}&page=10"
|
||||
class="pagination-button"
|
||||
>Last</a
|
||||
>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+84
-73
@@ -1,79 +1,90 @@
|
||||
<div class="container">
|
||||
<div class="tag-header">
|
||||
{{ if Tag.Metadata.id }}
|
||||
<a href="/artworks/{{ Tag.Metadata.id }}">
|
||||
<img class="tag-thumbnail" src="{{ Tag.Metadata.image }}" alt="{{ Tag.Name }}" />
|
||||
</a>
|
||||
{{ end }}
|
||||
|
||||
<div class="tag-details">
|
||||
<b class="main-tag">#{{ Tag.Name }}</b>
|
||||
<span class="translated-tag">{{ Tag.Metadata.tag }}</span>
|
||||
<br />
|
||||
<br />
|
||||
<span><b>{{ Data.Artworks.Total }}</b> works</span>
|
||||
|
||||
<p class="tag-description">{{ Tag.Metadata.abstract }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="thumbnail-container">
|
||||
{{ range Data.RelatedTags }}
|
||||
<a class="tag-container" href="/tags/{{ . }}">#{{ . }}</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<div class="switcher">
|
||||
<span class="switch-title">Type</span>
|
||||
<a href="/tags/{{ Tag.Name }}?category=artworks&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page=1"
|
||||
class="switch-button">All</a>
|
||||
<a href="/tags/{{ Tag.Name }}?category=illustrations&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page=1"
|
||||
class="switch-button">Illustrations</a>
|
||||
<a href="/tags/{{ Tag.Name }}?category=manga&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page=1"
|
||||
class="switch-button">Manga</a>
|
||||
</div>
|
||||
<div class="switcher">
|
||||
<span class="switch-title">Order</span>
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order=date_d&mode={{ Queries.Mode }}&page=1"
|
||||
class="switch-button">Newest</a>
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order=date&mode={{ Queries.Mode }}&page=1"
|
||||
class="switch-button">Oldest</a>
|
||||
</div>
|
||||
<div class="switcher">
|
||||
<span class="switch-title">Filter</span>
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode=all&page=1"
|
||||
class="switch-button">All</a>
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode=safe&page=1"
|
||||
class="switch-button">Safe</a>
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode=r18&page=1"
|
||||
class="switch-button">R18</a>
|
||||
</div>
|
||||
{{ if Data.Popular.Recent }}
|
||||
<h2>Popular artworks</h2>
|
||||
<div class="thumbnail-container">
|
||||
{{ include "small-tn-normal" Data.Popular.Recent }} {{ include
|
||||
"small-tn-normal" Data.Popular.Permanent }}
|
||||
</div>
|
||||
<div class="tag-header">
|
||||
{{ if Tag.Metadata.id }}
|
||||
<a href="/artworks/{{ Tag.Metadata.id }}">
|
||||
<img
|
||||
class="tag-thumbnail"
|
||||
src="{{ Tag.Metadata.image }}"
|
||||
alt="{{ Tag.Name }}"
|
||||
/>
|
||||
</a>
|
||||
{{ end }}
|
||||
<!-- Switchers here -->
|
||||
<br />
|
||||
<h2>Works</h2>
|
||||
<div>{{ include "small-tn" Data.Artworks.Artworks }}</div>
|
||||
|
||||
<div class="pagination">
|
||||
{{ if toInt (Queries.Page) == 1 }}
|
||||
<a href="#" class="pagination-button disabled">First</a>
|
||||
<a href="#" class="pagination-button disabled">Previous</a>
|
||||
{{ else }}
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page=1"
|
||||
class="pagination-button">First</a>
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page={{ dec(toInt(Queries.Page)) }}"
|
||||
class="pagination-button">Previous</a>
|
||||
{{ end }}
|
||||
<div class="tag-details">
|
||||
<b class="main-tag">#{{ Tag.Name }}</b>
|
||||
<span class="translated-tag">{{ Tag.Metadata.tag }}</span>
|
||||
<br />
|
||||
<br />
|
||||
<span><b>{{ Data.Artworks.Total }}</b> works</span>
|
||||
|
||||
<a href="#" class="pagination-button disabled">{{ Queries.Page }}</a>
|
||||
|
||||
<a href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page={{ inc(toInt(Queries.Page)) }}"
|
||||
class="pagination-button">Next</a>
|
||||
<p class="tag-description">{{ Tag.Metadata.abstract }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="thumbnail-container">
|
||||
{{ range Data.RelatedTags }}
|
||||
<a class="tag-container" href="/tags/{{ . }}">#{{ . }}</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<div class="switcher">
|
||||
{{ url := "/tags/" + Tag.Name + "?order=" + Queries.Order + "&mode=" +
|
||||
Queries.Mode + "&page=1" + "&category=" }}
|
||||
<span class="switch-title">Type</span>
|
||||
<a href="{{url }}artworks" class="switch-button">All</a>
|
||||
<a href="{{url }}illustrations" class="switch-button">Illustrations</a>
|
||||
<a href="{{url }}manga" class="switch-button">Manga</a>
|
||||
</div>
|
||||
<div class="switcher">
|
||||
{{ url := "/tags/" + Tag.Name + "?category=" + Queries.Category + "&mode=" +
|
||||
Queries.Mode + "&page=1" + "&order=" }}
|
||||
<span class="switch-title">Order</span>
|
||||
<a href="{{url }}date_d" class="switch-button">Newest</a>
|
||||
<a href="{{url }}date" class="switch-button">Oldest</a>
|
||||
</div>
|
||||
<div class="switcher">
|
||||
<span class="switch-title">Filter</span>
|
||||
{{ url := "/tags/" + Tag.Name + "?category=" + Queries.Category + "&order="
|
||||
+ Queries.Order + "&page=1" + "&mode=" }}
|
||||
<a href="{{url }}all" class="switch-button">All</a>
|
||||
<a href="{{url }}safe" class="switch-button">Safe</a>
|
||||
<a href="{{url }}r18" class="switch-button">R-18</a>
|
||||
</div>
|
||||
{{ if Data.Popular.Recent }}
|
||||
<h2>Popular artworks</h2>
|
||||
<div class="thumbnail-container">
|
||||
{{ include "small-tn-normal" Data.Popular.Recent }} {{ include
|
||||
"small-tn-normal" Data.Popular.Permanent }}
|
||||
</div>
|
||||
{{ end }}
|
||||
<!-- Switchers here -->
|
||||
<br />
|
||||
<h2>Works</h2>
|
||||
<div>{{ include "small-tn" Data.Artworks.Artworks }}</div>
|
||||
|
||||
<div class="pagination">
|
||||
{{ if toInt (Queries.Page) == 1 }}
|
||||
<a href="#" class="pagination-button disabled">First</a>
|
||||
<a href="#" class="pagination-button disabled">Previous</a>
|
||||
{{ else }}
|
||||
<a
|
||||
href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page=1"
|
||||
class="pagination-button"
|
||||
>First</a
|
||||
>
|
||||
<a
|
||||
href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page={{ dec(toInt(Queries.Page)) }}"
|
||||
class="pagination-button"
|
||||
>Previous</a
|
||||
>
|
||||
{{ end }}
|
||||
|
||||
<a href="#" class="pagination-button disabled">{{ Queries.Page }}</a>
|
||||
|
||||
<a
|
||||
href="/tags/{{ Tag.Name }}?category={{ Queries.Category }}&order={{ Queries.Order }}&mode={{ Queries.Mode }}&page={{ inc(toInt(Queries.Page)) }}"
|
||||
class="pagination-button"
|
||||
>Next</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user