Merge pull request #28 from dweymouth/develop

Add artist page header with image and biography

README.md

@@ -17,10 +17,10 @@ Slightly outdated screenshots of Supersonic running against the Navidrome <a hre
 * [x] Album view with tracklist
 * [x] Browse by genre
 * [x] Browse by artist
+* [x] Artist view with biography, image, and discography (similar artists coming soon)
 * [x] Set/unset favorite and browse by favorites (albums only; artists+songs coming soon)
 * [x] Browse and play playlists (create and edit support coming soon)
 * [ ] View and edit play queue (coming soon)
-* [ ] Artist view with biography, image, similar artists (coming soon)
 * [ ] Shuffle and repeat playback modes (planned)
 * [ ] Set and view five-star rating (planned)
 * [ ] Browse by folders (planned)

go.mod

@@ -11,6 +11,7 @@ require (
 	github.com/pelletier/go-toml v1.9.3
 	github.com/wildeyedskies/go-mpv v0.0.0-20221204042335-e8961dc66756
 	github.com/zalando/go-keyring v0.2.1
+	golang.org/x/net v0.0.0-20210805182204-aaa1db679c0d
 )
 
 require (
@@ -37,7 +38,6 @@ require (
 	github.com/yuin/goldmark v1.4.0 // indirect
 	golang.org/x/image v0.0.0-20220601225756-64ec528b34cd // indirect
 	golang.org/x/mobile v0.0.0-20211207041440-4e6c2922fdee // indirect
-	golang.org/x/net v0.0.0-20210805182204-aaa1db679c0d // indirect
 	golang.org/x/sys v0.0.0-20220412211240-33da011f77ad // indirect
 	golang.org/x/text v0.3.7 // indirect
 	gopkg.in/yaml.v3 v3.0.1 // indirect

ui/browsing/artistpage.go

@@ -1,15 +1,24 @@
 package browsing
 
 import (
+	"bytes"
+	"image"
+	"image/color"
 	"log"
+	"strings"
 	"supersonic/backend"
+	"supersonic/res"
+	"supersonic/ui/layouts"
+	"supersonic/ui/util"
 	"supersonic/ui/widgets"
 
 	"fyne.io/fyne/v2"
+	"fyne.io/fyne/v2/canvas"
 	"fyne.io/fyne/v2/container"
 	"fyne.io/fyne/v2/layout"
 	"fyne.io/fyne/v2/theme"
 	"fyne.io/fyne/v2/widget"
+	"github.com/dweymouth/go-subsonic"
 )
 
 var _ fyne.Widget = (*ArtistPage)(nil)
@@ -22,7 +31,7 @@ type ArtistPage struct {
 	sm        *backend.ServerManager
 	nav       func(Route)
 	grid      *widgets.AlbumGrid
-	titleDisp *widget.RichText
+	header    *ArtistPageHeader
 	container *fyne.Container
 
 	OnPlayAlbum func(string, int)
@@ -36,11 +45,8 @@ func NewArtistPage(artistID string, sm *backend.ServerManager, im *backend.Image
 		nav:      nav,
 	}
 	a.ExtendBaseWidget(a)
-	a.titleDisp = widget.NewRichTextWithText("Artist")
+	a.header = NewArtistPageHeader()
-	a.titleDisp.Segments[0].(*widget.TextSegment).Style = widget.RichTextStyle{
+	a.container = container.NewBorder(a.header, nil, nil, nil, layout.NewSpacer())
-		SizeName: theme.SizeNameHeadingText,
-	}
-	a.container = container.NewBorder(a.titleDisp, nil, nil, nil, layout.NewSpacer())
 	a.loadAsync()
 	return a
 }
@@ -83,13 +89,17 @@ func (a *ArtistPage) loadAsync() {
 			log.Printf("Failed to get artist: %s", err.Error())
 			return
 		}
-		a.titleDisp.Segments[0].(*widget.TextSegment).Text = artist.Name
+		a.header.Update(artist)
-		a.titleDisp.Refresh()
 		ag := widgets.NewFixedAlbumGrid(artist.Album, a.im, true /*showYear*/)
 		ag.OnPlayAlbum = a.onPlayAlbum
 		ag.OnShowAlbumPage = a.onShowAlbumPage
 		a.container.Objects[0] = ag
 		a.container.Refresh()
+		info, err := a.sm.Server.GetArtistInfo2(a.artistID, nil)
+		if err != nil {
+			log.Printf("Failed to get artist info: %s", err.Error())
+		}
+		a.header.UpdateInfo(info)
 	}()
 }
 
