Merge branch 'master' into 2.x-develop

Author: quead

.angular-cli.json

@@ -1,7 +1,7 @@
 {
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
   "project": {
-    "name": "yt-app"
+    "name": "a2-youtube"
   },
   "apps": [
     {
@@ -19,7 +19,7 @@
       "testTsconfig": "tsconfig.spec.json",
       "prefix": "app",
       "styles": [
-        "styles.css"
+        "assets/scss/main.scss"
       ],
       "scripts": [],
       "environmentSource": "environments/environment.ts",
@@ -36,13 +36,16 @@
   },
   "lint": [
     {
-      "project": "src/tsconfig.app.json"
+      "project": "src/tsconfig.app.json",
+      "exclude": "**/node_modules/**"
     },
     {
-      "project": "src/tsconfig.spec.json"
+      "project": "src/tsconfig.spec.json",
+      "exclude": "**/node_modules/**"
     },
     {
-      "project": "e2e/tsconfig.e2e.json"
+      "project": "e2e/tsconfig.e2e.json",
+      "exclude": "**/node_modules/**"
     }
   ],
   "test": {
@@ -51,7 +54,7 @@
     }
   },
   "defaults": {
-    "styleExt": "css",
+    "styleExt": "scss",
     "component": {}
   }
 }

.gitignore

@@ -2,6 +2,7 @@
 
 # compiled output
 /dist
+/dist-server
 /tmp
 /out-tsc
 

README.md

@@ -1,26 +1,30 @@
 <p align="center">
-  <a href="https://quead.github.io/demo/" title="YouTube Player Demo">View Demo</a>
-  <img alt="Angular YouTube Player Logo" src="http://i.imgur.com/5DS0zFh.jpg" style="height: auto; max-width:100%;" />
+  Check 
+  <a href="https://quead.github.io/demo/" title="YouTube Player Demo">Demo</a> 
+  or
+  <a href="https://youtu.be/KB803dWQM-o/" title="Video Presentation">Video Presentation</a>
+  <img alt="Angular YouTube Player Logo" src="https://i.imgur.com/EKqK4ip.png" style="height: auto; max-width:100%;" />
 </p>
 
 # About Player
