From b8eeb636e0640e1459742ddad908e5fdd7789a7c Mon Sep 17 00:00:00 2001 From: Atlas <17718755+uykukacinca@users.noreply.github.com> Date: Sun, 6 Oct 2024 18:36:37 +0300 Subject: [PATCH] twitch-grid-cards --- docs/configuration.md | 12 +++++++ internal/assets/static/main.css | 1 + internal/assets/templates.go | 1 + .../twitch-channels-card-contents.html | 32 +++++++++++++++++++ .../templates/twitch-channels-grid.html | 29 +++++++++++++++++ internal/feed/twitch.go | 10 ++++++ internal/widget/twitch-channels.go | 26 ++++++++++++--- 7 files changed, 106 insertions(+), 5 deletions(-) create mode 100644 internal/assets/templates/twitch-channels-card-contents.html create mode 100644 internal/assets/templates/twitch-channels-grid.html diff --git a/docs/configuration.md b/docs/configuration.md index 6f9d602a..b0059b2c 100644 --- a/docs/configuration.md +++ b/docs/configuration.md @@ -1588,6 +1588,9 @@ Preview: | ---- | ---- | -------- | ------- | | channels | array | yes | | | collapse-after | integer | no | 5 | +| collapse-after-rows | integer | no | 4 | +| style | string | no | | +| show-offline | boolean | no | false | | sort-by | string | no | viewers | ##### `channels` @@ -1596,6 +1599,15 @@ A list of channels to display. ##### `collapse-after` How many channels are visible before the "SHOW MORE" button appears. Set to `-1` to never collapse. +##### `collapse-after-rows` +Specify the number of rows to show when using the `grid-cards` style before the "SHOW MORE" button appears. + +##### `style` +Used to change the appearance of the widget. Possible values are `grid-cards`. + +##### `show-offline` + + ##### `sort-by` Can be used to specify the order in which the channels are displayed. Possible values are `viewers` and `live`. diff --git a/internal/assets/static/main.css b/internal/assets/static/main.css index d5ab9bb7..f22d54f4 100644 --- a/internal/assets/static/main.css +++ b/internal/assets/static/main.css @@ -695,6 +695,7 @@ details[open] .summary::after { @container widget (max-width: 850px) { .cards-grid { --cards-per-row: 3; } } @container widget (max-width: 750px) { .cards-grid { --cards-per-row: 3; } } @container widget (max-width: 650px) { .cards-grid { --cards-per-row: 2; } } +@container widget (max-width: 300px) { .cards-grid { --cards-per-row: 1; } } .widget-small-content-bounds { max-width: 350px; diff --git a/internal/assets/templates.go b/internal/assets/templates.go index 85abb69a..6c309830 100644 --- a/internal/assets/templates.go +++ b/internal/assets/templates.go @@ -34,6 +34,7 @@ var ( MonitorTemplate = compileTemplate("monitor.html", "widget-base.html") TwitchGamesListTemplate = compileTemplate("twitch-games-list.html", "widget-base.html") TwitchChannelsTemplate = compileTemplate("twitch-channels.html", "widget-base.html") + TwitchChannelsGridTemplate = compileTemplate("twitch-channels-grid.html", "widget-base.html", "twitch-channels-card-contents.html") RepositoryTemplate = compileTemplate("repository.html", "widget-base.html") SearchTemplate = compileTemplate("search.html", "widget-base.html") ExtensionTemplate = compileTemplate("extension.html", "widget-base.html") diff --git a/internal/assets/templates/twitch-channels-card-contents.html b/internal/assets/templates/twitch-channels-card-contents.html new file mode 100644 index 00000000..bf543417 --- /dev/null +++ b/internal/assets/templates/twitch-channels-card-contents.html @@ -0,0 +1,32 @@ +{{ define "twitch-channels-card-contents" }} + {{ if .IsLive }} + + {{ end }} +
+
+
+ + {{ .Login }} + +
+
+ {{ .Name }} + {{ if .Exists }} + {{ if .IsLive }} + {{ if .Category }} + {{ .Category }} + {{ end }} +
    +
  • +
  • {{ .ViewersCount | formatViewerCount }} viewers
    • +