@@ -108,3 +118,115 @@ type savedArtistPage struct {
 func (s *savedArtistPage) Restore() Page {
 	return NewArtistPage(s.artistID, s.sm, s.im, s.nav)
 }
+
+type ArtistPageHeader struct {
+	widget.BaseWidget
+
+	artistID       string
+	artistImageCtr *fyne.Container
+	titleDisp      *widget.RichText
+	biographyDisp  *widget.RichText
+	similarArtists *widget.RichText
+	container      *fyne.Container
+}
+
+func NewArtistPageHeader() *ArtistPageHeader {
+	a := &ArtistPageHeader{
+		titleDisp:      widget.NewRichTextWithText(""),
+		biographyDisp:  widget.NewRichTextWithText("Artist biography not available."),
+		similarArtists: widget.NewRichText(),
+	}
+	a.titleDisp.Segments[0].(*widget.TextSegment).Style = widget.RichTextStyle{
+		SizeName: theme.SizeNameHeadingText,
+	}
+	a.artistImageCtr = container.New(&layouts.CenterPadLayout{PadLeftRight: 10, PadTopBottom: 10},
+		NewMissingArtistImage())
+	a.biographyDisp.Wrapping = fyne.TextWrapWord
+	a.ExtendBaseWidget(a)
+	a.createContainer()
+	return a
+}
+
+func (a *ArtistPageHeader) Update(artist *subsonic.ArtistID3) {
+	if artist == nil {
+		return
+	}
+	a.artistID = artist.ID
+	a.titleDisp.Segments[0].(*widget.TextSegment).Text = artist.Name
+	a.titleDisp.Refresh()
+}
+
+func (a *ArtistPageHeader) UpdateInfo(info *subsonic.ArtistInfo2) {
+	if info == nil {
+		return
+	}
+	if info.Biography != "" {
+		segs := util.RichTextSegsFromHTMLString(info.Biography)
+		if len(segs) > 0 {
+			if ts, ok := segs[0].(*widget.TextSegment); ok && strings.TrimSpace(ts.Text) != "" {
+				a.biographyDisp.Segments = segs
+				a.biographyDisp.Refresh()
+			}
+		}
+	}
+	/** TODO:
+	if len(info.SimilarArtist) > 0 {
+		segments := make([]widget.RichTextSegment, 0)
+		segments = append(segments, &widget.TextSegment{Text: "Similar artists: "})
+		for sim := info.SimilarArtist {
+			segments = append(segments, &widget.HyperlinkSegment{
+
+			})
+		}
+	}
+	*/
+	if info.LargeImageUrl != "" {
+		if res, err := fyne.LoadResourceFromURLString(info.LargeImageUrl); err == nil {
+			im, _, err := image.Decode(bytes.NewReader(res.Content()))
+			if err != nil {
+				return
+			}
+			img := canvas.NewImageFromImage(im)
+			img.FillMode = canvas.ImageFillContain
+			img.SetMinSize(fyne.NewSize(225, 225))
+			a.artistImageCtr.RemoveAll()
+			a.artistImageCtr.Add(img)
+			a.artistImageCtr.Refresh()
+		}
+	}
+}
+
+func (a *ArtistPageHeader) createContainer() {
+	a.container = container.NewBorder(nil, nil, a.artistImageCtr, nil,
+		container.NewBorder(a.titleDisp, a.similarArtists, nil, nil, a.biographyDisp))
+}
+
+func (a *ArtistPageHeader) CreateRenderer() fyne.WidgetRenderer {
+	return widget.NewSimpleRenderer(a.container)
+}
+
+type MissingArtistImage struct {
+	widget.BaseWidget
+	container *fyne.Container
+}
+
+func NewMissingArtistImage() *MissingArtistImage {
+	m := &MissingArtistImage{}
+	m.ExtendBaseWidget(m)
+	img := canvas.NewImageFromResource(res.ResPeopleInvertPng)
+	img.FillMode = canvas.ImageFillContain
+	img.SetMinSize(fyne.NewSize(64, 64))
+	rect := canvas.NewRectangle(theme.BackgroundColor())
+	rect.StrokeColor = color.Black
+	rect.StrokeWidth = 3
+	rect.SetMinSize(fyne.NewSize(225, 225))
+	m.container = container.NewMax(
+		rect,
+		container.NewCenter(img),
+	)
+	return m
+}
+
+func (m *MissingArtistImage) CreateRenderer() fyne.WidgetRenderer {
+	return widget.NewSimpleRenderer(m.container)
+}

ui/util/util.go

@@ -3,6 +3,10 @@ package util
 import (
 	"fmt"
 	"math"
+	"strings"
+
+	"fyne.io/fyne/v2/widget"
+	"golang.org/x/net/html"
 )
 
 func SecondsToTimeString(s float64) string {
@@ -15,3 +19,31 @@ func SecondsToTimeString(s float64) string {
 
 	return fmt.Sprintf("%3d:%02d", min, sec)
 }
+
+func RichTextSegsFromHTMLString(s string) []widget.RichTextSegment {
+	tokr := html.NewTokenizer(strings.NewReader(s))
+	var segs []widget.RichTextSegment
+
+	var isLink bool
+	var done bool
+	for !done {
+		tt := tokr.Next()
+		switch {
+		case tt == html.ErrorToken:
+			done = true
+		case tt == html.StartTagToken:
+			t := tokr.Token()
+			isLink = t.Data == "a"
+		case tt == html.EndTagToken:
+			isLink = false
+		case tt == html.TextToken:
+			t := tokr.Token()
+			// for now, skip displaying Navidrome's "Read more on Last.FM" link
+			if !isLink {
+				segs = append(segs, &widget.TextSegment{Text: t.Data})
+			}
+		}
+	}
+
+	return segs
+}