fix(player): fix #54

orizens · Oct 28, 2018 · 7c011be · 7c011be
1 parent b785154
commit 7c011be
Show file tree

Hide file tree

Showing 5 changed files with 130 additions and 44 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## v 4.0.1 (2018/10/28)
+
+* [FIX] - fixes #54
+
 ## v 4.0.0 (2018/10/02)
 
 * [UPGRADE] - now running Angular 6, NgRx 6

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "echoes-player",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "license": "MIT",
   "scripts": {
     "ng": "ng",

diff --git a/src/app/core/store/app-player/app-player.reducer.ts b/src/app/core/store/app-player/app-player.reducer.ts
@@ -1,13 +1,13 @@
-import { Observable } from 'rxjs';
-import { Action } from '@ngrx/store';
 import { ActionTypes, Actions } from './app-player.actions';
 
-type GoogleApiYoutubeVideo = GoogleApiYouTubeVideoResource | GoogleApiYouTubeSearchResource | any;
+type GoogleApiYoutubeVideo =
+  | GoogleApiYouTubeVideoResource
+  | GoogleApiYouTubeSearchResource
+  | any;
 
 export * from './app-player.actions';
 
 export interface IAppPlayer {
-  mediaId: { videoId: string };
   index: number;
   media?: GoogleApiYoutubeVideo | any;
   showPlayer: boolean;
@@ -20,7 +20,6 @@ export interface IAppPlayer {
   isFullscreen: boolean;
 }
 const initialPlayerState: IAppPlayer = {
-  mediaId: { videoId: 'NONE' },
   index: 0,
   media: {
     snippet: { title: 'No Media Yet' }
@@ -34,7 +33,10 @@ const initialPlayerState: IAppPlayer = {
   },
   isFullscreen: false
 };
-export function player(state: IAppPlayer = initialPlayerState, action: Actions): IAppPlayer {
+export function player(
+  state: IAppPlayer = initialPlayerState,
+  action: Actions
+): IAppPlayer {
   switch (action.type) {
     case ActionTypes.PLAY:
       return playVideo(state, action.payload);
@@ -77,13 +79,16 @@ export function player(state: IAppPlayer = initialPlayerState, action: Actions):
 }
 
 export function playVideo(state: IAppPlayer, media: GoogleApiYoutubeVideo) {
-  return { ...state, mediaId: media.id, media };
+  return { ...state, mediaId: media.id || '', media };
 }
 
 export function toggleVisibility(state: IAppPlayer) {
   return { ...state, showPlayer: !state.showPlayer };
 }
 
-export function changePlayerState(state: IAppPlayer, playerState: YT.PlayerState | any) {
+export function changePlayerState(
+  state: IAppPlayer,
+  playerState: YT.PlayerState | any
+) {
   return { ...state, playerState: playerState };
 }
diff --git a/src/app/core/store/app-player/app-player.spec.ts b/src/app/core/store/app-player/app-player.spec.ts
@@ -1,12 +1,10 @@
-import { inject, async } from '@angular/core/testing';
-
 import { player, IAppPlayer } from './app-player.reducer';
 import { ActionTypes } from './app-player.actions';
 import { YoutubeMediaMock } from '@mocks/youtube.media.item';
+import * as fromActions from './app-player.actions';
 
 describe('The App Player reducer', () => {
   const mockedState: IAppPlayer = {
-    mediaId: { videoId: 'NONE' },
     index: 0,
     media: {},
     showPlayer: true,
@@ -20,24 +18,43 @@ describe('The App Player reducer', () => {
   };
   it('should return current state when no valid actions have been made', () => {
     const state = { ...mockedState };
-    const actual = player(<IAppPlayer>state, { type: 'INVALID_ACTION', payload: {} });
+    const actual = player(<IAppPlayer>state, {
+      type: 'INVALID_ACTION',
+      payload: {}
+    });
     const expected = state;
     expect(actual).toEqual(expected);
   });
 
   it('should set the new media id by the new PLAYED youtube media item', () => {
     const state = { ...mockedState };
-    const actual = player(state, { type: ActionTypes.PLAY, payload: YoutubeMediaMock });
+    const actual = player(
+      state,
+      new fromActions.PlayVideo(YoutubeMediaMock as any)
+    );
+    const expected = state;
+    expect(actual.media.id).toBe(YoutubeMediaMock.id);
+  });
+
+  it('should set the new media id to empty the new PLAYED youtube media item', () => {
+    const state = { ...mockedState };
+    const actual = player(
+      state,
+      new fromActions.PlayVideo(YoutubeMediaMock as any)
+    );
     const expected = state;
-    expect(actual.mediaId.videoId).toBe(YoutubeMediaMock.id.videoId);
+    expect(actual.media.id).toBe(YoutubeMediaMock.id);
   });
 
   it('should toggle visibility of the player', () => {
     const state = {
       ...mockedState,
       showPlayer: false
     };
-    const actual = player(state, { type: ActionTypes.TOGGLE_PLAYER, payload: true });
+    const actual = player(state, {
+      type: ActionTypes.TOGGLE_PLAYER,
+      payload: true
+    });
     const expected = state;
     expect(actual.showPlayer).toBe(!expected.showPlayer);
   });
@@ -47,7 +64,10 @@ describe('The App Player reducer', () => {
       ...mockedState,
       playerState: 0
     };
-    const actual = player(state, { type: ActionTypes.UPDATE_STATE, payload: 1 });
+    const actual = player(state, {
+      type: ActionTypes.UPDATE_STATE,
+      payload: 1
+    });
     const expected = state;
     expect(actual.playerState).toBe(1);
   });

diff --git a/tests/mocks/youtube.media.item.ts b/tests/mocks/youtube.media.item.ts
@@ -1,34 +1,91 @@
 /* tslint:disable */
 export let YoutubeMediaMock = {
-  "kind": "youtube#searchResult",
-  "etag": "\"q5k97EMVGxODeKcDgp8gnMu79wM/ms1isEChRlNREE1F9UOkqY3Ihe8\"",
-  "id": {
-    "kind": "youtube#video",
-    "videoId": "5PGvyjZtVKU"
-  },
-  "snippet": {
-    "publishedAt": "2016-02-19T15:00:39.000Z",
-    "channelId": "UCRxLFt-qJHbT-zzeZt4eQpw",
-    "title": "TREMONTI + DUST = 04.29.16",
-    "description": "\"Dust\" Presale Available NOW - https://fret12.com/store/tremonti-dust 'Dust' is Tremonti's follow up record to their 2015 FRET12 release 'Cauterize'. Get all the ...",
-    "thumbnails": {
-      "default": {
-        "url": "https://i.ytimg.com/vi/5PGvyjZtVKU/default.jpg",
-        "width": 120,
-        "height": 90
+  kind: 'youtube#video',
+  etag: 'XI7nbFXulYBIpL0ayR_gDh3eu1k/f4Zr_THvqk9b_0iUJvnoVdkA4Zs',
+  id: '9HghPn3v4e4',
+  snippet: {
+    publishedAt: '2016-03-18T16:51:24.000Z',
+    channelId: 'UCRxLFt-qJHbT-zzeZt4eQpw',
+    title: 'Tremonti - Dust (Official Lyric Video)',
+    description:
+      'Pre-order Tremonti\'s new record and get their new single "Dust", "My Last Mistake" and "Betray Me" today! Record Out 04.29.16 \nDigital: http://smarturl.it/dustdigital\nPhysical: http://smarturl.it/dustcd\n\niTunes:\nhttp://smarturl.it/dustdigital\n\nFRET12 (Buy Exclusive \'Dust\' Collectors Bundles):\nhttps://fret12.com/store/tremonti-dust\n\nBest Buy:\nhttp://www.bestbuy.com/site/dust-only--best-buy-cd/5009000.p?id=3563045&skuId=5009000\n\nFYE:\nhttp://www.fye.com/s/product/4078635/TREMONTI-DUST-Exclusive-Poster-Sticker-Guitar-Picks-on-pack#.Vwfl0asaW2w',
+    thumbnails: {
+      default: {
+        url: 'https://i.ytimg.com/vi/9HghPn3v4e4/default.jpg',
+        width: 120,
+        height: 90
+      },
+      medium: {
+        url: 'https://i.ytimg.com/vi/9HghPn3v4e4/mqdefault.jpg',
+        width: 320,
+        height: 180
       },
-      "medium": {
-        "url": "https://i.ytimg.com/vi/5PGvyjZtVKU/mqdefault.jpg",
-        "width": 320,
-        "height": 180
+      high: {
+        url: 'https://i.ytimg.com/vi/9HghPn3v4e4/hqdefault.jpg',
+        width: 480,
+        height: 360
       },
-      "high": {
-        "url": "https://i.ytimg.com/vi/5PGvyjZtVKU/hqdefault.jpg",
-        "width": 480,
-        "height": 360
+      standard: {
+        url: 'https://i.ytimg.com/vi/9HghPn3v4e4/sddefault.jpg',
+        width: 640,
+        height: 480
       }
     },
-    "channelTitle": "TremontiOfficial",
-    "liveBroadcastContent": "none"
+    channelTitle: 'TremontiOfficial',
+    tags: [
+      'Mark Tremonti',
+      'Tremonti',
+      'Cauterize',
+      'Dust',
+      'Alter Bridge',
+      'Creed',
+      'Van Halen',
+      'Wolfgang Van Halen',
+      'Garrett Whitlock',
+      'Eric Friedmann',
+      'michael elvis baskett',
+      'fret12',
+      'Fret12',
+      'Mesa Boogie',
+      'Prs',
+      'Paul Reed Smith',
+      'Rock',
+      'Hard Rock',
+      'Metal',
+      'Music',
+      'Guitar',
+      'morley',
+      'T-rex',
+      'Octane',
+      'Riffs',
+      'All I Was',
+      'hot chicks',
+      'Dragons',
+      'breaking Benjaming',
+      'Distrubed',
+      'Stone Sour'
+    ],
+    categoryId: '10',
+    liveBroadcastContent: 'none',
+    localized: {
+      title: 'Tremonti - Dust (Official Lyric Video)',
+      description:
+        'Pre-order Tremonti\'s new record and get their new single "Dust", "My Last Mistake" and "Betray Me" today! Record Out 04.29.16 \nDigital: http://smarturl.it/dustdigital\nPhysical: http://smarturl.it/dustcd\n\niTunes:\nhttp://smarturl.it/dustdigital\n\nFRET12 (Buy Exclusive \'Dust\' Collectors Bundles):\nhttps://fret12.com/store/tremonti-dust\n\nBest Buy:\nhttp://www.bestbuy.com/site/dust-only--best-buy-cd/5009000.p?id=3563045&skuId=5009000\n\nFYE:\nhttp://www.fye.com/s/product/4078635/TREMONTI-DUST-Exclusive-Poster-Sticker-Guitar-Picks-on-pack#.Vwfl0asaW2w'
+    }
+  },
+  contentDetails: {
+    duration: 'PT5M30S',
+    dimension: '2d',
+    definition: 'hd',
+    caption: 'false',
+    licensedContent: false,
+    projection: 'rectangular'
+  },
+  statistics: {
+    viewCount: '1680964',
+    likeCount: '13845',
+    dislikeCount: '306',
+    favoriteCount: '0',
+    commentCount: '1344'
   }
-}
+};