Skip to content

Latest commit

 

History

History
56 lines (38 loc) · 1.8 KB

README.md

File metadata and controls

56 lines (38 loc) · 1.8 KB
Raw

podcast-player

Screenshot of podcast-player

<podcast-player src="my.mp3"></podcast-player>

A web component for audio podcasts. It has a few features that make it most suitable for podcasts:

  • Play/Pause
  • 30s Rewind Button
  • Seekable Progress Meter
  • Speed Selection
  • Mute/Unmute
  • Accessibility
  • TimeJump?

Usage

To get started, you'll need a copy of webcomponents.js. Either link from CDNjs or

bower install webcomponentsjs

Include webcomponents.min.js and podcast-player.html in the <head> of your episode page:

<script src="webcomponents.min.js"></script>
<link rel="import" href="podcast-player.html"/>

Then in the body of your post, invoke the custom component using the <podcast-player> element.

<podcast-player src="my.mp3"></podcast-player>

BINGO-BANGO! Now you should be able to style it with good old fashioned CSS. Make it your own, good buddy.

Testing Locally

To test out web components locally, you need to start a local server so you don't get a CORS violation with something like:

cd to/my/directory/
python -m SimpleHTTPServer

If you have questions about web components, read up on them at webcomponents.org.

Download, Fork, Commit

If you like to contribue, please feel free to fork the repo. If you created a brand new feature, I recommend discussing it in an issue first rather wasting your whole weekend working on it, then Hail Mary'ing it my way.

If you're reporting a bug, you'd better have an editable reduced test case on a CodePen or GTFO. Sorry, thems the brakes. I got kids.