Readying demo and readme for alpha release

Author: mderrick

README.md

@@ -2,11 +2,13 @@
 
 A customizeable HoC (Higher Order Component) for HTML5 Video that allows custom and configurable controls.
 
+V2 API has changed and is not backwards compatible. You can find the old documentation [here](https://github.com/mderrick/react-html5video/blob/master/README.md).
+
 [![Build Status](https://travis-ci.org/mderrick/react-html5video.svg?branch=master)](https://travis-ci.org/mderrick/react-html5video)
 [![npm version](https://img.shields.io/npm/v/react-html5video.svg?style=flat-square)](https://www.npmjs.com/package/react-html5video)
 [![npm downloads](https://img.shields.io/npm/dm/react-html5video.svg?style=flat-square)](https://www.npmjs.com/package/react-html5video)
 
-<img src="http://mderrick.github.io/react-html5video/example.png?v=1" align="center" height="337" width="600" />
+<img src="http://mderrick.github.io/react-html5video/example.v2.png?v=1" align="center" height="337" width="600" />
 
 View the [demo](http://mderrick.github.io/react-html5video/).
 

demo/assets/poster-big-buck-bunny.png

@@ -2,6 +2,7 @@ const path = require('path');
 const webpack = require('webpack');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 
 const pkg = require('./../package.json');
@@ -54,6 +55,10 @@ module.exports = ({ optimize, extractCss, hot, publicPath = '/' }) => {
             new HtmlWebpackPlugin({
                 template: path.resolve(srcPath, 'index.html')
             }),
+            new CopyWebpackPlugin([{
+                context: 'assets/static',
+                from: '**/*'
+            }]),
             new CaseSensitivePathsPlugin()
         ]
     };

demo/assets/poster-sintel-trailer.png

@@ -5,6 +5,8 @@ import styles from './App.css';
 import 'reset-css/reset.css';
 import vttEn from './../../assets/sintel-en.vtt';
 import vttEs from './../../assets/sintel-es.vtt';
+import bigBuckBunnyPoster from './../../assets/poster-big-buck-bunny.png';
+import sintelTrailerPoster from './../../assets/poster-sintel-trailer.png';
 
 const sintelTrailer = 'https://download.blender.org/durian/trailer/sintel_trailer-720p.mp4';
 const bigBuckBunny = 'http://download.blender.org/peach/bigbuckbunny_movies/big_buck_bunny_480p_h264.mov';
@@ -28,7 +30,8 @@ class App extends Component {
                             onPlay={() => {
                                 this.refs.video2.videoEl.pause();
                             }}
-                            className={styles.video}>
+                            className={styles.video}
+                            poster={sintelTrailerPoster}>
                             <source src={sintelTrailer} type="video/mp4" />
                             <track
                                 label="English"
@@ -50,7 +53,8 @@ class App extends Component {
                                 this.refs.video1.videoEl.pause();
                             }}
                             src={bigBuckBunny}
-                            className={styles.video}>
+                            className={styles.video}
+                            poster={bigBuckBunnyPoster}>
                         </Video>
                     </li>
                 </ul>

demo/example.png renamed to demo/assets/static/example.png

@@ -72,6 +72,7 @@
     "babel-runtime": "^6.23.0",
     "case-sensitive-paths-webpack-plugin": "^1.1.4",
     "chalk": "^1.1.3",
+    "copy-webpack-plugin": "^4.0.1",
     "css-loader": "^0.25.0",
     "detect-port": "^1.0.6",
     "enzyme": "^2.6.0",