/StreamusWebsite

A YouTube video player as a Google Chrome extension

Primary LanguageJavaScriptApache License 2.0Apache-2.0

Streamus - Website

The website for Streamus - The most popular Chrome extension YouTube music player

Overview

Streamus Website is a single-page website leveraging HTML5 push state. The design is shaped around Google's Material Design specification. Some portions of the website are able to communicate with Streamus Chrome Extension and/or Streamus Server

Development

Start by cloning the development branch. All PRs should be submitted to the development branch. Non-trivial PRs will be declined unless they are accompanied by test cases.

Dependencies

You will need to have Node and Gulp installed on your system. After installing Node, navigate useing a terminal to the direction in which you cloned this repository. Then, run the following command to install dependencies:

npm install

Successful installation of Node dependencies will result in jspm being installed on your system in addition to all development dependencies. Successful installation of jspm will result in all production dependencies being installed, as well.

You should then run the test case suite to ensure you're in a known good state:

gulp test

Karma's test suite will then be ran against both Google Chrome and Firefox, if available.

Gulp Tasks

The following Gulp tasks are available:

  • Build: Generate a production-ready build of the website and place it in the dist folder.
  • Compile: Transpile ES6 to ES5 through Babel and copy all other assets into the compiled folder. Suitable for development use.
  • Connect: Spin up a simple HTTP server via Node. Points at the compiled or dist directory depending on arguments given to connect.
  • Lint: Validate code quality with ESLint and output issues to the console.
  • Test: Run test case suite through Karma. Karma will open Chrome and Firefox and ensure test cases pass in both.
  • Watch: Monitor the src and compiled directories for changes. Simple HTTP server will reload as changes are detected.

Libraries

Production

* [jQuery](http://jquery.com/) * [Backbone](http://backbonejs.org/) * [Marionette](http://marionettejs.com) * [lodash](http://lodash.com/) * [Handlebars](http://handlebarsjs.com/) * [Backbone.Base-Router](https://github.com/jmeas/backbone.base-router) * [Backbone.Intercept](https://github.com/jmeas/backbone.intercept) * [Backbone.Syphon](https://github.com/marionettejs/backbone.syphon) * [jQuery.browser](https://github.com/gabceb/jquery-browser-plugin) * [webcomponents.js](https://github.com/WebComponents/webcomponentsjs)

Development

* [jspm](http://jspm.io//) * [PostCSS](https://github.com/postcss/postcss) * [Babel](https://babeljs.io/) * [Gulp](http://gulpjs.com/) * [Mocha](http://visionmedia.github.io/mocha/) * [Chai](http://chaijs.com/) * [Sinon](http://sinonjs.org/) * [Karma](https://karma-runner.github.io/) * [ESLint](http://eslint.org/)