diff options
| author | chm@openerp.com <> | 2014-03-20 16:15:42 +0100 |
|---|---|---|
| committer | chm@openerp.com <> | 2014-03-20 16:15:42 +0100 |
| commit | abfccd8936da4f228919dcd3f59462c38d9efe41 (patch) | |
| tree | bd0a7ccfc2be5a0af551618b77a17f293720ed6f /addons/website/static/lib | |
| parent | 0b75d4ea043e35c9c523b9ec24324eae8d149e8f (diff) | |
[WIP] website tour: bootstrap-tour - v0.9.1
bzr revid: chm@openerp.com-20140320151542-blfr1rs1j24xanh8
Diffstat (limited to 'addons/website/static/lib')
| -rw-r--r--[-rwxr-xr-x] | addons/website/static/lib/bootstrap-tour/bootstrap-tour.css | 44 | ||||
| -rw-r--r--[-rwxr-xr-x] | addons/website/static/lib/bootstrap-tour/bootstrap-tour.js | 1103 |
2 files changed, 663 insertions, 484 deletions
diff --git a/addons/website/static/lib/bootstrap-tour/bootstrap-tour.css b/addons/website/static/lib/bootstrap-tour/bootstrap-tour.css index 72c6e8cbab7..5449158e7f4 100755..100644 --- a/addons/website/static/lib/bootstrap-tour/bootstrap-tour.css +++ b/addons/website/static/lib/bootstrap-tour/bootstrap-tour.css @@ -1,37 +1,59 @@ +/* =========================================================== +# bootstrap-tour - v0.9.1 +# http://bootstraptour.com +# ============================================================== +# Copyright 2012-2013 Ulrich Sossou +# +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at +# +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +*/ .tour-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; - z-index: 1009; + z-index: 1100; background-color: #000; opacity: 0.8; } .tour-step-backdrop { position: relative; - z-index: 1011; + z-index: 1101; + background: inherit; } .tour-step-background { position: absolute; - z-index: 1010; - background: #fff; + z-index: 1100; + background: inherit; border-radius: 6px; } +.popover[class*="tour-"] { + z-index: 1100; +} .popover[class*="tour-"] .popover-navigation { padding: 9px 14px; } -.popover[class*="tour-"] .popover-navigation *[data-role=end] { +.popover[class*="tour-"] .popover-navigation *[data-role="end"] { float: right; } -.popover[class*="tour-"] .popover-navigation *[data-role=prev], -.popover[class*="tour-"] .popover-navigation *[data-role=next], -.popover[class*="tour-"] .popover-navigation *[data-role=end] { +.popover[class*="tour-"] .popover-navigation *[data-role="prev"], +.popover[class*="tour-"] .popover-navigation *[data-role="next"], +.popover[class*="tour-"] .popover-navigation *[data-role="end"] { cursor: pointer; } -.popover[class*="tour-"] .popover-navigation *[data-role=prev].disabled, -.popover[class*="tour-"] .popover-navigation *[data-role=next].disabled, -.popover[class*="tour-"] .popover-navigation *[data-role=end].disabled { +.popover[class*="tour-"] .popover-navigation *[data-role="prev"].disabled, +.popover[class*="tour-"] .popover-navigation *[data-role="next"].disabled, +.popover[class*="tour-"] .popover-navigation *[data-role="end"].disabled { cursor: default; } .popover[class*="tour-"].orphan { diff --git a/addons/website/static/lib/bootstrap-tour/bootstrap-tour.js b/addons/website/static/lib/bootstrap-tour/bootstrap-tour.js index 8b45d6da9ee..a0172c718c0 100755..100644 --- a/addons/website/static/lib/bootstrap-tour/bootstrap-tour.js +++ b/addons/website/static/lib/bootstrap-tour/bootstrap-tour.js @@ -1,5 +1,5 @@ /* =========================================================== -# bootstrap-tour - v0.6.1 +# bootstrap-tour - v0.9.1 # http://bootstraptour.com # ============================================================== # Copyright 2012-2013 Ulrich Sossou @@ -16,220 +16,233 @@ # See the License for the specific language governing permissions and # limitations under the License. */ -(function() { - (function($, window) { - var Tour, document; - document = window.document; - Tour = (function() { - function Tour(options) { - this._options = $.extend({ - name: "tour", - container: "body", - keyboard: true, - storage: window.localStorage, - debug: false, - backdrop: false, - redirect: true, - orphan: false, - basePath: "", - template: "<div class='popover'> <div class='arrow'></div> <h3 class='popover-title'></h3> <div class='popover-content'></div> <nav class='popover-navigation'> <div class='btn-group'> <button class='btn btn-sm btn-default' data-role='prev'>« Prev</button> <button class='btn btn-sm btn-default' data-role='next'>Next »</button> </div> <button class='btn btn-sm btn-default' data-role='end'>End tour</button> </nav> </div>", - afterSetState: function(key, value) {}, - afterGetState: function(key, value) {}, - afterRemoveState: function(key) {}, - onStart: function(tour) {}, - onEnd: function(tour) {}, - onShow: function(tour) {}, - onShown: function(tour) {}, - onHide: function(tour) {}, - onHidden: function(tour) {}, - onNext: function(tour) {}, - onPrev: function(tour) {} - }, options); - this._steps = []; - this.setCurrentStep(); - this.backdrop = { - overlay: null, - $element: null, - $background: null - }; +(function($, window) { + var Tour, document; + document = window.document; + Tour = (function() { + function Tour(options) { + this._options = $.extend({ + name: "tour", + steps: [], + container: "body", + keyboard: true, + storage: window.localStorage, + debug: false, + backdrop: false, + redirect: true, + orphan: false, + duration: false, + basePath: "", + template: "<div class='popover'> <div class='arrow'></div> <h3 class='popover-title'></h3> <div class='popover-content'></div> <div class='popover-navigation'> <div class='btn-group'> <button class='btn btn-sm btn-default' data-role='prev'>« Prev</button> <button class='btn btn-sm btn-default' data-role='next'>Next »</button> <button class='btn btn-sm btn-default' data-role='pause-resume' data-pause-text='Pause' data-resume-text='Resume'>Pause</button> </div> <button class='btn btn-sm btn-default' data-role='end'>End tour</button> </div> </div>", + afterSetState: function(key, value) {}, + afterGetState: function(key, value) {}, + afterRemoveState: function(key) {}, + onStart: function(tour) {}, + onEnd: function(tour) {}, + onShow: function(tour) {}, + onShown: function(tour) {}, + onHide: function(tour) {}, + onHidden: function(tour) {}, + onNext: function(tour) {}, + onPrev: function(tour) {}, + onPause: function(tour, duration) {}, + onResume: function(tour, duration) {} + }, options); + this._force = false; + this._inited = false; + this.backdrop = { + overlay: null, + $element: null, + $background: null, + backgroundShown: false, + overlayElementShown: false + }; + this; + } + + Tour.prototype.addSteps = function(steps) { + var step, _i, _len; + for (_i = 0, _len = steps.length; _i < _len; _i++) { + step = steps[_i]; + this.addStep(step); } + return this; + }; + + Tour.prototype.addStep = function(step) { + this._options.steps.push(step); + return this; + }; + + Tour.prototype.getStep = function(i) { + if (this._options.steps[i] != null) { + return $.extend({ + id: "step-" + i, + path: "", + placement: "right", + title: "", + content: "<p></p>", + next: i === this._options.steps.length - 1 ? -1 : i + 1, + prev: i - 1, + animation: true, + container: this._options.container, + backdrop: this._options.backdrop, + redirect: this._options.redirect, + orphan: this._options.orphan, + duration: this._options.duration, + template: this._options.template, + onShow: this._options.onShow, + onShown: this._options.onShown, + onHide: this._options.onHide, + onHidden: this._options.onHidden, + onNext: this._options.onNext, + onPrev: this._options.onPrev, + onPause: this._options.onPause, + onResume: this._options.onResume + }, this._options.steps[i]); + } + }; - Tour.prototype.setState = function(key, value) { - var keyName; - if (this._options.storage) { - keyName = "" + this._options.name + "_" + key; - this._options.storage.setItem(keyName, value); - return this._options.afterSetState(keyName, value); - } else { - if (this._state == null) { - this._state = {}; - } - return this._state[key] = value; - } - }; - - Tour.prototype.removeState = function(key) { - var keyName; - if (this._options.storage) { - keyName = "" + this._options.name + "_" + key; - this._options.storage.removeItem(keyName); - return this._options.afterRemoveState(keyName); - } else { - if (this._state != null) { - return delete this._state[key]; - } - } - }; - - Tour.prototype.getState = function(key) { - var keyName, value; - if (this._options.storage) { - keyName = "" + this._options.name + "_" + key; - value = this._options.storage.getItem(keyName); - } else { - if (this._state != null) { - value = this._state[key]; - } - } - if (value === void 0 || value === "null") { - value = null; - } - this._options.afterGetState(key, value); - return value; - }; - - Tour.prototype.addSteps = function(steps) { - var step, _i, _len, _results; - _results = []; - for (_i = 0, _len = steps.length; _i < _len; _i++) { - step = steps[_i]; - _results.push(this.addStep(step)); - } - return _results; - }; - - Tour.prototype.addStep = function(step) { - return this._steps.push(step); - }; - - Tour.prototype.getStep = function(i) { - if (this._steps[i] != null) { - return $.extend({ - id: "step-" + i, - path: "", - placement: "right", - title: "", - content: "<p></p>", - next: i === this._steps.length - 1 ? -1 : i + 1, - prev: i - 1, - animation: true, - container: this._options.container, - backdrop: this._options.backdrop, - redirect: this._options.redirect, - orphan: this._options.orphan, - template: this._options.template, - onShow: this._options.onShow, - onShown: this._options.onShown, - onHide: this._options.onHide, - onHidden: this._options.onHidden, - onNext: this._options.onNext, - onPrev: this._options.onPrev - }, this._steps[i]); - } - }; - - Tour.prototype.start = function(force) { - var promise, - _this = this; - if (force == null) { - force = false; - } - if (this.ended() && !force) { - return this._debug("Tour ended, start prevented."); - } - $(document).off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role=next]").on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role=next]:not(.disabled)", function(e) { - e.preventDefault(); - return _this.next(); - }); - $(document).off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role=prev]").on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role=prev]:not(.disabled)", function(e) { - e.preventDefault(); - return _this.prev(); - }); - $(document).off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role=end]").on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role=end]", function(e) { - e.preventDefault(); - return _this.end(); - }); - this._onResize(function() { + Tour.prototype.init = function(force) { + this._force = force; + if (this.ended()) { + this._debug("Tour ended, init prevented."); + return this; + } + this.setCurrentStep(); + this._initMouseNavigation(); + this._initKeyboardNavigation(); + this._onResize((function(_this) { + return function() { return _this.showStep(_this._current); - }); - this._setupKeyboardNavigation(); + }; + })(this)); + if (this._current !== null) { + this.showStep(this._current); + } + this._inited = true; + return this; + }; + + Tour.prototype.start = function(force) { + var promise; + if (force == null) { + force = false; + } + if (!this._inited) { + this.init(force); + } + if (this._current === null) { promise = this._makePromise(this._options.onStart != null ? this._options.onStart(this) : void 0); - return this._callOnPromiseDone(promise, this.showStep, this._current); - }; - - Tour.prototype.next = function() { - var promise; - if (this.ended()) { - return this._debug("Tour ended, next prevented."); - } - promise = this.hideStep(this._current); - return this._callOnPromiseDone(promise, this._showNextStep); - }; - - Tour.prototype.prev = function() { - var promise; - if (this.ended()) { - return this._debug("Tour ended, prev prevented."); - } - promise = this.hideStep(this._current); - return this._callOnPromiseDone(promise, this._showPrevStep); - }; - - Tour.prototype.goto = function(i) { - var promise; - if (this.ended()) { - return this._debug("Tour ended, goto prevented."); - } - promise = this.hideStep(this._current); - return this._callOnPromiseDone(promise, this.showStep, i); - }; - - Tour.prototype.end = function() { - var endHelper, hidePromise, - _this = this; - endHelper = function(e) { + this._callOnPromiseDone(promise, this.showStep, 0); + } + return this; + }; + + Tour.prototype.next = function() { + var promise; + promise = this.hideStep(this._current); + return this._callOnPromiseDone(promise, this._showNextStep); + }; + + Tour.prototype.prev = function() { + var promise; + promise = this.hideStep(this._current); + return this._callOnPromiseDone(promise, this._showPrevStep); + }; + + Tour.prototype.goTo = function(i) { + var promise; + promise = this.hideStep(this._current); + return this._callOnPromiseDone(promise, this.showStep, i); + }; + + Tour.prototype.end = function() { + var endHelper, promise; + endHelper = (function(_this) { + return function(e) { $(document).off("click.tour-" + _this._options.name); $(document).off("keyup.tour-" + _this._options.name); $(window).off("resize.tour-" + _this._options.name); - _this.setState("end", "yes"); + _this._setState("end", "yes"); + _this._inited = false; + _this._force = false; + _this._clearTimer(); if (_this._options.onEnd != null) { return _this._options.onEnd(_this); } }; - hidePromise = this.hideStep(this._current); - return this._callOnPromiseDone(hidePromise, endHelper); - }; - - Tour.prototype.ended = function() { - return !!this.getState("end"); - }; + })(this); + promise = this.hideStep(this._current); + return this._callOnPromiseDone(promise, endHelper); + }; + + Tour.prototype.ended = function() { + return !this._force && !!this._getState("end"); + }; + + Tour.prototype.restart = function() { + this._removeState("current_step"); + this._removeState("end"); + this.setCurrentStep(0); + return this.start(); + }; + + Tour.prototype.pause = function() { + var step; + step = this.getStep(this._current); + if (!(step && step.duration)) { + return this; + } + this._paused = true; + this._duration -= new Date().getTime() - this._start; + window.clearTimeout(this._timer); + this._debug("Paused/Stopped step " + (this._current + 1) + " timer (" + this._duration + " remaining)."); + if (step.onPause != null) { + return step.onPause(this, this._duration); + } + }; - Tour.prototype.restart = function() { - this.removeState("current_step"); - this.removeState("end"); - this.setCurrentStep(0); - return this.start(); - }; + Tour.prototype.resume = function() { + var step; + step = this.getStep(this._current); + if (!(step && step.duration)) { + return this; + } + this._paused = false; + this._start = new Date().getTime(); + this._duration = this._duration || step.duration; + this._timer = window.setTimeout((function(_this) { + return function() { + if (_this._isLast()) { + return _this.next(); + } else { + return _this.end(); + } + }; + })(this), this._duration); + this._debug("Started step " + (this._current + 1) + " timer with duration " + this._duration); + if ((step.onResume != null) && this._duration !== step.duration) { + return step.onResume(this, this._duration); + } + }; - Tour.prototype.hideStep = function(i) { - var hideStepHelper, promise, step, - _this = this; - step = this.getStep(i); - promise = this._makePromise(step.onHide != null ? step.onHide(this, i) : void 0); - hideStepHelper = function(e) { + Tour.prototype.hideStep = function(i) { + var hideStepHelper, promise, step; + step = this.getStep(i); + if (!step) { + return; + } + this._clearTimer(); + promise = this._makePromise(step.onHide != null ? step.onHide(this, i) : void 0); + hideStepHelper = (function(_this) { + return function(e) { var $element; - $element = _this._isOrphan(step) ? $("body") : $(step.element); - $element.popover("destroy"); + $element = $(step.element); + if (!($element.data("bs.popover") || $element.data("popover"))) { + $element = $("body"); + } + $element.popover("destroy").removeClass("tour-" + _this._options.name + "-element tour-" + _this._options.name + "-" + i + "-element"); if (step.reflex) { $element.css("cursor", "").off("click.tour-" + _this._options.name); } @@ -240,23 +253,37 @@ return step.onHidden(_this); } }; - this._callOnPromiseDone(promise, hideStepHelper); - return promise; - }; - - Tour.prototype.showStep = function(i) { - var promise, showStepHelper, skipToPrevious, step, - _this = this; - step = this.getStep(i); - if (!step) { - return; - } - skipToPrevious = i < this._current; - promise = this._makePromise(step.onShow != null ? step.onShow(this, i) : void 0); - showStepHelper = function(e) { + })(this); + this._callOnPromiseDone(promise, hideStepHelper); + return promise; + }; + + Tour.prototype.showStep = function(i) { + var promise, showStepHelper, skipToPrevious, step; + if (this.ended()) { + this._debug("Tour ended, showStep prevented."); + return this; + } + step = this.getStep(i); + if (!step) { + return; + } + skipToPrevious = i < this._current; + promise = this._makePromise(step.onShow != null ? step.onShow(this, i) : void 0); + showStepHelper = (function(_this) { + return function(e) { var current_path, path; _this.setCurrentStep(i); - path = $.isFunction(step.path) ? step.path.call() : _this._options.basePath + step.path; + path = (function() { + switch ({}.toString.call(step.path)) { + case "[object Function]": + return step.path(); + case "[object String]": + return this._options.basePath + step.path; + default: + return step.path; + } + }).call(_this); current_path = [document.location.pathname, document.location.hash].join(""); if (_this._isRedirect(path, current_path)) { _this._redirect(step, path); @@ -277,283 +304,413 @@ if (step.backdrop) { _this._showBackdrop(!_this._isOrphan(step) ? step.element : void 0); } - _this._showPopover(step, i); - if (step.onShown != null) { - step.onShown(_this); + _this._scrollIntoView(step.element, function() { + if ((step.element != null) && step.backdrop) { + _this._showOverlayElement(step.element); + } + _this._showPopover(step, i); + if (step.onShown != null) { + step.onShown(_this); + } + return _this._debug("Step " + (_this._current + 1) + " of " + _this._options.steps.length); + }); + if (step.duration) { + return _this.resume(); } - return _this._debug("Step " + (_this._current + 1) + " of " + _this._steps.length); }; - return this._callOnPromiseDone(promise, showStepHelper); - }; - - Tour.prototype.setCurrentStep = function(value) { - if (value != null) { - this._current = value; - return this.setState("current_step", value); - } else { - this._current = this.getState("current_step"); - return this._current = this._current === null ? 0 : parseInt(this._current, 10); + })(this); + this._callOnPromiseDone(promise, showStepHelper); + return promise; + }; + + Tour.prototype.getCurrentStep = function() { + return this._current; + }; + + Tour.prototype.setCurrentStep = function(value) { + if (value != null) { + this._current = value; + this._setState("current_step", value); + } else { + this._current = this._getState("current_step"); + this._current = this._current === null ? null : parseInt(this._current, 10); + } + return this; + }; + + Tour.prototype._setState = function(key, value) { + var e, keyName; + if (this._options.storage) { + keyName = "" + this._options.name + "_" + key; + try { + this._options.storage.setItem(keyName, value); + } catch (_error) { + e = _error; + if (e.code === DOMException.QUOTA_EXCEEDED_ERR) { + this.debug("LocalStorage quota exceeded. State storage failed."); + } } - }; + return this._options.afterSetState(keyName, value); + } else { + if (this._state == null) { + this._state = {}; + } + return this._state[key] = value; + } + }; + + Tour.prototype._removeState = function(key) { + var keyName; + if (this._options.storage) { + keyName = "" + this._options.name + "_" + key; + this._options.storage.removeItem(keyName); + return this._options.afterRemoveState(keyName); + } else { + if (this._state != null) { + return delete this._state[key]; + } + } + }; - Tour.prototype._showNextStep = function() { - var promise, showNextStepHelper, step, - _this = this; - step = this.getStep(this._current); - showNextStepHelper = function(e) { + Tour.prototype._getState = function(key) { + var keyName, value; + if (this._options.storage) { + keyName = "" + this._options.name + "_" + key; + value = this._options.storage.getItem(keyName); + } else { + if (this._state != null) { + value = this._state[key]; + } + } + if (value === void 0 || value === "null") { + value = null; + } + this._options.afterGetState(key, value); + return value; + }; + + Tour.prototype._showNextStep = function() { + var promise, showNextStepHelper, step; + step = this.getStep(this._current); + showNextStepHelper = (function(_this) { + return function(e) { return _this.showStep(step.next); }; - promise = this._makePromise((step.onNext != null ? step.onNext(this) : void 0)); - return this._callOnPromiseDone(promise, showNextStepHelper); - }; - - Tour.prototype._showPrevStep = function() { - var promise, showPrevStepHelper, step, - _this = this; - step = this.getStep(this._current); - showPrevStepHelper = function(e) { + })(this); + promise = this._makePromise(step.onNext != null ? step.onNext(this) : void 0); + return this._callOnPromiseDone(promise, showNextStepHelper); + }; + + Tour.prototype._showPrevStep = function() { + var promise, showPrevStepHelper, step; + step = this.getStep(this._current); + showPrevStepHelper = (function(_this) { + return function(e) { return _this.showStep(step.prev); }; - promise = this._makePromise((step.onPrev != null ? step.onPrev(this) : void 0)); - return this._callOnPromiseDone(promise, showPrevStepHelper); - }; - - Tour.prototype._debug = function(text) { - if (this._options.debug) { - return window.console.log("Bootstrap Tour '" + this._options.name + "' | " + text); - } - }; - - Tour.prototype._isRedirect = function(path, currentPath) { - return (path != null) && path !== "" && path.replace(/\?.*$/, "").replace(/\/?$/, "") !== currentPath.replace(/\/?$/, ""); - }; - - Tour.prototype._redirect = function(step, path) { - if ($.isFunction(step.redirect)) { - return step.redirect.call(this, path); - } else if (step.redirect === true) { - this._debug("Redirect to " + path); - return document.location.href = path; - } - }; - - Tour.prototype._isOrphan = function(step) { - return (step.element == null) || !$(step.element).length || $(step.element).is(":hidden"); - }; - - Tour.prototype._showPopover = function(step, i) { - var $element, $navigation, $template, $tip, isOrphan, options, - _this = this; - options = $.extend({}, this._options); - $template = $.isFunction(step.template) ? $(step.template(i, step)) : $(step.template); - $navigation = $template.find(".popover-navigation"); - isOrphan = this._isOrphan(step); - if (isOrphan) { - step.element = "body"; - step.placement = "top"; - $template = $template.addClass("orphan"); - } - $element = $(step.element); - $template.addClass("tour-" + this._options.name); - if (step.options) { - $.extend(options, step.options); - } - if (step.reflex) { - $element.css("cursor", "pointer").on("click.tour-" + this._options.name, function(e) { - if (_this._current < _this._steps.length - 1) { + })(this); + promise = this._makePromise(step.onPrev != null ? step.onPrev(this) : void 0); + return this._callOnPromiseDone(promise, showPrevStepHelper); + }; + + Tour.prototype._debug = function(text) { + if (this._options.debug) { + return window.console.log("Bootstrap Tour '" + this._options.name + "' | " + text); + } + }; + + Tour.prototype._isRedirect = function(path, currentPath) { + return (path != null) && path !== "" && ((toString.call(path) === "[object RegExp]" && !path.test(currentPath)) || (toString.call(path) === "[object String]" && path.replace(/\?.*$/, "").replace(/\/?$/, "") !== currentPath.replace(/\/?$/, ""))); + }; + + Tour.prototype._redirect = function(step, path) { + if ($.isFunction(step.redirect)) { + return step.redirect.call(this, path); + } else if (step.redirect === true) { + this._debug("Redirect to " + path); + return document.location.href = path; + } + }; + + Tour.prototype._isOrphan = function(step) { + return (step.element == null) || !$(step.element).length || $(step.element).is(":hidden") && ($(step.element)[0].namespaceURI !== "http://www.w3.org/2000/svg"); + }; + + Tour.prototype._isLast = function() { + return this._current < this._options.steps.length - 1; + }; + + Tour.prototype._showPopover = function(step, i) { + var $element, $navigation, $template, $tip, isOrphan, options; + options = $.extend({}, this._options); + $template = $.isFunction(step.template) ? $(step.template(i, step)) : $(step.template); + $navigation = $template.find(".popover-navigation"); + isOrphan = this._isOrphan(step); + if (isOrphan) { + step.element = "body>*:last"; + step.placement = "top"; + $template = $template.addClass("orphan"); + } + $element = $(step.element); + $template.addClass("tour-" + this._options.name + " tour-" + this._options.name + "-" + i); + $element.addClass("tour-" + this._options.name + "-element tour-" + this._options.name + "-" + i + "-element"); + if (step.options) { + $.extend(options, step.options); + } + if (step.reflex) { + $element.css("cursor", "pointer").on("click.tour-" + this._options.name, (function(_this) { + return function() { + if (_this._isLast()) { return _this.next(); } else { return _this.end(); } - }); - } - if (step.prev < 0) { - $navigation.find("*[data-role=prev]").addClass("disabled"); - } - if (step.next < 0) { - $navigation.find("*[data-role=next]").addClass("disabled"); + }; + })(this)); + } + if (step.prev < 0) { + $navigation.find("[data-role='prev']").addClass("disabled"); + } + if (step.next < 0) { + $navigation.find("[data-role='next']").addClass("disabled"); + } + if (!step.duration) { + $navigation.find("[data-role='pause-resume']").remove(); + } + step.template = $template.clone().wrap("<div>").parent().html(); + $element.popover({ + placement: step.placement, + trigger: "manual", + title: step.title, + content: step.content, + html: true, + animation: step.animation, + container: step.container, + template: step.template, + selector: step.element + }).popover("show"); + $tip = $element.data("bs.popover") ? $element.data("bs.popover").tip() : $element.data("popover").tip(); + $tip.attr("id", step.id); + this._reposition($tip, step); + if (isOrphan) { + return this._center($tip); + } + }; + + Tour.prototype._reposition = function($tip, step) { + var offsetBottom, offsetHeight, offsetRight, offsetWidth, originalLeft, originalTop, tipOffset; + offsetWidth = $tip[0].offsetWidth; + offsetHeight = $tip[0].offsetHeight; + tipOffset = $tip.offset(); + originalLeft = tipOffset.left; + originalTop = tipOffset.top; + offsetBottom = $(document).outerHeight() - tipOffset.top - $tip.outerHeight(); + if (offsetBottom < 0) { + tipOffset.top = tipOffset.top + offsetBottom; + } + offsetRight = $("html").outerWidth() - tipOffset.left - $tip.outerWidth(); + if (offsetRight < 0) { + tipOffset.left = tipOffset.left + offsetRight; + } + if (tipOffset.top < 0) { + tipOffset.top = 0; + } + if (tipOffset.left < 0) { + tipOffset.left = 0; + } + $tip.offset(tipOffset); + if (step.placement === "bottom" || step.placement === "top") { + if (originalLeft !== tipOffset.left) { + return this._replaceArrow($tip, (tipOffset.left - originalLeft) * 2, offsetWidth, "left"); } - step.template = $template.clone().wrap("<div>").parent().html(); - $element.popover({ - placement: step.placement, - trigger: "manual", - title: step.title, - content: step.content, - html: true, - animation: step.animation, - container: step.container, - template: step.template, - selector: step.element - }).popover("show"); - $tip = $element.data("bs.popover") ? $element.data("bs.popover").tip() : $element.data("popover").tip(); - $tip.attr("id", step.id); - this._scrollIntoView($tip); - this._reposition($tip, step); - if (isOrphan) { - return this._center($tip); + } else { + if (originalTop !== tipOffset.top) { + return this._replaceArrow($tip, (tipOffset.top - originalTop) * 2, offsetHeight, "top"); } - }; + } + }; - Tour.prototype._reposition = function($tip, step) { - var offsetBottom, offsetHeight, offsetRight, offsetWidth, originalLeft, originalTop, tipOffset; - offsetWidth = $tip[0].offsetWidth; - offsetHeight = $tip[0].offsetHeight; - tipOffset = $tip.offset(); - originalLeft = tipOffset.left; - originalTop = tipOffset.top; - offsetBottom = $(document).outerHeight() - tipOffset.top - $tip.outerHeight(); - if (offsetBottom < 0) { - tipOffset.top = tipOffset.top + offsetBottom; - } - offsetRight = $("html").outerWidth() - tipOffset.left - $tip.outerWidth(); - if (offsetRight < 0) { - tipOffset.left = tipOffset.left + offsetRight; - } - if (tipOffset.top < 0) { - tipOffset.top = 0; - } - if (tipOffset.left < 0) { - tipOffset.left = 0; - } - $tip.offset(tipOffset); - if (step.placement === "bottom" || step.placement === "top") { - if (originalLeft !== tipOffset.left) { - return this._replaceArrow($tip, (tipOffset.left - originalLeft) * 2, offsetWidth, "left"); + Tour.prototype._center = function($tip) { + return $tip.css("top", $(window).outerHeight() / 2 - $tip.outerHeight() / 2); + }; + + Tour.prototype._replaceArrow = function($tip, delta, dimension, position) { + return $tip.find(".arrow").css(position, delta ? 50 * (1 - delta / dimension) + "%" : ""); + }; + + Tour.prototype._scrollIntoView = function(element, callback) { + var $element, $window, counter, offsetTop, scrollTop, windowHeight; + $element = $(element); + if (!$element.length) { + return callback(); + } + $window = $(window); + offsetTop = $element.offset().top; + windowHeight = $window.height(); + scrollTop = Math.max(0, offsetTop - (windowHeight / 2)); + this._debug("Scroll into view. ScrollTop: " + scrollTop + ". Element offset: " + offsetTop + ". Window height: " + windowHeight + "."); + counter = 0; + return $("body,html").stop(true, true).animate({ + scrollTop: Math.ceil(scrollTop) + }, (function(_this) { + return function() { + if (++counter === 2) { + callback(); + return _this._debug("Scroll into view. Animation end element offset: " + ($element.offset().top) + ". Window height: " + ($window.height()) + "."); } + }; + })(this)); + }; + + Tour.prototype._onResize = function(callback, timeout) { + return $(window).on("resize.tour-" + this._options.name, function() { + clearTimeout(timeout); + return timeout = setTimeout(callback, 100); + }); + }; + + Tour.prototype._initMouseNavigation = function() { + var _this; + _this = this; + return $(document).off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='prev']:not(.disabled)").off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='next']:not(.disabled)").off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='end']").off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='pause-resume']").on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='next']:not(.disabled)", (function(_this) { + return function(e) { + e.preventDefault(); + return _this.next(); + }; + })(this)).on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='prev']:not(.disabled)", (function(_this) { + return function(e) { + e.preventDefault(); + return _this.prev(); + }; + })(this)).on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='end']", (function(_this) { + return function(e) { + e.preventDefault(); + return _this.end(); + }; + })(this)).on("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='pause-resume']", function(e) { + var $this; + e.preventDefault(); + $this = $(this); + $this.text(_this._paused ? $this.data("pause-text") : $this.data("resume-text")); + if (_this._paused) { + return _this.resume(); } else { - if (originalTop !== tipOffset.top) { - return this._replaceArrow($tip, (tipOffset.top - originalTop) * 2, offsetHeight, "top"); - } + return _this.pause(); } - }; - - Tour.prototype._center = function($tip) { - return $tip.css("top", $(window).outerHeight() / 2 - $tip.outerHeight() / 2); - }; - - Tour.prototype._replaceArrow = function($tip, delta, dimension, position) { - return $tip.find(".arrow").css(position, delta ? 50 * (1 - delta / dimension) + "%" : ""); - }; - - Tour.prototype._scrollIntoView = function(tip) { - return $("html, body").stop().animate({ - scrollTop: Math.ceil(tip.offset().top - ($(window).height() / 2)) - }); - }; + }); + }; - Tour.prototype._onResize = function(callback, timeout) { - return $(window).on("resize.tour-" + this._options.name, function() { - clearTimeout(timeout); - return timeout = setTimeout(callback, 100); - }); - }; - - Tour.prototype._setupKeyboardNavigation = function() { - var _this = this; - if (this._options.keyboard) { - return $(document).on("keyup.tour-" + this._options.name, function(e) { - if (!e.which) { - return; - } - switch (e.which) { - case 39: - e.preventDefault(); - if (_this._current < _this._steps.length - 1) { - return _this.next(); - } else { - return _this.end(); - } - break; - case 37: - e.preventDefault(); - if (_this._current > 0) { - return _this.prev(); - } - break; - case 27: - e.preventDefault(); + Tour.prototype._initKeyboardNavigation = function() { + if (!this._options.keyboard) { + return; + } + return $(document).on("keyup.tour-" + this._options.name, (function(_this) { + return function(e) { + if (!e.which) { + return; + } + switch (e.which) { + case 39: + e.preventDefault(); + if (_this._isLast()) { + return _this.next(); + } else { return _this.end(); - } - }); - } - }; - - Tour.prototype._makePromise = function(result) { - if (result && $.isFunction(result.then)) { - return result; - } else { - return null; - } - }; + } + break; + case 37: + e.preventDefault(); + if (_this._current > 0) { + return _this.prev(); + } + break; + case 27: + e.preventDefault(); + return _this.end(); + } + }; + })(this)); + }; + + Tour.prototype._makePromise = function(result) { + if (result && $.isFunction(result.then)) { + return result; + } else { + return null; + } + }; - Tour.prototype._callOnPromiseDone = function(promise, cb, arg) { - var _this = this; - if (promise) { - return promise.then(function(e) { + Tour.prototype._callOnPromiseDone = function(promise, cb, arg) { + if (promise) { + return promise.then((function(_this) { + return function(e) { return cb.call(_this, arg); - }); - } else { - return cb.call(this, arg); - } - }; - - Tour.prototype._showBackdrop = function(element) { - if (this.backdrop.overlay !== null) { - return; - } - this._showOverlay(); - if (element != null) { - return this._showOverlayElement(element); - } - }; - - Tour.prototype._hideBackdrop = function() { - if (this.backdrop.overlay === null) { - return; - } - if (this.backdrop.$element) { - this._hideOverlayElement(); - } - return this._hideOverlay(); - }; - - Tour.prototype._showOverlay = function() { - this.backdrop = $("<div/>", { - "class": "tour-backdrop" - }); - return $("body").append(this.backdrop); - }; - - Tour.prototype._hideOverlay = function() { - this.backdrop.remove(); - return this.backdrop.overlay = null; - }; - - Tour.prototype._showOverlayElement = function(element) { - var $background, $element, offset; - $element = $(element); - $background = $("<div/>"); - offset = $element.offset(); - offset.top = offset.top; - offset.left = offset.left; - $background.width($element.innerWidth()).height($element.innerHeight()).addClass("tour-step-background").offset(offset); - $element.addClass("tour-step-backdrop"); - $("body").append($background); - this.backdrop.$element = $element; - return this.backdrop.$background = $background; - }; - - Tour.prototype._hideOverlayElement = function() { - this.backdrop.$element.removeClass("tour-step-backdrop"); - this.backdrop.$background.remove(); - this.backdrop.$element = null; - return this.backdrop.$background = null; - }; - - return Tour; - - })(); - return window.Tour = Tour; - })(jQuery, window); + }; + })(this)); + } else { + return cb.call(this, arg); + } + }; -}).call(this); + Tour.prototype._showBackdrop = function(element) { + if (this.backdrop.backgroundShown) { + return; + } + this.backdrop = $("<div/>", { + "class": "tour-backdrop" + }); + this.backdrop.backgroundShown = true; + return $("body").append(this.backdrop); + }; + + Tour.prototype._hideBackdrop = function() { + this._hideOverlayElement(); + return this._hideBackground(); + }; + + Tour.prototype._hideBackground = function() { + this.backdrop.remove(); + this.backdrop.overlay = null; + return this.backdrop.backgroundShown = false; + }; + + Tour.prototype._showOverlayElement = function(element) { + var $background, $element, offset; + $element = $(element); + if (!$element || $element.length === 0 || this.backdrop.overlayElementShown) { + return; + } + this.backdrop.overlayElementShown = true; + $background = $("<div/>"); + offset = $element.offset(); + offset.top = offset.top; + offset.left = offset.left; + $background.width($element.innerWidth()).height($element.innerHeight()).addClass("tour-step-background").offset(offset); + $element.addClass("tour-step-backdrop"); + $("body").append($background); + this.backdrop.$element = $element; + return this.backdrop.$background = $background; + }; + + Tour.prototype._hideOverlayElement = function() { + if (!this.backdrop.overlayElementShown) { + return; + } + this.backdrop.$element.removeClass("tour-step-backdrop"); + this.backdrop.$background.remove(); + this.backdrop.$element = null; + this.backdrop.$background = null; + return this.backdrop.overlayElementShown = false; + }; + + Tour.prototype._clearTimer = function() { + window.clearTimeout(this._timer); + this._timer = null; + return this._duration = null; + }; + + return Tour; + + })(); + return window.Tour = Tour; +})(jQuery, window); |
