Open source video player for HTML sites

Go to file

Gregory Ballantine 944f535532 Updated readme		2018-05-02 10:52:46 -04:00
src	More code-style cleanup	2018-04-11 17:37:37 -04:00
.gitignore	Removed index.html from the git ignore file for testing	2018-02-26 17:10:19 -05:00
.sass-lint.yml	More code-style cleanup	2018-04-11 17:39:23 -04:00
Gruntfile.js	Added Gruntfile for compiling SASS and CoffeeScript files	2018-02-26 17:09:00 -05:00
index.html	Added an MP4 video file link in the example/test HTML file	2018-02-26 17:38:48 -05:00
LICENSE	Updated the project license	2018-02-27 22:45:46 -05:00
package-lock.json	Added SASS Lint tool to the dev dependencies	2018-04-11 10:21:08 -04:00
package.json	Added SASS Lint tool to the dev dependencies	2018-04-11 10:21:08 -04:00
README.md	Updated readme	2018-05-02 10:52:46 -04:00

README.md

Metaunix-Player.js

An HTML/Javascript video player - built as a jQuery plugin for easy use. The idea behind this project was to create an HTML5 video player that was very configurable and allowed for dynamic updates on a real website.

Getting Started

Below you will learn how to get ready for an use this project.

Prerequisites

Production

You simply need to include <script> tags that point to jQuery and a copy of the compiled Javascript files.

Development

You will need node.js installed on your machine to compile assets and run tests. You will need to install the Grunt CLI package with npm install -g grunt-cli. The rest of the tools required should be easily installed by running npm install

The list of tools installed will be:

Grunt
Grunt plugins for:
- Sass
- CoffeeScript
- Time (tracks how much time each task takes to run)
- Watch (for automatically re-running compilation steps)
Sass-lint

Usage

Production

Using this in a production environment (e.g. on a website), you will need to include this script, as stated above, create an HTML element, and then call the plugin in a second script, for example:

<html>
<head>
  <title>My Site</title>
  <script src="https://cdn.example.com/path/to/jQuery"></script>
  <script src="https://cdn.example.com/path/to/player.js"></script>
</head>
<body>
  <div class="my-player" />

  <script>
    $('.my-player').MUPlayer({
      'use_default_css': true,
      'video_width': '720px',
      'video_sources': [
        {
          'link': 'http://techslides.com/demos/sample-videos/small.ogv',
          'type': 'video/ogg',
        },
        {
          'link': 'http://techslides.com/demos/sample-videos/small.mp4',
          'type': 'video/mp4',
        }
      ]
    });
  </script>
</body>
</html>

Development

Assuming you have the grunt-cli NPM package installed, cd to a clone of this repository and run grunt. The SASS and CoffeeScript assets should now compile, and you can use the provided index.html file for local testing.

Contributing

If you notice anything about this project that could be improved, feel free to open up an Issue, clone this repository and create a Pull Request with those changes, or shoot me an email at gballantine555@gmail.com.

Please, please, PLEASE be as detailed as possible if you notice any bugs or have feature requests. Copy the error/console output, suggest a possible way to implement a feature, give me something so I'm trying to tackle an issue blindly!

Versioning

I will use SemVer for versioning this project - right now there are no versions available, but when I feel this project is ready to be used in any capacity, I'll start tagging releases.

Authors

Gregory Ballantine - Gitea

License

This project is licensed under the "Simplified" BSD License (aka BSD 2-Clause License) - see the LICENSE file for details