Giter Club home page Giter Club logo

thom4parisot / webextension-fip Goto Github PK

View Code? Open in Web Editor NEW
34.0 3.0 10.0 5.41 MB

Minimalistic WebExtension to listen to FIP Radio, the best eclectic radio station (for Firefox, Chrome, Opera and Edge)

Home Page: https://chrome.google.com/webstore/detail/fnhlecpfnocgmmmghkjcipmhdpmpddii

License: MIT License

JavaScript 58.15% CSS 14.92% HTML 26.92%
chrome-extension fip-radio lastfm webextension firefox-addon angular-app opera-extension webextensions radio-station fip

webextension-fip's Introduction

FIP Radio — for Chrome, Firefox, Edge and Opera web browsers

Listen to FIP Radio in a minimalistic browser interface. FIP is an eclectic and ad-free radio station. Optionnally scrobble tracks to your last.fm account.

Oh, and it's ads free and trackers free.
Check the privacy policy to know more how first-parties (aka. not me) may collect data about you.

I developed this extension to listen to my favourite radio station when I moved from France to London.

Extension Showcase

Features

One-click playback, volume control and song preview Get to know what aired previously
Select a station Scrobble to last.fm

Install in your browser

You are one click away from installing the extension in your favourite web browser. FIP Radio WebExtension is distributed on the official web stores:

Once installed, the radio playback is accessible by clicking on the FIP logo, freshly added to your browser.

That's it!

Contribute

Contributions are friendly welcomed, either they are code, ideas or bug reports.

The developer toolchain relies on:

If you don't know them much… well it's a good occasion to learn!

Development Setup

Better for you to have https://nodejs.org/download/ (v10+) installed on your computer to use the development tooling.

Hit the Clone or download button above to get a copy of the source code. Then run these commands in a terminal:

$ npm install
$ npm run watch

Then load the unpacked extension or temporary module in your browser by typing a special URL:

Firefox Chrome
about:debugging#/runtime/this-firefox chrome://extensions/

The browser will ask you to locate the manifest.json file.

After being loaded, any change in the source code will be taken in account immediately ⚠️ except background page code — which requires to hit the related Refresh or Reload button in the extension panel.

Chrome Dev Tools will help you debugging by displaying errors or the various state change of the playback.

Testing

Tests partially assert the code works as expected. You can check on your own:

$ npm test

If you don't think about it, no problem, tests are automated when you contribute back your code.

You will receive help and guidance if adding new tests is necessary.

Current status is pretty poor but the codebase is solid.

Privacy Policy

Read the end user privacy policy.

tl;dr no data is collected.

License

MIT license.

webextension-fip's People

Contributors

abulte avatar cbonnissent avatar davidbruant avatar dependabot[bot] avatar thom4parisot avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

webextension-fip's Issues

Background -> Event Page

  • switch definition
  • summon page on click
  • let the garbage collection happening only if the radio status is stopped

Dev / Local mode without Last.FM

I don't know how to setup Last.FM scrobbling when in development mode. Actually, I don't even need Last.FM for the code I want to tweak and contribute.

A development mode without Last.FM would be useful for people like me who don't know yet how all the tools work :)

Manual Buffering?

It seems some networks make the use of the radio quite complicated.

Enhancement : link to other platforms / video link

The official iOS app has a link to other platforms (Apple Music, Spotify and Deezer), as well a link to a video.

If the links are available in FIP's API, I think it could be nice to display them in the player window.

photo 2017-11-27 22 30 19-7016

Firefox : the player window is not the right size when loaded from "More tools…" menu.

Bug encountered in Firefox 57.

I don't know if the English name is "More tools…" but it's the menu that displays more tools (Outils Supplémentaires en français). When calling the window from that menu, the player windows width stays the width of the menu, hiding the rest of the controls.

capture d ecran 2017-11-27 a 22 19 16

I've also seen the player window unfolding to the right size, but the content of the window staying at the menu width—so the player window had a big white padding to the right… and a big padding to the bottom if the menu is higher than the window. This case appears when the browser window is not large enough for the whole toolbar—the tools are added to the "More tools…" menu.

capture d ecran 2017-11-27 a 22 27 30

FIP Tab

A click on the tab displays:

  • link to archive
  • name of the show
  • song link

Track event times

  • play/pause events
  • like events
  • use Sync API to store securely the data

Tab system

Instead of having a static "FIP Radio" eating all the space, display an icon based tab system with:

  • FIP #56
  • Last.fm #58
  • Volume control

Visual glitches

Hi !
Nice extension for a first one 👍
I've just spotted two little glitches, accented characters have encoding issue and the badge containing "à l'antenne" is braking from his line.

Screenshot of pop up menu

setTimeout -> Alarm API

Will be effective only if the event page is up.

Check if there is a way to check if the background page up – otherwise runtime.getBackground will ruin all the efforts (by waking it up).

Handle network errors

Especially true when:

  • network has flaws
  • FIP audio redirect fails
  • user is not connected to the Interwebs and try hit "play"

  • update icon and display a ❗ icon (error, emptied)
  • update icon and display a gray icon on load
  • enables the user to retry manually (aka normal play)

Last.fm Tab

This tab will contain:

  • enable/disable scrobbling
  • username / link/unlink
  • fave the track

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.