introjs.diff

--- /tmp/subl stdin rRABqE.txt 
+++ /tmp/subl stdin PgKei7.txt 
@@ -31,9 +31,9 @@
 
     this._options = {
       /* Next button label in tooltip box */
-      nextLabel: 'Next →',
+      nextLabel: 'Next',
       /* Previous button label in tooltip box */
-      prevLabel: '← Back',
+      prevLabel: 'Back',
       /* Skip button label in tooltip box */
       skipLabel: 'Skip',
       /* Done button label in tooltip box */
@@ -47,7 +47,7 @@
       /* Close introduction when clicking on overlay layer? */
       exitOnOverlayClick: true,
       /* Show step numbers in introduction? */
-      showStepNumbers: true
+      showStepNumbers: false
     };
   }
 
@@ -299,27 +299,32 @@
     //custom css class for tooltip boxes
     var tooltipCssClass = this._options.tooltipClass;
 
+    // Customized by Matteo, added the class to the parent in order to have a border arround the arrow
     var currentTooltipPosition = this._introItems[this._currentStep].position;
     switch (currentTooltipPosition) {
       case 'top':
         tooltipLayer.style.left = '15px';
         tooltipLayer.style.top = '-' + (_getOffset(tooltipLayer).height + 10) + 'px';
-        arrowLayer.className = 'introjs-arrow bottom';
+        $('.introjs-arrow').parent('.introjs-tooltip').addClass('bottom');
+        // arrowLayer.className = 'introjs-arrow bottom'; 
         break;
       case 'right':
         tooltipLayer.style.left = (_getOffset(targetElement).width + 20) + 'px';
-        arrowLayer.className = 'introjs-arrow left';
+        $('.introjs-arrow').parent('.introjs-tooltip').addClass('left');
+        // arrowLayer.className = 'introjs-arrow left';
         break;
       case 'left':
         tooltipLayer.style.top = '15px';
         tooltipLayer.style.right = (_getOffset(targetElement).width + 20) + 'px';
-        arrowLayer.className = 'introjs-arrow right';
+        $('.introjs-arrow').parent('.introjs-tooltip').addClass('right');
+        // arrowLayer.className = 'introjs-arrow right';
         break;
       case 'bottom':
       // Bottom going to follow the default behavior
       default:
         tooltipLayer.style.bottom = '-' + (_getOffset(tooltipLayer).height + 10) + 'px';
-        arrowLayer.className = 'introjs-arrow top';
+        $('.introjs-arrow').parent('.introjs-tooltip').addClass('top');
+        // arrowLayer.className = 'introjs-arrow top';
         break;
     }
   }
@@ -368,7 +373,7 @@
           oldArrowLayer        = oldHelperLayer.querySelector('.introjs-arrow'),
           oldtooltipContainer  = oldHelperLayer.querySelector('.introjs-tooltip'),
           skipTooltipButton    = oldHelperLayer.querySelector('.introjs-skipbutton'),
-          prevTooltipButton    = oldHelperLayer.querySelector('.introjs-prevbutton'),
+          //prevTooltipButton    = oldHelperLayer.querySelector('.introjs-prevbutton'),
           nextTooltipButton    = oldHelperLayer.querySelector('.introjs-nextbutton');
 
       //hide the tooltip
@@ -447,20 +452,20 @@
       nextTooltipButton.innerHTML = this._options.nextLabel;
 
       //previous button
-      var prevTooltipButton = document.createElement('a');
-
-      prevTooltipButton.onclick = function() {
-        if(self._currentStep != 0) {
-          _previousStep.call(self);
-        }
-      };
-
-      prevTooltipButton.href = 'javascript:void(0);';
-      prevTooltipButton.innerHTML = this._options.prevLabel;
+      // var prevTooltipButton = document.createElement('a');
+
+      // prevTooltipButton.onclick = function() {
+      //   if(self._currentStep != 0) {
+      //     _previousStep.call(self);
+      //   }
+      // };
+
+      // prevTooltipButton.href = 'javascript:void(0);';
+      // prevTooltipButton.innerHTML = this._options.prevLabel;
 
       //skip button
       var skipTooltipButton = document.createElement('a');
-      skipTooltipButton.className = 'introjs-button introjs-skipbutton';
+      skipTooltipButton.className = 'introjs-skipbutton';
       skipTooltipButton.href = 'javascript:void(0);';
       skipTooltipButton.innerHTML = this._options.skipLabel;
 
@@ -481,7 +486,7 @@
 
       //in order to prevent displaying next/previous button always
       if (this._introItems.length > 1) {
-        tooltipButtonsLayer.appendChild(prevTooltipButton);
+        //tooltipButtonsLayer.appendChild(prevTooltipButton);
         tooltipButtonsLayer.appendChild(nextTooltipButton);
       }
 
@@ -490,15 +495,16 @@
     }
 
     if (this._currentStep == 0) {
-      prevTooltipButton.className = 'introjs-button introjs-prevbutton introjs-disabled';
+      //prevTooltipButton.className = 'introjs-button introjs-prevbutton introjs-disabled';
       nextTooltipButton.className = 'introjs-button introjs-nextbutton';
       skipTooltipButton.innerHTML = this._options.skipLabel;
     } else if (this._introItems.length - 1 == this._currentStep) {
       skipTooltipButton.innerHTML = this._options.doneLabel;
-      prevTooltipButton.className = 'introjs-button introjs-prevbutton';
-      nextTooltipButton.className = 'introjs-button introjs-nextbutton introjs-disabled';
+      skipTooltipButton.className = 'introjs-button introjs-nextbutton';
+      //prevTooltipButton.className = 'introjs-button introjs-prevbutton';
+      nextTooltipButton.className = 'introjs-button introjs-nextbutton introjs-disabled introjs-end';
     } else {
-      prevTooltipButton.className = 'introjs-button introjs-prevbutton';
+      //prevTooltipButton.className = 'introjs-button introjs-prevbutton';
       nextTooltipButton.className = 'introjs-button introjs-nextbutton';
       skipTooltipButton.innerHTML = this._options.skipLabel;
     }