"));
+
+ if (this.options.attachTo) {
+ this.el.appendChild(createFromHTML('
'));
+ }
var content = document.createElement('div');
content.className = 'shepherd-content';
this.el.appendChild(content);
-
var header = document.createElement('header');
content.appendChild(header);
if (this.options.title) {
- header.innerHTML += '
' + this.options.title + '
';
+ header.innerHTML += "
".concat(this.options.title, "
");
this.el.className += ' shepherd-has-title';
}
if (this.options.showCancelLink) {
- var link = createFromHTML("
✕");
+ var link = createFromHTML('
✕');
header.appendChild(link);
-
this.el.className += ' shepherd-has-cancel-link';
-
this.bindCancelLink(link);
}
if (!isUndefined(this.options.text)) {
- (function () {
- var text = createFromHTML("
");
- var paragraphs = _this5.options.text;
-
- if (typeof paragraphs === 'function') {
- paragraphs = paragraphs.call(_this5, text);
- }
+ var text = createFromHTML('
');
+ var paragraphs = this.options.text;
- if (paragraphs instanceof HTMLElement) {
- text.appendChild(paragraphs);
- } else {
- if (typeof paragraphs === 'string') {
- paragraphs = [paragraphs];
- }
+ if (typeof paragraphs === 'function') {
+ paragraphs = paragraphs.call(this, text);
+ }
- paragraphs.map(function (paragraph) {
- text.innerHTML += '
' + paragraph + '
';
- });
+ if (paragraphs instanceof HTMLElement) {
+ text.appendChild(paragraphs);
+ } else {
+ if (typeof paragraphs === 'string') {
+ paragraphs = [paragraphs];
}
- content.appendChild(text);
- })();
+ paragraphs.map(function (paragraph) {
+ text.innerHTML += "
".concat(paragraph, "
");
+ });
+ }
+
+ content.appendChild(text);
}
if (this.options.buttons) {
- (function () {
- var footer = document.createElement('footer');
- var buttons = createFromHTML("
");
-
- _this5.options.buttons.map(function (cfg) {
- var button = createFromHTML('
' + cfg.text + '');
- buttons.appendChild(button);
- _this5.bindButtonEvents(cfg, button.querySelector('a'));
- });
+ var footer = document.createElement('footer');
+ var buttons = createFromHTML('');
+ this.options.buttons.map(function (cfg) {
+ var button = createFromHTML("").concat(cfg.text, ""));
+ buttons.appendChild(button);
- footer.appendChild(buttons);
- content.appendChild(footer);
- })();
+ _this6.bindButtonEvents(cfg, button.querySelector('a'));
+ });
+ footer.appendChild(buttons);
+ content.appendChild(footer);
}
document.body.appendChild(this.el);
-
- this.setupTether();
+ this.setupPopper();
if (this.options.advanceOn) {
this.bindAdvance();
}
}
}, {
- key: 'bindCancelLink',
+ key: "bindCancelLink",
value: function bindCancelLink(link) {
- var _this6 = this;
+ var _this7 = this;
link.addEventListener('click', function (e) {
e.preventDefault();
- _this6.cancel();
+
+ _this7.cancel();
});
}
}, {
- key: 'bindButtonEvents',
+ key: "bindButtonEvents",
value: function bindButtonEvents(cfg, el) {
- var _this7 = this;
+ var _this8 = this;
cfg.events = cfg.events || {};
+
if (!isUndefined(cfg.action)) {
// Including both a click event and an action is not supported
cfg.events.click = cfg.action;
}
- for (var _event2 in cfg.events) {
- if (({}).hasOwnProperty.call(cfg.events, _event2)) {
- var handler = cfg.events[_event2];
+ for (var event in cfg.events) {
+ if ({}.hasOwnProperty.call(cfg.events, event)) {
+ var handler = cfg.events[event];
+
if (typeof handler === 'string') {
(function () {
var page = handler;
- handler = function () {
- return _this7.tour.show(page);
+
+ handler = function handler() {
+ return _this8.tour.show(page);
};
})();
}
- el.addEventListener(_event2, handler);
+
+ el.addEventListener(event, handler);
}
}
this.on('destroy', function () {
- for (var _event3 in cfg.events) {
- if (({}).hasOwnProperty.call(cfg.events, _event3)) {
- var handler = cfg.events[_event3];
- el.removeEventListener(_event3, handler);
+ for (var _event in cfg.events) {
+ if ({}.hasOwnProperty.call(cfg.events, _event)) {
+ var _handler = cfg.events[_event];
+ el.removeEventListener(_event, _handler);
}
}
});
@@ -530,50 +720,52 @@ var Step = (function (_Evented) {
}]);
return Step;
-})(Evented);
+}(Evented);
-var Tour = (function (_Evented2) {
+var Tour =
+/*#__PURE__*/
+function (_Evented2) {
_inherits(Tour, _Evented2);
function Tour() {
- var _this8 = this;
+ var _this9;
- var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
+ var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
_classCallCheck(this, Tour);
- _get(Object.getPrototypeOf(Tour.prototype), 'constructor', this).call(this, options);
- this.bindMethods();
- this.options = options;
- this.steps = this.options.steps || [];
+ _this9 = _possibleConstructorReturn(this, _getPrototypeOf(Tour).call(this, options));
+
+ _this9.bindMethods();
+
+ _this9.options = options;
+ _this9.steps = _this9.options.steps || []; // Pass these events onto the global Shepherd object
- // Pass these events onto the global Shepherd object
var events = ['complete', 'cancel', 'hide', 'start', 'show', 'active', 'inactive'];
events.map(function (event) {
(function (e) {
- _this8.on(e, function (opts) {
+ _this9.on(e, function (opts) {
opts = opts || {};
- opts.tour = _this8;
+ opts.tour = _assertThisInitialized(_assertThisInitialized(_this9));
Shepherd.trigger(e, opts);
});
})(event);
});
-
- return this;
+ return _possibleConstructorReturn(_this9, _assertThisInitialized(_assertThisInitialized(_this9)));
}
_createClass(Tour, [{
- key: 'bindMethods',
+ key: "bindMethods",
value: function bindMethods() {
- var _this9 = this;
+ var _this10 = this;
var methods = ['next', 'back', 'cancel', 'complete', 'hide'];
methods.map(function (method) {
- _this9[method] = _this9[method].bind(_this9);
+ _this10[method] = _this10[method].bind(_this10);
});
}
}, {
- key: 'addStep',
+ key: "addStep",
value: function addStep(name, step) {
if (isUndefined(step)) {
step = name;
@@ -583,7 +775,8 @@ var Tour = (function (_Evented2) {
if (typeof name === 'string' || typeof name === 'number') {
step.id = name.toString();
}
- step = extend({}, this.options.defaults, step);
+
+ step = assign({}, this.options.defaults, step);
step = new Step(this, step);
} else {
step.tour = this;
@@ -593,16 +786,18 @@ var Tour = (function (_Evented2) {
return this;
}
}, {
- key: 'removeStep',
+ key: "removeStep",
value: function removeStep(name) {
var current = this.getCurrentStep();
for (var i = 0; i < this.steps.length; ++i) {
var step = this.steps[i];
+
if (step.id === name) {
if (step.isOpen()) {
step.hide();
}
+
step.destroy();
this.steps.splice(i, 1);
break;
@@ -611,27 +806,27 @@ var Tour = (function (_Evented2) {
if (current && current.id === name) {
this.currentStep = undefined;
-
if (this.steps.length) this.show(0);else this.hide();
}
}
}, {
- key: 'getById',
+ key: "getById",
value: function getById(id) {
for (var i = 0; i < this.steps.length; ++i) {
var step = this.steps[i];
+
if (step.id === id) {
return step;
}
}
}
}, {
- key: 'getCurrentStep',
+ key: "getCurrentStep",
value: function getCurrentStep() {
return this.currentStep;
}
}, {
- key: 'next',
+ key: "next",
value: function next() {
var index = this.steps.indexOf(this.currentStep);
@@ -644,61 +839,67 @@ var Tour = (function (_Evented2) {
}
}
}, {
- key: 'back',
+ key: "back",
value: function back() {
var index = this.steps.indexOf(this.currentStep);
this.show(index - 1, false);
}
}, {
- key: 'cancel',
+ key: "cancel",
value: function cancel() {
if (this.currentStep) {
this.currentStep.hide();
}
+
this.trigger('cancel');
this.done();
}
}, {
- key: 'complete',
+ key: "complete",
value: function complete() {
if (this.currentStep) {
this.currentStep.hide();
}
+
this.trigger('complete');
this.done();
}
}, {
- key: 'hide',
+ key: "hide",
value: function hide() {
if (this.currentStep) {
this.currentStep.hide();
}
+
this.trigger('hide');
this.done();
}
}, {
- key: 'done',
+ key: "done",
value: function done() {
Shepherd.activeTour = null;
- removeClass(document.body, 'shepherd-active');
- this.trigger('inactive', { tour: this });
+ document.body.classList.remove('shepherd-active');
+ this.trigger('inactive', {
+ tour: this
+ });
}
}, {
- key: 'show',
+ key: "show",
value: function show() {
- var key = arguments.length <= 0 || arguments[0] === undefined ? 0 : arguments[0];
- var forward = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+ var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+ var forward = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
if (this.currentStep) {
this.currentStep.hide();
} else {
- addClass(document.body, 'shepherd-active');
- this.trigger('active', { tour: this });
+ document.body.classList.add('shepherd-active');
+ this.trigger('active', {
+ tour: this
+ });
}
Shepherd.activeTour = this;
-
- var next = undefined;
+ var next;
if (typeof key === 'string') {
next = this.getById(key);
@@ -727,19 +928,23 @@ var Tour = (function (_Evented2) {
}
}
}, {
- key: 'start',
+ key: "start",
value: function start() {
this.trigger('start');
-
this.currentStep = null;
this.next();
}
}]);
return Tour;
-})(Evented);
+}(Evented);
-extend(Shepherd, { Tour: Tour, Step: Step, Evented: Evented });
+var Shepherd = new Evented();
+assign(Shepherd, {
+ Tour: Tour,
+ Step: Step,
+ Evented: Evented
+});
return Shepherd;
}));
diff --git a/dist/js/shepherd.min.js b/dist/js/shepherd.min.js
index a5e9e8c81..5d31497bf 100644
--- a/dist/js/shepherd.min.js
+++ b/dist/js/shepherd.min.js
@@ -1 +1 @@
-!function(t,e){"function"==typeof define&&define.amd?define(["tether"],e):"object"==typeof exports?module.exports=e(require("tether")):t.Shepherd=e(t.Tether)}(this,function(t){"use strict";function e(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function n(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function i(t){return"undefined"==typeof t}function r(t){return t&&t.constructor===Array}function o(t){return t&&t.constructor===Object}function s(t){return"object"==typeof t}function h(t){var e=document.createElement("div");return e.innerHTML=t,e.children[0]}function c(t,e){var n=void 0;return i(t.matches)?i(t.matchesSelector)?i(t.msMatchesSelector)?i(t.webkitMatchesSelector)?i(t.mozMatchesSelector)?i(t.oMatchesSelector)||(n=t.oMatchesSelector):n=t.mozMatchesSelector:n=t.webkitMatchesSelector:n=t.msMatchesSelector:n=t.matchesSelector:n=t.matches,n.call(t,e)}function l(t){if(s(t))return t.hasOwnProperty("element")&&t.hasOwnProperty("on")?t:null;var e=S.exec(t);if(!e)return null;var n=e[2];return"["===n[0]&&(n=n.substring(1,n.length-1)),{element:e[1],on:n}}function a(t,e){if(null===t||i(t))return t;if(s(t))return t;for(var n=t.split(" "),r={},o=e.length-1,h=n.length-1;h>=0;h--){if(0===o){r[e[o]]=n.slice(0,h+1).join(" ");break}r[e[o]]=n[h],o--}return r}var u=function(){function t(t,e){for(var n=0;n ");var e=document.createElement("div");e.className="shepherd-content",this.el.appendChild(e);var n=document.createElement("header");if(e.appendChild(n),this.options.title&&(n.innerHTML+="