From bb9fa04f35c40b4c064ee8cc9f06e7340aaef081 Mon Sep 17 00:00:00 2001 From: tomByrer Date: Wed, 19 Jun 2013 17:19:28 -0600 Subject: [PATCH] Added 0.4.0, kept 0.2.1 Package.json: + "keywords": "tutorial", MIT Licence (stated in intro.js) intro.min.js: + comment line for file name, version, (c), licence --- ajax/libs/intro.js/0.4.0/intro.js | 758 +++++++++++++++++++++++ ajax/libs/intro.js/0.4.0/intro.min.js | 20 + ajax/libs/intro.js/0.4.0/introjs.css | 216 +++++++ ajax/libs/intro.js/0.4.0/introjs.min.css | 1 + ajax/libs/intro.js/package.json | 5 +- 5 files changed, 998 insertions(+), 2 deletions(-) create mode 100644 ajax/libs/intro.js/0.4.0/intro.js create mode 100644 ajax/libs/intro.js/0.4.0/intro.min.js create mode 100644 ajax/libs/intro.js/0.4.0/introjs.css create mode 100644 ajax/libs/intro.js/0.4.0/introjs.min.css diff --git a/ajax/libs/intro.js/0.4.0/intro.js b/ajax/libs/intro.js/0.4.0/intro.js new file mode 100644 index 000000000..9430305e3 --- /dev/null +++ b/ajax/libs/intro.js/0.4.0/intro.js @@ -0,0 +1,758 @@ +/** + * Intro.js v0.4.0 + * https://github.com/usablica/intro.js + * MIT licensed + * + * Copyright (C) 2013 usabli.ca - A weekend project by Afshin Mehrabani (@afshinmeh) + */ + +(function (root, factory) { + if (typeof exports === 'object') { + // CommonJS + factory(exports); + } else if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports'], factory); + } else { + // Browser globals + factory(root); + } +} (this, function (exports) { + //Default config/variables + var VERSION = '0.4.0'; + + /** + * IntroJs main class + * + * @class IntroJs + */ + function IntroJs(obj) { + this._targetElement = obj; + + this._options = { + nextLabel: 'Next →', + prevLabel: '← Back', + skipLabel: 'Skip', + doneLabel: 'Done', + tooltipPosition: 'bottom', + exitOnEsc: true, + exitOnOverlayClick: true, + showStepNumbers: true + }; + } + + /** + * Initiate a new introduction/guide from an element in the page + * + * @api private + * @method _introForElement + * @param {Object} targetElm + * @returns {Boolean} Success or not? + */ + function _introForElement(targetElm) { + var introItems = [], + self = this; + + if (this._options.steps) { + //use steps passed programmatically + var allIntroSteps = []; + + for (var i = 0, stepsLength = this._options.steps.length; i < stepsLength; i++) { + var currentItem = this._options.steps[i]; + //set the step + currentItem.step = i + 1; + //grab the element with given selector from the page + currentItem.element = document.querySelector(currentItem.element); + introItems.push(currentItem); + } + + } else { + //use steps from data-* annotations + + var allIntroSteps = targetElm.querySelectorAll('*[data-intro]'); + //if there's no element to intro + if (allIntroSteps.length < 1) { + return false; + } + + for (var i = 0, elmsLength = allIntroSteps.length; i < elmsLength; i++) { + var currentElement = allIntroSteps[i]; + introItems.push({ + element: currentElement, + intro: currentElement.getAttribute('data-intro'), + step: parseInt(currentElement.getAttribute('data-step'), 10), + position: currentElement.getAttribute('data-position') || this._options.tooltipPosition + }); + } + } + + //Ok, sort all items with given steps + introItems.sort(function (a, b) { + return a.step - b.step; + }); + + //set it to the introJs object + self._introItems = introItems; + + //add overlay layer to the page + if(_addOverlayLayer.call(self, targetElm)) { + //then, start the show + _nextStep.call(self); + + var skipButton = targetElm.querySelector('.introjs-skipbutton'), + nextStepButton = targetElm.querySelector('.introjs-nextbutton'); + + 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 + if (self._introExitCallback != undefined) { + self._introExitCallback.call(self); + } + } else if(e.keyCode === 37) { + //left arrow + _previousStep.call(self); + } else if (e.keyCode === 39 || e.keyCode === 13) { + //right arrow or enter + _nextStep.call(self); + //prevent default behaviour on hitting Enter, to prevent steps being skipped in some browsers + if(e.preventDefault) { + e.preventDefault(); + } else { + e.returnValue = false; + } + } + }; + + self._onResize = function(e) { + _setHelperLayerPosition.call(self, document.querySelector('.introjs-helperLayer')); + }; + + if (window.addEventListener) { + window.addEventListener('keydown', self._onKeyDown, true); + //for window resize + window.addEventListener("resize", self._onResize, true); + } else if (document.attachEvent) { //IE + document.attachEvent('onkeydown', self._onKeyDown); + //for window resize + document.attachEvent("onresize", self._onResize); + } + } + return false; + } + + /** + * Go to specific step of introduction + * + * @api private + * @method _goToStep + */ + function _goToStep(step) { + //because steps starts with zero + this._currentStep = step - 2; + if(typeof (this._introItems) !== 'undefined') { + _nextStep.call(this); + } + } + + /** + * Go to next step on intro + * + * @api private + * @method _nextStep + */ + function _nextStep() { + if (typeof (this._introBeforeChangeCallback) !== 'undefined') { + this._introBeforeChangeCallback.call(this, this._targetElement); + } + + if (typeof (this._currentStep) === 'undefined') { + this._currentStep = 0; + } else { + ++this._currentStep; + } + + if((this._introItems.length) <= this._currentStep) { + //end of the intro + //check if any callback is defined + if (typeof (this._introCompleteCallback) === 'function') { + this._introCompleteCallback.call(this); + } + _exitIntro.call(this, this._targetElement); + return; + } + + _showElement.call(this, this._introItems[this._currentStep]); + } + + /** + * Go to previous step on intro + * + * @api private + * @method _nextStep + */ + function _previousStep() { + if (this._currentStep === 0) { + return false; + } + + if (typeof (this._introBeforeChangeCallback) !== 'undefined') { + this._introBeforeChangeCallback.call(this, this._targetElement); + } + + _showElement.call(this, this._introItems[--this._currentStep]); + } + + /** + * Exit from intro + * + * @api private + * @method _exitIntro + * @param {Object} targetElement + */ + function _exitIntro(targetElement) { + //remove overlay layer from the page + var overlayLayer = targetElement.querySelector('.introjs-overlay'); + //for fade-out animation + overlayLayer.style.opacity = 0; + setTimeout(function () { + if (overlayLayer.parentNode) { + overlayLayer.parentNode.removeChild(overlayLayer); + } + }, 500); + //remove all helper layers + var helperLayer = targetElement.querySelector('.introjs-helperLayer'); + if (helperLayer) { + helperLayer.parentNode.removeChild(helperLayer); + } + //remove `introjs-showElement` class from the element + var showElement = document.querySelector('.introjs-showElement'); + if (showElement) { + showElement.className = showElement.className.replace(/introjs-[a-zA-Z]+/g, '').replace(/^\s+|\s+$/g, ''); // This is a manual trim. + } + + //remove `introjs-fixParent` class from the elements + var fixParents = document.querySelectorAll('.introjs-fixParent'); + if (fixParents && fixParents.length > 0) { + for (var i = fixParents.length - 1; i >= 0; i--) { + fixParents[i].className = fixParents[i].className.replace(/introjs-fixParent/g, '').replace(/^\s+|\s+$/g, ''); + }; + } + //clean listeners + if (window.removeEventListener) { + window.removeEventListener('keydown', this._onKeyDown, true); + } else if (document.detachEvent) { //IE + document.detachEvent('onkeydown', this._onKeyDown); + } + //set the step to zero + this._currentStep = undefined; + } + + /** + * Render tooltip box in the page + * + * @api private + * @method _placeTooltip + * @param {Object} targetElement + * @param {Object} tooltipLayer + * @param {Object} arrowLayer + */ + function _placeTooltip(targetElement, tooltipLayer, arrowLayer) { + //reset the old style + tooltipLayer.style.top = null; + tooltipLayer.style.right = null; + tooltipLayer.style.bottom = null; + tooltipLayer.style.left = null; + + //prevent error when `this._currentStep` is undefined + if(!this._introItems[this._currentStep]) return; + + 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'; + break; + case 'right': + tooltipLayer.style.left = (_getOffset(targetElement).width + 20) + 'px'; + 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'; + break; + case 'bottom': + // Bottom going to follow the default behavior + default: + tooltipLayer.style.bottom = '-' + (_getOffset(tooltipLayer).height + 10) + 'px'; + arrowLayer.className = 'introjs-arrow top'; + break; + } + } + + /** + * Update the position of the helper layer on the screen + * + * @api private + * @method _setHelperLayerPosition + * @param {Object} helperLayer + */ + function _setHelperLayerPosition(helperLayer) { + if(helperLayer) { + //prevent error when `this._currentStep` in undefined + if(!this._introItems[this._currentStep]) return; + + var elementPosition = _getOffset(this._introItems[this._currentStep].element); + //set new position to helper layer + helperLayer.setAttribute('style', 'width: ' + (elementPosition.width + 10) + 'px; ' + + 'height:' + (elementPosition.height + 10) + 'px; ' + + 'top:' + (elementPosition.top - 5) + 'px;' + + 'left: ' + (elementPosition.left - 5) + 'px;'); + } + } + + /** + * Show an element on the page + * + * @api private + * @method _showElement + * @param {Object} targetElement + */ + function _showElement(targetElement) { + + if (typeof (this._introChangeCallback) !== 'undefined') { + this._introChangeCallback.call(this, targetElement.element); + } + + var self = this, + oldHelperLayer = document.querySelector('.introjs-helperLayer'), + elementPosition = _getOffset(targetElement.element); + + if(oldHelperLayer != null) { + var oldHelperNumberLayer = oldHelperLayer.querySelector('.introjs-helperNumberLayer'), + oldtooltipLayer = oldHelperLayer.querySelector('.introjs-tooltiptext'), + oldArrowLayer = oldHelperLayer.querySelector('.introjs-arrow'), + oldtooltipContainer = oldHelperLayer.querySelector('.introjs-tooltip'), + skipTooltipButton = oldHelperLayer.querySelector('.introjs-skipbutton'), + prevTooltipButton = oldHelperLayer.querySelector('.introjs-prevbutton'), + nextTooltipButton = oldHelperLayer.querySelector('.introjs-nextbutton'); + + //hide the tooltip + oldtooltipContainer.style.opacity = 0; + + //set new position to helper layer + _setHelperLayerPosition.call(self, oldHelperLayer); + + //remove `introjs-fixParent` class from the elements + var fixParents = document.querySelectorAll('.introjs-fixParent'); + if (fixParents && fixParents.length > 0) { + for (var i = fixParents.length - 1; i >= 0; i--) { + fixParents[i].className = fixParents[i].className.replace(/introjs-fixParent/g, '').replace(/^\s+|\s+$/g, ''); + }; + } + + //remove old classes + var oldShowElement = document.querySelector('.introjs-showElement'); + oldShowElement.className = oldShowElement.className.replace(/introjs-[a-zA-Z]+/g, '').replace(/^\s+|\s+$/g, ''); + //we should wait until the CSS3 transition is competed (it's 0.3 sec) to prevent incorrect `height` and `width` calculation + if (self._lastShowElementTimer) { + clearTimeout(self._lastShowElementTimer); + } + self._lastShowElementTimer = setTimeout(function() { + //set current step to the label + if(oldHelperNumberLayer != null) { + oldHelperNumberLayer.innerHTML = targetElement.step; + } + //set current tooltip text + oldtooltipLayer.innerHTML = targetElement.intro; + //set the tooltip position + _placeTooltip.call(self, targetElement.element, oldtooltipContainer, oldArrowLayer); + //show the tooltip + oldtooltipContainer.style.opacity = 1; + }, 350); + + } else { + var helperLayer = document.createElement('div'), + arrowLayer = document.createElement('div'), + tooltipLayer = document.createElement('div'); + + helperLayer.className = 'introjs-helperLayer'; + + //set new position to helper layer + _setHelperLayerPosition.call(self, helperLayer); + + //add helper layer to target element + this._targetElement.appendChild(helperLayer); + + arrowLayer.className = 'introjs-arrow'; + tooltipLayer.className = 'introjs-tooltip'; + + + tooltipLayer.innerHTML = '
' + + targetElement.intro + + '
'; + + //add helper layer number + if (this._options.showStepNumbers) { + var helperNumberLayer = document.createElement('span'); + helperNumberLayer.className = 'introjs-helperNumberLayer'; + helperNumberLayer.innerHTML = targetElement.step; + helperLayer.appendChild(helperNumberLayer); + } + tooltipLayer.appendChild(arrowLayer); + helperLayer.appendChild(tooltipLayer); + + //next button + var nextTooltipButton = document.createElement('a'); + + nextTooltipButton.onclick = function() { + if(self._introItems.length - 1 != self._currentStep) { + _nextStep.call(self); + } + }; + + nextTooltipButton.href = 'javascript:void(0);'; + 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; + + //skip button + var skipTooltipButton = document.createElement('a'); + skipTooltipButton.className = 'introjs-button introjs-skipbutton'; + skipTooltipButton.href = 'javascript:void(0);'; + skipTooltipButton.innerHTML = this._options.skipLabel; + + skipTooltipButton.onclick = function() { + if (self._introItems.length - 1 == self._currentStep && typeof (self._introCompleteCallback) === 'function') { + self._introCompleteCallback.call(self); + } + + if (self._introItems.length - 1 != self._currentStep && typeof (self._introExitCallback) === 'function') { + self._introExitCallback.call(self); + } + + _exitIntro.call(self, self._targetElement); + }; + + var tooltipButtonsLayer = tooltipLayer.querySelector('.introjs-tooltipbuttons'); + tooltipButtonsLayer.appendChild(skipTooltipButton); + tooltipButtonsLayer.appendChild(prevTooltipButton); + tooltipButtonsLayer.appendChild(nextTooltipButton); + + //set proper position + _placeTooltip.call(self, targetElement.element, tooltipLayer, arrowLayer); + } + + if (this._currentStep == 0) { + 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'; + } else { + prevTooltipButton.className = 'introjs-button introjs-prevbutton'; + nextTooltipButton.className = 'introjs-button introjs-nextbutton'; + skipTooltipButton.innerHTML = this._options.skipLabel; + } + + //Set focus on "next" button, so that hitting Enter always moves you onto the next step + nextTooltipButton.focus(); + + //add target element position style + targetElement.element.className += ' introjs-showElement'; + + var currentElementPosition = _getPropValue(targetElement.element, 'position'); + if (currentElementPosition !== 'absolute' && + currentElementPosition !== 'relative') { + //change to new intro item + targetElement.element.className += ' introjs-relativePosition'; + } + + var parentElm = targetElement.element.parentNode; + while(parentElm != null) { + if(parentElm.tagName.toLowerCase() === 'body') break; + + var zIndex = _getPropValue(parentElm, 'z-index'); + if(/[0-9]+/.test(zIndex)) { + parentElm.className += ' introjs-fixParent'; + } + parentElm = parentElm.parentNode; + } + + if (!_elementInViewport(targetElement.element)) { + var rect = targetElement.element.getBoundingClientRect(), + top = rect.bottom - (rect.bottom - rect.top), + bottom = rect.bottom - _getWinSize().height; + + // Scroll up + if (top < 0) { + window.scrollBy(0, top - 30); // 30px padding from edge to look nice + + // Scroll down + } else { + window.scrollBy(0, bottom + 100); // 70px + 30px padding from edge to look nice + } + } + } + + /** + * Get an element CSS property on the page + * Thanks to JavaScript Kit: http://www.javascriptkit.com/dhtmltutors/dhtmlcascade4.shtml + * + * @api private + * @method _getPropValue + * @param {Object} element + * @param {String} propName + * @returns Element's property value + */ + function _getPropValue (element, propName) { + var propValue = ''; + if (element.currentStyle) { //IE + propValue = element.currentStyle[propName]; + } else if (document.defaultView && document.defaultView.getComputedStyle) { //Others + propValue = document.defaultView.getComputedStyle(element, null).getPropertyValue(propName); + } + + //Prevent exception in IE + if(propValue.toLowerCase) { + return propValue.toLowerCase(); + } else { + return propValue; + } + } + + /** + * Provides a cross-browser way to get the screen dimensions + * via: http://stackoverflow.com/questions/5864467/internet-explorer-innerheight + * + * @api private + * @method _getWinSize + * @returns {Object} width and height attributes + */ + function _getWinSize() { + if (window.innerWidth != undefined) { + return { width: window.innerWidth, height: window.innerHeight }; + } else { + var D = document.documentElement; + return { width: D.clientWidth, height: D.clientHeight }; + } + } + + /** + * Add overlay layer to the page + * http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport + * + * @api private + * @method _elementInViewport + * @param {Object} el + */ + function _elementInViewport(el) { + var rect = el.getBoundingClientRect(); + + return ( + rect.top >= 0 && + rect.left >= 0 && + (rect.bottom+80) <= window.innerHeight && // add 80 to get the text right + rect.right <= window.innerWidth + ); + } + + /** + * Add overlay layer to the page + * + * @api private + * @method _addOverlayLayer + * @param {Object} targetElm + */ + function _addOverlayLayer(targetElm) { + var overlayLayer = document.createElement('div'), + styleText = '', + self = this; + + //set css class name + overlayLayer.className = 'introjs-overlay'; + + //check if the target element is body, we should calculate the size of overlay layer in a better way + if (targetElm.tagName.toLowerCase() === 'body') { + styleText += 'top: 0;bottom: 0; left: 0;right: 0;position: fixed;'; + overlayLayer.setAttribute('style', styleText); + } else { + //set overlay layer position + var elementPosition = _getOffset(targetElm); + if(elementPosition) { + styleText += 'width: ' + elementPosition.width + 'px; height:' + elementPosition.height + 'px; top:' + elementPosition.top + 'px;left: ' + elementPosition.left + 'px;'; + overlayLayer.setAttribute('style', styleText); + } + } + + targetElm.appendChild(overlayLayer); + + 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); + } + }; + + setTimeout(function() { + styleText += 'opacity: .8;'; + overlayLayer.setAttribute('style', styleText); + }, 10); + return true; + } + + /** + * Get an element position on the page + * Thanks to `meouw`: http://stackoverflow.com/a/442474/375966 + * + * @api private + * @method _getOffset + * @param {Object} element + * @returns Element's position info + */ + function _getOffset(element) { + var elementPosition = {}; + + //set width + elementPosition.width = element.offsetWidth; + + //set height + elementPosition.height = element.offsetHeight; + + //calculate element top and left + var _x = 0; + var _y = 0; + while(element && !isNaN(element.offsetLeft) && !isNaN(element.offsetTop)) { + _x += element.offsetLeft; + _y += element.offsetTop; + element = element.offsetParent; + } + //set top + elementPosition.top = _y; + //set left + elementPosition.left = _x; + + return elementPosition; + } + + /** + * Overwrites obj1's values with obj2's and adds obj2's if non existent in obj1 + * via: http://stackoverflow.com/questions/171251/how-can-i-merge-properties-of-two-javascript-objects-dynamically + * + * @param obj1 + * @param obj2 + * @returns obj3 a new object based on obj1 and obj2 + */ + function _mergeOptions(obj1,obj2) { + var obj3 = {}; + for (var attrname in obj1) { obj3[attrname] = obj1[attrname]; } + for (var attrname in obj2) { obj3[attrname] = obj2[attrname]; } + return obj3; + } + + var introJs = function (targetElm) { + if (typeof (targetElm) === 'object') { + //Ok, create a new instance + return new IntroJs(targetElm); + + } else if (typeof (targetElm) === 'string') { + //select the target element with query selector + var targetElement = document.querySelector(targetElm); + + if (targetElement) { + return new IntroJs(targetElement); + } else { + throw new Error('There is no element with given selector.'); + } + } else { + return new IntroJs(document.body); + } + }; + + /** + * Current IntroJs version + * + * @property version + * @type String + */ + introJs.version = VERSION; + + //Prototype + introJs.fn = IntroJs.prototype = { + clone: function () { + return new IntroJs(this); + }, + setOption: function(option, value) { + this._options[option] = value; + return this; + }, + setOptions: function(options) { + this._options = _mergeOptions(this._options, options); + return this; + }, + start: function () { + _introForElement.call(this, this._targetElement); + return this; + }, + goToStep: function(step) { + _goToStep.call(this, step); + return this; + }, + exit: function() { + _exitIntro.call(this, this._targetElement); + }, + onbeforechange: function(providedCallback) { + if (typeof (providedCallback) === 'function') { + this._introBeforeChangeCallback = providedCallback; + } else { + throw new Error('Provided callback for onbeforechange was not a function'); + } + return this; + }, + onchange: function(providedCallback) { + if (typeof (providedCallback) === 'function') { + this._introChangeCallback = providedCallback; + } else { + throw new Error('Provided callback for onchange was not a function.'); + } + return this; + }, + oncomplete: function(providedCallback) { + if (typeof (providedCallback) === 'function') { + this._introCompleteCallback = providedCallback; + } else { + throw new Error('Provided callback for oncomplete was not a function.'); + } + return this; + }, + onexit: function(providedCallback) { + if (typeof (providedCallback) === 'function') { + this._introExitCallback = providedCallback; + } else { + throw new Error('Provided callback for onexit was not a function.'); + } + return this; + } + }; + + exports.introJs = introJs; + return introJs; +})); diff --git a/ajax/libs/intro.js/0.4.0/intro.min.js b/ajax/libs/intro.js/0.4.0/intro.min.js new file mode 100644 index 000000000..17c56281f --- /dev/null +++ b/ajax/libs/intro.js/0.4.0/intro.min.js @@ -0,0 +1,20 @@ +/*! Intro.js v0.4.0 | (c)2013 usabli.ca MIT License */ +(function(h,f){"object"===typeof exports?f(exports):"function"===typeof define&&define.amd?define(["exports"],f):f(h)})(this,function(h){function f(a){this._targetElement=a;this._options={nextLabel:"Next →",prevLabel:"← Back",skipLabel:"Skip",doneLabel:"Done",tooltipPosition:"bottom",exitOnEsc:!0,exitOnOverlayClick:!0,showStepNumbers:!0}}function n(){"undefined"!==typeof this._introBeforeChangeCallback&&this._introBeforeChangeCallback.call(this,this._targetElement);"undefined"===typeof this._currentStep? +this._currentStep=0:++this._currentStep;this._introItems.length<=this._currentStep?("function"===typeof this._introCompleteCallback&&this._introCompleteCallback.call(this),m.call(this,this._targetElement)):s.call(this,this._introItems[this._currentStep])}function t(){if(0===this._currentStep)return!1;"undefined"!==typeof this._introBeforeChangeCallback&&this._introBeforeChangeCallback.call(this,this._targetElement);s.call(this,this._introItems[--this._currentStep])}function m(a){var b=a.querySelector(".introjs-overlay"); +b.style.opacity=0;setTimeout(function(){b.parentNode&&b.parentNode.removeChild(b)},500);(a=a.querySelector(".introjs-helperLayer"))&&a.parentNode.removeChild(a);if(a=document.querySelector(".introjs-showElement"))a.className=a.className.replace(/introjs-[a-zA-Z]+/g,"").replace(/^\s+|\s+$/g,"");if((a=document.querySelectorAll(".introjs-fixParent"))&&0'+a.intro+'
';this._options.showStepNumbers&&(b=document.createElement("span"),b.className="introjs-helperNumberLayer",b.innerHTML=a.step,e.appendChild(b));k.appendChild(d);e.appendChild(k);j=document.createElement("a"); +j.onclick=function(){c._introItems.length-1!=c._currentStep&&n.call(c)};j.href="javascript:void(0);";j.innerHTML=this._options.nextLabel;b=document.createElement("a");b.onclick=function(){0!=c._currentStep&&t.call(c)};b.href="javascript:void(0);";b.innerHTML=this._options.prevLabel;e=document.createElement("a");e.className="introjs-button introjs-skipbutton";e.href="javascript:void(0);";e.innerHTML=this._options.skipLabel;e.onclick=function(){c._introItems.length-1==c._currentStep&&"function"===typeof c._introCompleteCallback&& +c._introCompleteCallback.call(c);c._introItems.length-1!=c._currentStep&&"function"===typeof c._introExitCallback&&c._introExitCallback.call(c);m.call(c,c._targetElement)};var h=k.querySelector(".introjs-tooltipbuttons");h.appendChild(e);h.appendChild(b);h.appendChild(j);u.call(c,a.element,k,d)}0==this._currentStep?(b.className="introjs-button introjs-prevbutton introjs-disabled",j.className="introjs-button introjs-nextbutton",e.innerHTML=this._options.skipLabel):this._introItems.length-1==this._currentStep? +(e.innerHTML=this._options.doneLabel,b.className="introjs-button introjs-prevbutton",j.className="introjs-button introjs-nextbutton introjs-disabled"):(b.className="introjs-button introjs-prevbutton",j.className="introjs-button introjs-nextbutton",e.innerHTML=this._options.skipLabel);j.focus();a.element.className+=" introjs-showElement";e=v(a.element,"position");"absolute"!==e&&"relative"!==e&&(a.element.className+=" introjs-relativePosition");for(e=a.element.parentNode;null!=e&&"body"!==e.tagName.toLowerCase();)b= +v(e,"z-index"),/[0-9]+/.test(b)&&(e.className+=" introjs-fixParent"),e=e.parentNode;e=a.element.getBoundingClientRect();0<=e.top&&0<=e.left&&e.bottom+80<=window.innerHeight&&e.right<=window.innerWidth||(b=a.element.getBoundingClientRect(),e=b.bottom-(b.bottom-b.top),j=b.bottom,b=void 0!=window.innerWidth?window.innerHeight:document.documentElement.clientHeight,b=j-b,0>e?window.scrollBy(0,e-30):window.scrollBy(0,b+100))}function v(a,b){var c="";a.currentStyle?c=a.currentStyle[b]:document.defaultView&& +document.defaultView.getComputedStyle&&(c=document.defaultView.getComputedStyle(a,null).getPropertyValue(b));return c.toLowerCase?c.toLowerCase():c}function x(a){var b=document.createElement("div"),c="",d=this;b.className="introjs-overlay";if("body"===a.tagName.toLowerCase())c+="top: 0;bottom: 0; left: 0;right: 0;position: fixed;",b.setAttribute("style",c);else{var g=l(a);g&&(c+="width: "+g.width+"px; height:"+g.height+"px; top:"+g.top+"px;left: "+g.left+"px;",b.setAttribute("style",c))}a.appendChild(b); +b.onclick=function(){!0==d._options.exitOnOverlayClick&&m.call(d,a);void 0!=d._introExitCallback&&d._introExitCallback.call(d)};setTimeout(function(){c+="opacity: .8;";b.setAttribute("style",c)},10);return!0}function l(a){var b={};b.width=a.offsetWidth;b.height=a.offsetHeight;for(var c=0,d=0;a&&!isNaN(a.offsetLeft)&&!isNaN(a.offsetTop);)c+=a.offsetLeft,d+=a.offsetTop,a=a.offsetParent;b.top=d;b.left=c;return b}var r=function(a){if("object"===typeof a)return new f(a);if("string"===typeof a){if(a=document.querySelector(a))return new f(a); +throw Error("There is no element with given selector.");}return new f(document.body)};r.version="0.4.0";r.fn=f.prototype={clone:function(){return new f(this)},setOption:function(a,b){this._options[a]=b;return this},setOptions:function(a){var b=this._options,c={},d;for(d in b)c[d]=b[d];for(d in a)c[d]=a[d];this._options=c;return this},start:function(){a:{var a=this._targetElement,b=[],c=this;if(this._options.steps)for(var d=[],g=0,d=this._options.steps.length;gd.length)break a;g=0;for(f=d.length;g