Skip to content

Commit a590df2

Browse files
queadquead
committed
2.3 - Cleaning the code
1 parent 8361b2d commit a590df2

File tree

5 files changed

+84
-80
lines changed

5 files changed

+84
-80
lines changed

‎src/app/app.component.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -53,16 +53,16 @@ <h1><span class="favicon-app"></span>YouTube Player v2.0</h1>
5353
<button type="button" class="video-item-head-btn" (click)="clearPlaylist()"><span class="fa fa-close"></span>clear</button>
5454
<button type="button" class="video-item-head-btn" (click)="exportPlaylist()"><span class="fa fa-cog"></span>manage</button>
5555
</div>
56-
<div class="playlist-video-content" [dragula]='"playlistDrag"' [dragulaModel]='playlistVideos' #playlistContainer>
57-
<div *ngIf="playlistVideos.length === 0" class="video-list-info">
56+
<div class="playlist-video-content" [dragula]='"playlistDrag"' [dragulaModel]='_shared.playlist' #playlistContainer>
57+
<ng-container *ngIf="_shared.playlist.length === 0">
5858
<div *ngFor="let i of [1,2,3,4,5]" class="video-item">
5959
<div class="video-item-info">
6060
<div class="video-item-image loading-featured"></div>
6161
<div class="video-item-content loading-featured"></div>
6262
</div>
6363
</div>
64-
</div>
65-
<div *ngFor="let playlistVideo of playlistVideos; let i = index" [ngClass]="currentPlaylistItem === i ? 'active' : ''" [attr.data-index]="i" class="video-item">
64+
</ng-container>
65+
<div *ngFor="let playlistVideo of _shared.playlist; let i = index" [ngClass]="currentPlaylistItem === i ? 'active' : ''" [attr.data-index]="i" class="video-item">
6666
<div class="video-item-info">
6767
<div *ngIf="thumbnails" class="video-item-image" [ngStyle]="{'background-image': 'url(' + playlistVideo.snippet.thumbnails.default.url +')'}"></div>
6868
<div class="video-item-content">
@@ -152,14 +152,14 @@ <h2>Player</h2>
152152
Similar videos
153153
</div>
154154
<div class="related-video-content">
155-
<div *ngIf="relatedVideos.length === 0" class="video-list-info">
155+
<ng-container *ngIf="relatedVideos.length === 0">
156156
<div *ngFor="let i of [1,2,3,4]" class="video-item">
157157
<div class="video-item-info">
158158
<div class="video-item-image loading-featured"></div>
159159
<div class="video-item-content loading-featured"></div>
160160
</div>
161161
</div>
162-
</div>
162+
</ng-container>
163163
<div *ngFor="let relatedVideo of relatedVideos; let i = index" [attr.data-index]="i" class="video-item">
164164
<div class="video-item-info">
165165
<div *ngIf="thumbnails" class="video-item-image" [ngStyle]="{'background-image': 'url(' + relatedVideo.snippet.thumbnails.default.url +')'}"></div>
@@ -200,8 +200,8 @@ <h2>Player</h2>
200200
<div *ngIf="modalPlaylist" class="modal-container">
201201
<h2>Do you want to remove this item from playlist?</h2>
202202
<div class="modal-content">
203-
<img *ngIf="thumbnails" src="{{ playlistVideos[modalPlaylistItem].snippet.thumbnails.medium.url }}" alt="{{ playlistVideos[modalPlaylistItem].snippet.title }}" />
204-
<p>{{ playlistVideos[modalPlaylistItem].snippet.title }}</p>
203+
<img *ngIf="thumbnails" src="{{ _shared.playlist[modalPlaylistItem].snippet.thumbnails.medium.url }}" alt="{{ _shared.playlist[modalPlaylistItem].snippet.title }}" />
204+
<p>{{ _shared.playlist[modalPlaylistItem].snippet.title }}</p>
205205
</div>
206206
<button class="modal-close" (click)="closeModal()">
207207
<span class="fa fa-times"></span>
@@ -224,7 +224,7 @@ <h3>Import Playlist</h3>
224224
<button type="button" class="btn btn-round btn-primary" (click)="importPlaylist(importPlaylistInput)">Replace</button>
225225
</div>
226226
<h3>Export Playlist</h3>
227-
<p>Number of videos to export: {{playlistVideos.length}}</p>
227+
<p>Number of videos to export: {{_shared.playlist.length}}</p>
228228
</div>
229229
<button class="modal-close" (click)="closeModal()">
230230
<span class="fa fa-times"></span>

‎src/app/app.component.ts

Lines changed: 65 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,7 @@ import * as firebase from 'firebase/app';
1414

