139 lines
4.4 KiB
Plaintext
139 lines
4.4 KiB
Plaintext
package homeview
|
|
|
|
import "github.com/tigorlazuardi/redmage/views/components"
|
|
import "github.com/tigorlazuardi/redmage/views"
|
|
import "github.com/tigorlazuardi/redmage/views/utils"
|
|
import "strconv"
|
|
import "fmt"
|
|
import "github.com/tigorlazuardi/redmage/api"
|
|
|
|
templ Home(c *views.Context, data Data) {
|
|
@components.Doctype() {
|
|
@components.Head(c,
|
|
components.HeadTitle("Redmage - Home"),
|
|
)
|
|
@components.Body(c) {
|
|
@HomeContent(c, data)
|
|
}
|
|
}
|
|
}
|
|
|
|
// HomeContent returns the main content of the home page.
|
|
//
|
|
// Use this template if request is HX-Boosted.
|
|
templ HomeContent(c *views.Context, data Data) {
|
|
<main class="prose min-w-full">
|
|
@components.Container() {
|
|
if data.Error != "" {
|
|
@components.ErrorToast(data.Error)
|
|
} else {
|
|
<section class="mb-4 mx-auto">
|
|
<h1 class="mb-4">Recently Added</h1>
|
|
@filterBar(c, data)
|
|
<div id="recently-added-images">
|
|
if data.TotalImages == 0 {
|
|
<h2 class="mt-4">There are no recently added images in the current time range.</h2>
|
|
} else {
|
|
<h2 class="mt-4">
|
|
{ strconv.FormatInt(data.TotalImages, 10) } Images
|
|
</h2>
|
|
}
|
|
for _, recently := range data.RecentlyAddedImages {
|
|
<div class="divider"></div>
|
|
<h2 class="mt-4">{ recently.Device.Name }</h2>
|
|
for _, subreddit := range recently.Subreddits {
|
|
<h4>
|
|
<a class="text-primary" href={ templ.SafeURL(fmt.Sprintf("/subreddits/details/%s?device=%s", subreddit.Subreddit.Name, recently.Device.Slug)) }>
|
|
{ subreddit.Subreddit.Name }
|
|
</a>
|
|
- { strconv.Itoa(len(subreddit.Images)) } images
|
|
</h4>
|
|
@components.HorizontalImageWell() {
|
|
for _, data := range subreddit.Images {
|
|
@components.ImageCard(data, components.HideDevice)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</div>
|
|
</section>
|
|
<section>
|
|
<h1>Subreddits</h1>
|
|
for _, subreddit := range data.SubredditsList.Data {
|
|
<h3>
|
|
{ subreddit.Name } -
|
|
@utils.RelativeTimeNode(subreddit.Name, utils.NextScheduleTime(subreddit.Schedule).Unix())
|
|
</h3>
|
|
}
|
|
</section>
|
|
}
|
|
}
|
|
</main>
|
|
}
|
|
|
|
templ filterBar(c *views.Context, data Data) {
|
|
<div
|
|
id="filter-bar"
|
|
hx-get="/"
|
|
hx-target="#recently-added-images"
|
|
hx-select="#recently-added-images"
|
|
hx-swap="outerHTML"
|
|
hx-trigger="change"
|
|
hx-include="this"
|
|
hx-push-url="true"
|
|
class="grid grid-cols-[1fr,4fr] sm:grid-cols-[1fr,4fr,1fr,4fr] items-center gap-4"
|
|
>
|
|
@nsfwToggle(data)
|
|
@limitInput(data.ImageListParams)
|
|
@recentRangeInput(c.Query.Get("created_at"))
|
|
</div>
|
|
}
|
|
|
|
templ limitInput(params api.ImageListParams) {
|
|
<label for="limit" class="label">Limit</label>
|
|
<select id="limit" name="limit" class="select select-bordered w-full">
|
|
<option value="0" selected?={ params.Limit ==0 }>*No Limit</option>
|
|
<option value="25" selected?={ params.Limit == 25 }>25</option>
|
|
<option value="50" selected?={ params.Limit == 50 }>50</option>
|
|
<option value="75" selected?={ params.Limit == 75 }>75</option>
|
|
<option value="100" selected?={ params.Limit == 100 }>100</option>
|
|
<option value="200" selected?={ params.Limit == 200 }>200</option>
|
|
<option value="300" selected?={ params.Limit == 300 }>300</option>
|
|
</select>
|
|
}
|
|
|
|
templ recentRangeInput(current string) {
|
|
<label for="range" class="label">Range</label>
|
|
<select
|
|
id="range"
|
|
name="created_at"
|
|
class="select select-ghost select-bordered w-full"
|
|
>
|
|
@rangeOption("-10800", "3 Hours", current == "-10800")
|
|
@rangeOption("-21600", "6 Hours", current == "-21600")
|
|
@rangeOption("-43200", "12 Hours", current == "-43200")
|
|
@rangeOption("-86400", "1 Day", current == "-86400" || current == "")
|
|
@rangeOption("-172800", "2 Days", current == "-172800")
|
|
@rangeOption("-259200", "3 Days", current == "-259200")
|
|
@rangeOption("-604800", "7 Days", current == "-604800")
|
|
@rangeOption("-2592000", "30 Days", current == "-2592000")
|
|
</select>
|
|
}
|
|
|
|
templ rangeOption(value, text string, selected bool) {
|
|
<option selected?={ selected } value={ value }>{ text }</option>
|
|
}
|
|
|
|
templ nsfwToggle(data Data) {
|
|
<label for="nsfw" class="label">NSFW</label>
|
|
<select
|
|
id="nsfw"
|
|
name="nsfw"
|
|
class="select select-ghost select-bordered w-full"
|
|
>
|
|
<option value="-1" selected?={ data.ImageListParams.NSFW < 0 }>*No Filter</option>
|
|
<option value="0" selected?={ data.ImageListParams.NSFW == 0 }>Hide</option>
|
|
<option value="1" selected?={ data.ImageListParams.NSFW == 1 }>Show Only</option>
|
|
</select>
|
|
}
|