Bladeren bron

Update icons implementation to use custom type

Svilen Markov 7 maanden geleden
bovenliggende
commit
f7239137d6

+ 3 - 3
internal/assets/static/main.css

@@ -1059,7 +1059,7 @@ details[open] .summary::after {
     opacity: 0.8;
 }
 
-:root:not(.light-scheme) .simple-icon {
+:root:not(.light-scheme) .flat-icon {
     filter: invert(1);
 }
 
@@ -1355,7 +1355,7 @@ details[open] .summary::after {
     transition: filter 0.3s, opacity 0.3s;
 }
 
-.monitor-site-icon.simple-icon {
+.monitor-site-icon.flat-icon {
     opacity: 0.7;
 }
 
@@ -1363,7 +1363,7 @@ details[open] .summary::after {
     opacity: 1;
 }
 
-.monitor-site:hover .monitor-site-icon:not(.simple-icon) {
+.monitor-site:hover .monitor-site-icon:not(.flat-icon) {
     filter: grayscale(0);
 }
 

+ 2 - 2
internal/assets/templates/bookmarks.html

@@ -8,9 +8,9 @@
         <ul class="list list-gap-2">
         {{ range .Links }}
         <li class="flex items-center gap-10">
-            {{ if ne "" .Icon }}
+            {{ if ne "" .Icon.URL }}
             <div class="bookmarks-icon-container">
-                <img class="bookmarks-icon{{ if .IsSimpleIcon }} simple-icon{{ end }}" src="{{ .Icon }}" alt="" loading="lazy">
+                <img class="bookmarks-icon{{ if .Icon.IsFlatIcon }} flat-icon{{ end }}" src="{{ .Icon.URL }}" alt="" loading="lazy">
             </div>
             {{ end }}
             <a href="{{ .URL }}" class="bookmarks-link {{ if .HideArrow }}bookmarks-link-no-arrow {{ end }}color-highlight size-h4" {{ if not .SameTab }}target="_blank"{{ end }} rel="noreferrer">{{ .Title }}</a>

+ 2 - 2
internal/assets/templates/monitor.html

@@ -21,8 +21,8 @@
 {{ end }}
 
 {{ define "site" }}
-{{ if .IconUrl }}
-<img class="monitor-site-icon{{ if .IsSimpleIcon }} simple-icon{{ end }}" src="{{ .IconUrl }}" alt="" loading="lazy">
+{{ if .Icon.URL }}
+<img class="monitor-site-icon{{ if .Icon.IsFlatIcon }} flat-icon{{ end }}" src="{{ .Icon.URL }}" alt="" loading="lazy">
 {{ end }}
 <div class="min-width-0">
     <a class="size-h3 color-highlight text-truncate block" href="{{ .URL }}" {{ if not .SameTab }}target="_blank"{{ end }} rel="noreferrer">{{ .Title }}</a>

+ 5 - 20
internal/widget/bookmarks.go

@@ -13,32 +13,17 @@ type Bookmarks struct {
 		Title string         `yaml:"title"`
 		Color *HSLColorField `yaml:"color"`
 		Links []struct {
-			Title        string     `yaml:"title"`
-			URL          string     `yaml:"url"`
-			Icon         string     `yaml:"icon"`
-			IsSimpleIcon bool       `yaml:"-"`
-			IconSource   IconSource `yaml:"-"`
-			SameTab      bool       `yaml:"same-tab"`
-			HideArrow    bool       `yaml:"hide-arrow"`
+			Title     string     `yaml:"title"`
+			URL       string     `yaml:"url"`
+			Icon      CustomIcon `yaml:"icon"`
+			SameTab   bool       `yaml:"same-tab"`
+			HideArrow bool       `yaml:"hide-arrow"`
 		} `yaml:"links"`
 	} `yaml:"groups"`
 }
 
 func (widget *Bookmarks) Initialize() error {
 	widget.withTitle("Bookmarks").withError(nil)
-
-	for g := range widget.Groups {
-		for l := range widget.Groups[g].Links {
-			if widget.Groups[g].Links[l].Icon == "" {
-				continue
-			}
-
-			link := &widget.Groups[g].Links[l]
-			link.Icon, link.IconSource = toIconURIIfPrefixed(link.Icon)
-			link.IsSimpleIcon = link.IconSource == SimpleIcon
-		}
-	}
-
 	widget.cachedHTML = widget.render(widget, assets.BookmarksTemplate)
 
 	return nil

+ 31 - 28
internal/widget/fields.go

@@ -27,14 +27,6 @@ type HSLColorField struct {
 	Lightness  uint8
 }
 
-type IconSource uint8
-
-const (
-	IconURI IconSource = iota
-	SimpleIcon
-	DashboardIcon
-)
-
 func (c *HSLColorField) String() string {
 	return fmt.Sprintf("hsl(%d, %d%%, %d%%)", c.Hue, c.Saturation, c.Lightness)
 }
@@ -164,38 +156,49 @@ func (f *OptionalEnvString) String() string {
 	return string(*f)
 }
 
-func toIconURIIfPrefixed(icon string) (string, IconSource) {
-	var prefix, iconstr string
-
-	prefix, iconstr, found := strings.Cut(icon, ":")
+type CustomIcon struct {
+	URL        string
+	IsFlatIcon bool
+	// TODO: along with whether the icon is flat, we also need to know
+	// whether the icon is black or white by default in order to properly
+	// invert the color based on the theme being light or dark
+}
 
-	if !found {
-		return icon, IconURI
+func (i *CustomIcon) UnmarshalYAML(node *yaml.Node) error {
+	var value string
+	if err := node.Decode(&value); err != nil {
+		return err
 	}
 
-	// syntax: si:<icon_name>
-	if prefix == "si" {
-		icon = "https://cdnjs.cloudflare.com/ajax/libs/simple-icons/11.14.0/" + iconstr + ".svg"
-		return icon, SimpleIcon
+	prefix, icon, found := strings.Cut(value, ":")
+	if !found {
+		i.URL = value
+		return nil
 	}
 
-	// syntax: di:<icon_name>[.svg|.png]
-	if prefix == "di" {
+	switch prefix {
+	case "si":
+		i.URL = "https://cdn.jsdelivr.net/npm/simple-icons@latest/icons/" + icon + ".svg"
+		i.IsFlatIcon = true
+	case "di":
+		// syntax: di:<icon_name>[.svg|.png]
 		// if the icon name is specified without extension, it is assumed to be wanting the SVG icon
 		// otherwise, specify the extension of either .svg or .png to use either of the CDN offerings
 		// any other extension will be interpreted as .svg
-		var basename, ext string
-
-		basename, ext, found := strings.Cut(iconstr, ".")
-
+		basename, ext, found := strings.Cut(icon, ".")
 		if !found {
 			ext = "svg"
-			basename = iconstr
+			basename = icon
 		}
 
-		icon = "https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons@master/" + ext + "/" + basename + "." + ext
-		return icon, DashboardIcon
+		if ext != "svg" && ext != "png" {
+			ext = "svg"
+		}
+
+		i.URL = "https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons@master/" + ext + "/" + basename + "." + ext
+	default:
+		i.URL = value
 	}
 
-	return icon, IconURI
+	return nil
 }

+ 1 - 8
internal/widget/monitor.go

@@ -47,9 +47,7 @@ type Monitor struct {
 		*feed.SiteStatusRequest `yaml:",inline"`
 		Status                  *feed.SiteStatus `yaml:"-"`
 		Title                   string           `yaml:"title"`
-		IconUrl                 string           `yaml:"icon"`
-		IsSimpleIcon            bool             `yaml:"-"`
-		IconSource              IconSource       `yaml:"-"`
+		Icon                    CustomIcon       `yaml:"icon"`
 		SameTab                 bool             `yaml:"same-tab"`
 		StatusText              string           `yaml:"-"`
 		StatusStyle             string           `yaml:"-"`
@@ -61,11 +59,6 @@ type Monitor struct {
 func (widget *Monitor) Initialize() error {
 	widget.withTitle("Monitor").withCacheDuration(5 * time.Minute)
 
-	for i := range widget.Sites {
-		widget.Sites[i].IconUrl, widget.Sites[i].IconSource = toIconURIIfPrefixed(widget.Sites[i].IconUrl)
-		widget.Sites[i].IsSimpleIcon = widget.Sites[i].IconSource == SimpleIcon
-	}
-
 	return nil
 }