1515
import { IRelatedVideo } from './models/related-video.model';
1616
import { INotify } from './models/notify.model';
17-
import { IFeedVideo } from './models/feed-video.model';
18-
import { Observable } from 'rxjs';
17+
import { Observable } from 'rxjs/Observable';
1918

2019
@Component({
2120
selector: 'app-yt',
@@ -32,11 +31,9 @@ export class AppComponent implements OnInit {
3231
videoRangePercent = 0;
3332

3433
relatedVideos: Array<IRelatedVideo> = [];
35-
feedVideos: Array<IFeedVideo>;
36-
playlistVideos: Array<any> = [];
3734
tempPlaylist: Array<any> = [];
3835
currentVideoObject: Array<any> = [];
39-
36+
4037
thumbnails = true;
4138
darkMode = true;
4239
menuActive = false;
@@ -99,12 +96,12 @@ export class AppComponent implements OnInit {
9996
) {
10097
this._shared = shared;
10198
this.notify = this._shared.notify;
102-
this.initDragula();
10399
}
104100

105101
ngOnInit() {
106102
this.preventOldSettings();
107103
this.updateUserDetails();
104+
this.initDragula();
108105
}
109106

110107
private hasClass(el: any, name: string) {
@@ -138,23 +135,28 @@ export class AppComponent implements OnInit {
138135
this.authService.checkLogged();
139136
this.db2.list('sessions/' + localStorage.getItem('session_key')).valueChanges().subscribe((data) => {
140137
if (data.length > 0) {
138+
this.clearSession();
139+
localStorage.setItem('settings', JSON.parse(data['3']));
141140
this.currentVideo = data['2'];
142141
this.shareLink = 'https://youtu.be/' + this.currentVideo.id;
142+
this.playlistInit();
143143
this.updatePlaylist();
144-
this.getRelatedVideos();
144+
this.getRelatedVideos();
145145
} else {
146146
this.setDefaultPlayer();
147147
}
148+
this.setSettings();
148149
});
149-
this.setSettings();
150+
}
151+
152+
refreshNow() {
153+
console.log('si-a facut update');
150154
}
151155

152156
refresh() {
153-
console.log('da');
154-
this.currentVideo.id = '';
155157
this.clearSession();
156158
// this.playlistInit();
157-
// this.updatePlaylist();
159+
// this.getRelatedVideos();
158160
}
159161

160162
// ---------------- Init player ----------------
@@ -181,7 +183,6 @@ export class AppComponent implements OnInit {
181183
async getFeedVideos() {
182184
await this._shared.initFeed();
183185
await this._shared.initChannel();
184-
this.feedVideos = this._shared.feedVideos;
185186
if (!this.currentVideo.id && !this._shared.isLogged) {
186187
this.setDefaultPlayer();
187188
}
@@ -197,13 +198,12 @@ export class AppComponent implements OnInit {
197198
}
198199

199200
setDefaultPlayer() {
200-
this.feedVideos = this._shared.feedVideos;
201-
this.setCurrentVideoObject(this.feedVideos[0]);
202-
this.currentVideo.id = this.feedVideos[0].id;
203-
this.currentVideo.title = this.feedVideos[0].snippet.title;
204-
this.currentVideo.stats.likes = this.feedVideos[0].statistics.likeCount;
205-
this.currentVideo.stats.dislikes = this.feedVideos[0].statistics.dislikeCount;
206-
this.currentVideo.stats.views = this.feedVideos[0].statistics.viewCount;
201+
this.setCurrentVideoObject(this._shared.feedVideos[0]);
202+
this.currentVideo.id = this._shared.feedVideos[0].id;
203+
this.currentVideo.title = this._shared.feedVideos[0].snippet.title;
204+
this.currentVideo.stats.likes = this._shared.feedVideos[0].statistics.likeCount;
205+
this.currentVideo.stats.dislikes = this._shared.feedVideos[0].statistics.dislikeCount;
206+
this.currentVideo.stats.views = this._shared.feedVideos[0].statistics.viewCount;
207207
this.shareLink = 'https://youtu.be/' + this.currentVideo.id;
208208
this.getRelatedVideos();
209209
this.findPlaylistItem();
@@ -225,14 +225,14 @@ export class AppComponent implements OnInit {
225225
if (this.currentState === 0) {
226226
this.stopRange();
227227
if (this.repeatMode) {
228-
if (this.playlistVideos.length) {
228+
if (this._shared.playlist.length) {
229229
this.findPlaylistItem();
230230
if (this.currentPlaylistItem < 0) {
231231
this.playPlaylistItem('next', this.currentPlaylistItem);
232232
} else {
233233
this.playPlaylistItem('next', this.currentPlaylistItem);
234234
}
235-
if (this.playlistVideos.length === 1) {
235+
if (this._shared.playlist.length === 1) {
236236
this.player.playVideo();
237237
}
238238
} else {
@@ -261,7 +261,6 @@ export class AppComponent implements OnInit {
261261

262262
updatePlaylist() {
263263
this.findPlaylistItem();
264-
this._shared.playlist = this.playlistVideos;
265264
this._shared.updatePlaylist();
266265
}
267266

@@ -280,47 +279,45 @@ export class AppComponent implements OnInit {
280279
}
281280

282281
playlistInit() {
283-
if (localStorage.getItem('playlist') === null || localStorage.getItem('playlist').length === 2) {
284-
this.playlistVideos = JSON.parse(JSON.stringify(this.relatedVideos));
285-
this._shared.playlist = JSON.parse(JSON.stringify(this.playlistVideos));
286-
this._shared.updatePlaylist();
287-
} else {
288-
this._shared.getPlaylist();
289-
this.playlistVideos = JSON.parse(JSON.stringify(this._shared.playlist));
290-
}
291-
this.findPlaylistItem();
282+
if (localStorage.getItem('playlist') === null || localStorage.getItem('playlist').length === 2) {
283+
this._shared.playlist = JSON.parse(JSON.stringify(this.relatedVideos));
284+
this._shared.updatePlaylist();
285+
} else {
286+
this._shared.getPlaylist();
287+
}
288+
this.findPlaylistItem();
292289
}
293290

294291
findPlaylistItem() {
295-
let playlistItem;
296-
if (!this._shared.isLogged) {
297-
if (typeof this.currentVideoObject[0].id.videoId !== 'undefined') {
298-
playlistItem = this.playlistVideos.find(item => item.id.videoId === this.currentVideoObject[0].id.videoId);
299-
} else {
300-
playlistItem = this.playlistVideos.find(item => item.id === this.currentVideoObject[0].id);
301-
}
302-
}
303-
this.currentPlaylistItem = this.playlistVideos.indexOf(playlistItem);
292+
let playlistItem;
293+
if (typeof this.currentVideoObject[0].id.videoId !== 'undefined') {
294+
playlistItem = this._shared.playlist.find(item => item.id.videoId === this.currentVideoObject[0].id.videoId);
295+
} else {
296+
playlistItem = this._shared.playlist.find(item => item.id === this.currentVideoObject[0].id);
297+
}
298+
console.log(this._shared.playlist);
299+
console.log(this.currentVideoObject[0].id);
300+
this.currentPlaylistItem = this._shared.playlist.indexOf(playlistItem);
304301
}
305302

306303
playPlaylistItem(direction: string, i: number) {
307304
if (direction === 'next') {
308-
if (i < this.playlistVideos.length) {
305+
if (i < this._shared.playlist.length) {
309306
i += 1;
310307
}
311-
if (i === this.playlistVideos.length) {
308+
if (i === this._shared.playlist.length) {
312309
i = 0;
313310
}
314311
}
315312
if (direction === 'prev') {
316313
if (i === 0 || i < 0) {
317-
i = this.playlistVideos.length - 1;
314+
i = this._shared.playlist.length - 1;
318315
} else {
319316
i -= 1;
320317
}
321318
}
322-
if (this.playlistVideos.length > 0) {
323-
this.getVideo(this.playlistVideos[i]);
319+
if (this._shared.playlist.length > 0) {
320+
this.getVideo(this._shared.playlist[i]);
324321
} else {
325322
this._shared.triggerNotify('Playlist is empty');
326323
this.updateNotify();
@@ -334,7 +331,7 @@ export class AppComponent implements OnInit {
334331
if (i === this.currentPlaylistItem) {
335332
this.currentPlaylistItem = -1;
336333
}
337-
this.playlistVideos.splice(i, 1);
334+
this._shared.playlist.splice(i, 1);
338335
this.updatePlaylist();
339336
}, 200);
340337
}
@@ -359,13 +356,13 @@ export class AppComponent implements OnInit {
359356
}
360357

361358
if (typeof listType.id.videoId !== 'undefined') {
362-
playlistItem = this.playlistVideos.find(item => item.id.videoId === listType.id.videoId);
359+
playlistItem = this._shared.playlist.find(item => item.id.videoId === listType.id.videoId);
363360
} else {
364-
playlistItem = this.playlistVideos.find(item => item.id === listType.id);
361+
playlistItem = this._shared.playlist.find(item => item.id === listType.id);
365362
}
366363

367364
if (typeof playlistItem === 'undefined') {
368-
this.playlistVideos.push(listType);
365+
this._shared.playlist.push(listType);
369366
this.updatePlaylist();
370367

371368
this._shared.triggerNotify('Added to playlist');
@@ -379,16 +376,27 @@ export class AppComponent implements OnInit {
379376

380377
clearPlaylist() {
381378
this.currentPlaylistItem = -1;
382-
this.playlistVideos = [];
383379
this._shared.playlist = [];
384380
this._shared.updatePlaylist();
385381
}
386382

387383
clearSession() {
384+
const removedCurrentVid = {
385+
id: '',
386+
title: '',
387+
channelTitle: '',
388+
stats: {
389+
likes: '',
390+
dislikes: '',
391+
views: ''
392+
}
393+
};
394+
this.currentVideo = removedCurrentVid;
388395
this.currentPlaylistItem = -1;
389-
this.playlistVideos = [];
390396
this._shared.playlist = [];
391397
this.relatedVideos = [];
398+
localStorage.removeItem('playlist');
399+
// localStorage.removeItem('settings');
392400
}
393401

394402
exportPlaylist() {
@@ -397,14 +405,13 @@ export class AppComponent implements OnInit {
397405

398406
exportFilePlaylist() {
399407
const a = document.createElement('a');
400-
const file = new Blob([JSON.stringify(this.playlistVideos)], {type: 'data:text/json;charset=utf8'});
408+
const file = new Blob([JSON.stringify(this._shared.playlist)], {type: 'data:text/json;charset=utf8'});
401409
a.href = URL.createObjectURL(file);
402410
a.download = 'playlist.json';
403411
a.click();
404412
}
405413

406414
importPlaylist(input: any) {
407-
this.playlistVideos = this.tempPlaylist;
408415
this._shared.playlist = this.tempPlaylist;
409416
this.tempPlaylist = [];
410417
this._shared.updatePlaylist();
@@ -414,7 +421,7 @@ export class AppComponent implements OnInit {
414421
// ---------------- Init settings ----------------
415422

416423
initDragula() {
417-
this.dragula.setOptions('playlistVideos', {
424+
this.dragula.setOptions('_shared.playlist', {
418425
moves: (el, container, handle) => {
419426
return handle.className === 'video-item-settings';
420427
}
@@ -442,7 +449,7 @@ export class AppComponent implements OnInit {
442449
this._shared.settings = null;
443450
this._shared.playlist = null;
444451

445-
this.playlistVideos = [];
452+
this._shared.playlist = [];
446453
}
447454
}
448455

@@ -480,7 +487,7 @@ export class AppComponent implements OnInit {
480487
if (i === this.currentPlaylistItem) {
481488
this.playPauseVideo();
482489
} else {
483-
this.getVideo(this.playlistVideos[i]);
490+
this.getVideo(this._shared.playlist[i]);
484491
}
485492
}
486493

@@ -533,7 +540,7 @@ export class AppComponent implements OnInit {
533540

534541
playPauseVideo() {
535542
if (this.currentState === 1) {
536-
this.player.pauseVideo();
543+
this.player.pauseVideo();
537544
} else {
538545
this.player.playVideo();
539546
}
@@ -642,7 +649,7 @@ export class AppComponent implements OnInit {
642649
listType = this.relatedVideos[i];
643650
}
644651
if (list === 3) {
645-
listType = this.playlistVideos[i];
652+
listType = this._shared.playlist[i];
646653
}
647654
if (list === 4) {
648655
listType = this._shared.historyVideos[i];

‎src/app/services/auth.service.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,6 @@ export class AuthService {
5050
this.itemsRef = this.db2.list('users/' + authData.user.uid);
5151
this.itemsRef.valueChanges().subscribe(data => {
5252
this.db2.list('users/' + authData.user.uid).valueChanges().subscribe(userData => {
53-
console.log(userData);
5453
if (userData.length === 0) {
5554
console.log('First time login');
5655
// First time login create user and session
@@ -71,14 +70,15 @@ export class AuthService {
7170
console.log('Normal login');
7271
localStorage.removeItem('session_key');
7372
localStorage.setItem('session_key', data['2']);
74-
this.db2.list('sessions/' + data['2']).valueChanges().subscribe((sessionData) => {
75-
localStorage.removeItem('settings');
76-
localStorage.removeItem('playlist');
77-
this.shared.playlist = sessionData[3];
78-
this.shared.settings = data[3];
79-
this.shared.updateSettings();
80-
this.shared.updatePlaylist();
81-
});
73+
this.shared.isAffected(true);
74+
// this.db2.list('sessions/' + data['2']).valueChanges().subscribe((sessionData) => {
75+
// localStorage.removeItem('settings');
76+
// localStorage.removeItem('playlist');
77+
// this.shared.playlist = sessionData[3];
78+
// this.shared.settings = data[3];
79+
// this.shared.updateSettings();
80+
// this.shared.updatePlaylist();
81+
// });
8282
}
8383
this.shared.isLogged = true;
8484
});

0 commit comments

Comments
 (0)