Skip to content
This repository has been archived by the owner on Aug 22, 2021. It is now read-only.

Commit

Permalink
Add VLC Tech plug-in source code first version
Browse files Browse the repository at this point in the history
  • Loading branch information
Afterster committed Jan 10, 2015
0 parents commit 349fd63
Show file tree
Hide file tree
Showing 14 changed files with 734 additions and 0 deletions.
13 changes: 13 additions & 0 deletions .editorconfig
@@ -0,0 +1,13 @@
# http://editorconfig.org
root = true

[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false
7 changes: 7 additions & 0 deletions .gitignore
@@ -0,0 +1,7 @@
.DS_Store
*.log
node_modules/
dist/
*~
nbproject/private/
build
11 changes: 11 additions & 0 deletions .jshintrc
@@ -0,0 +1,11 @@
{
"browser" : true,
"curly": true,
"eqeqeq": true,
"quotmark" : "single",
"trailing" : true,
"undef" : true,
"predef" : [
"videojs"
]
}
3 changes: 3 additions & 0 deletions .npmignore
@@ -0,0 +1,3 @@
dist/
test/
*~
84 changes: 84 additions & 0 deletions Gruntfile.js
@@ -0,0 +1,84 @@
'use strict';

module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +
'<%= grunt.template.today("yyyy-mm-dd") %>\n' +
'* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author %>;' +
' Licensed <%= pkg.license %> */\n',
clean: {
files: ['dist']
},
concat: {
options: {
banner: '<%= banner %>',
stripBanners: true
},
dist: {
src: 'lib/**/*.js',
dest: 'dist/<%= pkg.name %>.js'
}
},
uglify: {
options: {
banner: '<%= banner %>'
},
dist: {
src: '<%= concat.dist.dest %>',
dest: 'dist/<%= pkg.name %>.min.js'
}
},
qunit: {
files: 'test/**/*.html'
},
jshint: {
gruntfile: {
options: {
node: true
},
src: 'Gruntfile.js'
},
src: {
options: {
jshintrc: '.jshintrc'
},
src: ['lib/**/*.js']
},
test: {
options: {
jshintrc: '.jshintrc'
},
src: ['test/**/*.js']
}
},
watch: {
gruntfile: {
files: '<%= jshint.gruntfile.src %>',
tasks: ['jshint:gruntfile']
},
src: {
files: '<%= jshint.src.src %>',
tasks: ['jshint:src', 'qunit']
},
test: {
files: '<%= jshint.test.src %>',
tasks: ['jshint:test', 'qunit']
}
}
});

grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-watch');

grunt.registerTask('default',
['clean',
'jshint',
'qunit',
'concat',
'uglify']);
};
13 changes: 13 additions & 0 deletions LICENSE-Apache-2.0
@@ -0,0 +1,13 @@
Copyright 2015 Afterster

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
88 changes: 88 additions & 0 deletions README.md
@@ -0,0 +1,88 @@
# Video.js VLC

Video.js VLC Tech plug-in

A Video.js tech plugin that add VLC fallback.

## Getting Started

Once you've added the plugin script to your page, you can use it with any supported video:
* Include JavaScript files
```html
<script src="video.js"></script>
<script src="videojs-vlc.js"></script>
```
* And add this new tech to the player:
```html
data-setup='{ "techOrder": ["vlc"] }'
```

There's also a [working example](example.html) of the plugin you can check out if you're having trouble.

## Documentation
### Plugin Options

This plugin doesn't have any option.

### Supported content type

Supported content type will depends on your VLC installation, but potentially it should support the following list:
* video/mp4(.mp4)
* video/mp4(.m4v)
* video/ogg(.ogv)
* video/webm(.webm)
* video/ogg(.ogg)
* video/ogg(.anx)
* audio/ogg(.ogg)
* audio/ogg(.oga)
* audio/mp3(.mp3)
* audio/mpeg(.mp3)
* application/mpegURL(.m3u8)
* application/mpegURL(.m3u)
* application/vnd.apple.mpegURL(.m3u8)
* application/vnd.apple.mpegURL(.m3u)
* application/x-mpegURL(.m3u8)
* application/x-mpegURL(.m3u)
* application/mpegURL(.m3u8)
* application/mpegURL(.m3u)
* application/vnd.apple.mpegURL(.m3u8)
* application/vnd.apple.mpegURL(.m3u)
* application/x-mpegURL(.m3u8)
* application/x-mpegURL(.m3u)
* audio/mpegURL(.m3u8)
* audio/mpegURL(.m3u)
* text/json(.json)
* text/jsonp(.jsonp)
* text/xml(.xml)
* application/json(.json)
* application/jsonp(.jsonp)
* application/xml(.xml)
* image/jpeg(.jpg)
* image/gif(.gif)
* image/png(.png)
* text/html(.html)
* video/flv(.flv)
* video/mp4(.mp4)
* video/mp4(.f4v)
* video/quicktime(.mov)
* video/mp4(.m4v)
* application/f4m+xml(.f4m)
* application/mpegURL(.m3u8)
* application/x-mpegURL(.m3u8)
* application/vnd.apple.mpegurl(.m3u8)
* application/vnd.ms-ss(.manifest)
* video/flv(.flv)
* video/mp4(.mp4)
* video/mp4(.f4v)
* video/quicktime(.mov)
* video/mp4(.m4v)
* application/f4m+xml(.f4m)
* audio/mp3(.mp3)
* audio/mp4(.m4a)
* audio/mpeg(.m4a)

As this cannot be determined in advance, this plug-in always return success on file type support test. It's why you should always put it at the end of techOrder property.

## Release History

- 0.1.0: Initial release
48 changes: 48 additions & 0 deletions example.html
@@ -0,0 +1,48 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Video.js VLC</title>

<link href="node_modules/video.js/dist/video-js/video-js.css" rel="stylesheet">

<style>
body {
font-family: Arial, sans-serif;
}
.info {
background-color: #eee;
border: thin solid #333;
border-radius: 3px;
padding: 0 5px;
text-align: center;
}
.video-js {
margin: 40px auto;
}
</style>

<script src="node_modules/video.js/dist/video-js/video.js"></script>
<script src="lib/videojs-vlc.js"></script>
</head>
<body>
<div class="info">
<p>
You can see the Video.js VLC plugin in action below.
Look at the source of this page to see how to use it with your videos.
</p>
</div>
<video id="video"
class="video-js vjs-default-skin"
height="300"
width="600"
controls
data-setup='{ "techOrder": ["vlc"] }'>
<p>
Your browser doesn't support video. Please <a href="http://browsehappy.com/">upgrade your browser</a> to see the example.
</p>

<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
</video>
</body>
</html>

0 comments on commit 349fd63

Please sign in to comment.