From 27bad25e1197f7481e09ee0dd901580ec805214d Mon Sep 17 00:00:00 2001
From: Chris Armstrong <chris@podtrackers.com>
Date: Tue, 8 Sep 2015 12:21:11 +1000
Subject: [PATCH 1/4] Added support for top-right-aligned and
 top-middle-aligned positions (and associated arrows).

---
 intro.js    | 19 +++++++++++++++++++
 introjs.css | 17 +++++++++++++++++
 2 files changed, 36 insertions(+)

diff --git a/intro.js b/intro.js
index 74a10ef7a..a9304418c 100644
--- a/intro.js
+++ b/intro.js
@@ -471,12 +471,31 @@
     windowSize    = _getWinSize();
     switch (currentTooltipPosition) {
       case 'top':
+      // top-left-aligned is the same as top
+      case 'top-left-aligned':
         arrowLayer.className = 'introjs-arrow bottom';
 
         var tooltipLayerStyleLeft = 15;
         _checkRight(targetOffset, tooltipLayerStyleLeft, tooltipOffset, windowSize, tooltipLayer);
         tooltipLayer.style.bottom = (targetOffset.height +  20) + 'px';
         break;
+      case 'top-right-aligned':
+        arrowLayer.className = 'introjs-arrow bottom-right';
+
+        var tooltipLayerStyleRight = 15;
+        _checkLeft(targetOffset, tooltipLayerStyleRight, tooltipOffset, tooltipLayer);
+        tooltipLayer.style.bottom = (targetOffset.height +  20) + 'px';
+        break;
+      case 'top-middle-aligned':
+        arrowLayer.className = 'introjs-arrow bottom-middle';
+
+        var tooltipLayerStyleLeftRight = targetOffset.width / 2 - tooltipOffset.width / 2;
+        if (_checkLeft(targetOffset, tooltipLayerStyleLeftRight, tooltipOffset, tooltipLayer)) {
+          tooltipLayer.style.right = null;
+          _checkRight(targetOffset, tooltipLayerStyleLeftRight, tooltipOffset, windowSize, tooltipLayer);
+        }
+        tooltipLayer.style.bottom = (targetOffset.height +  20) + 'px';
+        break;
       case 'right':
         tooltipLayer.style.left = (targetOffset.width + 20) + 'px';
         if (targetOffset.top + tooltipOffset.height > windowSize.height) {
diff --git a/introjs.css b/introjs.css
index a33457f36..aa835203b 100644
--- a/introjs.css
+++ b/introjs.css
@@ -167,6 +167,23 @@ tr.introjs-showElement > th {
   border-bottom-color:transparent;
   border-left-color:transparent;
 }
+.introjs-arrow.bottom-right {
+  bottom: -10px;
+  right: 10px;
+  border-top-color:white;
+  border-right-color:transparent;
+  border-bottom-color:transparent;
+  border-left-color:transparent;
+}
+.introjs-arrow.bottom-middle {
+  bottom: -10px;
+  left: 50%;
+  margin-left: -5px;
+  border-top-color:white;
+  border-right-color:transparent;
+  border-bottom-color:transparent;
+  border-left-color:transparent;
+}
 .introjs-arrow.left {
   left: -10px;
   top: 10px;

From 30c304e5c81a32144456cbec5eb3e112702d5c32 Mon Sep 17 00:00:00 2001
From: henry-whil <henry@whil.com>
Date: Thu, 5 Jan 2017 16:25:53 -0800
Subject: [PATCH 2/4] Fix bug

---
 intro.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/intro.js b/intro.js
index 48bc80331..9b7e27dfd 100644
--- a/intro.js
+++ b/intro.js
@@ -1073,7 +1073,9 @@
     } else {
       prevTooltipButton.className = 'introjs-button introjs-prevbutton';
       nextTooltipButton.className = 'introjs-button introjs-nextbutton';
-      skipTooltipButton.innerHTML = this._options.skipLabel;
+      if (skipTooltipButton) {
+        skipTooltipButton.innerHTML = this._options.skipLabel;
+      }
     }
 
     //Set focus on "next" button, so that hitting Enter always moves you onto the next step

From 5381ec7186a50b9485f44bcd42ff7a0f51f32f99 Mon Sep 17 00:00:00 2001
From: henry-whil <henry@whil.com>
Date: Thu, 5 Jan 2017 16:34:36 -0800
Subject: [PATCH 3/4] Update intro.js

---
 intro.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/intro.js b/intro.js
index 9b7e27dfd..1a6c62f3d 100644
--- a/intro.js
+++ b/intro.js
@@ -1058,8 +1058,10 @@
       prevTooltipButton.tabIndex = '-1';
       skipTooltipButton.innerHTML = this._options.skipLabel;
     } else if (this._introItems.length - 1 == this._currentStep || this._introItems.length == 1) {
-      skipTooltipButton.innerHTML = this._options.doneLabel;
-      skipTooltipButton.className = 'introjs-button introjs-donebutton';
+      if (skipTooltipButton) {
+        skipTooltipButton.innerHTML = this._options.doneLabel;
+        skipTooltipButton.className = 'introjs-button introjs-donebutton';
+      }
       prevTooltipButton.className = 'introjs-button introjs-prevbutton';
 
       if (this._options.hideNext == true) {

From 11ff1a747b4f0a14749292baf14960771c98128b Mon Sep 17 00:00:00 2001
From: henry-whil <henry@whil.com>
Date: Thu, 5 Jan 2017 16:39:11 -0800
Subject: [PATCH 4/4] Update intro.js

---
 intro.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/intro.js b/intro.js
index 1a6c62f3d..801d2d5df 100644
--- a/intro.js
+++ b/intro.js
@@ -889,7 +889,9 @@
         //reset button focus
         if (nextTooltipButton.tabIndex === -1) {
           //tabindex of -1 means we are at the end of the tour - focus on skip / done
-          skipTooltipButton.focus();
+          if (skipTooltipButton) {
+            skipTooltipButton.focus();
+          }
         } else {
           //still in the tour, focus on next
           nextTooltipButton.focus();