silvermine / videojs-chromecast / 233

pending completion

Build # 233

Build Type

push

travis-ci-com

Committed by

web-flow

Commit Message

Merge pull request #148 from izkmdz/ismendoza/cast-label

Use "Disconnect Cast" label when chromecast connected

Run Details

0 of 169 branches covered (0.0%)

Branch coverage included in aggregate %.

7 of 7 new or added lines in 1 file covered. (100.0%)

0 of 358 relevant lines covered (0.0%)

0.0 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/js/components/ChromecastButton.js

/**
 * The ChromecastButton module contains both the ChromecastButton class definition and
 * the function used to register the button as a Video.js Component.
 *
 * @module ChromecastButton
 */

var ChromecastButton;

/**
* The Video.js Button class is the base class for UI button components.
*
* @external Button
* @see {@link http://docs.videojs.com/Button.html|Button}
*/

/** @lends ChromecastButton.prototype */
ChromecastButton = {

   /**
    * This class is a button component designed to be displayed in the player UI's control
    * bar. It opens the Chromecast menu when clicked.
    *
    * @constructs
    * @extends external:Button
    * @param player {Player} the video.js player instance
    */
   constructor: function(player, options) {
      this.constructor.super_.apply(this, arguments);

      player.on('chromecastConnected', this._onChromecastConnected.bind(this));
      player.on('chromecastDisconnected', this._onChromecastDisconnected.bind(this));
      player.on('chromecastDevicesAvailable', this._onChromecastDevicesAvailable.bind(this));
      player.on('chromecastDevicesUnavailable', this._onChromecastDevicesUnavailable.bind(this));

      // Use the initial state of `hasAvailableDevices` to call the corresponding event
      // handlers because the corresponding events may have already been emitted before
      // binding the listeners above.
      if (player.chromecastSessionManager && player.chromecastSessionManager.hasAvailableDevices()) {
         this._onChromecastDevicesAvailable();
      } else {
         this._onChromecastDevicesUnavailable();
      }

      if (options.addCastLabelToButton) {
         this.el().classList.add('vjs-chromecast-button-lg');

         this._labelEl = document.createElement('span');
         this._labelEl.classList.add('vjs-chromecast-button-label');
         this._updateCastLabelText();

         this.el().appendChild(this._labelEl);
      } else {
         this.controlText('Open Chromecast menu');
      }
   },

   /**
    * Overrides Button#buildCSSClass to return the classes used on the button element.
    *
    * @param el {DOMElement}
    * @see {@link http://docs.videojs.com/Button.html#buildCSSClass|Button#buildCSSClass}
    */
   buildCSSClass: function() {
      return 'vjs-chromecast-button ' +
         (this._isChromecastConnected ? 'vjs-chromecast-casting-state ' : '') +
         (this.options_.addCastLabelToButton ? 'vjs-chromecast-button-lg ' : '') +
         this.constructor.super_.prototype.buildCSSClass();
   },

   /**
    * Overrides Button#handleClick to handle button click events. Chromecast functionality
    * is handled outside of this class, which should be limited to UI related logic. This
    * function simply triggers an event on the player.
    *
    * @fires ChromecastButton#chromecastRequested
    * @param el {DOMElement}
    * @see {@link http://docs.videojs.com/Button.html#handleClick|Button#handleClick}
    */
   handleClick: function() {
      this.player().trigger('chromecastRequested');
   },

   /**
    * Handles `chromecastConnected` player events.
    *
    * @private
    */
   _onChromecastConnected: function() {
      this._isChromecastConnected = true;
      this._reloadCSSClasses();
      this._updateCastLabelText();
   },

   /**
    * Handles `chromecastDisconnected` player events.
    *
    * @private
    */
   _onChromecastDisconnected: function() {
      this._isChromecastConnected = false;
      this._reloadCSSClasses();
      this._updateCastLabelText();
   },

   /**
    * Handles `chromecastDevicesAvailable` player events.
    *
    * @private
    */
   _onChromecastDevicesAvailable: function() {
      this.show();
   },

   /**
    * Handles `chromecastDevicesUnavailable` player events.
    *
    * @private
    */
   _onChromecastDevicesUnavailable: function() {
      this.hide();
   },

   /**
    * Re-calculates which CSS classes the button needs and sets them on the buttons'
    * DOMElement.
    *
    * @private
    */
   _reloadCSSClasses: function() {
      if (!this.el_) {
         return;
      }
      this.el_.className = this.buildCSSClass();
   },

   /**
    * Updates the optional cast label text based on whether the chromecast is connected
    * or disconnected.
    *
    * @private
    */
   _updateCastLabelText: function() {
      if (!this._labelEl) {
         return;
      }
      this._labelEl.textContent = this._isChromecastConnected ? this.localize('Disconnect Cast') : this.localize('Cast');
   },
};

