commit 80879344248572e946cc4af70e54d7c5064aafb7
parent 94b0ff9b127a2b6da11af240359341504b2e0988
Author: MTRNord <mtrnord1@gmail.com>
Date: Sun, 27 Mar 2016 22:23:53 +0200
Add bootrap Tour (WIP) and restructure index.html
Diffstat:
7 files changed, 1004 insertions(+), 61 deletions(-)
diff --git a/web/theme/css/bootstrap-tour.css b/web/theme/css/bootstrap-tour.css
@@ -0,0 +1,73 @@
+/* ========================================================================
+ * bootstrap-tour - v0.10.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: 1100;
+ background-color: #000;
+ opacity: 0.8;
+ filter: alpha(opacity=80);
+}
+.tour-step-backdrop {
+ position: relative;
+ z-index: 1101;
+ background: inherit;
+}
+.tour-step-backdrop > td {
+ position: relative;
+ z-index: 1101;
+}
+.tour-step-background {
+ position: absolute !important;
+ 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"] {
+ 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"] {
+ 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 {
+ cursor: default;
+}
+.popover[class*="tour-"].orphan {
+ position: fixed;
+ margin-top: 0;
+}
+.popover[class*="tour-"].orphan .arrow {
+ display: none;
+}
diff --git a/web/theme/css/bootstrap-tour.min.css b/web/theme/css/bootstrap-tour.min.css
@@ -0,0 +1,22 @@
+/* ========================================================================
+ * bootstrap-tour - v0.10.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:1100;background-color:#000;opacity:.8;filter:alpha(opacity=80)}.tour-step-backdrop{position:relative;z-index:1101;background:inherit}.tour-step-backdrop>td{position:relative;z-index:1101}.tour-step-background{position:absolute!important;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]{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]{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{cursor:default}.popover[class*=tour-].orphan{position:fixed;margin-top:0}.popover[class*=tour-].orphan .arrow{display:none}
+\ No newline at end of file
diff --git a/web/theme/index.html b/web/theme/index.html
@@ -7,12 +7,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
- <meta name="author" content="">
+ <meta name="author" content="MTRNord">
<link rel="icon" href="favicon.ico">
<title>nBot</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
+ <link href="css/bootstrap-tour.min.css" rel="stylesheet">
<!-- Bootstrap theme -->
<!--<link href="css/bootstrap-theme.min.css" rel="stylesheet">-->
<!-- Custom styles for this template -->
@@ -96,11 +97,11 @@
<div class="panel panel-default">
<div class="panel-heading">
- <h3 class="panel-title">Server 1</h3>
+ <h3 class="panel-title" id="server_1">Server 1</h3>
</div>
<div class="panel-body">
<div class="panel panel-default">
- <div class="panel-heading">Server Data</div>
+ <div class="panel-heading" id="server-data_1">Server Data</div>
<div class="panel-body">
<p><b>Hostname: </b>Placeholder</p>
<p><b>IP: </b>Placeholder</p>
@@ -158,64 +159,12 @@
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
- <script src="js/bootstrap.min.js"></script>
- <script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
+ <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+ <script type="text/javascript" src="js/bootstrap.min.js"></script>
+ <script type="text/javascript" src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script type="text/javascript" src="js/pnotify.custom.min.js"></script>
- <script>
- PNotify.prototype.options.styling = "bootstrap3";
- $("#menu-toggle").click(function(e) {
- e.preventDefault();
- $("#wrapper").toggleClass("toggled");
- });
- var ws = location.protocol+'//'+location.hostname+(location.port ? ':'+location.port: '');
- var socket = io(ws);
- $(document).off('click', '#restart').on('click', '#restart', function (e) {
- console.log('restart fired');
-
- socket.emit('command', {command: 'restartgame'});
- e.preventDefault();
- });
- $(document).off('click', '#live_on').on('click', '#live_on', function (e) {
- console.warn('LIVE!!!');
-
- socket.emit('command', {command: 'live_on'});
- e.preventDefault();
- });
- socket.on('alert', function (message) {
- if (message.command == "live_on") {
- PNotify.desktop.permission();
- (new PNotify({
- title: 'LIVE!!!',
- text: "The game successfully started!",
- type: 'success',
- desktop: {
- desktop: true
- }
- })).get().click(function(e) {
- if ($('.ui-pnotify-closer, .ui-pnotify-sticker, .ui-pnotify-closer *, .ui-pnotify-sticker *').is(e.target)) return;
- alert('Hey! You clicked the desktop notification!');
- });
- }else {
-
- }
- });
- socket.on('status_alert', function (message) {
- console.warn(typeof message)
- console.warn(message)
- });
- $(document).off('click', '#check_status').on('click', '#check_status', function (e) {
- console.log('Check Status');
-
- socket.emit('command', {command: 'status'});
- e.preventDefault();
- });
- $(document).off('click', '#add_server').on('click', '#add_server', function (e) {
- console.log('Add Server');
-
- socket.emit('command', {command: 'add_server'});
- e.preventDefault();
- });
- </script>
+ <script type="text/javascript" src="js/bootstrap-tour.min.js"></script>
+ <script type="text/javascript" src="js/serverConnect.js"></script>
+ <script type="text/javascript" src="js/tour.js"></script>
</body>
</html>
diff --git a/web/theme/js/bootstrap-tour.js b/web/theme/js/bootstrap-tour.js
@@ -0,0 +1,802 @@
+/* ========================================================================
+ * bootstrap-tour - v0.10.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.
+ * ========================================================================
+ */
+
+(function($, window) {
+ var Tour, document;
+ document = window.document;
+ Tour = (function() {
+ function Tour(options) {
+ var storage;
+ try {
+ storage = window.localStorage;
+ } catch (_error) {
+ storage = false;
+ }
+ this._options = $.extend({
+ name: 'tour',
+ steps: [],
+ container: 'body',
+ autoscroll: true,
+ keyboard: true,
+ storage: storage,
+ debug: false,
+ backdrop: false,
+ backdropPadding: 0,
+ redirect: true,
+ orphan: false,
+ duration: false,
+ delay: false,
+ basePath: '',
+ template: '<div class="popover" role="tooltip"> <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,
+ autoscroll: this._options.autoscroll,
+ backdrop: this._options.backdrop,
+ backdropPadding: this._options.backdropPadding,
+ redirect: this._options.redirect,
+ orphan: this._options.orphan,
+ duration: this._options.duration,
+ delay: this._options.delay,
+ 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.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));
+ 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);
+ 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._inited = false;
+ _this._force = false;
+ _this._clearTimer();
+ if (_this._options.onEnd != null) {
+ return _this._options.onEnd(_this);
+ }
+ };
+ })(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');
+ 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.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;
+ 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 = $(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.removeClass('tour-step-element-reflex').off("" + (_this._reflexEvent(step.reflex)) + ".tour-" + _this._options.name);
+ }
+ if (step.backdrop) {
+ _this._hideBackdrop();
+ }
+ if (step.onHidden != null) {
+ return step.onHidden(_this);
+ }
+ };
+ })(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, showPopoverAndOverlay;
+ _this.setCurrentStep(i);
+ 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);
+ return;
+ }
+ if (_this._isOrphan(step)) {
+ if (!step.orphan) {
+ _this._debug("Skip the orphan step " + (_this._current + 1) + ".\nOrphan option is false and the element does not exist or is hidden.");
+ if (skipToPrevious) {
+ _this._showPrevStep();
+ } else {
+ _this._showNextStep();
+ }
+ return;
+ }
+ _this._debug("Show the orphan step " + (_this._current + 1) + ". Orphans option is true.");
+ }
+ if (step.backdrop) {
+ _this._showBackdrop(!_this._isOrphan(step) ? step.element : void 0);
+ }
+ showPopoverAndOverlay = function() {
+ if (_this.getCurrentStep() !== i) {
+ return;
+ }
+ if ((step.element != null) && step.backdrop) {
+ _this._showOverlayElement(step);
+ }
+ _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.autoscroll) {
+ _this._scrollIntoView(step.element, showPopoverAndOverlay);
+ } else {
+ showPopoverAndOverlay();
+ }
+ if (step.duration) {
+ return _this.resume();
+ }
+ };
+ })(this);
+ if (step.delay) {
+ this._debug("Wait " + step.delay + " milliseconds to show the step " + (this._current + 1));
+ window.setTimeout((function(_this) {
+ return function() {
+ return _this._callOnPromiseDone(promise, showStepHelper);
+ };
+ })(this), step.delay);
+ } else {
+ 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._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);
+ };
+ })(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);
+ };
+ })(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, $tip, isOrphan, options;
+ $(".tour-" + this._options.name).remove();
+ options = $.extend({}, this._options);
+ isOrphan = this._isOrphan(step);
+ step.template = this._template(step, i);
+ if (isOrphan) {
+ step.element = 'body';
+ step.placement = 'top';
+ }
+ $element = $(step.element);
+ $element.addClass("tour-" + this._options.name + "-element tour-" + this._options.name + "-" + i + "-element");
+ if (step.options) {
+ $.extend(options, step.options);
+ }
+ if (step.reflex && !isOrphan) {
+ $element.addClass('tour-step-element-reflex');
+ $element.off("" + (this._reflexEvent(step.reflex)) + ".tour-" + this._options.name);
+ $element.on("" + (this._reflexEvent(step.reflex)) + ".tour-" + this._options.name, (function(_this) {
+ return function() {
+ if (_this._isLast()) {
+ return _this.next();
+ } else {
+ return _this.end();
+ }
+ };
+ })(this));
+ }
+ $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._template = function(step, i) {
+ var $navigation, $next, $prev, $resume, $template;
+ $template = $.isFunction(step.template) ? $(step.template(i, step)) : $(step.template);
+ $navigation = $template.find('.popover-navigation');
+ $prev = $navigation.find('[data-role="prev"]');
+ $next = $navigation.find('[data-role="next"]');
+ $resume = $navigation.find('[data-role="pause-resume"]');
+ if (this._isOrphan(step)) {
+ $template.addClass('orphan');
+ }
+ $template.addClass("tour-" + this._options.name + " tour-" + this._options.name + "-" + i);
+ if (step.prev < 0) {
+ $prev.addClass('disabled');
+ }
+ if (step.next < 0) {
+ $next.addClass('disabled');
+ }
+ if (!step.duration) {
+ $resume.remove();
+ }
+ return $template.clone().wrap('<div>').parent().html();
+ };
+
+ Tour.prototype._reflexEvent = function(reflex) {
+ if ({}.toString.call(reflex) === '[object Boolean]') {
+ return 'click';
+ } else {
+ return reflex;
+ }
+ };
+
+ 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');
+ }
+ } else {
+ if (originalTop !== tipOffset.top) {
+ return this._replaceArrow($tip, (tipOffset.top - originalTop) * 2, offsetHeight, 'top');
+ }
+ }
+ };
+
+ 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.\nAnimation end element offset: " + ($element.offset().top) + ".\nWindow 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']").off("click.tour-" + this._options.name, ".popover.tour-" + this._options.name + " *[data-role='next']").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']", (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']", (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 {
+ return _this.pause();
+ }
+ });
+ };
+
+ 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();
+ }
+ 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) {
+ if (promise) {
+ return promise.then((function(_this) {
+ return function(e) {
+ return cb.call(_this, arg);
+ };
+ })(this));
+ } else {
+ return cb.call(this, arg);
+ }
+ };
+
+ 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() {
+ if (this.backdrop) {
+ this.backdrop.remove();
+ this.backdrop.overlay = null;
+ return this.backdrop.backgroundShown = false;
+ }
+ };
+
+ Tour.prototype._showOverlayElement = function(step) {
+ var $element, elementData;
+ $element = $(step.element);
+ if (!$element || $element.length === 0 || this.backdrop.overlayElementShown) {
+ return;
+ }
+ this.backdrop.overlayElementShown = true;
+ this.backdrop.$element = $element.addClass('tour-step-backdrop');
+ this.backdrop.$background = $('<div>', {
+ "class": 'tour-step-background'
+ });
+ elementData = {
+ width: $element.innerWidth(),
+ height: $element.innerHeight(),
+ offset: $element.offset()
+ };
+ this.backdrop.$background.appendTo('body');
+ if (step.backdropPadding) {
+ elementData = this._applyBackdropPadding(step.backdropPadding, elementData);
+ }
+ return this.backdrop.$background.width(elementData.width).height(elementData.height).offset(elementData.offset);
+ };
+
+ 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._applyBackdropPadding = function(padding, data) {
+ if (typeof padding === 'object') {
+ if (padding.top == null) {
+ padding.top = 0;
+ }
+ if (padding.right == null) {
+ padding.right = 0;
+ }
+ if (padding.bottom == null) {
+ padding.bottom = 0;
+ }
+ if (padding.left == null) {
+ padding.left = 0;
+ }
+ data.offset.top = data.offset.top - padding.top;
+ data.offset.left = data.offset.left - padding.left;
+ data.width = data.width + padding.left + padding.right;
+ data.height = data.height + padding.top + padding.bottom;
+ } else {
+ data.offset.top = data.offset.top - padding;
+ data.offset.left = data.offset.left - padding;
+ data.width = data.width + (padding * 2);
+ data.height = data.height + (padding * 2);
+ }
+ return data;
+ };
+
+ Tour.prototype._clearTimer = function() {
+ window.clearTimeout(this._timer);
+ this._timer = null;
+ return this._duration = null;
+ };
+
+ return Tour;
+
+ })();
+ return window.Tour = Tour;
+})(jQuery, window);
diff --git a/web/theme/js/bootstrap-tour.min.js b/web/theme/js/bootstrap-tour.min.js
@@ -0,0 +1,22 @@
+/* ========================================================================
+ * bootstrap-tour - v0.10.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.
+ * ========================================================================
+ */
+
+!function(t,e){var o,n;return n=e.document,o=function(){function o(o){var n;try{n=e.localStorage}catch(i){n=!1}this._options=t.extend({name:"tour",steps:[],container:"body",autoscroll:!0,keyboard:!0,storage:n,debug:!1,backdrop:!1,backdropPadding:0,redirect:!0,orphan:!1,duration:!1,delay:!1,basePath:"",template:'<div class="popover" role="tooltip"> <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(){},afterGetState:function(){},afterRemoveState:function(){},onStart:function(){},onEnd:function(){},onShow:function(){},onShown:function(){},onHide:function(){},onHidden:function(){},onNext:function(){},onPrev:function(){},onPause:function(){},onResume:function(){}},o),this._force=!1,this._inited=!1,this.backdrop={overlay:null,$element:null,$background:null,backgroundShown:!1,overlayElementShown:!1}}return o.prototype.addSteps=function(t){var e,o,n;for(o=0,n=t.length;n>o;o++)e=t[o],this.addStep(e);return this},o.prototype.addStep=function(t){return this._options.steps.push(t),this},o.prototype.getStep=function(e){return null!=this._options.steps[e]?t.extend({id:"step-"+e,path:"",placement:"right",title:"",content:"<p></p>",next:e===this._options.steps.length-1?-1:e+1,prev:e-1,animation:!0,container:this._options.container,autoscroll:this._options.autoscroll,backdrop:this._options.backdrop,backdropPadding:this._options.backdropPadding,redirect:this._options.redirect,orphan:this._options.orphan,duration:this._options.duration,delay:this._options.delay,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[e]):void 0},o.prototype.init=function(t){return this._force=t,this.ended()?(this._debug("Tour ended, init prevented."),this):(this.setCurrentStep(),this._initMouseNavigation(),this._initKeyboardNavigation(),this._onResize(function(t){return function(){return t.showStep(t._current)}}(this)),null!==this._current&&this.showStep(this._current),this._inited=!0,this)},o.prototype.start=function(t){var e;return null==t&&(t=!1),this._inited||this.init(t),null===this._current&&(e=this._makePromise(null!=this._options.onStart?this._options.onStart(this):void 0),this._callOnPromiseDone(e,this.showStep,0)),this},o.prototype.next=function(){var t;return t=this.hideStep(this._current),this._callOnPromiseDone(t,this._showNextStep)},o.prototype.prev=function(){var t;return t=this.hideStep(this._current),this._callOnPromiseDone(t,this._showPrevStep)},o.prototype.goTo=function(t){var e;return e=this.hideStep(this._current),this._callOnPromiseDone(e,this.showStep,t)},o.prototype.end=function(){var o,i;return o=function(o){return function(){return t(n).off("click.tour-"+o._options.name),t(n).off("keyup.tour-"+o._options.name),t(e).off("resize.tour-"+o._options.name),o._setState("end","yes"),o._inited=!1,o._force=!1,o._clearTimer(),null!=o._options.onEnd?o._options.onEnd(o):void 0}}(this),i=this.hideStep(this._current),this._callOnPromiseDone(i,o)},o.prototype.ended=function(){return!this._force&&!!this._getState("end")},o.prototype.restart=function(){return this._removeState("current_step"),this._removeState("end"),this.start()},o.prototype.pause=function(){var t;return t=this.getStep(this._current),t&&t.duration?(this._paused=!0,this._duration-=(new Date).getTime()-this._start,e.clearTimeout(this._timer),this._debug("Paused/Stopped step "+(this._current+1)+" timer ("+this._duration+" remaining)."),null!=t.onPause?t.onPause(this,this._duration):void 0):this},o.prototype.resume=function(){var t;return t=this.getStep(this._current),t&&t.duration?(this._paused=!1,this._start=(new Date).getTime(),this._duration=this._duration||t.duration,this._timer=e.setTimeout(function(t){return function(){return t._isLast()?t.next():t.end()}}(this),this._duration),this._debug("Started step "+(this._current+1)+" timer with duration "+this._duration),null!=t.onResume&&this._duration!==t.duration?t.onResume(this,this._duration):void 0):this},o.prototype.hideStep=function(e){var o,n,i;return(i=this.getStep(e))?(this._clearTimer(),n=this._makePromise(null!=i.onHide?i.onHide(this,e):void 0),o=function(o){return function(){var n;return n=t(i.element),n.data("bs.popover")||n.data("popover")||(n=t("body")),n.popover("destroy").removeClass("tour-"+o._options.name+"-element tour-"+o._options.name+"-"+e+"-element"),i.reflex&&n.removeClass("tour-step-element-reflex").off(""+o._reflexEvent(i.reflex)+".tour-"+o._options.name),i.backdrop&&o._hideBackdrop(),null!=i.onHidden?i.onHidden(o):void 0}}(this),this._callOnPromiseDone(n,o),n):void 0},o.prototype.showStep=function(t){var o,i,r,s;return this.ended()?(this._debug("Tour ended, showStep prevented."),this):(s=this.getStep(t))?(r=t<this._current,o=this._makePromise(null!=s.onShow?s.onShow(this,t):void 0),i=function(e){return function(){var o,i,a;if(e.setCurrentStep(t),i=function(){switch({}.toString.call(s.path)){case"[object Function]":return s.path();case"[object String]":return this._options.basePath+s.path;default:return s.path}}.call(e),o=[n.location.pathname,n.location.hash].join(""),e._isRedirect(i,o))return e._redirect(s,i),void 0;if(e._isOrphan(s)){if(!s.orphan)return e._debug("Skip the orphan step "+(e._current+1)+".\nOrphan option is false and the element does not exist or is hidden."),r?e._showPrevStep():e._showNextStep(),void 0;e._debug("Show the orphan step "+(e._current+1)+". Orphans option is true.")}return s.backdrop&&e._showBackdrop(e._isOrphan(s)?void 0:s.element),a=function(){return e.getCurrentStep()===t?(null!=s.element&&s.backdrop&&e._showOverlayElement(s),e._showPopover(s,t),null!=s.onShown&&s.onShown(e),e._debug("Step "+(e._current+1)+" of "+e._options.steps.length)):void 0},s.autoscroll?e._scrollIntoView(s.element,a):a(),s.duration?e.resume():void 0}}(this),s.delay?(this._debug("Wait "+s.delay+" milliseconds to show the step "+(this._current+1)),e.setTimeout(function(t){return function(){return t._callOnPromiseDone(o,i)}}(this),s.delay)):this._callOnPromiseDone(o,i),o):void 0},o.prototype.getCurrentStep=function(){return this._current},o.prototype.setCurrentStep=function(t){return null!=t?(this._current=t,this._setState("current_step",t)):(this._current=this._getState("current_step"),this._current=null===this._current?null:parseInt(this._current,10)),this},o.prototype._setState=function(t,e){var o,n;if(this._options.storage){n=""+this._options.name+"_"+t;try{this._options.storage.setItem(n,e)}catch(i){o=i,o.code===DOMException.QUOTA_EXCEEDED_ERR&&this._debug("LocalStorage quota exceeded. State storage failed.")}return this._options.afterSetState(n,e)}return null==this._state&&(this._state={}),this._state[t]=e},o.prototype._removeState=function(t){var e;return this._options.storage?(e=""+this._options.name+"_"+t,this._options.storage.removeItem(e),this._options.afterRemoveState(e)):null!=this._state?delete this._state[t]:void 0},o.prototype._getState=function(t){var e,o;return this._options.storage?(e=""+this._options.name+"_"+t,o=this._options.storage.getItem(e)):null!=this._state&&(o=this._state[t]),(void 0===o||"null"===o)&&(o=null),this._options.afterGetState(t,o),o},o.prototype._showNextStep=function(){var t,e,o;return o=this.getStep(this._current),e=function(t){return function(){return t.showStep(o.next)}}(this),t=this._makePromise(null!=o.onNext?o.onNext(this):void 0),this._callOnPromiseDone(t,e)},o.prototype._showPrevStep=function(){var t,e,o;return o=this.getStep(this._current),e=function(t){return function(){return t.showStep(o.prev)}}(this),t=this._makePromise(null!=o.onPrev?o.onPrev(this):void 0),this._callOnPromiseDone(t,e)},o.prototype._debug=function(t){return this._options.debug?e.console.log("Bootstrap Tour '"+this._options.name+"' | "+t):void 0},o.prototype._isRedirect=function(t,e){return null!=t&&""!==t&&("[object RegExp]"==={}.toString.call(t)&&!t.test(e)||"[object String]"==={}.toString.call(t)&&t.replace(/\?.*$/,"").replace(/\/?$/,"")!==e.replace(/\/?$/,""))},o.prototype._redirect=function(e,o){return t.isFunction(e.redirect)?e.redirect.call(this,o):e.redirect===!0?(this._debug("Redirect to "+o),n.location.href=o):void 0},o.prototype._isOrphan=function(e){return null==e.element||!t(e.element).length||t(e.element).is(":hidden")&&"http://www.w3.org/2000/svg"!==t(e.element)[0].namespaceURI},o.prototype._isLast=function(){return this._current<this._options.steps.length-1},o.prototype._showPopover=function(e,o){var n,i,r,s;return t(".tour-"+this._options.name).remove(),s=t.extend({},this._options),r=this._isOrphan(e),e.template=this._template(e,o),r&&(e.element="body",e.placement="top"),n=t(e.element),n.addClass("tour-"+this._options.name+"-element tour-"+this._options.name+"-"+o+"-element"),e.options&&t.extend(s,e.options),e.reflex&&!r&&(n.addClass("tour-step-element-reflex"),n.off(""+this._reflexEvent(e.reflex)+".tour-"+this._options.name),n.on(""+this._reflexEvent(e.reflex)+".tour-"+this._options.name,function(t){return function(){return t._isLast()?t.next():t.end()}}(this))),n.popover({placement:e.placement,trigger:"manual",title:e.title,content:e.content,html:!0,animation:e.animation,container:e.container,template:e.template,selector:e.element}).popover("show"),i=n.data("bs.popover")?n.data("bs.popover").tip():n.data("popover").tip(),i.attr("id",e.id),this._reposition(i,e),r?this._center(i):void 0},o.prototype._template=function(e,o){var n,i,r,s,a;return a=t.isFunction(e.template)?t(e.template(o,e)):t(e.template),n=a.find(".popover-navigation"),r=n.find('[data-role="prev"]'),i=n.find('[data-role="next"]'),s=n.find('[data-role="pause-resume"]'),this._isOrphan(e)&&a.addClass("orphan"),a.addClass("tour-"+this._options.name+" tour-"+this._options.name+"-"+o),e.prev<0&&r.addClass("disabled"),e.next<0&&i.addClass("disabled"),e.duration||s.remove(),a.clone().wrap("<div>").parent().html()},o.prototype._reflexEvent=function(t){return"[object Boolean]"==={}.toString.call(t)?"click":t},o.prototype._reposition=function(e,o){var i,r,s,a,p,u,h;if(a=e[0].offsetWidth,r=e[0].offsetHeight,h=e.offset(),p=h.left,u=h.top,i=t(n).outerHeight()-h.top-e.outerHeight(),0>i&&(h.top=h.top+i),s=t("html").outerWidth()-h.left-e.outerWidth(),0>s&&(h.left=h.left+s),h.top<0&&(h.top=0),h.left<0&&(h.left=0),e.offset(h),"bottom"===o.placement||"top"===o.placement){if(p!==h.left)return this._replaceArrow(e,2*(h.left-p),a,"left")}else if(u!==h.top)return this._replaceArrow(e,2*(h.top-u),r,"top")},o.prototype._center=function(o){return o.css("top",t(e).outerHeight()/2-o.outerHeight()/2)},o.prototype._replaceArrow=function(t,e,o,n){return t.find(".arrow").css(n,e?50*(1-e/o)+"%":"")},o.prototype._scrollIntoView=function(o,n){var i,r,s,a,p,u;return i=t(o),i.length?(r=t(e),a=i.offset().top,u=r.height(),p=Math.max(0,a-u/2),this._debug("Scroll into view. ScrollTop: "+p+". Element offset: "+a+". Window height: "+u+"."),s=0,t("body, html").stop(!0,!0).animate({scrollTop:Math.ceil(p)},function(t){return function(){return 2===++s?(n(),t._debug("Scroll into view.\nAnimation end element offset: "+i.offset().top+".\nWindow height: "+r.height()+".")):void 0}}(this))):n()},o.prototype._onResize=function(o,n){return t(e).on("resize.tour-"+this._options.name,function(){return clearTimeout(n),n=setTimeout(o,100)})},o.prototype._initMouseNavigation=function(){var e;return e=this,t(n).off("click.tour-"+this._options.name,".popover.tour-"+this._options.name+" *[data-role='prev']").off("click.tour-"+this._options.name,".popover.tour-"+this._options.name+" *[data-role='next']").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']",function(t){return function(e){return e.preventDefault(),t.next()}}(this)).on("click.tour-"+this._options.name,".popover.tour-"+this._options.name+" *[data-role='prev']",function(t){return function(e){return e.preventDefault(),t.prev()}}(this)).on("click.tour-"+this._options.name,".popover.tour-"+this._options.name+" *[data-role='end']",function(t){return function(e){return e.preventDefault(),t.end()}}(this)).on("click.tour-"+this._options.name,".popover.tour-"+this._options.name+" *[data-role='pause-resume']",function(o){var n;return o.preventDefault(),n=t(this),n.text(e._paused?n.data("pause-text"):n.data("resume-text")),e._paused?e.resume():e.pause()})},o.prototype._initKeyboardNavigation=function(){return this._options.keyboard?t(n).on("keyup.tour-"+this._options.name,function(t){return function(e){if(e.which)switch(e.which){case 39:return e.preventDefault(),t._isLast()?t.next():t.end();case 37:if(e.preventDefault(),t._current>0)return t.prev();break;case 27:return e.preventDefault(),t.end()}}}(this)):void 0},o.prototype._makePromise=function(e){return e&&t.isFunction(e.then)?e:null},o.prototype._callOnPromiseDone=function(t,e,o){return t?t.then(function(t){return function(){return e.call(t,o)}}(this)):e.call(this,o)},o.prototype._showBackdrop=function(){return this.backdrop.backgroundShown?void 0:(this.backdrop=t("<div>",{"class":"tour-backdrop"}),this.backdrop.backgroundShown=!0,t("body").append(this.backdrop))},o.prototype._hideBackdrop=function(){return this._hideOverlayElement(),this._hideBackground()},o.prototype._hideBackground=function(){return this.backdrop?(this.backdrop.remove(),this.backdrop.overlay=null,this.backdrop.backgroundShown=!1):void 0},o.prototype._showOverlayElement=function(e){var o,n;return o=t(e.element),o&&0!==o.length&&!this.backdrop.overlayElementShown?(this.backdrop.overlayElementShown=!0,this.backdrop.$element=o.addClass("tour-step-backdrop"),this.backdrop.$background=t("<div>",{"class":"tour-step-background"}),n={width:o.innerWidth(),height:o.innerHeight(),offset:o.offset()},this.backdrop.$background.appendTo("body"),e.backdropPadding&&(n=this._applyBackdropPadding(e.backdropPadding,n)),this.backdrop.$background.width(n.width).height(n.height).offset(n.offset)):void 0},o.prototype._hideOverlayElement=function(){return this.backdrop.overlayElementShown?(this.backdrop.$element.removeClass("tour-step-backdrop"),this.backdrop.$background.remove(),this.backdrop.$element=null,this.backdrop.$background=null,this.backdrop.overlayElementShown=!1):void 0},o.prototype._applyBackdropPadding=function(t,e){return"object"==typeof t?(null==t.top&&(t.top=0),null==t.right&&(t.right=0),null==t.bottom&&(t.bottom=0),null==t.left&&(t.left=0),e.offset.top=e.offset.top-t.top,e.offset.left=e.offset.left-t.left,e.width=e.width+t.left+t.right,e.height=e.height+t.top+t.bottom):(e.offset.top=e.offset.top-t,e.offset.left=e.offset.left-t,e.width=e.width+2*t,e.height=e.height+2*t),e},o.prototype._clearTimer=function(){return e.clearTimeout(this._timer),this._timer=null,this._duration=null},o}(),e.Tour=o}(jQuery,window);
+\ No newline at end of file
diff --git a/web/theme/js/serverConnect.js b/web/theme/js/serverConnect.js
@@ -0,0 +1,53 @@
+PNotify.prototype.options.styling = "bootstrap3";
+$("#menu-toggle").click(function(e) {
+ e.preventDefault();
+ $("#wrapper").toggleClass("toggled");
+});
+var ws = location.protocol+'//'+location.hostname+(location.port ? ':'+location.port: '');
+var socket = io(ws);
+$(document).off('click', '#restart').on('click', '#restart', function (e) {
+ console.log('restart fired');
+
+ socket.emit('command', {command: 'restartgame'});
+ e.preventDefault();
+});
+$(document).off('click', '#live_on').on('click', '#live_on', function (e) {
+ console.warn('LIVE!!!');
+
+ socket.emit('command', {command: 'live_on'});
+ e.preventDefault();
+});
+socket.on('alert', function (message) {
+ if (message.command == "live_on") {
+ PNotify.desktop.permission();
+ (new PNotify({
+ title: 'LIVE!!!',
+ text: "The game successfully started!",
+ type: 'success',
+ desktop: {
+ desktop: true
+ }
+ })).get().click(function(e) {
+ if ($('.ui-pnotify-closer, .ui-pnotify-sticker, .ui-pnotify-closer *, .ui-pnotify-sticker *').is(e.target)) return;
+ alert('Hey! You clicked the desktop notification!');
+ });
+ }else {
+
+ }
+});
+socket.on('status_alert', function (message) {
+ console.warn(typeof message)
+ console.warn(message)
+});
+$(document).off('click', '#check_status').on('click', '#check_status', function (e) {
+ console.log('Check Status');
+
+ socket.emit('command', {command: 'status'});
+ e.preventDefault();
+});
+$(document).off('click', '#add_server').on('click', '#add_server', function (e) {
+ console.log('Add Server');
+
+ socket.emit('command', {command: 'add_server'});
+ e.preventDefault();
+});
diff --git a/web/theme/js/tour.js b/web/theme/js/tour.js
@@ -0,0 +1,20 @@
+// Instance the tour
+var tour = new Tour({
+ steps: [
+ {
+ element: "#server_1",
+ title: "Title of my step",
+ content: "Content of my step"
+ },
+ {
+ element: "#server-data_1",
+ title: "Title of my step",
+ content: "Content of my step"
+ }
+]});
+
+// Initialize the tour
+tour.init();
+
+// Start the tour
+tour.start();
