trikolon / liquidradio Goto Github PK
View Code? Open in Web Editor NEWFrontend for music station Liquid Radio
Home Page: https://liquidradio.pro
License: MIT License
Frontend for music station Liquid Radio
Home Page: https://liquidradio.pro
License: MIT License
(through a Service Wörker)
Not sure if this is only an issue on my side. Perhaps there is a way to fix it. Will do some research.
The Visualizer should also fade out in the graph as before when the playback is paused. Instead it just freezes. This is due to the new play-state check.
Perhaps we could add a timeout until the animation is paused so that the fadeout works.
Implement support for fallback URLs for audio stream. When an url is not working try the next one. When a station is completely offline switch to the next one.
new port: 8359
master -> dev
When switching from an online stream to an offline stream all button actions result in endless buffering.
Sent from my OnePlus A0001 using FastHub
Options:
StreamPlayer.js:94 StreamPlayer: Error while setting up AudioAPI TypeError: Failed to execute 'createMediaElementSource' on 'BaseAudioContext': parameter 1 is not of type 'HTMLMediaElement'.
at VueComponent.mounted (StreamPlayer.js:90)
at callHook (vue.esm.js:2665)
at Object.insert (vue.esm.js:3526)
at invokeInsertHook (vue.esm.js:5469)
at Vue$3.patch [as __patch__] (vue.esm.js:5639)
at Vue$3.Vue._update (vue.esm.js:2414)
at Vue$3.updateComponent (vue.esm.js:2538)
at Watcher.get (vue.esm.js:2881)
at new Watcher (vue.esm.js:2870)
at mountComponent (vue.esm.js:2542)
... when using the volume buttons after that, it behaves as if it had actually remembered the previously saved volume. Example/recreation: play stream, set the volume to 10%, refresh the page, press play again (volume is at 100%) and then use volume down (volume jumps to 0%)
When the stream starts / stops or the station is switched fade out the audio, stop the playback and fade in the new stream (if any).
Implement support for parameter station
in the url.
This enables direct sharing / bookmarking of stations via url.
Behavior:
When the application loads it checks for parameter station
in the url, where station holds the station id. E.g.: https://liquidradio.pro/?station=liquid_radio
. If the parameter matches a station it selects that station initially. When the user selections a new station the parameter in the url is updated accordingly.
This function could be used to extract the parameter:
function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
}
this.mediaElSrc.mediaElement
always undefined in Firefox
Implement functionality for the user to add radio stations that are stored in their browsers local storage.
(Additionally to the default stations queried from the stream server)
Newly selected station does not play if switched to from an already playing station.
Store state in audio element rather than stream.play
etc, combined with the use of computed properties.
For the two currently collapsible menus in the sidebar, and for every potential collapsible menu to be added in the future, everyone but the station's menu would be better to close automatically when closing the sidebar (up to a certain numbers of stations when the list size requires it to be either grouped within itself of a scrolling feature, etc [further details to hypothetical atp]).
Two out of the recently added audio streams ("Rough Tempo" [1] & "DnB Radio" [2]),
both 128kbps mpga, appear as 'Offline' even though their stream source is working fine:
Pre Proxy Stream Sources:
=> Web audio api
This could potentially resolve issues related to #14
The button to enter station edit mode should open the station dropdown (if not already opened)
iE drop down menu or, other selection methods, to choose between the different bitrates (of 320k 256k 192k 128k 64k 32k) depending on what source streams are already available from the respective stations.
Would it be possible with the Echo Nest API?
https://notes.variogr.am/2010/04/24/the-echo-nest-musical-fingerprint-enmfp/
https://github.com/spotify/echoprint-server
https://github.com/echonest/
http://the.echonest.com
Monitor network requests / GETs.
Polling to backend? Socket connection?
Make the title show the currently selected station e.g.:
Liquid Radio - <station.title>
This is also visible in the android playback notification.
Load visualizer from .vue file?
https://sentry.io/pbz/liquidradio/issues/444184634/
TypeError: Cannot read property 'id' of undefined
at None (/bundle.js:15:402024)
at o.it [as _l] (/bundle.js:1:17256)
at o.render (/bundle.js:15:401855)
at o.e._render (/bundle.js:5:10682)
at o.n (/bundle.js:1:12911)
...
(24 additional frame(s) were not displayed)
When the page is loaded with visualizer set to false
enabling it via the switch in the navigation does not work.
... especially visible in the low end. The behavior is new appearing only since one of the last few updates present in both DEV & MASTER.
Components are first all mounted then destroyed and then mounted again. I wasn't able to find the source of this bug yet. Ideas?
When the WiFi connection of my phone breaks off, the device is momentarily without a web connection and the stream stops, no "stream stalled" notification is shown. Upon using 'skip' the message "stream offline" is displayed. When the connection is reestablished only 'skip' resumes the stream, 'play/pause' is without effect.
Unsuccessfully buffering stream does not result in "Stream Offline" notice
Sent from my OnePlus A0001 using FastHub
Volume setting loaded from local storage does not apply initially (only after adjusting the volume).
Steps to reproduce the problem:
When switch from the online station to the first still offline station whilst playing a quick play/pause loop is triggered that is only stopped through skip/forward or reloading the page.
Sent from my OnePlus A0001 using FastHub
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.