/**
 * Registers the ChromecastButton Component with Video.js. Calls
 * {@link http://docs.videojs.com/Component.html#.registerComponent}, which will add a
 * component called `chromecastButton` to the list of globally registered Video.js
 * components. The `chromecastButton` is added to the player's control bar UI
 * automatically once {@link module:enableChromecast} has been called. If you would like
 * to specify the order of the buttons that appear in the control bar, including this
 * button, you can do so in the options that you pass to the `videojs` function when
 * creating a player:
 *
 * ```
 * videojs('playerID', {
 *    controlBar: {
 *       children: [
 *          'playToggle',
 *          'progressControl',
 *          'volumePanel',
 *          'fullscreenToggle',
 *          'chromecastButton',
 *       ],
 *    }
 * });
 * ```
 *
 * @param videojs {object} A reference to {@link http://docs.videojs.com/module-videojs.html|Video.js}
 * @see http://docs.videojs.com/module-videojs.html#~registerPlugin
 */
module.exports = function(videojs) {
   var ChromecastButtonImpl;

   ChromecastButtonImpl = videojs.extend(videojs.getComponent('Button'), ChromecastButton);
   videojs.registerComponent('chromecastButton', ChromecastButtonImpl);
};

1	/**
2	* The ChromecastButton module contains both the ChromecastButton class definition and
3	* the function used to register the button as a Video.js Component.
4	*
5	* @module ChromecastButton
6	*/
7
8	var ChromecastButton;
9
10	/**
11	* The Video.js Button class is the base class for UI button components.
12	*
13	* @external Button
14	* @see {@link http://docs.videojs.com/Button.html\|Button}
15	*/
16
17	/** @lends ChromecastButton.prototype */
18	ChromecastButton = {	×
19
20	/**
21	* This class is a button component designed to be displayed in the player UI's control
22	* bar. It opens the Chromecast menu when clicked.
23	*
24	* @constructs
25	* @extends external:Button
26	* @param player {Player} the video.js player instance
27	*/
28	constructor: function(player, options) {
29	this.constructor.super_.apply(this, arguments);	×
30
31	player.on('chromecastConnected', this._onChromecastConnected.bind(this));	×
32	player.on('chromecastDisconnected', this._onChromecastDisconnected.bind(this));	×
33	player.on('chromecastDevicesAvailable', this._onChromecastDevicesAvailable.bind(this));	×
34	player.on('chromecastDevicesUnavailable', this._onChromecastDevicesUnavailable.bind(this));	×
35
36	// Use the initial state of `hasAvailableDevices` to call the corresponding event
37	// handlers because the corresponding events may have already been emitted before
38	// binding the listeners above.
39	if (player.chromecastSessionManager && player.chromecastSessionManager.hasAvailableDevices()) {	×
40	this._onChromecastDevicesAvailable();	×
41	} else {
42	this._onChromecastDevicesUnavailable();	×
43	}
44
45	if (options.addCastLabelToButton) {	×
46	this.el().classList.add('vjs-chromecast-button-lg');	×
47
48	this._labelEl = document.createElement('span');	×
49	this._labelEl.classList.add('vjs-chromecast-button-label');	×
50	this._updateCastLabelText();	×
51
52	this.el().appendChild(this._labelEl);	×
53	} else {
54	this.controlText('Open Chromecast menu');	×
55	}
56	},
57
58	/**
59	* Overrides Button#buildCSSClass to return the classes used on the button element.
60	*
61	* @param el {DOMElement}
62	* @see {@link http://docs.videojs.com/Button.html#buildCSSClass\|Button#buildCSSClass}
63	*/
64	buildCSSClass: function() {
65	return 'vjs-chromecast-button ' +	×
66	(this._isChromecastConnected ? 'vjs-chromecast-casting-state ' : '') +	×
67	(this.options_.addCastLabelToButton ? 'vjs-chromecast-button-lg ' : '') +	×
68	this.constructor.super_.prototype.buildCSSClass();
69	},
70
71	/**
72	* Overrides Button#handleClick to handle button click events. Chromecast functionality
73	* is handled outside of this class, which should be limited to UI related logic. This
74	* function simply triggers an event on the player.
75	*
76	* @fires ChromecastButton#chromecastRequested
77	* @param el {DOMElement}
78	* @see {@link http://docs.videojs.com/Button.html#handleClick\|Button#handleClick}
79	*/
80	handleClick: function() {
81	this.player().trigger('chromecastRequested');	×
82	},
83
84	/**
85	* Handles `chromecastConnected` player events.
86	*
87	* @private
88	*/
89	_onChromecastConnected: function() {
90	this._isChromecastConnected = true;	×
91	this._reloadCSSClasses();	×
92	this._updateCastLabelText();	×
93	},
94
95	/**
96	* Handles `chromecastDisconnected` player events.
97	*
98	* @private
99	*/
100	_onChromecastDisconnected: function() {
101	this._isChromecastConnected = false;	×
102	this._reloadCSSClasses();	×
103	this._updateCastLabelText();	×
104	},
105
106	/**
107	* Handles `chromecastDevicesAvailable` player events.
108	*
109	* @private
110	*/
111	_onChromecastDevicesAvailable: function() {
112	this.show();	×
113	},
114
115	/**
116	* Handles `chromecastDevicesUnavailable` player events.
117	*
118	* @private
119	*/
120	_onChromecastDevicesUnavailable: function() {
121	this.hide();	×
122	},
123
124	/**
125	* Re-calculates which CSS classes the button needs and sets them on the buttons'
126	* DOMElement.
127	*
128	* @private
129	*/
130	_reloadCSSClasses: function() {
131	if (!this.el_) {	×
132	return;	×
133	}
134	this.el_.className = this.buildCSSClass();	×
135	},
136
137	/**
138	* Updates the optional cast label text based on whether the chromecast is connected
139	* or disconnected.
140	*
141	* @private
142	*/
143	_updateCastLabelText: function() {
144	if (!this._labelEl) {	×
145	return;	×
146	}
147	this._labelEl.textContent = this._isChromecastConnected ? this.localize('Disconnect Cast') : this.localize('Cast');	×
148	},
149	};
150
151	/**
152	* Registers the ChromecastButton Component with Video.js. Calls
153	* {@link http://docs.videojs.com/Component.html#.registerComponent}, which will add a
154	* component called `chromecastButton` to the list of globally registered Video.js
155	* components. The `chromecastButton` is added to the player's control bar UI
156	* automatically once {@link module:enableChromecast} has been called. If you would like
157	* to specify the order of the buttons that appear in the control bar, including this
158	* button, you can do so in the options that you pass to the `videojs` function when
159	* creating a player:
160	*
161	* ```
162	* videojs('playerID', {
163	* controlBar: {
164	* children: [
165	* 'playToggle',
166	* 'progressControl',
167	* 'volumePanel',
168	* 'fullscreenToggle',
169	* 'chromecastButton',
170	* ],
171	* }
172	* });
173	* ```
174	*
175	* @param videojs {object} A reference to {@link http://docs.videojs.com/module-videojs.html\|Video.js}
176	* @see http://docs.videojs.com/module-videojs.html#~registerPlugin
177	*/
178	module.exports = function(videojs) {	×
179	var ChromecastButtonImpl;
180
181	ChromecastButtonImpl = videojs.extend(videojs.getComponent('Button'), ChromecastButton);	×
182	videojs.registerComponent('chromecastButton', ChromecastButtonImpl);	×
183	};

silvermine / videojs-chromecast / 233

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous