Merge remote-tracking branch 'usablica/master'

Author: jayenashar

bower.json

@@ -1,6 +1,5 @@
 {
   "name": "intro.js",
-  "version": "1.0.0",
   "description": "A better way for new feature introduction and step-by-step users guide for your website and project.",
   "keywords": ["demo", "intro", "introduction"],
   "homepage": "http://usablica.github.com/intro.js/",

example/RTL/index.html

@@ -42,7 +42,7 @@ <h3 class="muted">Intro.js</h3>
       <hr>
 
       <div class="jumbotron">
-        <h1 data-step="1" data-intro="متن توضیح">RTL Style</span></h1>
+        <h1 data-step="1" data-intro="متن توضیح">RTL Style</h1>
         <p class="lead" data-step="4" data-intro="یک مرحله دیگه">This is the <abbr lang="en" title="Right To Left">RTL</abbr> version of IntroJs which includes an addition CSS file to perform the RTL style.</p>
         <a class="btn btn-large btn-success" href="javascript:void(0);" onclick="javascript:introJs().setOptions({ 'nextLabel': 'بعد', 'prevLabel': 'قبل', 'skipLabel': 'خروج', 'doneLabel': 'اتمام' }).start();">Show me how</a>
       </div>
@@ -59,7 +59,7 @@ <h4>Section Two</h4>
 
           <h4>Section Three</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
-          </div>
+        </div>
 
         <div class="span6" data-step="3" data-intro="امکانات بیشتر"  data-position='left'>
           <h4>Section Four</h4>

intro.js

@@ -195,11 +195,11 @@
       self._onKeyDown = function(e) {
         if (e.keyCode === 27 && self._options.exitOnEsc == true) {
           //escape key pressed, exit the intro
-          _exitIntro.call(self, targetElm);
-          //check if any callback is defined
+          //check if exit callback is defined
           if (self._introExitCallback != undefined) {
             self._introExitCallback.call(self);
           }
+          _exitIntro.call(self, targetElm);
         } else if(e.keyCode === 37) {
           //left arrow
           _previousStep.call(self);
@@ -214,6 +214,13 @@
             _previousStep.call(self);
           } else if (target && target.className.indexOf('introjs-skipbutton') > 0) {
             //user hit enter while focusing on skip button
+            if (self._introItems.length - 1 == self._currentStep && typeof (self._introCompleteCallback) === 'function') {
+                self._introCompleteCallback.call(self);
+            }
+            //check if any callback is defined
+            if (self._introExitCallback != undefined) {
+              self._introExitCallback.call(self);
+            }
             _exitIntro.call(self, targetElm);
           } else {
             //default behavior for responding to enter
@@ -473,8 +480,9 @@
           // Modify so that the bottom of the tooltip connects with the target
           arrowLayer.className = "introjs-arrow left-bottom";
           tooltipLayer.style.top = "-" + (tooltipOffset.height - targetOffset.height - 20) + "px"
+        } else {
+          arrowLayer.className = 'introjs-arrow left';
         }
-        arrowLayer.className = 'introjs-arrow left';
         break;
       case 'left':
         if (this._options.showStepNumbers == true) {
@@ -1107,12 +1115,12 @@
 
     overlayLayer.onclick = function() {
       if (self._options.exitOnOverlayClick == true) {
-        _exitIntro.call(self, targetElm);
 
         //check if any callback is defined
         if (self._introExitCallback != undefined) {
           self._introExitCallback.call(self);
         }
+        _exitIntro.call(self, targetElm);
       }
     };
 

introjs.css

@@ -65,6 +65,7 @@ tr.introjs-showElement > th {
 
 .introjs-tooltipReferenceLayer {
   position: absolute;
+  visibility: hidden;
   z-index: 10000000;
   background-color: transparent;
   -webkit-transition: all 0.3s ease-out;
@@ -86,6 +87,7 @@ tr.introjs-showElement > th {
 
 .introjs-helperNumberLayer {
   position: absolute;
+  visibility: visible;
   top: -16px;
   left: -16px;
   z-index: 9999999999 !important;
@@ -184,6 +186,7 @@ tr.introjs-showElement > th {
 
 .introjs-tooltip {
   position: absolute;
+  visibility: visible;
   padding: 10px;
   background-color: white;
   min-width: 200px;