Skip to content

Commit 9add32f

Browse files
committed
Add license
Update Read Me
1 parent f22acfe commit 9add32f

File tree

3 files changed

+4212
-1
lines changed

3 files changed

+4212
-1
lines changed

LICENSE.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2017 Liam Tarpey
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.

README.md

Lines changed: 54 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,57 @@
22

33
Single page component HTML5 video player component for Vue.js
44

5-
** Documentation coming soon...
5+
## Running this repository
6+
7+
Clone this repository and run `yarn` or `npm install` to install all the dependencies.
8+
You can then run `npm run build` and this project will be running on `localhost:8080`
9+
10+
## Using the component in your project
11+
12+
Grab the `viewjs.vue` file in the `src` and copy it into your project.
13+
You will need some kind of module bundler to handle the `.vue` file - I'm using webpack for this example.
14+
15+
1. Import the component into your project:
16+
`import ViewJs from './viewjs.vue';` (or whatever path you need)
17+
18+
2. Define a data object that will be passed to the component on your parent component:
19+
```
20+
const videoWrapper = new Vue({
21+
el: '#video-wrapper',
22+
data: function() {
23+
return {
24+
viewJs: {
25+
allowFullScreen: true,
26+
preload: 'auto',
27+
sources: [
28+
{
29+
url: 'http://nettuts.s3.amazonaws.com/763_sammyJSIntro/trailer_test.mp4',
30+
type: 'video/mp4'
31+
},
32+
{
33+
url: 'http://nettuts.s3.amazonaws.com/763_sammyJSIntro/trailer_test.ogg',
34+
type: 'video/ogg'
35+
}
36+
]
37+
}
38+
}
39+
},
40+
components: {
41+
viewJs: ViewJs
42+
}
43+
});
44+
```
45+
46+
3. Include the component HTML in your page:
47+
```
48+
<div id="video-wrapper">
49+
<view-js :props="viewJs"></view-js>
50+
</div>
51+
```
52+
53+
## Options
54+
55+
In your data object, you can define the following:
56+
- allowFullScreen | {Boolean} | if you want the full screen button to appear
57+
- preload | {String} | if you want the video to preload on page load. possible values are: `none`, `auto` & `metadata`
58+
- sources | {Array} | Array of objects containing `url` and `type` values

0 commit comments

Comments
 (0)