A Sample Youtube Video Player created with Polymer by GDG Bingham University
You will need to have bower installed on your computer. If you don't have bower installed, simply install Node.js and run:
npm -g install bower
Now clone bhu-vplayer repository and run:
bower install
Before you can run the application, you need to create your Client ID from the Google Developer Console.
- Create a new project using the Google Developer Console here.
- Click the project name and navigate to APIs & Auth -> Credentials.
- Under OAuth, click the blue "Create new Client ID" button. A popup dialog appears and you should select Web Application and enter your development/production URL (e.g. http://dev.bhu.gdg.ng) in the "Authorized JavaScript origins" section. Finally, clear any entry in the "Authorized redirect URIs" section and click the "Create Client ID" button.
- Copy the Client ID and replace the placeholder text in app/elements/bhu-vplayer/bhu-vplayer.js
#Running bhu-vplayer App
You will need a web server to run the bhu-vplayer sample app. You can just drop the application directory into your Document Root or for those that have Python Installed, you can boot up a the Simple HTTP server by running python -m SimpleHTTPServer
#Note:
- If you have a port number attached to you development URL, you need to ensure that it is part of your Authorized JavaScript origins in Google Developer Console i.e. http://dev.bhu.gdg.ng:3000
- This is not production quality code, just intended for demo purposes.
- To improve the performance of the app, you will have to use the vulcanize tool provided by the Polymer team to in-line all the elements used in the app. This will reduce the HTTP request give improved performance. To install vulcanize, simply use npm:
npm -g install vulcanize
now to vulcanize the app, run:mv index.html index.html.old
vulcanize --inline-scripts --inline-css index.html.old -o index.html
. You will have a new index.html file which is the optimized version you can use for your demos.