Element: function fix for BS4/popper.js

Final updates, the first 0.2.x series release
IGreatlyDislikeJavascript · Aug 1, 2019 · 82bff6d · 82bff6d
1 parent 5a58462
commit 82bff6d
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 21 deletions.
diff --git a/README.md b/README.md
@@ -14,9 +14,9 @@ Tourist works with Bootstrap 3 and 4 (specify "framework" option), however the "
 
 ## Changelog from previous version:
 
-Changes IN v0.12 FROM v0.11:
-- fixes to the button text change code and better prep for localization (thanks to @DancingDad, @thenewbeat, @bardware)
-- fixed css for BS4 progress text to correctly use float-right (thanks to @macroscian, @thenewbeat)
+Changes IN v0.2.0:
+- Version update as major fix to bug preventing element: function(){...} feature under BS4/popper.js
+- published as release
 
 Full changelog can be found in the top of bootstrap-tourist.js
 

diff --git a/bootstrap-tourist.js b/bootstrap-tourist.js
@@ -1,6 +1,6 @@
 /* ========================================================================
  *
- * Bootstrap Tourist v0.12
+ * Bootstrap Tourist v0.2.0
  * Copyright FFS 2019
  * @ IGreatlyDislikeJavascript on Github
  *
@@ -25,7 +25,7 @@
  * ========================================================================
  * ENTIRELY BASED UPON:
  *
- * bootstrap-tour - v0.12.0
+ * bootstrap-tour - v0.2.0
  * http://bootstraptour.com
  * ========================================================================
  * Copyright 2012-2015 Ulrich Sossou
@@ -46,6 +46,10 @@
  *
  * Updated for CS by FFS 2018
  *
+ * Changes in v0.2.0
+ *  - Version update as major fix to bug preventing element: function(){...} feature under BS4/popper.js
+ *  - published as release
+ *
  * Changes IN v0.12 FROM v0.11:
  *	- note version labelling change in this changelog!
  *  - fixes to the button text change code and better prep for localization (thanks to @DancingDad, @thenewbeat, @bardware)
@@ -1813,25 +1817,39 @@
 									//boundary: "viewport", // added for BS4 popper testing. Do not enable, creates visible jump on orphan step scroll to bottom
 								};
 
-				if(this._options.framework == "bootstrap4" && isOrphan)
+				if(this._options.framework == "bootstrap4")
 				{
-					// BS4 uses popper.js, which doesn't have a method of fixing the popper to the center of the viewport without an element. However
-					// BS4 wrapper does some extra funky stuff that means we can't just replace the BS4 popper init code. Instead, fudge the popper
-					// using the offset feature, which params don't seem to be documented properly!
-					popOpts.offset = function(obj)
-									{
-										//console.log(obj);
+					if(isOrphan)
+					{
+						// BS4 uses popper.js, which doesn't have a method of fixing the popper to the center of the viewport without an element. However
+						// BS4 wrapper does some extra funky stuff that means we can't just replace the BS4 popper init code. Instead, fudge the popper
+						// using the offset feature, which params don't seem to be documented properly!
+						popOpts.offset = function(obj)
+										{
+											//console.log(obj);
 
-										var top = Math.max(0, ( ($(window).height() - obj.popper.height) / 2) );
-										var left = Math.max(0, ( ($(window).width() - obj.popper.width) / 2) );
+											var top = Math.max(0, ( ($(window).height() - obj.popper.height) / 2) );
+											var left = Math.max(0, ( ($(window).width() - obj.popper.width) / 2) );
 
-										obj.popper.position="fixed";
-										obj.popper.top = top;
-										obj.popper.bottom = top + obj.popper.height;
-										obj.popper.left = left;
-										obj.popper.right = top + obj.popper.width;
-										return obj;
-									}
+											obj.popper.position="fixed";
+											obj.popper.top = top;
+											obj.popper.bottom = top + obj.popper.height;
+											obj.popper.left = left;
+											obj.popper.right = top + obj.popper.width;
+											return obj;
+										}
+					}
+					else
+					{
+						// BS3 popover accepts jq object or string literal. BS4 popper.js of course doesn't, just to make life extra irritating.
+						popOpts.selector = "#" + step.element[0].id;
+					}
+				}
+
+				// BS4 / popper.js does not accept a jquery object as element. BS3 popover does!
+				if(this._options.framework == "bootstrap4" && isOrphan == false)
+				{
+					popOpts.selector = "#" + step.element[0].id;
 				}
 
 				$element.popover(popOpts);