+ {{ else }} +
Offline
+ {{ end }} + {{ else }} +
Not found
+ {{ end }} +
+
+
+{{ end }} diff --git a/internal/assets/templates/twitch-channels-grid.html b/internal/assets/templates/twitch-channels-grid.html new file mode 100644 index 00000000..1667e7e4 --- /dev/null +++ b/internal/assets/templates/twitch-channels-grid.html @@ -0,0 +1,29 @@ +{{ template "widget-base.html" . }} +{{ define "widget-content-classes" }}widget-content-frameless{{ end }} +{{ define "widget-content" }} +
+
+
+ {{ range .Groups.Online }} +
+ {{ template "twitch-channels-card-contents" . }} +
+ {{ end }} +
+
+ {{ if .ShowOffline }} +
+
+
Offline Channels
+
+
+ {{ range .Groups.Offline }} +
+ {{ template "twitch-channels-card-contents" . }} +
+ {{ end }} +
+
+ {{ end }} +
+{{ end }} diff --git a/internal/feed/twitch.go b/internal/feed/twitch.go index 739d7d14..33f54c82 100644 --- a/internal/feed/twitch.go +++ b/internal/feed/twitch.go @@ -38,6 +38,16 @@ type TwitchChannel struct { type TwitchChannels []TwitchChannel +func (channels TwitchChannels) GroupByLive() map[string][]TwitchChannel { + grouped := make(map[string][]TwitchChannel) + statusMap := map[bool]string{true: "Online", false: "Offline"} + for _, channel := range channels { + IsLive := statusMap[channel.IsLive] + grouped[IsLive] = append(grouped[IsLive], channel) + } + return grouped +} + func (channels TwitchChannels) SortByViewers() { sort.Slice(channels, func(i, j int) bool { return channels[i].ViewersCount > channels[j].ViewersCount diff --git a/internal/widget/twitch-channels.go b/internal/widget/twitch-channels.go index b06c986a..c1725df9 100644 --- a/internal/widget/twitch-channels.go +++ b/internal/widget/twitch-channels.go @@ -10,11 +10,15 @@ import ( ) type TwitchChannels struct { - widgetBase `yaml:",inline"` - ChannelsRequest []string `yaml:"channels"` - Channels []feed.TwitchChannel `yaml:"-"` - CollapseAfter int `yaml:"collapse-after"` - SortBy string `yaml:"sort-by"` + widgetBase `yaml:",inline"` + ChannelsRequest []string `yaml:"channels"` + Channels []feed.TwitchChannel `yaml:"-"` + Groups map[string][]feed.TwitchChannel `yaml:"-"` + CollapseAfter int `yaml:"collapse-after"` + CollapseAfterRows int `yaml:"collapse-after-rows"` + Style string `yaml:"style"` + SortBy string `yaml:"sort-by"` + ShowOffline bool `yaml:"show-offline"` } func (widget *TwitchChannels) Initialize() error { @@ -27,6 +31,10 @@ func (widget *TwitchChannels) Initialize() error { widget.CollapseAfter = 5 } + if widget.CollapseAfterRows == 0 || widget.CollapseAfterRows < -1 { + widget.CollapseAfterRows = 4 + } + if widget.SortBy != "viewers" && widget.SortBy != "live" { widget.SortBy = "viewers" } @@ -46,10 +54,18 @@ func (widget *TwitchChannels) Update(ctx context.Context) { } else if widget.SortBy == "live" { channels.SortByLive() } + + if widget.Style == "grid-cards" { + groupedChannels := channels.GroupByLive() + widget.Groups = groupedChannels + } widget.Channels = channels } func (widget *TwitchChannels) Render() template.HTML { + if widget.Style == "grid-cards" { + return widget.render(widget, assets.TwitchChannelsGridTemplate) + } return widget.render(widget, assets.TwitchChannelsTemplate) }