diff --git a/config.xml b/config.xml index 199d017..6786484 100644 --- a/config.xml +++ b/config.xml @@ -2,7 +2,7 @@ welcome - + diff --git a/js/src/OnBoarding.js b/js/src/OnBoarding.js index 40466e6..31fc041 100644 --- a/js/src/OnBoarding.js +++ b/js/src/OnBoarding.js @@ -36,7 +36,7 @@ class OnBoarding { * Display the needed elements for the current step. */ showCurrentStep() { - $('.onboarding-navbar').toggleClass('displayed', this.isShutDown === true); + $('.onboarding-navbar').toggleClass('displayed', !!this.isShutDown); $('.onboarding-advancement').toggle(this.isShutDown === false); $('.onboarding-popup').remove(); $('.onboarding-tooltip').remove(); @@ -47,7 +47,10 @@ class OnBoarding { if ($('#nav-sidebar').length) { $('#nav-sidebar').css('padding-bottom', `${onBoardingHeight + 50}px`); } else { - $('nav.nav-bar ul.main-menu').css('margin-bottom', `${onBoardingHeight}px`); + $('nav.nav-bar ul.main-menu').css( + 'margin-bottom', + `${onBoardingHeight}px`, + ); } if (!this.isShutDown) { @@ -60,7 +63,9 @@ class OnBoarding { this.placeToolTip(step); } - $('.onboarding-advancement').toggle($.inArray('hideFooter', step.options) === -1); + $('.onboarding-advancement').toggle( + $.inArray('hideFooter', step.options) === -1, + ); this.updateAdvancement(); } else { $('.onboarding-advancement').toggle(false); @@ -99,19 +104,19 @@ class OnBoarding { * @param {int} stepIndex Step index */ gotoStep(stepIndex) { - this.save({action: 'setCurrentStep', value: stepIndex}, ((error) => { + this.save({action: 'setCurrentStep', value: stepIndex}, (error) => { if (!error) { const currentStep = this.getStep(this.currentStep); const nextStep = this.getStep(stepIndex); - if (nextStep === null) { + if (!nextStep) { $('.onboarding-popup').remove(); $('.onboarding-navbar').remove(); $('.onboarding-tooltip').remove(); return; } - if (currentStep.action !== null) { + if (currentStep.action) { $(currentStep.action.selector)[currentStep.action.action](); } else { this.currentStep += 1; @@ -122,7 +127,7 @@ class OnBoarding { } } } - })); + }); } getTokenAsString(redirectUrl) { @@ -160,8 +165,10 @@ class OnBoarding { static parseQueryString(queryString) { const queryStringParts = queryString.split('&'); const queryParams = {}; - let parts; let i; let key; let - value; + let parts; + let i; + let key; + let value; for (i = 0; i < queryStringParts.length; i += 1) { parts = queryStringParts[i].split('='); [key, value] = parts; @@ -192,14 +199,17 @@ class OnBoarding { * Stop the OnBoarding */ stop() { - this.save({action: 'setCurrentStep', value: this.getTotalSteps()}, (error) => { - if (!error) { - $('.onboarding-advancement').remove(); - $('.onboarding-navbar').remove(); - $('.onboarding-popup').remove(); - $('.onboarding-tooltip').remove(); - } - }); + this.save( + {action: 'setCurrentStep', value: this.getTotalSteps()}, + (error) => { + if (!error) { + $('.onboarding-advancement').remove(); + $('.onboarding-navbar').remove(); + $('.onboarding-popup').remove(); + $('.onboarding-tooltip').remove(); + } + }, + ); } /** @@ -211,7 +221,10 @@ class OnBoarding { this.steps.groups.forEach((group) => { group.steps.forEach((step) => { - if (stepCount <= this.currentStep && $.inArray('savepoint', step.options) !== -1) { + if ( + stepCount <= this.currentStep + && $.inArray('savepoint', step.options) !== -1 + ) { lastSavePointStep = stepCount; } stepCount += 1; @@ -329,11 +342,13 @@ class OnBoarding { method: 'POST', url: this.apiLocation, data: settings, - }).done((result) => { - callback(result !== '0'); - }).fail(() => { - callback(true); - }); + }) + .done((result) => { + callback(result !== '0'); + }) + .fail(() => { + callback(true); + }); } /** @@ -345,11 +360,13 @@ class OnBoarding { let totalSteps = 0; this.steps.groups.forEach((group, index) => { - const positionOnChunk = Math.min((this.currentStep + 1) - totalSteps, group.steps.length); - advancementFooter.find(`.group-${index} .advancement`).css( - 'width', - `${(positionOnChunk / group.steps.length) * 100}%`, + const positionOnChunk = Math.min( + this.currentStep + 1 - totalSteps, + group.steps.length, ); + advancementFooter + .find(`.group-${index} .advancement`) + .css('width', `${(positionOnChunk / group.steps.length) * 100}%`); totalSteps += group.steps.length; if (positionOnChunk === group.steps.length) { const id = advancementFooter.find(`.group-${index} .id`); @@ -359,29 +376,40 @@ class OnBoarding { } }); - advancementFooter.find('.group-title').html( - `${this.getCurrentGroupID() + 1}/${this.getTotalGroups() - } - ${ - this.getGroupForStep(this.currentStep).title}`, - ); + advancementFooter + .find('.group-title') + .html( + `${this.getCurrentGroupID() + 1}/${this.getTotalGroups()} - ${ + this.getGroupForStep(this.currentStep).title + }`, + ); if (this.getGroupForStep(this.currentStep).subtitle) { if (this.getGroupForStep(this.currentStep).subtitle[1]) { - advancementFooter.find('.step-title-1').html( - `check ${ - this.getGroupForStep(this.currentStep).subtitle[1]}`, - ); + advancementFooter + .find('.step-title-1') + .html( + `check ${ + this.getGroupForStep(this.currentStep).subtitle[1] + }`, + ); } if (this.getGroupForStep(this.currentStep).subtitle[2]) { - advancementFooter.find('.step-title-2').html( - `check ${ - this.getGroupForStep(this.currentStep).subtitle[2]}`, - ); + advancementFooter + .find('.step-title-2') + .html( + `check ${ + this.getGroupForStep(this.currentStep).subtitle[2] + }`, + ); } } const totalAdvancement = this.currentStep / this.getTotalSteps(); - advancementNav.find('.text').find('.text-right').html(`${Math.floor(totalAdvancement * 100)}%`); + advancementNav + .find('.text') + .find('.text-right') + .html(`${Math.floor(totalAdvancement * 100)}%`); advancementNav.find('.progress-bar').width(`${totalAdvancement * 100}%`); } @@ -422,7 +450,7 @@ class OnBoarding { $('.onboarding-tooltip').remove(); } - this.save({action: 'setShutDown', value: this.isShutDown}, ((error) => { + this.save({action: 'setShutDown', value: this.isShutDown}, (error) => { if (!error) { if (this.isShutDown === 0) { if (OnBoarding.isCurrentPage(this.getStep(this.currentStep).page)) { @@ -432,7 +460,7 @@ class OnBoarding { } } } - })); + }); } /** @@ -489,7 +517,6 @@ class OnBoarding { this.updateToolTipPosition(step); }, 100); - this.tooltip.show(); this.tooltip.addClass(`-${step.position}`); @@ -498,7 +525,9 @@ class OnBoarding { const currentStepIDOnGroup = this.getCurrentStepIDOnGroup(); const groupStepsCount = this.getGroupForStep(this.currentStep).steps.length; - this.tooltip.find('.count').html(`${currentStepIDOnGroup + 1}/${groupStepsCount}`); + this.tooltip + .find('.count') + .html(`${currentStepIDOnGroup + 1}/${groupStepsCount}`); const bullsContainer = this.tooltip.find('.bulls'); for (let idStep = 0; idStep < groupStepsCount; idStep += 1) { @@ -513,8 +542,11 @@ class OnBoarding { } setTimeout(() => { - if (this.tooltipElement.offset().top > ((window.screen.height / 2) - 200)) { - window.scrollTo(0, this.tooltipElement.offset().top - ((window.screen.height / 2) - 200)); + if (this.tooltipElement.offset().top > window.screen.height / 2 - 200) { + window.scrollTo( + 0, + this.tooltipElement.offset().top - (window.screen.height / 2 - 200), + ); } }, 200); @@ -525,15 +557,20 @@ class OnBoarding { * Update the position of the tooltip. */ updateToolTipPosition() { - const middleX = this.tooltipElement.offset().top - - (this.tooltipElement.outerHeight() / 2) - - (this.tooltip.outerHeight() / 2); - const middleY = this.tooltipElement.offset().top - + (this.tooltipElement.outerHeight() / 2) - - (this.tooltip.outerHeight() / 2); - const topY = this.tooltipElement.offset().top - + (this.tooltipElement.outerHeight() / 2) - - (this.tooltip.outerHeight() / 2); + /* eslint-disable */ + const middleX = + this.tooltipElement.offset().top - + this.tooltipElement.outerHeight() / 2 - + this.tooltip.outerHeight() / 2; + const middleY = + this.tooltipElement.offset().top + + this.tooltipElement.outerHeight() / 2 - + this.tooltip.outerHeight() / 2; + const topY = + this.tooltipElement.offset().top + + this.tooltipElement.outerHeight() / 2 - + this.tooltip.outerHeight() / 2; + /* eslint-enable */ const leftX = this.tooltipElement.offset().left - this.tooltip.outerWidth(); const rightX = this.tooltipElement.offset().left + this.tooltipElement.outerWidth(); diff --git a/public/module.css b/public/module.css index 03a62a5..3283ed5 100644 --- a/public/module.css +++ b/public/module.css @@ -1 +1 @@ -.onboarding-advancement{font-family:Open Sans,sans-serif;font-weight:400;position:fixed;background:#dff5f9;height:6.875rem;bottom:0;right:0;left:13.125rem;z-index:1499}.onboarding-advancement .btn-primary{background:#25b9d7;background:#25b9d7!important}.onboarding-advancement .col-md-8{padding-left:.9375rem}.onboarding-advancement .group-title{font-weight:700;font-family:Open Sans,sans-serif;color:#363a41;font-size:1rem;margin-top:.625rem}.onboarding-advancement .step-title{font-size:.875rem;line-height:1.25rem}.onboarding-advancement .step-title .material-icons{color:#25b9d7;font-size:1.125rem;vertical-align:bottom;margin-bottom:.0625rem}.onboarding-advancement .onboarding-button-next{position:absolute;right:.625rem;top:1.25rem}.onboarding-advancement .onboarding-button-shut-down{position:absolute;right:.625rem;bottom:1.875rem;color:#363a41;font-size:.6875rem;cursor:pointer}.onboarding-advancement>.advancement-groups{width:100%}.onboarding-advancement>.advancement-groups>.group{float:left;height:.625rem;background:#363a41;position:relative}.onboarding-advancement>.advancement-groups>.group>.advancement{height:.625rem;background:#25b9d7;-webkit-transition:all .8s;-moz-transition:all .8s;transition:all .8s}.onboarding-advancement>.advancement-groups>.group>.id{position:absolute;box-sizing:border-box;background-color:#363a41;border:.0625rem solid #dff5f9;border-radius:1.25rem;text-align:center;vertical-align:middle;line-height:1.25rem;height:1.25rem;width:1.25rem;color:#fff;font-size:.75rem;right:-.0625rem;top:-.3125rem;z-index:1}.onboarding-advancement>.advancement-groups>.group>.id.-done{background-color:#25b9d7}.onboarding-navbar,.page-sidebar-closed .onboarding-navbar.displayed{display:none}.onboarding-navbar.displayed{display:block;font-weight:400;box-sizing:border-box;width:210px;padding:.625rem;padding-bottom:2.1875rem;background:#292c32;position:fixed;bottom:0;font-size:.6875rem;text-align:center}.onboarding-navbar.displayed>.text{text-align:left;color:#95a7ad;padding-bottom:.625rem}.onboarding-navbar.displayed .onboarding-button-resume{background:#1e2024;color:#95a7ad}.onboarding-navbar.displayed .btn{background:#1e2024;color:#95a7ad;text-transform:uppercase;margin:0 auto;font-size:.625rem;padding:.375rem .9375rem}.onboarding-navbar.displayed .btn:hover{color:#95a7ad!important}.onboarding-navbar.displayed .btn.-small{margin-top:.125rem;font-size:.5rem;padding:.25rem;background:#292c32;font-size:.625rem!important;text-transform:none;color:#95a7ad!important}.onboarding-navbar.displayed .btn.-small:hover{color:#95a7ad!important;text-decoration:underline}.onboarding-navbar.displayed>.btn.-small:hover{text-decoration:underline}.onboarding-navbar.displayed>.progress{border-radius:.5rem;height:.5rem;background:#1e2024}.onboarding-navbar.displayed>.progress>.bar{border-radius:.5rem;background:#fbb000;height:.5rem}.onboarding-tooltip{font-family:Open Sans,sans-serif;font-size:.875rem;position:absolute;box-sizing:border-box;opacity:1;padding:.625rem .625rem 3.125rem 2.375rem;width:18.125rem;min-height:9.375rem;z-index:1502;background:#dff5f9;border-radius:.3125rem;border:.0625rem solid #25b9d7}.onboarding-tooltip.-left{margin-left:-.75rem}.onboarding-tooltip.-left>.content:before{content:" ";position:absolute;top:.625rem;width:5.5rem;height:9.5625rem;background:url(eab7a4b5ee7f355e82c35a25542bb73d.png) no-repeat;background-size:5.5rem 9.5625rem;left:-3.8125rem;z-index:1}.onboarding-tooltip.-left:after{border:.75rem solid transparent;border-left-color:#dff5f9;margin-top:-.75rem}.onboarding-tooltip.-left:after,.onboarding-tooltip.-left:before{left:100%;top:50%;content:" ";height:0;width:0;position:absolute;pointer-events:none}.onboarding-tooltip.-left:before{border:.8125rem solid transparent;border-left-color:#25b9d7;margin-top:-.8125rem}.onboarding-tooltip.-right{margin-left:4.3125rem}.onboarding-tooltip.-right>.content:before{content:" ";position:absolute;top:.625rem;width:6.5rem;height:9.5625rem;background:url(ec967aeab4fe4dbcbffd8097dda2d17c.png) no-repeat;background-size:6.5rem 9.5625rem;left:-4.375rem;z-index:1}.onboarding-tooltip.-top{margin-top:-2.6875rem;margin-left:2.8125rem}.onboarding-tooltip.-top>.content:before{content:" ";position:absolute;top:.625rem;width:6.5rem;height:9.5625rem;background:url(eab7a4b5ee7f355e82c35a25542bb73d.png) no-repeat;background-size:6.5rem 9.5625rem;left:-4.375rem;z-index:1}.onboarding-tooltip.-top:after{border:.75rem solid transparent;border-left-color:#363a41;margin-top:-.75rem;margin-top:0}.onboarding-tooltip.-top:after,.onboarding-tooltip.-top:before{left:100%;top:50%;content:" ";height:0;width:0;position:absolute;pointer-events:none;left:50%;top:100%;transform:rotate(90deg)}.onboarding-tooltip.-top:before{border:.8125rem solid transparent;border-left-color:#25b9d7;margin-top:-.8125rem;margin-top:0}.onboarding-tooltip>.btn-primary{text-transform:uppercase;position:absolute;bottom:.3125rem;right:.3125rem;padding:0 .5rem;background:#25b9d7;color:#fff;font-size:.75rem;border-radius:.1875rem;border:none;vertical-align:middle;height:1.5625rem;line-height:1.5625rem}.onboarding-tooltipsteps{position:absolute;height:2.5rem;line-height:2.5rem;vertical-align:middle;bottom:0;left:0;right:0;background:#363a41;padding-left:3.125rem}.onboarding-tooltipsteps>.total{color:#25b9d7;font-size:.625rem}.onboarding-tooltipsteps>.bulls{text-align:center;position:absolute;top:0;left:0;right:0;bottom:0}.onboarding-tooltipsteps>.bulls>.bull{height:.375rem;width:.375rem;border-radius:.375rem;background:#bbcdd2;display:inline-block;margin:0 .0625rem .0625rem}.onboarding-tooltipsteps>.bulls>.bull.-current{background:#25b9d7}.onboarding-tooltipsteps>.bulls>.bull.-done{background:#6c868e}.onboarding-popup{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(54,58,65,.5);z-index:1500}.onboarding-popup>.content{position:absolute;width:35rem;left:50%;margin-left:-17.5rem;top:2.5rem;padding:0;background:#fff;box-shadow:.125rem .125rem .1875rem 0 rgba(0,0,0,.1)}.onboarding-welcome .welcome{background:url(bc6b8d0cfbf337b153ae599072112b00.png) top no-repeat;background-size:35rem 10.25rem;padding-top:164px;height:3.25rem;color:#000;font-size:1.5rem;text-align:center;margin-bottom:0}.onboarding-welcome>.content{padding-bottom:5.625rem;min-height:12.5rem;font-size:.875rem;background:url(5e07cbde941cc1e24cbabe1c9a6c995a.png) bottom no-repeat;background-size:15rem 5.0625rem;margin-top:2.5rem;display:flex;flex-direction:column}.onboarding-welcome>.content p{display:flex;text-align:center;align-self:center;width:25rem}.onboarding-welcome .started{display:flex;font-weight:600;font-size:1.0625rem;justify-content:center}.onboarding-welcome>.content{margin-bottom:1.25rem}.onboarding-welcome>.material-icons{color:#6c868e;position:absolute;top:.625rem;right:.9375rem;cursor:pointer;font-size:1.875rem}.onboarding-welcome .buttons{display:flex;justify-content:center;margin-bottom:1.5625rem}.onboarding-welcome .btn-primary.blue-balloon{background-color:#2eacce}.onboarding-welcome .btn-tertiary-outline{background:none;color:#2eacce;border:2px solid #2eacce;text-transform:uppercase;box-sizing:border-box;padding:9px 16px;margin-right:20px}.onboarding-popup h2{font-size:1.5rem}.onboarding-popup #onboarding-welcome.modal-header{padding:1.5rem}.onboarding-popup #onboarding-welcome.modal-header .close{color:#000;font-size:2.5rem;margin-top:-14px;margin-right:-5px;opacity:.4}.onboarding-popup #onboarding-welcome .btn{background-color:#2eacce;font-size:.9375rem;font-weight:400;letter-spacing:normal}.onboarding-popup #onboarding-welcome .link-container .close{color:#000;font-size:40px;margin-top:-15px}.onboarding-popup #onboarding-welcome .link-container .forum,.onboarding-popup #onboarding-welcome .link-container .starter-guide,.onboarding-popup #onboarding-welcome .link-container .training,.onboarding-popup #onboarding-welcome .link-container .video-tutorial{width:9.375rem;height:8.125rem}.onboarding-popup #onboarding-welcome .link-container .starter-guide{background:url(c02d68433654ed03d38fdc6c2ae90112.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .video-tutorial{background:url(a216149cc722f1e24b5d3d266d623a09.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .forum{background:url(5452c6f6a92bc810c6e73210adfece55.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .training{background:url(ca2f8d1c0c7a6830ef94b57264bc3b72.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .final-link{border-width:0;color:#363a41;display:block;font-weight:600;justify-content:center;padding:0;position:relative;margin-left:auto;margin-right:auto;text-align:center;width:9.375rem}.onboarding-popup #onboarding-welcome .link-container .final-link:hover{box-shadow:.125rem .125rem .25rem 0 rgba(0,0,0,.25)}.onboarding-popup #onboarding-welcome .link-container .final-link .link{bottom:0;line-height:16px;position:absolute;padding:10px;display:block;text-align:center;width:100%}#onboarding-welcome .final-link{display:block;border:1px solid #bbcdd2;border-radius:.1875rem;padding:1.25rem;margin:.4375rem 0;text-decoration:none}#onboarding-welcome .final-link>i{color:#bbcdd2;font-size:4rem;margin-bottom:1.5rem}.btn.with-spinner{position:relative}.btn.with-spinner.animated{outline-color:#fff}.btn.with-spinner.animated,.btn.with-spinner.animated:hover{border-color:#fff;background:#fff}.btn.with-spinner.animated:after{position:absolute;width:1.875rem;height:1.875rem;left:50%;top:50%;margin-top:-.9375rem;margin-left:-.9375rem;display:block;border:3px solid #25b9d7;border-top-color:transparent;border-radius:3.125rem;background:transparent;content:"";-webkit-animation:spin 4s linear infinite;-moz-animation:spin 4s linear infinite;animation:spin 4s linear infinite}@-moz-keyframes spin{to{-moz-transform:rotate(1turn)}}@-webkit-keyframes spin{to{-webkit-transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}} \ No newline at end of file +.onboarding-advancement{font-family:Open Sans,sans-serif;font-weight:400;position:fixed;background:#dff5f9;height:6.875rem;bottom:0;right:0;left:13.125rem;z-index:1499}.onboarding-advancement .btn-primary{background:#25b9d7;background:#25b9d7!important}.onboarding-advancement .col-md-8{padding-left:.9375rem}.onboarding-advancement .group-title{font-weight:700;font-family:Open Sans,sans-serif;color:#363a41;font-size:1rem;margin-top:.625rem}.onboarding-advancement .step-title{font-size:.875rem;line-height:1.25rem}.onboarding-advancement .step-title .material-icons{color:#25b9d7;font-size:1.125rem;vertical-align:bottom;margin-bottom:.0625rem}.onboarding-advancement .onboarding-button-next{position:absolute;right:.625rem;top:1.25rem}.onboarding-advancement .onboarding-button-shut-down{position:absolute;right:.625rem;bottom:1.875rem;color:#363a41;font-size:.6875rem;cursor:pointer}.onboarding-advancement>.advancement-groups{width:100%}.onboarding-advancement>.advancement-groups>.group{float:left;height:.625rem;background:#363a41;position:relative}.onboarding-advancement>.advancement-groups>.group>.advancement{height:.625rem;background:#25b9d7;-webkit-transition:all .8s;-moz-transition:all .8s;transition:all .8s}.onboarding-advancement>.advancement-groups>.group>.id{position:absolute;box-sizing:border-box;background-color:#363a41;border:.0625rem solid #dff5f9;border-radius:1.25rem;text-align:center;vertical-align:middle;line-height:1.25rem;height:1.25rem;width:1.25rem;color:#fff;font-size:.75rem;right:-.0625rem;top:-.3125rem;z-index:1}.onboarding-advancement>.advancement-groups>.group>.id.-done{background-color:#25b9d7}.onboarding-navbar,.page-sidebar-closed .onboarding-navbar.displayed{display:none}.onboarding-navbar.displayed{display:block;font-weight:400;box-sizing:border-box;width:210px;padding:.625rem;padding-bottom:2.1875rem;background:#292c32;position:fixed;bottom:0;font-size:.6875rem;text-align:center}.onboarding-navbar.displayed>.text{text-align:left;color:#95a7ad;padding-bottom:.625rem}.onboarding-navbar.displayed .onboarding-button-resume{background:#1e2024;color:#95a7ad}.onboarding-navbar.displayed .btn{background:#1e2024;color:#95a7ad;text-transform:uppercase;margin:0 auto;font-size:.625rem;padding:.375rem .9375rem}.onboarding-navbar.displayed .btn:hover{color:#95a7ad!important}.onboarding-navbar.displayed .btn.-small{margin-top:.125rem;font-size:.5rem;padding:.25rem;background:#292c32;font-size:.625rem!important;text-transform:none;color:#95a7ad!important}.onboarding-navbar.displayed .btn.-small:hover{color:#95a7ad!important;text-decoration:underline}.onboarding-navbar.displayed>.btn.-small:hover{text-decoration:underline}.onboarding-navbar.displayed>.progress{border-radius:.5rem;height:.5rem;background:#1e2024;margin-bottom:1rem}.onboarding-navbar.displayed>.progress>.bar{border-radius:.5rem;background:#fbb000;height:.5rem}.onboarding-tooltip{font-family:Open Sans,sans-serif;font-size:.875rem;position:absolute;box-sizing:border-box;opacity:1;padding:.625rem .625rem 3.125rem 2.375rem;width:18.125rem;min-height:9.375rem;z-index:1502;background:#dff5f9;border-radius:.3125rem;border:.0625rem solid #25b9d7}.onboarding-tooltip.-left{margin-left:-.75rem}.onboarding-tooltip.-left>.content:before{content:" ";position:absolute;top:.625rem;width:5.5rem;height:9.5625rem;background:url(eab7a4b5ee7f355e82c35a25542bb73d.png) no-repeat;background-size:5.5rem 9.5625rem;left:-3.8125rem;z-index:1}.onboarding-tooltip.-left:after{border:.75rem solid transparent;border-left-color:#dff5f9;margin-top:-.75rem}.onboarding-tooltip.-left:after,.onboarding-tooltip.-left:before{left:100%;top:50%;content:" ";height:0;width:0;position:absolute;pointer-events:none}.onboarding-tooltip.-left:before{border:.8125rem solid transparent;border-left-color:#25b9d7;margin-top:-.8125rem}.onboarding-tooltip.-right{margin-left:4.3125rem}.onboarding-tooltip.-right>.content:before{content:" ";position:absolute;top:.625rem;width:6.5rem;height:9.5625rem;background:url(ec967aeab4fe4dbcbffd8097dda2d17c.png) no-repeat;background-size:6.5rem 9.5625rem;left:-4.375rem;z-index:1}.onboarding-tooltip.-top{margin-top:-2.6875rem;margin-left:2.8125rem}.onboarding-tooltip.-top>.content:before{content:" ";position:absolute;top:.625rem;width:6.5rem;height:9.5625rem;background:url(eab7a4b5ee7f355e82c35a25542bb73d.png) no-repeat;background-size:6.5rem 9.5625rem;left:-4.375rem;z-index:1}.onboarding-tooltip.-top:after{border:.75rem solid transparent;border-left-color:#363a41;margin-top:-.75rem;margin-top:0}.onboarding-tooltip.-top:after,.onboarding-tooltip.-top:before{left:100%;top:50%;content:" ";height:0;width:0;position:absolute;pointer-events:none;left:50%;top:100%;transform:rotate(90deg)}.onboarding-tooltip.-top:before{border:.8125rem solid transparent;border-left-color:#25b9d7;margin-top:-.8125rem;margin-top:0}.onboarding-tooltip>.btn-primary{text-transform:uppercase;position:absolute;bottom:.3125rem;right:.3125rem;padding:0 .5rem;background:#25b9d7;color:#fff;font-size:.75rem;border-radius:.1875rem;border:none;vertical-align:middle;height:1.5625rem;line-height:1.5625rem}.onboarding-tooltipsteps{position:absolute;height:2.5rem;line-height:2.5rem;vertical-align:middle;bottom:0;left:0;right:0;background:#363a41;padding-left:3.125rem}.onboarding-tooltipsteps>.total{color:#25b9d7;font-size:.625rem}.onboarding-tooltipsteps>.bulls{text-align:center;position:absolute;top:0;left:0;right:0;bottom:0}.onboarding-tooltipsteps>.bulls>.bull{height:.375rem;width:.375rem;border-radius:.375rem;background:#bbcdd2;display:inline-block;margin:0 .0625rem .0625rem}.onboarding-tooltipsteps>.bulls>.bull.-current{background:#25b9d7}.onboarding-tooltipsteps>.bulls>.bull.-done{background:#6c868e}.onboarding-popup{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(54,58,65,.5);z-index:1500}.onboarding-popup>.content{position:absolute;width:35rem;left:50%;margin-left:-17.5rem;top:2.5rem;padding:0;background:#fff;box-shadow:.125rem .125rem .1875rem 0 rgba(0,0,0,.1)}.onboarding-welcome .welcome{background:url(bc6b8d0cfbf337b153ae599072112b00.png) top no-repeat;background-size:35rem 10.25rem;padding-top:164px;height:3.25rem;color:#000;font-size:1.5rem;text-align:center;margin-bottom:0}.onboarding-welcome>.content{padding-bottom:5.625rem;min-height:12.5rem;font-size:.875rem;background:url(5e07cbde941cc1e24cbabe1c9a6c995a.png) bottom no-repeat;background-size:15rem 5.0625rem;margin-top:2.5rem;display:flex;flex-direction:column}.onboarding-welcome>.content p{display:flex;text-align:center;align-self:center;width:25rem}.onboarding-welcome .started{display:flex;font-weight:600;font-size:1.0625rem;justify-content:center}.onboarding-welcome>.content{margin-bottom:1.25rem}.onboarding-welcome>.material-icons{color:#6c868e;position:absolute;top:.625rem;right:.9375rem;cursor:pointer;font-size:1.875rem}.onboarding-welcome .buttons{display:flex;justify-content:center;margin-bottom:1.5625rem}.onboarding-welcome .btn-primary.blue-balloon{background-color:#2eacce}.onboarding-welcome .btn-tertiary-outline{background:none;color:#2eacce;border:2px solid #2eacce;text-transform:uppercase;box-sizing:border-box;padding:9px 16px;margin-right:20px}.onboarding-popup h2{font-size:1.5rem}.onboarding-popup #onboarding-welcome.modal-header{padding:1.5rem}.onboarding-popup #onboarding-welcome.modal-header .close{color:#000;font-size:2.5rem;margin-top:-14px;margin-right:-5px;opacity:.4}.onboarding-popup #onboarding-welcome .btn{background-color:#2eacce;font-size:.9375rem;font-weight:400;letter-spacing:normal}.onboarding-popup #onboarding-welcome .link-container .close{color:#000;font-size:40px;margin-top:-15px}.onboarding-popup #onboarding-welcome .link-container .forum,.onboarding-popup #onboarding-welcome .link-container .starter-guide,.onboarding-popup #onboarding-welcome .link-container .training,.onboarding-popup #onboarding-welcome .link-container .video-tutorial{width:9.375rem;height:8.125rem}.onboarding-popup #onboarding-welcome .link-container .starter-guide{background:url(c02d68433654ed03d38fdc6c2ae90112.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .video-tutorial{background:url(a216149cc722f1e24b5d3d266d623a09.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .forum{background:url(5452c6f6a92bc810c6e73210adfece55.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .training{background:url(ca2f8d1c0c7a6830ef94b57264bc3b72.png) no-repeat}.onboarding-popup #onboarding-welcome .link-container .final-link{border-width:0;color:#363a41;display:block;font-weight:600;justify-content:center;padding:0;position:relative;margin-left:auto;margin-right:auto;text-align:center;width:9.375rem}.onboarding-popup #onboarding-welcome .link-container .final-link:hover{box-shadow:.125rem .125rem .25rem 0 rgba(0,0,0,.25)}.onboarding-popup #onboarding-welcome .link-container .final-link .link{bottom:0;line-height:16px;position:absolute;padding:10px;display:block;text-align:center;width:100%}#onboarding-welcome .final-link{display:block;border:1px solid #bbcdd2;border-radius:.1875rem;padding:1.25rem;margin:.4375rem 0;text-decoration:none}#onboarding-welcome .final-link>i{color:#bbcdd2;font-size:4rem;margin-bottom:1.5rem}.btn.with-spinner{position:relative}.btn.with-spinner.animated{outline-color:#fff}.btn.with-spinner.animated,.btn.with-spinner.animated:hover{border-color:#fff;background:#fff}.btn.with-spinner.animated:after{position:absolute;width:1.875rem;height:1.875rem;left:50%;top:50%;margin-top:-.9375rem;margin-left:-.9375rem;display:block;border:3px solid #25b9d7;border-top-color:transparent;border-radius:3.125rem;background:transparent;content:"";-webkit-animation:spin 4s linear infinite;-moz-animation:spin 4s linear infinite;animation:spin 4s linear infinite}@-moz-keyframes spin{to{-moz-transform:rotate(1turn)}}@-webkit-keyframes spin{to{-webkit-transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}} \ No newline at end of file diff --git a/public/module.js b/public/module.js index 09ddff5..a96df89 100644 --- a/public/module.js +++ b/public/module.js @@ -1 +1 @@ -!function(t){function e(n){if(o[n])return o[n].exports;var i=o[n]={exports:{},id:n,loaded:!1};return t[n].call(i.exports,i,i.exports,e),i.loaded=!0,i.exports}var o={};return e.m=t,e.c=o,e.p="",e(0)}({0:function(t,e,o){t.exports=o(1)},1:function(t,e,o){"use strict";o(2),o(16)},2:function(t,e){},16:function(t,e,o){(function(e){t.exports=e.OnBoarding=o(17)}).call(e,function(){return this}())},17:function(t,e){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var n=function(){function t(t,e){var o=[],n=!0,i=!1,r=void 0;try{for(var s,a=t[Symbol.iterator]();!(n=(s=a.next()).done)&&(o.push(s.value),!e||o.length!==e);n=!0);}catch(t){i=!0,r=t}finally{try{!n&&a.return&&a.return()}finally{if(i)throw r}}return o}return function(e,o){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return t(e,o);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),i=function(){function t(t,e){for(var o=0;o1&&void 0!==arguments[1]?arguments[1]:"",o=$(this.templates[t]);""!==e&&o.find(".content").html(e),$("body").prepend(o)}},{key:"gotoNextStep",value:function(){this.gotoStep(this.currentStep+1)}},{key:"gotoStep",value:function(e){var o=this;this.save({action:"setCurrentStep",value:e},function(n){if(!n){var i=o.getStep(o.currentStep),r=o.getStep(e);if(null===r)return $(".onboarding-popup").remove(),$(".onboarding-navbar").remove(),void $(".onboarding-tooltip").remove();null!==i.action?$(i.action.selector)[i.action.action]():(o.currentStep+=1,t.isCurrentPage(r.page)?o.showCurrentStep():window.location.href=o.getRedirectUrl(r))}})}},{key:"getTokenAsString",value:function(e){var o=void 0;o=e.indexOf("?")!==-1?"&":"?";var n=window.location.search.substr(1),i=t.getSecurityTokens(n),r=o;return void 0!==i._token&&(r=r+"&_token="+i._token),r}},{key:"getRedirectUrl",value:function(t){var e=void 0;if(Array.isArray(t.page)){var o=n(t.page,1);e=o[0]}else e=t.page;return e+this.getTokenAsString(e)}},{key:"stop",value:function(){this.save({action:"setCurrentStep",value:this.getTotalSteps()},function(t){t||($(".onboarding-advancement").remove(),$(".onboarding-navbar").remove(),$(".onboarding-popup").remove(),$(".onboarding-tooltip").remove())})}},{key:"gotoLastSavePoint",value:function(){var t=this,e=0,o=0;this.steps.groups.forEach(function(n){n.steps.forEach(function(n){o<=t.currentStep&&$.inArray("savepoint",n.options)!==-1&&(e=o),o+=1})}),this.gotoStep(e)}},{key:"getGroupForStep",value:function(t){return this.getElementForStep(t,"group")}},{key:"getCurrentGroupID",value:function(){var t=this,e=0,o=0,n=0;return this.steps.groups.forEach(function(i){i.steps.forEach(function(){o===t.currentStep&&(n=e),o+=1}),e+=1}),n}},{key:"getCurrentStepIDOnGroup",value:function(){var t=this,e=0,o=0,n=0;return this.steps.groups.forEach(function(i){n=0,i.steps.forEach(function(){e===t.currentStep&&(o=n),n+=1,e+=1})}),o}},{key:"getStep",value:function(t){return this.getElementForStep(t,"step")}},{key:"getElementForStep",value:function(t,e){var o=0,n=null;return this.steps.groups.forEach(function(i){i.steps.forEach(function(r){o===t&&("step"===e?n=r:"group"===e&&(n=i)),o+=1})}),n}},{key:"save",value:function(t,e){$.ajax({method:"POST",url:this.apiLocation,data:t}).done(function(t){e("0"!==t)}).fail(function(){e(!0)})}},{key:"updateAdvancement",value:function(){var t=this,e=$(".onboarding-advancement"),o=$(".onboarding-navbar"),n=0;this.steps.groups.forEach(function(o,i){var r=Math.min(t.currentStep+1-n,o.steps.length);if(e.find(".group-"+i+" .advancement").css("width",r/o.steps.length*100+"%"),n+=o.steps.length,r===o.steps.length){var s=e.find(".group-"+i+" .id");s.hasClass("-done")||s.addClass("-done")}}),e.find(".group-title").html(this.getCurrentGroupID()+1+"/"+this.getTotalGroups()+" - "+this.getGroupForStep(this.currentStep).title),this.getGroupForStep(this.currentStep).subtitle&&(this.getGroupForStep(this.currentStep).subtitle[1]&&e.find(".step-title-1").html('check '+this.getGroupForStep(this.currentStep).subtitle[1]),this.getGroupForStep(this.currentStep).subtitle[2]&&e.find(".step-title-2").html('check '+this.getGroupForStep(this.currentStep).subtitle[2]));var i=this.currentStep/this.getTotalSteps();o.find(".text").find(".text-right").html(Math.floor(100*i)+"%"),o.find(".progress-bar").width(100*i+"%")}},{key:"getTotalSteps",value:function(){var t=0;return this.steps.groups.forEach(function(e){t+=e.steps.length}),t}},{key:"getTotalGroups",value:function(){return this.steps.groups.length}},{key:"setShutDown",value:function(e){var o=this;this.isShutDown=e?1:0,1===this.isShutDown&&($(".onboarding-advancement").toggle(!1),$(".onboarding-navbar").toggleClass("displayed",!0),$(".onboarding-popup").remove(),$(".onboarding-tooltip").remove()),this.save({action:"setShutDown",value:this.isShutDown},function(e){e||0===o.isShutDown&&(t.isCurrentPage(o.getStep(o.currentStep).page)?o.showCurrentStep():o.gotoLastSavePoint())})}},{key:"placeToolTip",value:function(t){var e=this;if(this.tooltipElement=$(t.selector),this.tooltip=$(".onboarding-tooltip"),this.tooltip.hide(),!this.tooltipElement.is(":visible"))return setTimeout(function(){e.placeToolTip(t)},100),void(void 0!==this.tooltipPlacementInterval&&clearInterval(this.tooltipPlacementInterval));this.tooltipPlacementInterval=setInterval(function(){e.updateToolTipPosition(t)},100),this.tooltip.show(),this.tooltip.addClass("-"+t.position),this.tooltip.data("position",t.position);var o=this.getCurrentStepIDOnGroup(),n=this.getGroupForStep(this.currentStep).steps.length;this.tooltip.find(".count").html(o+1+"/"+n);for(var i=this.tooltip.find(".bulls"),r=0;r").addClass("bull");rwindow.screen.height/2-200&&window.scrollTo(0,e.tooltipElement.offset().top-(window.screen.height/2-200))},200),this.updateToolTipPosition()}},{key:"updateToolTipPosition",value:function(){var t=this.tooltipElement.offset().top-this.tooltipElement.outerHeight()/2-this.tooltip.outerHeight()/2,e=this.tooltipElement.offset().top+this.tooltipElement.outerHeight()/2-this.tooltip.outerHeight()/2,o=this.tooltipElement.offset().top+this.tooltipElement.outerHeight()/2-this.tooltip.outerHeight()/2,n=this.tooltipElement.offset().left-this.tooltip.outerWidth(),i=this.tooltipElement.offset().left+this.tooltipElement.outerWidth();switch(this.tooltip.data("position")){case"right":this.tooltip.css({left:i,top:e});break;case"left":this.tooltip.css({left:n,top:e});break;case"top":this.tooltip.css({left:t,top:o})}}}],[{key:"parseQueryString",value:function(t){var e=t.split("&"),o={},i=void 0,r=void 0,s=void 0,a=void 0;for(r=0;r1&&void 0!==arguments[1]?arguments[1]:"",o=$(this.templates[t]);""!==e&&o.find(".content").html(e),$("body").prepend(o)}},{key:"gotoNextStep",value:function(){this.gotoStep(this.currentStep+1)}},{key:"gotoStep",value:function(e){var o=this;this.save({action:"setCurrentStep",value:e},function(n){if(!n){var i=o.getStep(o.currentStep),r=o.getStep(e);if(!r)return $(".onboarding-popup").remove(),$(".onboarding-navbar").remove(),void $(".onboarding-tooltip").remove();i.action?$(i.action.selector)[i.action.action]():(o.currentStep+=1,t.isCurrentPage(r.page)?o.showCurrentStep():window.location.href=o.getRedirectUrl(r))}})}},{key:"getTokenAsString",value:function(e){var o=void 0;o=e.indexOf("?")!==-1?"&":"?";var n=window.location.search.substr(1),i=t.getSecurityTokens(n),r=o;return void 0!==i._token&&(r=r+"&_token="+i._token),r}},{key:"getRedirectUrl",value:function(t){var e=void 0;if(Array.isArray(t.page)){var o=n(t.page,1);e=o[0]}else e=t.page;return e+this.getTokenAsString(e)}},{key:"stop",value:function(){this.save({action:"setCurrentStep",value:this.getTotalSteps()},function(t){t||($(".onboarding-advancement").remove(),$(".onboarding-navbar").remove(),$(".onboarding-popup").remove(),$(".onboarding-tooltip").remove())})}},{key:"gotoLastSavePoint",value:function(){var t=this,e=0,o=0;this.steps.groups.forEach(function(n){n.steps.forEach(function(n){o<=t.currentStep&&$.inArray("savepoint",n.options)!==-1&&(e=o),o+=1})}),this.gotoStep(e)}},{key:"getGroupForStep",value:function(t){return this.getElementForStep(t,"group")}},{key:"getCurrentGroupID",value:function(){var t=this,e=0,o=0,n=0;return this.steps.groups.forEach(function(i){i.steps.forEach(function(){o===t.currentStep&&(n=e),o+=1}),e+=1}),n}},{key:"getCurrentStepIDOnGroup",value:function(){var t=this,e=0,o=0,n=0;return this.steps.groups.forEach(function(i){n=0,i.steps.forEach(function(){e===t.currentStep&&(o=n),n+=1,e+=1})}),o}},{key:"getStep",value:function(t){return this.getElementForStep(t,"step")}},{key:"getElementForStep",value:function(t,e){var o=0,n=null;return this.steps.groups.forEach(function(i){i.steps.forEach(function(r){o===t&&("step"===e?n=r:"group"===e&&(n=i)),o+=1})}),n}},{key:"save",value:function(t,e){$.ajax({method:"POST",url:this.apiLocation,data:t}).done(function(t){e("0"!==t)}).fail(function(){e(!0)})}},{key:"updateAdvancement",value:function(){var t=this,e=$(".onboarding-advancement"),o=$(".onboarding-navbar"),n=0;this.steps.groups.forEach(function(o,i){var r=Math.min(t.currentStep+1-n,o.steps.length);if(e.find(".group-"+i+" .advancement").css("width",r/o.steps.length*100+"%"),n+=o.steps.length,r===o.steps.length){var s=e.find(".group-"+i+" .id");s.hasClass("-done")||s.addClass("-done")}}),e.find(".group-title").html(this.getCurrentGroupID()+1+"/"+this.getTotalGroups()+" - "+this.getGroupForStep(this.currentStep).title),this.getGroupForStep(this.currentStep).subtitle&&(this.getGroupForStep(this.currentStep).subtitle[1]&&e.find(".step-title-1").html('check '+this.getGroupForStep(this.currentStep).subtitle[1]),this.getGroupForStep(this.currentStep).subtitle[2]&&e.find(".step-title-2").html('check '+this.getGroupForStep(this.currentStep).subtitle[2]));var i=this.currentStep/this.getTotalSteps();o.find(".text").find(".text-right").html(Math.floor(100*i)+"%"),o.find(".progress-bar").width(100*i+"%")}},{key:"getTotalSteps",value:function(){var t=0;return this.steps.groups.forEach(function(e){t+=e.steps.length}),t}},{key:"getTotalGroups",value:function(){return this.steps.groups.length}},{key:"setShutDown",value:function(e){var o=this;this.isShutDown=e?1:0,1===this.isShutDown&&($(".onboarding-advancement").toggle(!1),$(".onboarding-navbar").toggleClass("displayed",!0),$(".onboarding-popup").remove(),$(".onboarding-tooltip").remove()),this.save({action:"setShutDown",value:this.isShutDown},function(e){e||0===o.isShutDown&&(t.isCurrentPage(o.getStep(o.currentStep).page)?o.showCurrentStep():o.gotoLastSavePoint())})}},{key:"placeToolTip",value:function(t){var e=this;if(this.tooltipElement=$(t.selector),this.tooltip=$(".onboarding-tooltip"),this.tooltip.hide(),!this.tooltipElement.is(":visible"))return setTimeout(function(){e.placeToolTip(t)},100),void(void 0!==this.tooltipPlacementInterval&&clearInterval(this.tooltipPlacementInterval));this.tooltipPlacementInterval=setInterval(function(){e.updateToolTipPosition(t)},100),this.tooltip.show(),this.tooltip.addClass("-"+t.position),this.tooltip.data("position",t.position);var o=this.getCurrentStepIDOnGroup(),n=this.getGroupForStep(this.currentStep).steps.length;this.tooltip.find(".count").html(o+1+"/"+n);for(var i=this.tooltip.find(".bulls"),r=0;r").addClass("bull");rwindow.screen.height/2-200&&window.scrollTo(0,e.tooltipElement.offset().top-(window.screen.height/2-200))},200),this.updateToolTipPosition()}},{key:"updateToolTipPosition",value:function(){var t=this.tooltipElement.offset().top-this.tooltipElement.outerHeight()/2-this.tooltip.outerHeight()/2,e=this.tooltipElement.offset().top+this.tooltipElement.outerHeight()/2-this.tooltip.outerHeight()/2,o=this.tooltipElement.offset().top+this.tooltipElement.outerHeight()/2-this.tooltip.outerHeight()/2,n=this.tooltipElement.offset().left-this.tooltip.outerWidth(),i=this.tooltipElement.offset().left+this.tooltipElement.outerWidth();switch(this.tooltip.data("position")){case"right":this.tooltip.css({left:i,top:e});break;case"left":this.tooltip.css({left:n,top:e});break;case"top":this.tooltip.css({left:t,top:o})}}}],[{key:"parseQueryString",value:function(t){var e=t.split("&"),o={},i=void 0,r=void 0,s=void 0,a=void 0;for(r=0;r .btn.-small:hover { text-decoration: underline; } @@ -65,7 +72,9 @@ border-radius: $navbar-progress-size; height: $navbar-progress-size; background: $navbar-progress-secondary-color; + margin-bottom: 1rem; } + > .progress > .bar { border-radius: $navbar-progress-size; background: $navbar-progress-primary-color; diff --git a/welcome.php b/welcome.php index d825ec7..85173c8 100644 --- a/welcome.php +++ b/welcome.php @@ -51,7 +51,7 @@ class Welcome extends Module public function __construct() { $this->name = 'welcome'; - $this->version = '6.0.2'; + $this->version = '6.0.3'; $this->author = 'PrestaShop'; parent::__construct(); @@ -148,7 +148,7 @@ public function uninstall() */ public function hookDisplayBackOfficeHeader() { - if ($this->displayHeader && !$this->onBoarding->isFinished()) { + if (!$this->onBoarding->isFinished()) { $this->context->controller->addCSS($this->_path . 'public/module.css', 'all'); $this->context->controller->addJS($this->_path . 'public/module.js'); } @@ -159,7 +159,7 @@ public function hookDisplayBackOfficeHeader() */ public function hookDisplayAdminAfterHeader() { - if ($this->displayHeader && !$this->onBoarding->isFinished()) { + if (!$this->onBoarding->isFinished()) { $this->onBoarding->showModuleContent(); } } @@ -169,7 +169,7 @@ public function hookDisplayAdminAfterHeader() */ public function hookDisplayAdminNavBarBeforeEnd() { - if ($this->displayHeader && !$this->onBoarding->isFinished()) { + if (!$this->onBoarding->isFinished()) { $this->onBoarding->showModuleContentForNavBar($this->context->link); } }