├── LICENSE
├── README.md
├── demo.html
└── podcast-player.html
/LICENSE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2014 Dave Rupert
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
23 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # podcast-player
2 |
3 | 
4 |
5 | ```
6 |
7 | ```
8 |
9 | A web component for audio podcasts. It has a few features that make it most suitable for podcasts:
10 |
11 | - [x] Play/Pause
12 | - [x] 30s Rewind Button
13 | - [x] Seekable Progress Meter
14 | - [x] Speed Selection
15 | - [x] Mute/Unmute
16 | - [x] Accessibility
17 | - [ ] [TimeJump](http://davatron5000.github.io/TimeJump/)?
18 |
19 | ## Usage
20 |
21 | To get started, you'll need a copy of `webcomponents.js`. Either [link from CDNjs](https://cdnjs.com/libraries/webcomponentsjs) or
22 |
23 | ```
24 | bower install webcomponentsjs
25 | ```
26 |
27 | Include `webcomponents.min.js` and `podcast-player.html` in the `` of your episode page:
28 |
29 | ```
30 |
31 |
32 | ```
33 |
34 | Then in the body of your post, invoke the custom component using the `` element.
35 |
36 | ```
37 |
38 | ```
39 |
40 | BINGO-BANGO! Now you should be able to style it with good old fashioned CSS. Make it your own, good buddy.
41 |
42 | ## Testing Locally
43 |
44 | To test out web components locally, you need to start a local server so you don't get a CORS violation with something like:
45 |
46 | ```
47 | cd to/my/directory/
48 | python -m SimpleHTTPServer
49 | ```
50 |
51 | If you have questions about web components, read up on them at [webcomponents.org](http://webcomponents.org/).
52 |
53 | ## Download, Fork, Commit
54 | 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.
55 |
56 | 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.
57 |
--------------------------------------------------------------------------------
/demo.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/podcast-player.html:
--------------------------------------------------------------------------------
1 |
2 |
77 |
94 |
95 |