[build] 0.3.0

close #5
toxic-johann · Feb 22, 2018 · 90e814b · 90e814b
1 parent c6d8b25
commit 90e814b
Show file tree

Hide file tree

Showing 5 changed files with 106 additions and 52 deletions.
diff --git a/lib/index.browser.js b/lib/index.browser.js
@@ -1,6 +1,6 @@
 
 /**
- * es-fullscreen v0.2.6
+ * es-fullscreen v0.3.0
  * (c) 2017-2018 toxic-johann
  * Released under MIT
  */
@@ -3510,6 +3510,7 @@ function _applyDecoratedDescriptor(target, property, decorators, descriptor, con
  return desc;
 }
 var fullscreenEnabled = native('fullscreenEnabled');
+var useStyleFirst = false;
 
 var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'), _dec3 = alias('exitFullscreen'), _dec4 = alias('addEventListener'), _dec5 = alias('removeEventListener'), _dec(_class = (_class2 = function () {
  function ESFullScreen() {
@@ -3518,6 +3519,8 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  this.isNativelySupport = defined$1(native('fullscreenElement')) && (!defined$1(fullscreenEnabled) || fullscreenEnabled === true);
  this._openKey = supportDocument ? native(document.body || document.documentElement, 'requestFullscreen', { keyOnly: true }) : '';
  this._exitKey = native('exitFullscreen', { keyOnly: true });
+ this._useStyleFirst = false;
+ this.hasUsedStyle = false;
  }
 
  createClass(ESFullScreen, [{
@@ -3535,20 +3538,22 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  this.exit();
  }
 
- if (this.isNativelySupport) {
- // $FlowFixMe: support computed key on HTMLElment here
- isFunction(element[this._openKey]) && element[this._openKey]();
- return true;
- }
+ if (!this.useStyleFirst) {
+ if (this.isNativelySupport) {
+ // $FlowFixMe: support computed key on HTMLElment here
+ isFunction(element[this._openKey]) && element[this._openKey]();
+ return true;
+ }
 
- // add wekitEnterFullscreen support as required in https://github.com/toxic-johann/es-fullscreen/issues/4
- /* istanbul ignore if */
- if (element instanceof HTMLVideoElement && element.webkitSupportsFullscreen &&
- // $FlowFixMe: support webkitEnterFullscreen on some werid safari
- isFunction(element.webkitEnterFullscreen)) {
- element.webkitEnterFullscreen();
- this._fullscreenElement = element;
- return true;
+ // add wekitEnterFullscreen support as required in https://github.com/toxic-johann/es-fullscreen/issues/4
+ /* istanbul ignore if */
+ if (element instanceof HTMLVideoElement && element.webkitSupportsFullscreen &&
+ // $FlowFixMe: support webkitEnterFullscreen on some werid safari
+ isFunction(element.webkitEnterFullscreen)) {
+ element.webkitEnterFullscreen();
+ this._fullscreenElement = element;
+ return true;
+ }
  }
 
  this._savedStyles = Object.keys(DESKTOP_FULLSCREEN_STYLE).reduce(function (styles, key) {
@@ -3569,14 +3574,15 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  document.documentElement.style.overflow = 'hidden';
  }
  this._fullscreenElement = element;
+ this.hasUsedStyle = true;
  dispatchEvent(element, 'fullscreenchange');
  return true;
  }
  }, {
  key: 'exit',
  value: function exit() {
  if (!this.isFullscreen) return false;
- if (this.isNativelySupport) {
+ if (this.isNativelySupport && !this.useStyleFirst && !this.hasUsedStyle) {
  // $FlowFixMe: support document computed key here
  document[this._exitKey]();
  return true;
@@ -3611,12 +3617,24 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  }, {
  key: '_handleEvent',
  value: function _handleEvent(element, behavior, name, fn) {
- var names = name === 'fullscreenchange' ? FULLSCREEN_CHANGE : FULLSCREEN_ERROR;
+ var names = name === 'fullscreenchange' ? FULLSCREEN_CHANGE : name === 'fullscreenerror' ? FULLSCREEN_ERROR : [name];
  names.forEach(function (name) {
  // $FlowFixMe: support computed attribute here
  element[behavior](name, fn);
  });
  }
+ }, {
+ key: 'useStyleFirst',
+ get: function get$$1() {
+ return useStyleFirst;
+ },
+ set: function set$$1(value) {
+ value = !!value;
+ if (value === useStyleFirst) return value;
+ useStyleFirst = value;
+ dispatchEvent(document, 'esfullscreenmethodchange');
+ return value;
+ }
  }, {
  key: 'fullscreenElement',
  get: function get$$1() {

diff --git a/lib/index.js b/lib/index.js
@@ -1,6 +1,6 @@
 
 /**
- * es-fullscreen v0.2.6
+ * es-fullscreen v0.3.0
  * (c) 2017-2018 toxic-johann
  * Released under MIT
  */
@@ -158,6 +158,7 @@ function _applyDecoratedDescriptor(target, property, decorators, descriptor, con
  return desc;
 }
 var fullscreenEnabled = native('fullscreenEnabled');
+var useStyleFirst = false;
 
 var ESFullScreen = (_dec = toxicDecorators.autobindClass(), _dec2 = toxicDecorators.alias('requestFullscreen'), _dec3 = toxicDecorators.alias('exitFullscreen'), _dec4 = toxicDecorators.alias('addEventListener'), _dec5 = toxicDecorators.alias('removeEventListener'), _dec(_class = (_class2 = function () {
  function ESFullScreen() {
@@ -167,6 +168,8 @@ var ESFullScreen = (_dec = toxicDecorators.autobindClass(), _dec2 = toxicDecorat
  this.isNativelySupport = toxicPredicateFunctions.defined(native('fullscreenElement')) && (!toxicPredicateFunctions.defined(fullscreenEnabled) || fullscreenEnabled === true);
  this._openKey = supportDocument ? native(document.body || document.documentElement, 'requestFullscreen', { keyOnly: true }) : '';
  this._exitKey = native('exitFullscreen', { keyOnly: true });
+ this._useStyleFirst = false;
+ this.hasUsedStyle = false;
  }
 
  _createClass(ESFullScreen, [{
@@ -190,20 +193,22 @@ var ESFullScreen = (_dec = toxicDecorators.autobindClass(), _dec2 = toxicDecorat
  this.exit();
  }
 
- if (this.isNativelySupport) {
- // $FlowFixMe: support computed key on HTMLElment here
- toxicPredicateFunctions.isFunction(element[this._openKey]) && element[this._openKey]();
- return true;
- }
+ if (!this.useStyleFirst) {
+ if (this.isNativelySupport) {
+ // $FlowFixMe: support computed key on HTMLElment here
+ toxicPredicateFunctions.isFunction(element[this._openKey]) && element[this._openKey]();
+ return true;
+ }
 
- // add wekitEnterFullscreen support as required in https://github.com/toxic-johann/es-fullscreen/issues/4
- /* istanbul ignore if */
- if (element instanceof HTMLVideoElement && element.webkitSupportsFullscreen &&
- // $FlowFixMe: support webkitEnterFullscreen on some werid safari
- toxicPredicateFunctions.isFunction(element.webkitEnterFullscreen)) {
- element.webkitEnterFullscreen();
- this._fullscreenElement = element;
- return true;
+ // add wekitEnterFullscreen support as required in https://github.com/toxic-johann/es-fullscreen/issues/4
+ /* istanbul ignore if */
+ if (element instanceof HTMLVideoElement && element.webkitSupportsFullscreen &&
+ // $FlowFixMe: support webkitEnterFullscreen on some werid safari
+ toxicPredicateFunctions.isFunction(element.webkitEnterFullscreen)) {
+ element.webkitEnterFullscreen();
+ this._fullscreenElement = element;
+ return true;
+ }
  }
 
  this._savedStyles = _Object$keys(DESKTOP_FULLSCREEN_STYLE).reduce(function (styles, key) {
@@ -224,14 +229,15 @@ var ESFullScreen = (_dec = toxicDecorators.autobindClass(), _dec2 = toxicDecorat
  document.documentElement.style.overflow = 'hidden';
  }
  this._fullscreenElement = element;
+ this.hasUsedStyle = true;
  dispatchEvent(element, 'fullscreenchange');
  return true;
  }
  }, {
  key: 'exit',
  value: function exit() {
  if (!this.isFullscreen) return false;
- if (this.isNativelySupport) {
+ if (this.isNativelySupport && !this.useStyleFirst && !this.hasUsedStyle) {
  // $FlowFixMe: support document computed key here
  document[this._exitKey]();
  return true;
@@ -268,16 +274,28 @@ var ESFullScreen = (_dec = toxicDecorators.autobindClass(), _dec2 = toxicDecorat
  value: function _handleEvent(element, behavior, name, fn) {
  /* istanbul ignore else */
  if (process.env.NODE_ENV !== 'production') {
- if (name !== 'fullscreenchange' && name !== 'fullscreenerror') throw new Error(this.constructor.name + ' only handle "fullscreenchange" and "fullscreenerror" event, but not ' + name + '. Pleas pass in an right event name.');
+ if (name !== 'fullscreenchange' && name !== 'fullscreenerror' && name !== 'esfullscreenmethodchange') throw new Error(this.constructor.name + ' only handle "fullscreenchange", "fullscreenerror" and "esfullscreenmethodchange" event, but not ' + name + '. Pleas pass in an right event name.');
  if (!toxicPredicateFunctions.isFunction(fn)) throw new Error('You must pass in an legal function, but not ' + (typeof fn === 'undefined' ? 'undefined' : _typeof(fn)) + '.');
  if (!toxicPredicateFunctions.isElement(element) && element !== document) throw new Error('You should passed in a legal element, but not ' + (typeof element === 'undefined' ? 'undefined' : _typeof(element)) + '.');
  }
- var names = name === 'fullscreenchange' ? FULLSCREEN_CHANGE : FULLSCREEN_ERROR;
+ var names = name === 'fullscreenchange' ? FULLSCREEN_CHANGE : name === 'fullscreenerror' ? FULLSCREEN_ERROR : [name];
  names.forEach(function (name) {
  // $FlowFixMe: support computed attribute here
  element[behavior](name, fn);
  });
  }
+ }, {
+ key: 'useStyleFirst',
+ get: function get() {
+ return useStyleFirst;
+ },
+ set: function set(value) {
+ value = !!value;
+ if (value === useStyleFirst) return value;
+ useStyleFirst = value;
+ dispatchEvent(document, 'esfullscreenmethodchange');
+ return value;
+ }
  }, {
  key: 'fullscreenElement',
  get: function get() {

diff --git a/lib/index.min.js b/lib/index.min.js
diff --git a/lib/index.mjs b/lib/index.mjs
@@ -1,6 +1,6 @@
 
 /**
- * es-fullscreen v0.2.6
+ * es-fullscreen v0.3.0
  * (c) 2017-2018 toxic-johann
  * Released under MIT
  */
@@ -154,6 +154,7 @@ function _applyDecoratedDescriptor(target, property, decorators, descriptor, con
  return desc;
 }
 var fullscreenEnabled = native('fullscreenEnabled');
+var useStyleFirst = false;
 
 var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'), _dec3 = alias('exitFullscreen'), _dec4 = alias('addEventListener'), _dec5 = alias('removeEventListener'), _dec(_class = (_class2 = function () {
  function ESFullScreen() {
@@ -163,6 +164,8 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  this.isNativelySupport = defined(native('fullscreenElement')) && (!defined(fullscreenEnabled) || fullscreenEnabled === true);
  this._openKey = supportDocument ? native(document.body || document.documentElement, 'requestFullscreen', { keyOnly: true }) : '';
  this._exitKey = native('exitFullscreen', { keyOnly: true });
+ this._useStyleFirst = false;
+ this.hasUsedStyle = false;
  }
 
  _createClass(ESFullScreen, [{
@@ -186,20 +189,22 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  this.exit();
  }
 
- if (this.isNativelySupport) {
- // $FlowFixMe: support computed key on HTMLElment here
- isFunction(element[this._openKey]) && element[this._openKey]();
- return true;
- }
+ if (!this.useStyleFirst) {
+ if (this.isNativelySupport) {
+ // $FlowFixMe: support computed key on HTMLElment here
+ isFunction(element[this._openKey]) && element[this._openKey]();
+ return true;
+ }
 
- // add wekitEnterFullscreen support as required in https://github.com/toxic-johann/es-fullscreen/issues/4
- /* istanbul ignore if */
- if (element instanceof HTMLVideoElement && element.webkitSupportsFullscreen &&
- // $FlowFixMe: support webkitEnterFullscreen on some werid safari
- isFunction(element.webkitEnterFullscreen)) {
- element.webkitEnterFullscreen();
- this._fullscreenElement = element;
- return true;
+ // add wekitEnterFullscreen support as required in https://github.com/toxic-johann/es-fullscreen/issues/4
+ /* istanbul ignore if */
+ if (element instanceof HTMLVideoElement && element.webkitSupportsFullscreen &&
+ // $FlowFixMe: support webkitEnterFullscreen on some werid safari
+ isFunction(element.webkitEnterFullscreen)) {
+ element.webkitEnterFullscreen();
+ this._fullscreenElement = element;
+ return true;
+ }
  }
 
  this._savedStyles = _Object$keys(DESKTOP_FULLSCREEN_STYLE).reduce(function (styles, key) {
@@ -220,14 +225,15 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  document.documentElement.style.overflow = 'hidden';
  }
  this._fullscreenElement = element;
+ this.hasUsedStyle = true;
  dispatchEvent(element, 'fullscreenchange');
  return true;
  }
  }, {
  key: 'exit',
  value: function exit() {
  if (!this.isFullscreen) return false;
- if (this.isNativelySupport) {
+ if (this.isNativelySupport && !this.useStyleFirst && !this.hasUsedStyle) {
  // $FlowFixMe: support document computed key here
  document[this._exitKey]();
  return true;
@@ -264,16 +270,28 @@ var ESFullScreen = (_dec = autobindClass(), _dec2 = alias('requestFullscreen'),
  value: function _handleEvent(element, behavior, name, fn) {
  /* istanbul ignore else */
  if (process.env.NODE_ENV !== 'production') {
- if (name !== 'fullscreenchange' && name !== 'fullscreenerror') throw new Error(this.constructor.name + ' only handle "fullscreenchange" and "fullscreenerror" event, but not ' + name + '. Pleas pass in an right event name.');
+ if (name !== 'fullscreenchange' && name !== 'fullscreenerror' && name !== 'esfullscreenmethodchange') throw new Error(this.constructor.name + ' only handle "fullscreenchange", "fullscreenerror" and "esfullscreenmethodchange" event, but not ' + name + '. Pleas pass in an right event name.');
  if (!isFunction(fn)) throw new Error('You must pass in an legal function, but not ' + (typeof fn === 'undefined' ? 'undefined' : _typeof(fn)) + '.');
  if (!isElement(element) && element !== document) throw new Error('You should passed in a legal element, but not ' + (typeof element === 'undefined' ? 'undefined' : _typeof(element)) + '.');
  }
- var names = name === 'fullscreenchange' ? FULLSCREEN_CHANGE : FULLSCREEN_ERROR;
+ var names = name === 'fullscreenchange' ? FULLSCREEN_CHANGE : name === 'fullscreenerror' ? FULLSCREEN_ERROR : [name];
  names.forEach(function (name) {
  // $FlowFixMe: support computed attribute here
  element[behavior](name, fn);
  });
  }
+ }, {
+ key: 'useStyleFirst',
+ get: function get() {
+ return useStyleFirst;
+ },
+ set: function set(value) {
+ value = !!value;
+ if (value === useStyleFirst) return value;
+ useStyleFirst = value;
+ dispatchEvent(document, 'esfullscreenmethodchange');
+ return value;
+ }
  }, {
  key: 'fullscreenElement',
  get: function get() {

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "es-fullscreen",
- "version": "0.2.6",
+ "version": "0.3.0",
  "description": "fullscreen library written in es6",
  "main": "lib/index.js",
  "module": "lib/index.mjs",