aleph1.co.uk Git - yaffs-website/blob - node_modules/video.js/es5/control-bar/volume-menu-button.js

   1 'use strict';
   2
   3 exports.__esModule = true;
   4
   5 var _fn = require('../utils/fn.js');
   6
   7 var Fn = _interopRequireWildcard(_fn);
   8
   9 var _component = require('../component.js');
  10
  11 var _component2 = _interopRequireDefault(_component);
  12
  13 var _popup = require('../popup/popup.js');
  14
  15 var _popup2 = _interopRequireDefault(_popup);
  16
  17 var _popupButton = require('../popup/popup-button.js');
  18
  19 var _popupButton2 = _interopRequireDefault(_popupButton);
  20
  21 var _muteToggle = require('./mute-toggle.js');
  22
  23 var _muteToggle2 = _interopRequireDefault(_muteToggle);
  24
  25 var _volumeBar = require('./volume-control/volume-bar.js');
  26
  27 var _volumeBar2 = _interopRequireDefault(_volumeBar);
  28
  29 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  30
  31 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj['default'] = obj; return newObj; } }
  32
  33 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  34
  35 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
  36
  37 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /**
  38                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 * @file volume-menu-button.js
  39                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 */
  40
  41
  42 /**
  43  * Button for volume popup
  44  *
  45  * @extends PopupButton
  46  */
  47 var VolumeMenuButton = function (_PopupButton) {
  48   _inherits(VolumeMenuButton, _PopupButton);
  49
  50   /**
  51    * Creates an instance of this class.
  52    *
  53    * @param {Player} player
  54    *        The `Player` that this class should be attached to.
  55    *
  56    * @param {Object} [options={}]
  57    *        The key/value store of player options.
  58    */
  59   function VolumeMenuButton(player) {
  60     var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
  61
  62     _classCallCheck(this, VolumeMenuButton);
  63
  64     // Default to inline
  65     if (options.inline === undefined) {
  66       options.inline = true;
  67     }
  68
  69     // If the vertical option isn't passed at all, default to true.
  70     if (options.vertical === undefined) {
  71       // If an inline volumeMenuButton is used, we should default to using
  72       // a horizontal slider for obvious reasons.
  73       if (options.inline) {
  74         options.vertical = false;
  75       } else {
  76         options.vertical = true;
  77       }
  78     }
  79
  80     // The vertical option needs to be set on the volumeBar as well,
  81     // since that will need to be passed along to the VolumeBar constructor
  82     options.volumeBar = options.volumeBar || {};
  83     options.volumeBar.vertical = !!options.vertical;
  84
  85     // Same listeners as MuteToggle
  86     var _this = _possibleConstructorReturn(this, _PopupButton.call(this, player, options));
  87
  88     _this.on(player, 'volumechange', _this.volumeUpdate);
  89     _this.on(player, 'loadstart', _this.volumeUpdate);
  90
  91     // hide mute toggle if the current tech doesn't support volume control
  92     function updateVisibility() {
  93       if (player.tech_ && player.tech_.featuresVolumeControl === false) {
  94         this.addClass('vjs-hidden');
  95       } else {
  96         this.removeClass('vjs-hidden');
  97       }
  98     }
  99
 100     updateVisibility.call(_this);
 101     _this.on(player, 'loadstart', updateVisibility);
 102
 103     _this.on(_this.volumeBar, ['slideractive', 'focus'], function () {
 104       this.addClass('vjs-slider-active');
 105     });
 106
 107     _this.on(_this.volumeBar, ['sliderinactive', 'blur'], function () {
 108       this.removeClass('vjs-slider-active');
 109     });
 110
 111     _this.on(_this.volumeBar, ['focus'], function () {
 112       this.addClass('vjs-lock-showing');
 113     });
 114
 115     _this.on(_this.volumeBar, ['blur'], function () {
 116       this.removeClass('vjs-lock-showing');
 117     });
 118     return _this;
 119   }
 120
 121   /**
 122    * Builds the default DOM `className`.
 123    *
 124    * @return {string}
 125    *         The DOM `className` for this object.
 126    */
 127
 128
 129   VolumeMenuButton.prototype.buildCSSClass = function buildCSSClass() {
 130     var orientationClass = '';
 131
 132     if (this.options_.vertical) {
 133       orientationClass = 'vjs-volume-menu-button-vertical';
 134     } else {
 135       orientationClass = 'vjs-volume-menu-button-horizontal';
 136     }
 137
 138     return 'vjs-volume-menu-button ' + _PopupButton.prototype.buildCSSClass.call(this) + ' ' + orientationClass;
 139   };
 140
 141   /**
 142    * Create the VolumeMenuButton popup
 143    *
 144    * @return {Popup}
 145    *         The popup that was created
 146    */
 147
 148
 149   VolumeMenuButton.prototype.createPopup = function createPopup() {
 150     var popup = new _popup2['default'](this.player_, {
 151       contentElType: 'div'
 152     });
 153
 154     var vb = new _volumeBar2['default'](this.player_, this.options_.volumeBar);
 155
 156     popup.addChild(vb);
 157
 158     this.menuContent = popup;
 159     this.volumeBar = vb;
 160
 161     this.attachVolumeBarEvents();
 162
 163     return popup;
 164   };
 165
 166   /**
 167    * This gets called when an `VolumeMenuButton` is "clicked". See
 168    * {@link ClickableComponent} for more detailed information on what a click can be.
 169    *
 170    * @param {EventTarget~Event} [event]
 171    *        The `keydown`, `tap`, or `click` event that caused this function to be
 172    *        called.
 173    *
 174    * @listens tap
 175    * @listens click
 176    */
 177
 178
 179   VolumeMenuButton.prototype.handleClick = function handleClick(event) {
 180     _muteToggle2['default'].prototype.handleClick.call(this);
 181     _PopupButton.prototype.handleClick.call(this);
 182   };
 183
 184   /**
 185    * Add events listeners to the created `VolumeBar`.
 186    */
 187
 188
 189   VolumeMenuButton.prototype.attachVolumeBarEvents = function attachVolumeBarEvents() {
 190     this.menuContent.on(['mousedown', 'touchdown'], Fn.bind(this, this.handleMouseDown));
 191   };
 192
 193   /**
 194    * Handle the `mousedown` and `touchdown` events on the `VolumeBar`
 195    *
 196    * @param {EventTarget~Event} [event]
 197    *        The `mousedown` or `touchdown` event that caused this to run.
 198    *
 199    * @listens mousedown
 200    * @listens touchdown
 201    */
 202
 203
 204   VolumeMenuButton.prototype.handleMouseDown = function handleMouseDown(event) {
 205     this.on(['mousemove', 'touchmove'], Fn.bind(this.volumeBar, this.volumeBar.handleMouseMove));
 206     this.on(this.el_.ownerDocument, ['mouseup', 'touchend'], this.handleMouseUp);
 207   };
 208
 209   /**
 210    * Handle the `mouseup` and `touchend` events on the `VolumeBar`
 211    *
 212    * @param {EventTarget~Event} [event]
 213    *        The `mouseup` or `touchend` event that caused this to run.
 214    *
 215    * @listens mouseup
 216    * @listens touchend
 217    */
 218
 219
 220   VolumeMenuButton.prototype.handleMouseUp = function handleMouseUp(event) {
 221     this.off(['mousemove', 'touchmove'], Fn.bind(this.volumeBar, this.volumeBar.handleMouseMove));
 222   };
 223
 224   return VolumeMenuButton;
 225 }(_popupButton2['default']);
 226
 227 /**
 228  * @borrows MuteToggle#update as VolumeMenuButton#volumeUpdate
 229  */
 230
 231
 232 VolumeMenuButton.prototype.volumeUpdate = _muteToggle2['default'].prototype.update;
 233
 234 /**
 235  * The text that should display over the `VolumeMenuButton`s controls. Added for localization.
 236  *
 237  * @type {string}
 238  * @private
 239  */
 240 VolumeMenuButton.prototype.controlText_ = 'Mute';
 241
 242 _component2['default'].registerComponent('VolumeMenuButton', VolumeMenuButton);
 243 exports['default'] = VolumeMenuButton;