v4.11.1 release

Stefan Sträßer · Stefan Sträßer · commit d07bef028694 · 2020-11-23T10:06:23.000+01:00
jsPanel v4.11.1 release
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 ## <span style='color:#563D7C;'>CHANGELOG</span>
 
+### <span style='color:#563D7C;'>Version 4.11.1 *2020-11-23*</span>
+
++ **bugfix** in the `maximize()` method
+
 ### <span style='color:#563D7C;'>Version 4.11.0 *2020-11-20*</span>
 
 + **renamed** panel property `autocloseProgressbar` to `progressbar`. The old property name remains usable for compatibility.
diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 <img alt="NPM license"   src="https://img.shields.io/npm/l/jspanel4"> <img alt="npm version"   src="https://img.shields.io/npm/v/jspanel4?color=0677b8"> <img alt="npm downloads" src="https://img.shields.io/npm/dm/jspanel4?color=0677b8">
 
 
-## [jsPanel 4.11.0 released 2020-11-20](#)
+## [jsPanel 4.11.1 released 2020-11-23](#)
 
 > The v4.11.0-beta release includes updated methods `jsPanel.ajax()` and `jsPanel.fetch()` which also affect options `contentAjax` and `contentFetch`. These updates might break existing code. So please check the docs for this beta release on https://beta.jspanel.de/
 
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "jspanel4x",
-  "version": "4.11.0",
+  "version": "4.11.1",
   "authors": [
     "Stefan Straesser <info@jspanel.de> (http://jspanel.de/)"
   ],