-[![Version](https://img.shields.io/badge/Current%20version-v2-brightgreen.svg?style=flat)](https://github.com/quead/angular2-yt-player)
+[![Version](https://img.shields.io/badge/Current%20version-v2.1-brightgreen.svg?style=flat)](https://github.com/quead/angular2-yt-player)
+[![Build Status](https://semaphoreci.com/api/v1/quead/angular2-yt-player/branches/master/badge.svg)](https://semaphoreci.com/quead/angular2-yt-player)
 
 [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/quead/angular2-yt-player/master/LICENSE)
 [![GitHub forks](https://img.shields.io/github/forks/quead/angular2-yt-player.svg)](https://github.com/quead/angular2-yt-player/network)
 [![GitHub stars](https://img.shields.io/github/stars/quead/angular2-yt-player.svg)](https://github.com/quead/angular2-yt-player/stargazers)
 
-This is a simple youtube player based on [angular-cli](https://github.com/angular/angular-cli "Angular Cli") 1.0, [ng2-youtube-player](https://github.com/orizens/ng2-youtube-player "ng2 youtube player") 0.0.3 (used for youtube iFrame API), SCSS (CSS3), HTML5 and webkit functions.
+This is a simple youtube web player and desktop player based on [angular-cli](https://github.com/angular/angular-cli "Angular Cli") 1.4, [NWjs 0.25.0](https://nwjs.io/ "NWJS Page"), [ngx-youtube-player](https://github.com/orizens/ng2-youtube-player "ngx youtube player") 0.0.41 (used for youtube iFrame API), SCSS (CSS3), HTML5 and webkit functions.
 
-This player is compatible only with Chrome/webkit browsers because in future I want to implement [NW.js](https://nwjs.io/ 'NWjs website') for compiling the code in Windows/Mac OS X/Linux desktop app.
+This player is compatible only with Chrome/webkit browsers.
 
-*This is pre-alpha.*
+*The project status is beta.*
 
 ## Usage
 
-**For angular2/typescript development**
-1. Install [NodeJS 6.10.2+](https://nodejs.org/en/download/ "Node JS Download")
-2. Install latest version of [angular-cli](https://github.com/angular/angular-cli "Angular Cli")
+**For Angular and Typescript Development**
+1. Install [NodeJS 6.11.0+](https://nodejs.org/en/download/ "Node JS Download")
+2. Install [angular-cli 1.1.3+](https://github.com/angular/angular-cli "Angular Cli")
 
 `npm install -g @angular/cli`
 
@@ -32,35 +36,124 @@ This player is compatible only with Chrome/webkit browsers because in future I w
 
 `npm start` in root folder
 
-------
+5. Add your youtube api key
 
 **For SASS development**
 
-*You must go in **src** folder*
 1. Install [Sass](http://sass-lang.com/install "Sass website")
-2. Install [Gulp](https://github.com/gulpjs/gulp "Gulp download")
 
-`npm install -g gulp`
+2. Start project by
+
+`npm start`
 
-3. Then install all packages
+3. Edit files from src/assets/scss
+
+------
 
-`npm install`
+**For building app**
 
-4. Start compiling the SCSS files by
+1. Add to body classes application app-win / app-linux
+`<body class="application app-win">`
+2. Build the src folder with
+`ng build` in root folder
+*You need to have angular-cli installed on global (check above)*
+*This is compiling typescript into Javascript*
 
-`gulp`
+3. Copy package.json from **/app** folder and paste it to **dist** folder
+4. Download [NWjs v0.25.0 +](https://nwjs.io/ "NWJS Download")
+5. Path your system enviroment to folder where you unarchived
+6. Run
+
+`gulp build` in root folder
+*This is compiling javascript into desktop app*
+
+7. In release folder (root) you have the compiled apps
 
 **For personal use**
 
 Just take files from ***dist*** folder
 
-<a href="https://quead.github.io/demo/" title="YouTube Player Demo">View Demo</a>
+Check 
+<a href="https://quead.github.io/demo/" title="YouTube Player Demo">Demo</a> 
+or
+<a href="https://youtu.be/KB803dWQM-o/" title="Video Presentation">Video Presentation</a>
 
 ## Changelog
+Angular2 YT Player v2.1
+- Categories with videos like (music, gaming, autos, films, sports, etc.)
+- Refactoring code
+- Search on specific region
+- Fixing copy link for featured video
+- UX improvements
+
+Angular2 YT Player v2.0.1
+- Import & export youtube playlist as .JSON file
+
+Angular2 YT Player v2.0
+- Global hotkeys for application in desktop (play/pause/next/prev, for keyboards with media buttons)
+- Adding support for NW.js to export the app for desktop compatible: Windows x64, Linux x64
+- Auto updating the app (desktop version)
+
+Angular2 YT Player v1.9.2
+- UX improvements and fixes
+- Preparing files for 2.0
+
+Angular2 YT Player v1.9.1
+- Get settings.json for localstorage if your localstorage is empty
+- The playlist automatically saving, if is empty it will be populated with related videos
+- Toggle light/dark theme mode
+- Share link button for all videos
+- Reorganised settings page
+- Auto saving for internal settings (check settings)
+- Manual saving for external settings (check settings)
+- Performance, UI and UX improvements and fixes
+
+Angular2 YT Player v1.9
+- Add/remove items from playlist, first time when is initialized It is prepopulated with related videos
+- Next/prev video from your playlist
+- Moved history to separate page
+- Adding toggle video, repeat mode and list & grid on trending to settings.json
+- Small fixes
+
+Angular2 YT Player v1.7
+- Added featured video as first video from trending
+- Notifications for important actions you do
+- Removed debugging mode
+- Preparing packages, code and files for v2.0
+- Improved UI/UX for lists
+
+Angular2 YT Player v1.6
+- Video details for current video and trending videos like number of views, likes and dislikes
+- Share link for current video
+- Added new setting for hiding all thumbnails
+- Custom player buttons shows now only when you hide video
+
+Angular2 YT Player v1.4
+- History of your watched videos
+- Small fixes
+
+Angular2 YT Player v1.3
+ - Show/hide video player
+ - Repeat video
+ - Grid/list mode for trending videos
+- **Settings (you can set default from "assets/settings.json", soon will be directly from settings)**
+- *Change country for trending videos (currently only three countries, US, UK and RO)*
+- *Max results show in search (0 to 50)*
+- *YOUR_API Key*
+- *Max related videos (0 to 50)*
+
+Angular2 YT Player v1.2
+- Introducing trending videos, currently default trending videos are from United States
+- Refactoring the code
+- Adding routes for future components which it will show in left navbar
+- Default video will be first from trending videos
+- Adding the video player
+- Update the design to match the new features
 
 Angular2 YT Player v1.1
 - Adding mute/unmute functionality
 - Improved user interface and user experience
+- Adding settings functionality, the settings will get from ***assets/settings.json***
 - **Settings**
 - *Show/hide debugging features*
 - *Show/hide thumbnails in search*
@@ -76,21 +169,24 @@ Angular2 YT Player v1.0.0
 - Change time of your video that you want to listen
 
 ## Future features
-- Repeat mode **(in v1.3)**
-- Copy link for current video and related videos **(in v1.6)** 
-- Copy link for current video at your playing time **(in v1.6)**
-- Video details for current video and related videos like number of views, likes and dislikes **(in v1.6)**
-- Add your videos in playlist **(in v1.9)**
-- Next/prev video from your playlist **(in v1.9)**
-- Adding support for NW.js to export the app for desktop compatible: Windows/Mac OS X/Linux **(in v2.0)**
-- Hotkeys for application in desktop (play/pause/next/prev) **(in v2.0)**
-- **Settings**
-- *Show/hide video **(possible in v1.3)***
-- *Set how many results to show in search (0 to 50) **(in v1.3)***
-- *Enable loop video **(in v1.3)***
-- *Change/add YOUR_API Key **(in v1.3)***
-- *Max related videos (0 to 50) **(in v1.3)***
-- *Save your settings **(possible in v1.9)***
+#### Backlog
+- iOS 8+ / android 5+ app **(unversioned)**
+- Change and create theme **(unversioned)**
+- macOS app release **(unversioned)**
+- **Rooms**
+- *Room chat **(unversioned)***
+
+#### Roadmap to 3.0
+- Drag and drop videos to playlist **(in v2.2)**
+- Arrange playlist by drag and drop **(in v2.2)**
+- Integrating Google accounts **(in v2.4)**
+- Integrating firebase **(in v2.5)**
+
+- **Rooms**
+- *Create room where you can watch videos with others in sync by sharing the room link **(in v3.0)***
+- *Set private/public room **(in v3.0)***
+- *List of public rooms **(in v3.0)***
+- *Room moderators which can add videos, kick roommates, mute roommates, rename room title and description **(in v3.3)***
 
 ## Copyright and License
 Copyright [quead](https://github.com/quead) under the [MIT license](LICENSE).

app/package.json

@@ -0,0 +1,35 @@
+{
+  "main": "index.html",
+  "name": "yt-app",
+  "description": "YouTube Player",
+  "author": "Alex Olari <queadx@gmail.com>",
+  "version": "2.0.0",
+  "keywords": [
+    "youtube app",
+    "node-webkit"
+  ],
+  "license": "MIT",
+  "manifestUrl": "http://noxien.net/quead/package.json",
+  "window": {
+    "height": 720,
+    "width": 1270,
+    "min_width": 1270,
+    "min_height": 720,
+    "frame": false,
+    "icon": "favicon.ico",
+    "toolbar": false
+  },
+  "webkit": {
+    "plugin": true
+  },
+  "scripts": {
+    "postversion": "npm run package",
+    "package": "nwb nwbuild -v 0.25.2-sdk . -o ../release --output-format=ZIP --output-name={name}-v{version}-{target}"    
+  },
+  "dependencies": {
+    "nw-autoupdater": "*"
+  },
+  "devDependencies": {
+    "nwjs-builder": "^1.14.0"
+  }
+}

e2e/app.e2e-spec.ts

@@ -0,0 +1,14 @@
+import { AppPage } from './app.po';
+
+describe('masterclean App', () => {
+  let page: AppPage;
+
+  beforeEach(() => {
+    page = new AppPage();
+  });
+
+  it('should display welcome message', () => {
+    page.navigateTo();
+    expect(page.getParagraphText()).toEqual('Welcome to app!');
+  });
+});

e2e/app.po.ts

@@ -0,0 +1,11 @@
+import { browser, by, element } from 'protractor';
+
+export class AppPage {
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getParagraphText() {
+    return element(by.css('app-root h1')).getText();
+  }
+}

e2e/tsconfig.e2e.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/e2e",
+    "baseUrl": "./",
+    "module": "commonjs",
+    "target": "es5",
+    "types": [
+      "jasmine",
+      "jasminewd2",
+      "node"
+    ]
+  }
+}

gulpfile.js

@@ -0,0 +1,33 @@
+'use strict';
+
+var gulp = require('gulp');
+var exec = require('child_process').exec;
+
+gulp.task('build', function() {
+    console.log('Installing packages...');
+    exec('npm install', { cwd: 'dist', stdio: 'inherit' }, function (error, stdout, stderr) {
+        if (stderr !== null) {
+            console.log(stderr);
+        }
+        if (stdout !== null) {
+            console.log(stdout);
+        }
+        if (error !== null) {
+            console.log(error);
+        }
+    }).on('close', done);
+
+    function done() {
+        exec('npm run package', { cwd: 'dist', stdio: 'inherit' }, function (error, stdout, stderr) {
+            if (stderr !== null) {
+                console.log(stderr);
+            }
+            if (stdout !== null) {
+                console.log(stdout);
+            }
+            if (error !== null) {
+                console.log(error);
+            }
+        });
+    }
+});