mopidy / mopidy-local

Mopidy extension for playing music from your local music archive
https://mopidy.com/ext/local/
Apache License 2.0
61 stars 26 forks source link

Update web interface for mopidy-local #64

Closed natumbri closed 2 years ago

natumbri commented 2 years ago

Have you considered using the mopidy.css stylesheet to style the mopidy-local web client?

When I added a image caching webclient to the mopidy-youtube front end, I formatted it using the mopidy.css stylesheet, so that it would be stylistically similar to the default mopidy web interface. I also included some javascript to make sure the images scale for screens (or browser windows) that are smaller than 600px wide.

I've made a similar suggestion for mopidy-bandcamp

Perhaps you'd be interested in doing the same thing with mopidy-local. If you are interested, the img style for the image thumbnails could also be moved into mopidy.css so the default thumbnail can be the same for all web frontends?

Cheers, Nik

natumbri commented 2 years ago

Thanks @jodal - I've tried to update per your suggestions, including CSS grid instead of javascript for handling resizing of images. The only one that didn't work was switching the border CSS to plain HTML: this still left an underline border.

Cheers, Nik

djmattyg007 commented 2 years ago

Do you know if template escaping is on by default? The docs aren't particularly clear about this:

https://www.tornadoweb.org/en/stable/template.html

If it isn't, we should work out how to turn it on, or add the necessary escaping.

natumbri commented 2 years ago

@djmattyg007 All template output is escaped by default, using the tornado.escape.xhtml_escape function, I'm told...

https://www.tornadoweb.org/en/stable/guide/templates.html#template-syntax

natumbri commented 2 years ago

As you may have guessed, I too am no webdev (or, strictly, any kind of dev!). But I think I've worked it out: CSS property aspect-ratio.

(Also fixed up the stray, incorrect id, which was referenced in the javascript.)