Skip to content

Commit

Permalink
revert whitespace fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
0xADADA committed May 6, 2019
1 parent 083a355 commit ae03080
Showing 1 changed file with 84 additions and 96 deletions.
180 changes: 84 additions & 96 deletions addon/components/ember-youtube.js
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,14 @@
/* global YT, window */

import Component from "@ember/component";
import RSVP from "rsvp";
import {
computed,
getProperties,
setProperties,
observer
} from "@ember/object";
import { debug } from "@ember/debug";
import { run } from "@ember/runloop";
import { task } from "ember-concurrency";
import Component from '@ember/component';
import RSVP from 'rsvp'
import { computed, getProperties, setProperties, observer } from '@ember/object';
import { debug } from '@ember/debug';
import { run } from '@ember/runloop';
import { task } from 'ember-concurrency';

export default Component.extend({
classNames: ["EmberYoutube"],
classNames: ['EmberYoutube'],
ytid: null,
width: 560,
height: 315,
Expand All @@ -27,10 +22,10 @@ export default Component.extend({
showControls: false,
showDebug: false,
showProgress: false,
showExtras: computed.or("showControls", "showProgress", "showDebug"),
showExtras: computed.or('showControls', 'showProgress', 'showDebug'),

player: null,
playerState: "loading",
playerState: 'loading',

init() {
this._super();
Expand All @@ -42,12 +37,12 @@ export default Component.extend({
playerVars: Object.assign({}, this.playerVars),
// from YT.PlayerState
stateNames: {
"-1": "ready", // READY
0: "ended", // YT.Player.ENDED
1: "playing", // YT.PlayerState.PLAYING
2: "paused", // YT.PlayerState.PAUSED
3: "buffering", // YT.PlayerState.BUFFERING
5: "queued" // YT.PlayerState.CUED
'-1': 'ready', // READY
0: 'ended', // YT.Player.ENDED
1: 'playing', // YT.PlayerState.PLAYING
2: 'paused', // YT.PlayerState.PAUSED
3: 'buffering', // YT.PlayerState.BUFFERING
5: 'queued' // YT.PlayerState.CUED
}
});

Expand All @@ -56,13 +51,13 @@ export default Component.extend({

// Expose the component to the outside world.
_register() {
const delegate = this.get("delegate");
const delegateAs = this.get("delegate-as");
run.schedule("afterRender", () => {
const delegate = this.get('delegate');
const delegateAs = this.get('delegate-as');
run.schedule('afterRender', () => {
if (!delegate) {
return;
}
delegate.set(delegateAs || "emberYouTube", this);
delegate.set(delegateAs || 'emberYouTube', this);
});
},

Expand All @@ -71,64 +66,63 @@ export default Component.extend({

this.addProgressBarClickHandler();

if (!this.get("lazyload") && this.get("ytid")) {
if (!this.get('lazyload') && this.get('ytid')) {
// If "lazyload" is not enabled and we have an ID, we can start immediately.
// Otherwise the `loadVideo` observer will take care of things.
this.get("loadAndCreatePlayer").perform();
this.get('loadAndCreatePlayer').perform();
}
},

willDestroyElement() {
this.get("loadAndCreatePlayer").cancelAll();
this.get('loadAndCreatePlayer').cancelAll();

// clear the timer
this.stopTimer();

// remove progress bar click handler

this.removeProgressBarClickHandler();

// destroy video player
const player = this.get("player");
const player = this.get('player');
if (player) {
player.destroy();
this.set("player", null);
this.set('player', null);
}

// clear up if "delegated"
const delegate = this.get("delegate");
const delegateAs = this.get("delegate-as");
const delegate = this.get('delegate');
const delegateAs = this.get('delegate-as');
if (delegate) {
delegate.set(delegateAs || "emberYouTube", null);
delegate.set(delegateAs || 'emberYouTube', null);
}
},

loadAndCreatePlayer: task(function*() {
loadAndCreatePlayer: task(function * () {
try {
yield this.loadYouTubeApi();
let player = yield this.createPlayer();

this.setProperties({
player,
playerState: "ready"
playerState: 'ready'
});

this.sendAction("playerCreated", player);
this.sendAction('playerCreated', player);

this.loadVideo();
} catch (err) {
if (this.get("showDebug")) {
} catch(err) {
if (this.get('showDebug')) {
debug(err);
}

throw err;
throw err
}
}).drop(),

// A promise that is resolved when window.onYouTubeIframeAPIReady is called.
// The promise is resolved with a reference to window.YT object.
loadYouTubeApi() {
return new RSVP.Promise(resolve => {
return new RSVP.Promise((resolve) => {
let previous;
previous = window.onYouTubeIframeAPIReady;

Expand All @@ -154,16 +148,14 @@ export default Component.extend({

// A promise that is immediately resolved with a YouTube player object.
createPlayer() {
const playerVars = this.get("playerVars");
const width = this.get("width");
const height = this.get("height");
const container = this.element.querySelector(".EmberYoutube-player");
const playerVars = this.get('playerVars');
const width = this.get('width');
const height = this.get('height');
const container = this.element.querySelector('.EmberYoutube-player');
let player;
return new RSVP.Promise((resolve, reject) => {
if (!container) {
reject(
`Couldn't find the container element to create a YouTube player`
);
reject(`Couldn't find the container element to create a YouTube player`);
}
player = new YT.Player(container, {
width,
Expand All @@ -183,26 +175,26 @@ export default Component.extend({
// Gets called by the YouTube player.
onPlayerStateChange(event) {
// Set a readable state name
let state = this.get("stateNames." + event.data.toString());
this.set("playerState", state);
if (this.get("showDebug")) {
let state = this.get('stateNames.' + event.data.toString());
this.set('playerState', state);
if (this.get('showDebug')) {
debug(state);
}
// send actions outside
this.sendAction(state, event);
this.sendAction("playerStateChanged", event);
this.sendAction('playerStateChanged', event);
// send actions inside
this.send(state);
},

// Gets called by the YouTube player.
onPlayerError(event) {
let errorCode = event.data;
this.set("playerState", "error");
this.set('playerState', 'error');
// Send the event to the controller
this.sendAction("error", errorCode);
if (this.get("showDebug")) {
debug("error" + errorCode);
this.sendAction('error', errorCode);
if (this.get('showDebug')) {
debug('error' + errorCode);
}
// switch(errorCode) {
// case 2:
Expand All @@ -223,9 +215,9 @@ export default Component.extend({
},

// Returns a boolean that indicates playback status by looking at the player state.
isPlaying: computed("playerState", {
isPlaying: computed('playerState', {
get() {
const player = this.get("player");
const player = this.get('player');
if (!player) {
return false;
}
Expand All @@ -234,31 +226,27 @@ export default Component.extend({
}),

// Load (and plays) a video every time ytid changes.
ytidDidChange: observer("ytid", function() {
const player = this.get("player");
const ytid = this.get("ytid");
ytidDidChange: observer('ytid', function () {
const player = this.get('player');
const ytid = this.get('ytid');

if (!ytid) {
return;
}

if (!player) {
this.get("loadAndCreatePlayer").perform();
this.get('loadAndCreatePlayer').perform();
return;
}
this.loadVideo();
}),

loadVideo() {
const player = this.get("player");
const ytid = this.get("ytid");
const player = this.get('player');
const ytid = this.get('ytid');

// Set parameters for the video to be played.
let options = getProperties(this, [
"startSeconds",
"endSeconds",
"suggestedQuality"
]);
let options = getProperties(this, ['startSeconds', 'endSeconds', 'suggestedQuality']);
options.videoId = ytid;
// Either load or cue depending on `autoplay`.
if (this.playerVars.autoplay) {
Expand All @@ -269,10 +257,10 @@ export default Component.extend({
},

updateTime() {
const player = this.get("player");
const player = this.get('player');
if (player && player.getDuration && player.getCurrentTime) {
this.set("currentTime", player.getCurrentTime());
this.set("duration", player.getDuration());
this.set('currentTime', player.getCurrentTime());
this.set('duration', player.getDuration());
}
},

Expand All @@ -286,17 +274,17 @@ export default Component.extend({
this.updateTime();
}, 1000);
// save the timer so we can stop it later
this.set("timer", timer);
this.set('timer', timer);
},

stopTimer() {
window.clearInterval(this.get("timer"));
window.clearInterval(this.get('timer'));
},

// A wrapper around the YouTube method to get current time.
currentTime: computed({
get() {
let player = this.get("player");
let player = this.get('player');
let value = player ? player.getCurrentTime() : 0;
return value;
},
Expand All @@ -308,7 +296,7 @@ export default Component.extend({
// A wrapper around the YouTube method to get the duration.
duration: computed({
get() {
let player = this.get("player");
let player = this.get('player');
let value = player ? player.getDuration() : 0;
return value;
},
Expand All @@ -320,12 +308,12 @@ export default Component.extend({
// A wrapper around the YouTube method to get and set volume.
volume: computed({
get() {
let player = this.get("player");
let player = this.get('player');
let value = player ? player.getVolume() : 0;
return value;
},
set(name, vol) {
let player = this.get("player");
let player = this.get('player');
// Clamp between 0 and 100
if (vol > 100) {
vol = 100;
Expand Down Expand Up @@ -353,7 +341,7 @@ export default Component.extend({
let element = event.srcElement;
if (element.tagName.toLowerCase() !== "progress") return;
// get the x position of the click inside our progress el
let x = event.pageX - element.getBoundingClientRect().x;
let x = event.pageX - element.getBoundingClientRect().x;
// convert it to a value relative to the duration (max)
let clickedValue = (x * element.max) / element.offsetWidth;
// 250 = 0.25 seconds into player
Expand All @@ -370,44 +358,44 @@ export default Component.extend({

actions: {
play() {
if (this.get("player")) {
this.get("player").playVideo();
if (this.get('player')) {
this.get('player').playVideo();
}
},
pause() {
if (this.get("player")) {
this.get("player").pauseVideo();
if (this.get('player')) {
this.get('player').pauseVideo();
}
},
togglePlay() {
if (this.get("player") && this.get("isPlaying")) {
this.send("pause");
if (this.get('player') && this.get('isPlaying')) {
this.send('pause');
} else {
this.send("play");
this.send('play');
}
},
mute() {
if (this.get("player")) {
this.get("player").mute();
this.set("isMuted", true);
if (this.get('player')) {
this.get('player').mute();
this.set('isMuted', true);
}
},
unMute() {
if (this.get("player")) {
this.get("player").unMute();
this.set("isMuted", false);
if (this.get('player')) {
this.get('player').unMute();
this.set('isMuted', false);
}
},
toggleVolume() {
if (this.get("player").isMuted()) {
this.send("unMute");
if (this.get('player').isMuted()) {
this.send('unMute');
} else {
this.send("mute");
this.send('mute');
}
},
seekTo(seconds) {
if (this.get("player")) {
this.get("player").seekTo(seconds);
if (this.get('player')) {
this.get('player').seekTo(seconds);
}
},
// YouTube events.
Expand Down

0 comments on commit ae03080

Please sign in to comment.