Commit bf86b695 authored by Nikita Hovratov's avatar Nikita Hovratov Committed by Oliver Bartsch
Browse files

[BUGFIX] Fix MultiStepWizard functionality

The MultiStepWizard has some obvious programming errors, which
surprisingly didn't cause any problems in TYPO3 v10. It was built
primarily with the multi step wizard of the form module in mind. This
fact reflects on some parts of the code.

As the direct commits to the module didn't change anything dramatically
it's reasonable to conclude the bootstrap v5 update revealed the flaws.

Most notably all 4 slides are now visible in the progress bar. Before
only 3 slides were visible (Step 3 was overridden with finish).

This patch fixes the prev and next logic to work properly with any size
of slides in a clear and understandable way.

Other notable changes:
- The missing progress bar titles in the form module multi step wizard
are added.
- The jQuery slideUp and slideDown of the buttons when going back to
the first step are removed as it serves no meaningful purpose.
- The hard coded forceSelection change when switching to first slide
(=true) and last slide (=false) is removed.

Resolves: #94037
Releases: master
Change-Id: I4f70dd30b3caf29a71491a69b18c6753666ccef4
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/68960

Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
Tested-by: Jonas Eberle's avatarJonas Eberle <flightvision@googlemail.com>
Tested-by: Andreas Fernandez's avatarAndreas Fernandez <a.fernandez@scripting-base.de>
Tested-by: Oliver Bartsch's avatarOliver Bartsch <bo@cedev.de>
Reviewed-by: Andreas Fernandez's avatarAndreas Fernandez <a.fernandez@scripting-base.de>
Reviewed-by: Oliver Bartsch's avatarOliver Bartsch <bo@cedev.de>
parent 6a6b7998
......@@ -263,7 +263,7 @@ class MultiStepWizard {
// Event fires when the slide transition is invoked
this.setup.$carousel.on('slide.bs.carousel', (evt: any): void => {
if (evt.direction === 'left') {
if (evt.direction === 'right') {
this.nextSlideChanges($modal);
} else {
this.prevSlideChanges($modal);
......@@ -317,50 +317,31 @@ class MultiStepWizard {
private nextSlideChanges($modal: JQuery): void {
this.initializeSlideNextEvent($modal);
let $modalTitle = $modal.find('.modal-title');
let $modalFooter = $modal.find('.modal-footer');
let $modalButtonGroup = $modal.find('.modal-btn-group');
let $nextButton = $modalFooter.find('button[name="next"]');
let nextSlideNumber = this.setup.$carousel.data('currentSlide') + 1;
let currentIndex = this.setup.$carousel.data('currentIndex') + 1;
const $modalTitle = $modal.find('.modal-title');
const $modalFooter = $modal.find('.modal-footer');
const nextSlideNumber = this.setup.$carousel.data('currentSlide') + 1;
const currentIndex = this.setup.$carousel.data('currentIndex');
const nextIndex = currentIndex + 1;
$modalTitle.text(this.setup.slides[currentIndex].title);
$modalTitle.text(this.setup.slides[nextIndex].title);
this.setup.$carousel.data('currentSlide', nextSlideNumber);
this.setup.$carousel.data('currentIndex', currentIndex);
this.setup.$carousel.data('currentIndex', nextIndex);
// Last wizard step
if (nextSlideNumber >= this.setup.$carousel.data('realSlideCount')) {
$nextButton.text(this.getProgressBarTitle(this.setup.$carousel.data('currentIndex')));
const progressBars = $modalFooter.find('.progress-bar');
$modalFooter.find('.progress-bar.first-step')
.width('100%')
.text(this.getProgressBarTitle(this.setup.$carousel.data('currentIndex')));
// Hide current progress bar section
progressBars
.eq(currentIndex)
.width('0%');
$modalFooter.find('.progress-bar.last-step')
.width('0%')
.text('');
this.setup.forceSelection = false;
} else {
$modalFooter.find('.progress-bar.first-step')
.width(this.setup.$carousel.data('initialStep') * nextSlideNumber + '%')
.text(this.getProgressBarTitle(currentIndex));
$modalFooter.find('.progress-bar.step')
.width('0%')
.text('');
$modalButtonGroup.slideDown();
}
// Increase size of next progress bar section
progressBars
.eq(nextIndex)
.width(this.setup.$carousel.data('initialStep') * nextSlideNumber + '%')
.removeClass('inactive');
$nextButton
.removeClass('btn-' + Severity.getCssClass(this.setup.slides[currentIndex - 1].severity))
.addClass('btn-' + Severity.getCssClass(this.setup.slides[currentIndex].severity));
$modal
.removeClass('modal-severity-' + Severity.getCssClass(this.setup.slides[currentIndex - 1].severity))
.addClass('modal-severity-' + Severity.getCssClass(this.setup.slides[currentIndex].severity));
this.updateCurrentSeverity($modal, currentIndex, nextIndex);
}
/**
......@@ -372,17 +353,17 @@ class MultiStepWizard {
private prevSlideChanges($modal: JQuery): void {
this.initializeSlidePrevEvent($modal);
let $modalTitle = $modal.find('.modal-title');
let $modalFooter = $modal.find('.modal-footer');
let $modalButtonGroup = $modal.find('.modal-btn-group');
let $nextButton = $modalFooter.find('button[name="next"]');
let nextSlideNumber = this.setup.$carousel.data('currentSlide') - 1;
let currentIndex = this.setup.$carousel.data('currentIndex') - 1;
const $modalTitle = $modal.find('.modal-title');
const $modalFooter = $modal.find('.modal-footer');
const $nextButton = $modalFooter.find('button[name="next"]');
const nextSlideNumber = this.setup.$carousel.data('currentSlide') - 1;
const currentIndex = this.setup.$carousel.data('currentIndex');
const nextIndex = currentIndex - 1;
this.setup.$carousel.data('currentSlide', nextSlideNumber);
this.setup.$carousel.data('currentIndex', currentIndex);
this.setup.$carousel.data('currentIndex', nextIndex);
$modalTitle.text(this.setup.slides[currentIndex].title);
$modalTitle.text(this.setup.slides[nextIndex].title);
$modalFooter.find('.progress-bar.last-step')
.width(this.setup.$carousel.data('initialStep') + '%')
......@@ -390,24 +371,42 @@ class MultiStepWizard {
$nextButton.text(top.TYPO3.lang['wizard.button.next']);
// First wizard step
if (nextSlideNumber === 1) {
$modalFooter.find('.progress-bar.first-step')
.width(this.setup.$carousel.data('initialStep') * nextSlideNumber + '%')
.text(this.getProgressBarTitle(0));
const progressBars = $modalFooter.find('.progress-bar');
$modalFooter.find('.progress-bar.step')
.width(this.setup.$carousel.data('initialStep') + '%')
.text(this.getProgressBarTitle(currentIndex + 1));
// Reset size of current progress bar
progressBars
.eq(currentIndex)
.width(this.setup.$carousel.data('initialStep') + '%')
.addClass('inactive');
$modalButtonGroup.slideUp();
} else {
$modalFooter.find('.progress-bar.first-step')
.width(this.setup.$carousel.data('initialStep') * nextSlideNumber + '%')
.text(this.getProgressBarTitle(currentIndex));
// Enable next (previous) progress bar again
progressBars
.eq(nextIndex)
.width(this.setup.$carousel.data('initialStep') * nextSlideNumber + '%')
.removeClass('inactive');
this.setup.forceSelection = true;
}
this.updateCurrentSeverity($modal, currentIndex, nextIndex);
}
/**
* Update severity of modal and buttons when changing slides.
*
* @param $modal
* @param currentIndex
* @param nextIndex
* @private
*/
private updateCurrentSeverity($modal: JQuery, currentIndex: number, nextIndex: number): void {
const $modalFooter = $modal.find('.modal-footer');
const $nextButton = $modalFooter.find('button[name="next"]');
$nextButton
.removeClass('btn-' + Severity.getCssClass(this.setup.slides[currentIndex].severity))
.addClass('btn-' + Severity.getCssClass(this.setup.slides[nextIndex].severity));
$modal
.removeClass('modal-severity-' + Severity.getCssClass(this.setup.slides[currentIndex].severity))
.addClass('modal-severity-' + Severity.getCssClass(this.setup.slides[nextIndex].severity));
}
/**
......@@ -451,7 +450,7 @@ class MultiStepWizard {
* @private
*/
private addProgressBar(): void {
let realSlideCount = this.setup.$carousel.find('.carousel-item').length - 1;
let realSlideCount = this.setup.$carousel.find('.carousel-item').length;
let slideCount = Math.max(1, realSlideCount);
let initialStep;
let $modal = this.setup.$carousel.closest('.modal');
......
......@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
var __importDefault=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};define(["require","exports","./Enum/Severity","jquery","./Modal","./Severity","./Icons"],(function(t,e,s,i,r,a,l){"use strict";i=__importDefault(i);class n{constructor(){this.setup={slides:[],settings:{},forceSelection:!0,$carousel:null},this.originalSetup=i.default.extend(!0,{},this.setup)}set(t,e){return this.setup.settings[t]=e,this}addSlide(t,e,i="",r=s.SeverityEnum.info,a,l){const n={identifier:t,title:e,content:i,severity:r,progressBarTitle:a,callback:l};return this.setup.slides.push(n),this}addFinalProcessingSlide(t){return t||(t=()=>{this.dismiss()}),l.getIcon("spinner-circle",l.sizes.default,null,null).then(e=>{let s=i.default("<div />",{class:"text-center"}).append(e);this.addSlide("final-processing-slide",top.TYPO3.lang["wizard.processing.title"],s[0].outerHTML,a.info,null,t)})}show(){let t=this.generateSlides(),e=this.setup.slides[0];r.confirm(e.title,t,e.severity,[{text:top.TYPO3.lang["wizard.button.cancel"],active:!0,btnClass:"btn-default pull-left",name:"cancel",trigger:()=>{this.getComponent().trigger("wizard-dismiss")}},{text:top.TYPO3.lang["wizard.button.prev"],btnClass:"btn-"+a.getCssClass(e.severity),name:"prev"},{text:top.TYPO3.lang["wizard.button.next"],btnClass:"btn-"+a.getCssClass(e.severity),name:"next"}],["modal-multi-step-wizard"]),this.addButtonContainer(),this.addProgressBar(),this.initializeEvents(),this.getComponent().on("wizard-visible",()=>{this.runSlideCallback(e,this.setup.$carousel.find(".carousel-item").first())}).on("wizard-dismissed",()=>{this.setup=i.default.extend(!0,{},this.originalSetup)})}getComponent(){return null===this.setup.$carousel&&this.generateSlides(),this.setup.$carousel}dismiss(){r.dismiss()}lockNextStep(){let t=this.setup.$carousel.closest(".modal").find('button[name="next"]');return t.prop("disabled",!0),t}unlockNextStep(){let t=this.setup.$carousel.closest(".modal").find('button[name="next"]');return t.prop("disabled",!1),t}lockPrevStep(){let t=this.setup.$carousel.closest(".modal").find('button[name="prev"]');return t.prop("disabled",!0),t}unlockPrevStep(){let t=this.setup.$carousel.closest(".modal").find('button[name="prev"]');return t.prop("disabled",!1),t}triggerStepButton(t){let e=this.setup.$carousel.closest(".modal").find('button[name="'+t+'"]');return e.length>0&&!0!==e.prop("disabled")&&e.trigger("click"),e}blurCancelStep(){let t=this.setup.$carousel.closest(".modal").find('button[name="cancel"]');return t.trigger("blur"),t}initializeEvents(){let t=this.setup.$carousel.closest(".modal");this.initializeSlideNextEvent(t),this.initializeSlidePrevEvent(t),this.setup.$carousel.on("slide.bs.carousel",e=>{"left"===e.direction?this.nextSlideChanges(t):this.prevSlideChanges(t)}).on("slid.bs.carousel",t=>{let e=this.setup.$carousel.data("currentIndex"),s=this.setup.slides[e];this.runSlideCallback(s,i.default(t.relatedTarget)),this.setup.forceSelection&&this.lockNextStep()});let e=this.getComponent();e.on("wizard-dismiss",this.dismiss),r.currentModal.on("hidden.bs.modal",()=>{e.trigger("wizard-dismissed")}).on("shown.bs.modal",()=>{e.trigger("wizard-visible")})}initializeSlideNextEvent(t){t.find(".modal-footer").find('button[name="next"]').off().on("click",()=>{this.setup.$carousel.carousel("next")})}initializeSlidePrevEvent(t){t.find(".modal-footer").find('button[name="prev"]').off().on("click",()=>{this.setup.$carousel.carousel("prev")})}nextSlideChanges(t){this.initializeSlideNextEvent(t);let e=t.find(".modal-title"),s=t.find(".modal-footer"),i=t.find(".modal-btn-group"),r=s.find('button[name="next"]'),l=this.setup.$carousel.data("currentSlide")+1,n=this.setup.$carousel.data("currentIndex")+1;e.text(this.setup.slides[n].title),this.setup.$carousel.data("currentSlide",l),this.setup.$carousel.data("currentIndex",n),l>=this.setup.$carousel.data("realSlideCount")?(r.text(this.getProgressBarTitle(this.setup.$carousel.data("currentIndex"))),s.find(".progress-bar.first-step").width("100%").text(this.getProgressBarTitle(this.setup.$carousel.data("currentIndex"))),s.find(".progress-bar.last-step").width("0%").text(""),this.setup.forceSelection=!1):(s.find(".progress-bar.first-step").width(this.setup.$carousel.data("initialStep")*l+"%").text(this.getProgressBarTitle(n)),s.find(".progress-bar.step").width("0%").text(""),i.slideDown()),r.removeClass("btn-"+a.getCssClass(this.setup.slides[n-1].severity)).addClass("btn-"+a.getCssClass(this.setup.slides[n].severity)),t.removeClass("modal-severity-"+a.getCssClass(this.setup.slides[n-1].severity)).addClass("modal-severity-"+a.getCssClass(this.setup.slides[n].severity))}prevSlideChanges(t){this.initializeSlidePrevEvent(t);let e=t.find(".modal-title"),s=t.find(".modal-footer"),i=t.find(".modal-btn-group"),r=s.find('button[name="next"]'),a=this.setup.$carousel.data("currentSlide")-1,l=this.setup.$carousel.data("currentIndex")-1;this.setup.$carousel.data("currentSlide",a),this.setup.$carousel.data("currentIndex",l),e.text(this.setup.slides[l].title),s.find(".progress-bar.last-step").width(this.setup.$carousel.data("initialStep")+"%").text(this.getProgressBarTitle(this.setup.$carousel.data("slideCount")-1)),r.text(top.TYPO3.lang["wizard.button.next"]),1===a?(s.find(".progress-bar.first-step").width(this.setup.$carousel.data("initialStep")*a+"%").text(this.getProgressBarTitle(0)),s.find(".progress-bar.step").width(this.setup.$carousel.data("initialStep")+"%").text(this.getProgressBarTitle(l+1)),i.slideUp()):(s.find(".progress-bar.first-step").width(this.setup.$carousel.data("initialStep")*a+"%").text(this.getProgressBarTitle(l)),this.setup.forceSelection=!0)}getProgressBarTitle(t){let e;return e=null===this.setup.slides[t].progressBarTitle?0===t?top.TYPO3.lang["wizard.progressStep.start"]:t>=this.setup.$carousel.data("slideCount")-1?top.TYPO3.lang["wizard.progressStep.finish"]:top.TYPO3.lang["wizard.progressStep"]+String(t+1):this.setup.slides[t].progressBarTitle,e}runSlideCallback(t,e){"function"==typeof t.callback&&t.callback(e,this.setup.settings,t.identifier)}addProgressBar(){let t,e=this.setup.$carousel.find(".carousel-item").length-1,s=Math.max(1,e),r=this.setup.$carousel.closest(".modal").find(".modal-footer");if(t=Math.round(100/s),this.setup.$carousel.data("initialStep",t).data("slideCount",s).data("realSlideCount",e).data("currentIndex",0).data("currentSlide",1),s>1){r.prepend(i.default("<div />",{class:"progress"}));for(let e=0;e<this.setup.slides.length;++e){let s;s=0===e?"progress-bar first-step":e===this.setup.$carousel.data("slideCount")-1?"progress-bar last-step inactive":"progress-bar step inactive",r.find(".progress").append(i.default("<div />",{role:"progressbar",class:s,"aria-valuemin":0,"aria-valuenow":t,"aria-valuemax":100}).width(t+"%").text(this.getProgressBarTitle(e)))}}}addButtonContainer(){this.setup.$carousel.closest(".modal").find(".modal-footer .btn").wrapAll('<div class="modal-btn-group" />')}generateSlides(){if(null!==this.setup.$carousel)return this.setup.$carousel;let t='<div class="carousel slide" data-bs-ride="carousel" data-bs-interval="false"><div class="carousel-inner" role="listbox">';for(let e=0;e<this.setup.slides.length;++e){let s=this.setup.slides[e],i=s.content;"object"==typeof i&&(i=i.html()),t+='<div class="carousel-item" data-bs-slide="'+s.identifier+'" data-step="'+e+'">'+i+"</div>"}return t+="</div></div>",this.setup.$carousel=i.default(t),this.setup.$carousel.find(".carousel-item").first().addClass("active"),this.setup.$carousel}}let d;try{window.opener&&window.opener.TYPO3&&window.opener.TYPO3.MultiStepWizard&&(d=window.opener.TYPO3.MultiStepWizard),parent&&parent.window.TYPO3&&parent.window.TYPO3.MultiStepWizard&&(d=parent.window.TYPO3.MultiStepWizard),top&&top.TYPO3&&top.TYPO3.MultiStepWizard&&(d=top.TYPO3.MultiStepWizard)}catch(t){}return d||(d=new n,"undefined"!=typeof TYPO3&&(TYPO3.MultiStepWizard=d)),d}));
\ No newline at end of file
var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};define(["require","exports","./Enum/Severity","jquery","./Modal","./Severity","./Icons"],(function(e,t,s,i,a,r,l){"use strict";i=__importDefault(i);class n{constructor(){this.setup={slides:[],settings:{},forceSelection:!0,$carousel:null},this.originalSetup=i.default.extend(!0,{},this.setup)}set(e,t){return this.setup.settings[e]=t,this}addSlide(e,t,i="",a=s.SeverityEnum.info,r,l){const n={identifier:e,title:t,content:i,severity:a,progressBarTitle:r,callback:l};return this.setup.slides.push(n),this}addFinalProcessingSlide(e){return e||(e=()=>{this.dismiss()}),l.getIcon("spinner-circle",l.sizes.default,null,null).then(t=>{let s=i.default("<div />",{class:"text-center"}).append(t);this.addSlide("final-processing-slide",top.TYPO3.lang["wizard.processing.title"],s[0].outerHTML,r.info,null,e)})}show(){let e=this.generateSlides(),t=this.setup.slides[0];a.confirm(t.title,e,t.severity,[{text:top.TYPO3.lang["wizard.button.cancel"],active:!0,btnClass:"btn-default pull-left",name:"cancel",trigger:()=>{this.getComponent().trigger("wizard-dismiss")}},{text:top.TYPO3.lang["wizard.button.prev"],btnClass:"btn-"+r.getCssClass(t.severity),name:"prev"},{text:top.TYPO3.lang["wizard.button.next"],btnClass:"btn-"+r.getCssClass(t.severity),name:"next"}],["modal-multi-step-wizard"]),this.addButtonContainer(),this.addProgressBar(),this.initializeEvents(),this.getComponent().on("wizard-visible",()=>{this.runSlideCallback(t,this.setup.$carousel.find(".carousel-item").first())}).on("wizard-dismissed",()=>{this.setup=i.default.extend(!0,{},this.originalSetup)})}getComponent(){return null===this.setup.$carousel&&this.generateSlides(),this.setup.$carousel}dismiss(){a.dismiss()}lockNextStep(){let e=this.setup.$carousel.closest(".modal").find('button[name="next"]');return e.prop("disabled",!0),e}unlockNextStep(){let e=this.setup.$carousel.closest(".modal").find('button[name="next"]');return e.prop("disabled",!1),e}lockPrevStep(){let e=this.setup.$carousel.closest(".modal").find('button[name="prev"]');return e.prop("disabled",!0),e}unlockPrevStep(){let e=this.setup.$carousel.closest(".modal").find('button[name="prev"]');return e.prop("disabled",!1),e}triggerStepButton(e){let t=this.setup.$carousel.closest(".modal").find('button[name="'+e+'"]');return t.length>0&&!0!==t.prop("disabled")&&t.trigger("click"),t}blurCancelStep(){let e=this.setup.$carousel.closest(".modal").find('button[name="cancel"]');return e.trigger("blur"),e}initializeEvents(){let e=this.setup.$carousel.closest(".modal");this.initializeSlideNextEvent(e),this.initializeSlidePrevEvent(e),this.setup.$carousel.on("slide.bs.carousel",t=>{"right"===t.direction?this.nextSlideChanges(e):this.prevSlideChanges(e)}).on("slid.bs.carousel",e=>{let t=this.setup.$carousel.data("currentIndex"),s=this.setup.slides[t];this.runSlideCallback(s,i.default(e.relatedTarget)),this.setup.forceSelection&&this.lockNextStep()});let t=this.getComponent();t.on("wizard-dismiss",this.dismiss),a.currentModal.on("hidden.bs.modal",()=>{t.trigger("wizard-dismissed")}).on("shown.bs.modal",()=>{t.trigger("wizard-visible")})}initializeSlideNextEvent(e){e.find(".modal-footer").find('button[name="next"]').off().on("click",()=>{this.setup.$carousel.carousel("next")})}initializeSlidePrevEvent(e){e.find(".modal-footer").find('button[name="prev"]').off().on("click",()=>{this.setup.$carousel.carousel("prev")})}nextSlideChanges(e){this.initializeSlideNextEvent(e);const t=e.find(".modal-title"),s=e.find(".modal-footer"),i=this.setup.$carousel.data("currentSlide")+1,a=this.setup.$carousel.data("currentIndex"),r=a+1;t.text(this.setup.slides[r].title),this.setup.$carousel.data("currentSlide",i),this.setup.$carousel.data("currentIndex",r);const l=s.find(".progress-bar");l.eq(a).width("0%"),l.eq(r).width(this.setup.$carousel.data("initialStep")*i+"%").removeClass("inactive"),this.updateCurrentSeverity(e,a,r)}prevSlideChanges(e){this.initializeSlidePrevEvent(e);const t=e.find(".modal-title"),s=e.find(".modal-footer"),i=s.find('button[name="next"]'),a=this.setup.$carousel.data("currentSlide")-1,r=this.setup.$carousel.data("currentIndex"),l=r-1;this.setup.$carousel.data("currentSlide",a),this.setup.$carousel.data("currentIndex",l),t.text(this.setup.slides[l].title),s.find(".progress-bar.last-step").width(this.setup.$carousel.data("initialStep")+"%").text(this.getProgressBarTitle(this.setup.$carousel.data("slideCount")-1)),i.text(top.TYPO3.lang["wizard.button.next"]);const n=s.find(".progress-bar");n.eq(r).width(this.setup.$carousel.data("initialStep")+"%").addClass("inactive"),n.eq(l).width(this.setup.$carousel.data("initialStep")*a+"%").removeClass("inactive"),this.updateCurrentSeverity(e,r,l)}updateCurrentSeverity(e,t,s){e.find(".modal-footer").find('button[name="next"]').removeClass("btn-"+r.getCssClass(this.setup.slides[t].severity)).addClass("btn-"+r.getCssClass(this.setup.slides[s].severity)),e.removeClass("modal-severity-"+r.getCssClass(this.setup.slides[t].severity)).addClass("modal-severity-"+r.getCssClass(this.setup.slides[s].severity))}getProgressBarTitle(e){let t;return t=null===this.setup.slides[e].progressBarTitle?0===e?top.TYPO3.lang["wizard.progressStep.start"]:e>=this.setup.$carousel.data("slideCount")-1?top.TYPO3.lang["wizard.progressStep.finish"]:top.TYPO3.lang["wizard.progressStep"]+String(e+1):this.setup.slides[e].progressBarTitle,t}runSlideCallback(e,t){"function"==typeof e.callback&&e.callback(t,this.setup.settings,e.identifier)}addProgressBar(){let e,t=this.setup.$carousel.find(".carousel-item").length,s=Math.max(1,t),a=this.setup.$carousel.closest(".modal").find(".modal-footer");if(e=Math.round(100/s),this.setup.$carousel.data("initialStep",e).data("slideCount",s).data("realSlideCount",t).data("currentIndex",0).data("currentSlide",1),s>1){a.prepend(i.default("<div />",{class:"progress"}));for(let t=0;t<this.setup.slides.length;++t){let s;s=0===t?"progress-bar first-step":t===this.setup.$carousel.data("slideCount")-1?"progress-bar last-step inactive":"progress-bar step inactive",a.find(".progress").append(i.default("<div />",{role:"progressbar",class:s,"aria-valuemin":0,"aria-valuenow":e,"aria-valuemax":100}).width(e+"%").text(this.getProgressBarTitle(t)))}}}addButtonContainer(){this.setup.$carousel.closest(".modal").find(".modal-footer .btn").wrapAll('<div class="modal-btn-group" />')}generateSlides(){if(null!==this.setup.$carousel)return this.setup.$carousel;let e='<div class="carousel slide" data-bs-ride="carousel" data-bs-interval="false"><div class="carousel-inner" role="listbox">';for(let t=0;t<this.setup.slides.length;++t){let s=this.setup.slides[t],i=s.content;"object"==typeof i&&(i=i.html()),e+='<div class="carousel-item" data-bs-slide="'+s.identifier+'" data-step="'+t+'">'+i+"</div>"}return e+="</div></div>",this.setup.$carousel=i.default(e),this.setup.$carousel.find(".carousel-item").first().addClass("active"),this.setup.$carousel}}let d;try{window.opener&&window.opener.TYPO3&&window.opener.TYPO3.MultiStepWizard&&(d=window.opener.TYPO3.MultiStepWizard),parent&&parent.window.TYPO3&&parent.window.TYPO3.MultiStepWizard&&(d=parent.window.TYPO3.MultiStepWizard),top&&top.TYPO3&&top.TYPO3.MultiStepWizard&&(d=top.TYPO3.MultiStepWizard)}catch(e){}return d||(d=new n,"undefined"!=typeof TYPO3&&(TYPO3.MultiStepWizard=d)),d}));
\ No newline at end of file
......@@ -88,7 +88,7 @@ define(['jquery',
/**
* Wizard step 1
*/
MultiStepWizard.addSlide('new-form-step-1', TYPO3.lang['formManager.newFormWizard.step1.title'], '', Severity.info, null, function(slide) {
MultiStepWizard.addSlide('new-form-step-1', TYPO3.lang['formManager.newFormWizard.step1.title'], '', Severity.info, TYPO3.lang['formManager.newFormWizard.step1.title'], function(slide) {
Icons.getIcon('actions-document-duplicates-select', Icons.sizes.large).then(function (duplicateIconMarkup) {
Icons.getIcon('actions-document-new', Icons.sizes.large).then(function (blankIconMarkup) {
var advancedWizardHasOptions, folders, html, modal, cancelButton, nextButton, prototypes,
......@@ -364,7 +364,7 @@ define(['jquery',
/**
* Wizard step 3
*/
MultiStepWizard.addSlide('new-form-step-3', TYPO3.lang['formManager.newFormWizard.step3.title'], '', Severity.info, null, function(slide, settings) {
MultiStepWizard.addSlide('new-form-step-3', TYPO3.lang['formManager.newFormWizard.step3.title'], '', Severity.info, TYPO3.lang['formManager.newFormWizard.step3.title'], function(slide, settings) {
var addOnTemplateChangeEvents, folders, html, modal, nextButton, prototypes, prototypeNameSelect,
savePathSelect, templates, templateSelect;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment