Code Monkey home page Code Monkey logo

podlove-web-player's Introduction

Podlove Web Player

Code Climate

Build Status

About

HTML5 Goodness for Podcasting

Podlove Web Player is a Podcast-optimized, HTML5-based video and audio player with Flash fallback. It can be used as a WordPress plugin or within a static HTML/JavaScript context.

The Podlove Web Player supports almost every modern browser and also does captions, chapters and much more. Thanks to MediaElement.js for providing the foundation.

Usage

The release version should have the application, the moderator their dependencies and necessary styles and fonts ready in the dist folder. Along with them there is a running example that shows you how to integrate the player in any webpage. Either directly as in embed.html or as an iframe/ embedded player as in index.html.

Installation

Clone the repository and install all dependencies with

bower install
npm install
npm install -g gulp

Install autoprefixer

Install autoprefixer to parse CSS and add vendor prefixes to rules fetched from 'Can I Use' https://github.com/ai/autoprefixer

sudo npm install --global autoprefixer

Build the CSS file

There is a gulp task for that, processing a version with line comments as well as a minified one

gulp styles

Build Distribution Package

Make is now replaced by gulp

Just run the default task to build the distribution package to dist folder.

gulp

For production

npm install -g uglifyify minifyify

smallest possible code (>50kB)

browserify -g uglifyify js/app.js > static/podlove-web-player.js

with sourcemaps (~250kB)

browserify -d js/app.js | minifyify > static/podlove-web-player.js

Development

Build, serve and watch the local repository version. With livereload on top

gulp serve

Test

Some automated tests are written and can be found in the spec folder. Install PhantomJS to be able to run them on your machine.

Run them with

gulp test

Each commit pushed to the repo will automatically launch the tests on TravisCI.

Info

Important! The Wordpress-plugin that includes the Podlove-Webplayer alone will be moved to its own repo.

Contributing

Fork it

Create your feature branch

git checkout -b my-new-feature

Commit your changes

git commit -am 'Added some feature'

Push to the branch

git push origin my-new-feature

Create new Pull Request

Release

git fetch

git checkout -b release origin/release

git merge origin/dev

gulp build

Force add all changes. Otherwise changes to the dist folder would not be part of the release.

git add dist -f

git commit "release <version-number>"

git push

Copy the commit messages from the merge commit to clipboard for later use.

git show HEAD^

Go to https://github.com/podlove/podlove-web-player/releases/new

Use as the tagname. Be sure to add a "v" to the beginning. Versions follow semantic versioning (for details see http://semver.org).

Find a (funny) name that can be easily remembered by humans.

Paste the contents of your clipboard into the description field and edit them to be a human readable changelog.

Hit the save button.


## Send feedback about the Podlove Web Player

Join the conversation

Become a part of the

If you're interested in discussing podcasting topics in general, please visit sendegate.de.

Podlove Docs

Report an issue

If you encounter a specific problem using the Podlove Web Player that you think is a bug, or you see a problem in the documentation, you can report the issue here:
github.com/podlove/podlove-web-player/issues

Also, if you have ideas for new features for player, please submit them as a Github issue.

Have a look on the Trello board to watch the status and progress of your issues:
trello.com/b/mFPdgi1P/podlove-web-player

Update the documentation

For contributing to Podlove Web Player documentation, see:
github.com/podlove/podlove.github.com


Contributors

Gerrit van Aaken, Simon Waldherr, Frank Hase, Eric Teubert, Juri Leino, Alexandra von Criegern and others

Version

3.0.0-beta.3

License

BSD 2-Clause License

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.