diff --git a/dist/extensions/contextmenu/jspanel.contextmenu.js b/dist/extensions/contextmenu/jspanel.contextmenu.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/datepicker/jspanel.datepicker.js b/dist/extensions/datepicker/jspanel.datepicker.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/datepicker/theme/default.css b/dist/extensions/datepicker/theme/default.css
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/dock/jspanel.dock.js b/dist/extensions/dock/jspanel.dock.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/hint/jspanel.hint.js b/dist/extensions/hint/jspanel.hint.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/layout/jspanel.layout.js b/dist/extensions/layout/jspanel.layout.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/modal/jspanel.modal.js b/dist/extensions/modal/jspanel.modal.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/extensions/tooltip/jspanel.tooltip.js b/dist/extensions/tooltip/jspanel.tooltip.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/jspanel.css b/dist/jspanel.css
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/dist/jspanel.js b/dist/jspanel.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
@@ -24,8 +24,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 
 // eslint-disable-next-line no-redeclare
 var jsPanel = {
-  version: '4.11.0',
-  date: '2020-11-20 12:05',
+  version: '4.11.1',
+  date: '2020-11-23 09:37',
   ajaxAlwaysCallbacks: [],
   autopositionSpacing: 4,
   closeOnEscape: function () {
@@ -1307,6 +1307,7 @@ var jsPanel = {
 
 
     if (_position.modify) {
+      // eslint-disable-next-line no-unused-vars
       pos = this.applyPositionModify(panel, pos, _position); //console.log('pos after applying modify():', pos);
     }
 
@@ -2693,8 +2694,7 @@ var jsPanel = {
 
     self.maximize = function (cb, donotfront) {
       // Note: do not disable maximize method for already maximized panels -> onContainerResize wouldn't work
-      self.statusBefore = self.status; // ensure smallify/unsmallify transition is turned off when resizing begins
-      //self.style.transition = 'unset';
+      self.statusBefore = self.status;
 
       if (options.onbeforemaximize && options.onbeforemaximize.length > 0 && !jsPanel.processCallbacks(self, options.onbeforemaximize, 'some', self.statusBefore)) {
         return self;
@@ -2706,15 +2706,17 @@ var jsPanel = {
 
       if (parent === document.body) {
         // maximize within window
+
+        /*
+           When clientHeight is used on the root element (the <html> element), (or on <body> if the document is in quirks mode),
+           the viewport's height (excluding any scrollbar) is returned. This is a special case of clientHeight.
+           See https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight
+           document.documentElement in the code below returns the <html> element
+        */
         self.style.width = document.documentElement.clientWidth - margins[1] - margins[3] + 'px';
         self.style.height = document.documentElement.clientHeight - margins[0] - margins[2] + 'px';
         self.style.left = margins[3] + 'px';
         self.style.top = margins[0] + 'px';
-
-        if (!options.position.fixed) {
-          self.style.left = window.pageXOffset + margins[3] + 'px';
-          self.style.top = window.pageYOffset + margins[0] + 'px';
-        }
       } else {
         // maximize within parentElement
         self.style.width = parent.clientWidth - margins[1] - margins[3] + 'px';
diff --git a/dist/jspanel.min.js b/dist/jspanel.min.js
diff --git a/es6module/extensions/contextmenu/jspanel.contextmenu.js b/es6module/extensions/contextmenu/jspanel.contextmenu.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/datepicker/jspanel.datepicker.js b/es6module/extensions/datepicker/jspanel.datepicker.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/datepicker/theme/default.css b/es6module/extensions/datepicker/theme/default.css
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/dock/jspanel.dock.js b/es6module/extensions/dock/jspanel.dock.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/hint/jspanel.hint.js b/es6module/extensions/hint/jspanel.hint.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/layout/jspanel.layout.js b/es6module/extensions/layout/jspanel.layout.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/modal/jspanel.modal.js b/es6module/extensions/modal/jspanel.modal.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/extensions/tooltip/jspanel.tooltip.js b/es6module/extensions/tooltip/jspanel.tooltip.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/jspanel.css b/es6module/jspanel.css
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
diff --git a/es6module/jspanel.js b/es6module/jspanel.js
@@ -1,6 +1,6 @@
 /**
  * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
- * @version v4.11.0
+ * @version v4.11.1
  * @homepage https://jspanel.de/
  * @license MIT
  * @author Stefan Sträßer - info@jspanel.de
@@ -9,8 +9,8 @@
 
 export // eslint-disable-next-line no-redeclare
 let jsPanel = {
-    version: '4.11.0',
-    date: '2020-11-20 12:05',
+    version: '4.11.1',
+    date: '2020-11-23 09:37',
     ajaxAlwaysCallbacks: [],
     autopositionSpacing: 4,
     closeOnEscape: (() => {
@@ -1294,6 +1294,7 @@ let jsPanel = {
         // apply position.modify
         // must be function returning an object with keys left/top, each with valid css length value
         if (position.modify) {
+            // eslint-disable-next-line no-unused-vars
             pos = this.applyPositionModify(panel, pos, position);
             //console.log('pos after applying modify():', pos);
         }
@@ -2621,9 +2622,6 @@ let jsPanel = {
         self.maximize = (cb, donotfront) => {
             // Note: do not disable maximize method for already maximized panels -> onContainerResize wouldn't work
             self.statusBefore = self.status;
-            // ensure smallify/unsmallify transition is turned off when resizing begins
-            //self.style.transition = 'unset';
-
             if (
                 options.onbeforemaximize &&
                 options.onbeforemaximize.length > 0 &&
@@ -2639,15 +2637,16 @@ let jsPanel = {
 
             if (parent === document.body) {
                 // maximize within window
+                /*
+                   When clientHeight is used on the root element (the <html> element), (or on <body> if the document is in quirks mode),
+                   the viewport's height (excluding any scrollbar) is returned. This is a special case of clientHeight.
+                   See https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight
+                   document.documentElement in the code below returns the <html> element
+                */
                 self.style.width = document.documentElement.clientWidth - margins[1] - margins[3] + 'px';
                 self.style.height = document.documentElement.clientHeight - margins[0] - margins[2] + 'px';
                 self.style.left = margins[3] + 'px';
                 self.style.top = margins[0] + 'px';
-
-                if (!options.position.fixed) {
-                    self.style.left = window.pageXOffset + margins[3] + 'px';
-                    self.style.top = window.pageYOffset + margins[0] + 'px';
-                }
             } else {
                 // maximize within parentElement
                 self.style.width = parent.clientWidth - margins[1] - margins[3] + 'px';
diff --git a/es6module/jspanel.min.js b/es6module/jspanel.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "jspanel4",
-    "version": "4.11.0",
+    "version": "4.11.1",
     "description": "A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu",
     "keywords": [
         "jsPanel",
@@ -39,10 +39,10 @@
         "email": "info@jspanel.de"
     },
     "devDependencies": {
-        "@babel/cli": "^7.12.1",
-        "@babel/core": "^7.12.3",
-        "@babel/preset-env": "^7.12.1",
-        "eslint": "^7.13.0",
+        "@babel/cli": "^7.12.7",
+        "@babel/core": "^7.12.7",
+        "@babel/preset-env": "^7.12.7",
+        "eslint": "^7.14.0",
         "eslint-config-standard": "^16.0.2",
         "eslint-plugin-import": "^2.22.1",
         "eslint-plugin-node": "^11.1.0",
@@ -58,7 +58,7 @@
         "gulp-rename": "^2.0.0",
         "gulp-sass": "^4.1.0",
         "node-sass": "4.14.1",
-        "npm": "^6.14.8",
+        "npm": "^6.14.9",
         "prettier": "^2.2.0"
     },
     "prettier": {
diff --git a/source/jspanel.js b/source/jspanel.js
@@ -1,7 +1,7 @@
 // eslint-disable-next-line no-redeclare
 let jsPanel = {
-    version: '4.11.0',
-    date: '2020-11-20 12:05',
+    version: '4.11.1',
+    date: '2020-11-23 09:37',
     ajaxAlwaysCallbacks: [],
     autopositionSpacing: 4,
     closeOnEscape: (() => {
@@ -1285,6 +1285,7 @@ let jsPanel = {
         // apply position.modify
         // must be function returning an object with keys left/top, each with valid css length value
         if (position.modify) {
+            // eslint-disable-next-line no-unused-vars
             pos = this.applyPositionModify(panel, pos, position);
             //console.log('pos after applying modify():', pos);
         }
@@ -2612,9 +2613,6 @@ let jsPanel = {
         self.maximize = (cb, donotfront) => {
             // Note: do not disable maximize method for already maximized panels -> onContainerResize wouldn't work
             self.statusBefore = self.status;
-            // ensure smallify/unsmallify transition is turned off when resizing begins
-            //self.style.transition = 'unset';
-
             if (
                 options.onbeforemaximize &&
                 options.onbeforemaximize.length > 0 &&
@@ -2630,15 +2628,16 @@ let jsPanel = {
 
             if (parent === document.body) {
                 // maximize within window
+                /*
+                   When clientHeight is used on the root element (the <html> element), (or on <body> if the document is in quirks mode),
+                   the viewport's height (excluding any scrollbar) is returned. This is a special case of clientHeight.
+                   See https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight
+                   document.documentElement in the code below returns the <html> element
+                */
                 self.style.width = document.documentElement.clientWidth - margins[1] - margins[3] + 'px';
                 self.style.height = document.documentElement.clientHeight - margins[0] - margins[2] + 'px';
                 self.style.left = margins[3] + 'px';
                 self.style.top = margins[0] + 'px';
-
-                if (!options.position.fixed) {
-                    self.style.left = window.pageXOffset + margins[3] + 'px';
-                    self.style.top = window.pageYOffset + margins[0] + 'px';
-                }
             } else {
                 // maximize within parentElement
                 self.style.width = parent.clientWidth - margins[1] - margins[3] + 'px';

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "jspanel4x",`
`3`		`- "version": "4.11.0",`
	`3`	`+ "version": "4.11.1",`
`4`	`4`	`"authors": [`
`5`	`5`	`"Stefan Straesser <info@jspanel.de> (http://jspanel.de/)"`
`6`	`6`	`],`