Scratching my own itches; my online radio player

I’ve never been into iTunes or Spotify, tuning into online radio-stations instead to satisfy my constant need for musical discovery, excitement and/ or entertainment. For a long time I was an avid KCRW listener, but times change and their eclecticism does not necessarily match mine the way it used to, so over the last couple of years many online streams (Worldwide FM, Nova, TSF Jazz, KCSN, Laurent Garnier’s PBB, …) were added to my favorites which I stored in a draft mail in Gmail of all places, accessing that file on my different devices and -where available- using VLC to play them.
But VLC isn’t available everywhere (hello “smart” TV), it is not great to manage a collections of streams and copy/pasting URL’s from that draft mail is clumsy, so after creating a simple webpage with an HTML5 audio element for my wife to listen to the local “Radio 1 classics” stream on our TV, I decided to extend that to display a list of streams to choose from with a minimum of vanilla JavaScript to do the actual switching and just a dash of CSS (still struggling with vertically aligning multiline titles in those inline-blocks, but I don’t mind that too much. No really, I’m not nervous about that whenever I see it, not at all!).
The result (at https://futtta.be/r/) is an unattractive but pretty usable mp3 stream player that I use on 4 different locations and which I can update easily to accommodate my wife’s knack for doo-wap and xmas-music. Maybe I should add falling snow-flakes to surprise her when we put up the Christmas tree? 🙂

9 thoughts on “Scratching my own itches; my online radio player”

  1. Okay tizen 2.4 and webkit 538 are quite old 🙂 That would explain it.
    Actually my original trick MIGHT work if you actually CSS prefix it with `-webkit-` (looking at the webkit version I think it corresponds with safari 7ish which still needed the prefix.
    ul#list {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    }
    Get rid of ul#list li::after
    ul#list li {
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    }
    I guess no newer version of the software are available for the device?
    PS: Can you tell how annoyed I was by the screenshot I keep trying to fix a problem I never will have 🙂

    Reply

Leave a Reply to frank Cancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.