').addClass(wizardClasses.wizardContent), formOptions = this.options.form;\n $('body').append(formElement);\n this.element.prepend(contentElement);\n formOptions.buttonsTemplate = formOptions.buttonsTemplate || '';\n this.form = formElement.kendoForm(formOptions).getKendoForm();\n contentElement.append(formElement.show());\n },\n _iterateButton: function (button) {\n var messages = this.options.messages;\n if (typeof button === 'string') {\n button = { name: button };\n }\n if (!button.text) {\n button.text = messages[button.name] || button.name.charAt(0).toUpperCase() + button.name.slice(1);\n }\n if (button.name === DONE || button.name === NEXT) {\n button.primary = true;\n }\n if (!button.position && button.name === RESET) {\n button.position = LEFT;\n } else if (!button.position) {\n button.position = RIGHT;\n }\n return button;\n },\n _pager: function () {\n var options = this.options, messages = options.messages, pagerData = {\n step: messages.step,\n currentStep: options.index + 1,\n of: messages.of,\n totalSteps: options.totalSteps\n }, pager = kendo.template(this._pagerTemplate)(pagerData);\n this._leftButtonsContainer.append(pager);\n },\n _processButtons: function () {\n var options = this.options, buttonsOptions = options.buttons, defaultButtons = this._defaultButtonsConfiguration;\n if (!buttonsOptions || !buttonsOptions.length || buttonsOptions.length <= 0) {\n if (options.index === 0) {\n buttonsOptions = defaultButtons.first;\n } else if (options.index + 1 === options.totalSteps) {\n buttonsOptions = defaultButtons.last;\n } else {\n buttonsOptions = defaultButtons.middle;\n }\n }\n this.options.buttons = buttonsOptions.map(proxy(this._iterateButton, this));\n },\n _render: function () {\n this.element = $('
').addClass(wizardClasses.wizardStep);\n if (this.options.className) {\n this.element.addClass(this.options.className);\n }\n this._ariaAttributes();\n if (!this.options.selected) {\n this.element.addClass(HIDDEN);\n this.element.attr(ARIA_HIDDEN, true);\n }\n if (this.options.actionBar) {\n this._buttonsContainer();\n }\n if (this.options.form) {\n this._form();\n } else {\n this._content();\n }\n }\n });\n var Wizard = Widget.extend({\n init: function (element, options) {\n var that = this;\n options = options || {};\n Widget.fn.init.call(that, element, options);\n that._wrapper();\n that._createSteps();\n that._stepper();\n that._attachEvents();\n },\n options: {\n name: 'Wizard',\n contentPosition: BOTTOM,\n actionBar: true,\n pager: true,\n loadOnDemand: false,\n reloadOnSelect: false,\n validateForms: true,\n stepper: {},\n steps: [],\n messages: {\n reset: 'Reset',\n previous: 'Previous',\n next: 'Next',\n done: 'Done',\n step: 'Step',\n of: 'of'\n }\n },\n events: [\n ACTIVATE,\n SELECT,\n RESET,\n DONE,\n ERROR,\n CONTENTLOAD,\n FORM_VALIDATE_FAILED\n ],\n destroy: function () {\n var that = this;\n Widget.fn.destroy.call(that.stepper);\n Widget.fn.destroy.call(that);\n that.wrapper.off(WIZARD);\n },\n activeStep: function () {\n return this.currentStep;\n },\n enableStep: function (stepIndex, value) {\n var that = this, targetStep;\n if (stepIndex === undefined || stepIndex === null || isNaN(stepIndex) || stepIndex >= that._steps.length || stepIndex < 0) {\n return;\n }\n stepIndex = Number(stepIndex);\n targetStep = that._steps[stepIndex];\n if (targetStep.options.enabled === value) {\n return;\n } else {\n targetStep.options.enabled = value;\n that.stepper.steps()[stepIndex].enable(value);\n }\n },\n insertAt: function (index, stepOptions) {\n var steps = this._steps, numberOfSteps = steps.length, step, stepperStepOptions, alteredStepIndex, alteredStep, iterateStep = function (step, i) {\n if (i >= index) {\n step.options.index += 1;\n }\n step.options.totalSteps += 1;\n step.element.find(DOT + wizardClasses.wizardPager).remove();\n step._pager();\n };\n if (index === null || index === undefined || isNaN(index) || index < 0 || index > numberOfSteps) {\n return;\n }\n if (!stepOptions) {\n return;\n }\n stepperStepOptions = this._mapStepForStepper(stepOptions);\n this.stepper.insertAt(index, stepperStepOptions);\n stepOptions.totalSteps = numberOfSteps + 1;\n stepOptions.messages = this.options.messages;\n stepOptions.index = index;\n stepOptions.formTag = this.wrapper.is('form') ? 'div' : 'form';\n if (this.options.pager === false && stepOptions.pager !== true) {\n stepOptions.pager = false;\n }\n step = new Step(stepOptions);\n steps.forEach(iterateStep);\n steps.splice(index, 0, step);\n if (index === 0 || index === numberOfSteps) {\n alteredStepIndex = index === 0 ? 1 : numberOfSteps - 1;\n alteredStep = steps[alteredStepIndex];\n alteredStep.resetButtons();\n }\n this._insertStepElementAtIndex(index, step.element);\n },\n next: function () {\n var that = this, stepsLength = that._steps.length, currentStepIndex = that.currentStep.options.index;\n if (currentStepIndex + 1 === stepsLength) {\n return;\n } else if (!that.steps()[currentStepIndex + 1].options.enabled) {\n return;\n } else {\n that._select(currentStepIndex + 1);\n that._selectStepper(currentStepIndex + 1);\n }\n },\n previous: function () {\n var that = this, currentStepIndex = that.currentStep.options.index;\n if (currentStepIndex === 0) {\n return;\n } else if (!that.steps()[currentStepIndex - 1].options.enabled) {\n return;\n } else {\n that._select(currentStepIndex - 1);\n that._selectStepper(currentStepIndex - 1);\n }\n },\n removeAt: function (index) {\n var steps = this._steps, numberOfSteps = steps.length, removedStep, newSelectedStepIndex, alteredStepIndex, alteredStep, i, step;\n if (index === null || index === undefined || isNaN(index) || index < 0 || index > numberOfSteps || numberOfSteps === 1) {\n return;\n }\n this.stepper.removeAt(index);\n removedStep = steps.splice(index, 1)[0];\n if (removedStep === this.selectedStep) {\n newSelectedStepIndex = index > 0 ? index - 1 : 0;\n this.selectedStep = steps[newSelectedStepIndex];\n }\n for (i = 0; i < numberOfSteps - 1; i += 1) {\n step = steps[i];\n step.options.index = i;\n step.options.totalSteps = numberOfSteps - 1;\n step.element.find(DOT + wizardClasses.wizardPager).remove();\n step._pager();\n }\n if (index === 0 || index === numberOfSteps - 2) {\n alteredStepIndex = index === 0 ? 0 : numberOfSteps - 2;\n alteredStep = steps[alteredStepIndex];\n alteredStep.resetButtons();\n }\n },\n select: function (stepIndex) {\n var that = this, stepper = that.stepper, targetStep;\n if (stepIndex === undefined || stepIndex === null || isNaN(stepIndex) || stepIndex >= that._steps.length || stepIndex < 0) {\n return;\n }\n stepIndex = Number(stepIndex);\n targetStep = that._steps[stepIndex];\n if (!targetStep.options.enabled) {\n return;\n }\n that._select(stepIndex);\n if (stepper.options.linear) {\n stepper.setOptions({ linear: false });\n that._selectStepper(stepIndex);\n stepper.setOptions({ linear: true });\n } else {\n that._selectStepper(stepIndex);\n }\n },\n steps: function () {\n return this._steps;\n },\n _attachEvents: function () {\n var that = this;\n that.stepper.bind(SELECT, proxy(that._stepperSelectHandler, that));\n that.wrapper.on(CLICK + WIZARD, '[' + DATA_WIZARD_PREFIX + RESET + ']', proxy(that._resetClickHandler, that)).on(CLICK + WIZARD, '[' + DATA_WIZARD_PREFIX + PREVIOUS + ']', proxy(that._previousClickHandler, that)).on(CLICK + WIZARD, '[' + DATA_WIZARD_PREFIX + NEXT + ']', proxy(that._nextClickHandler, that));\n if (that.wrapper.is('form')) {\n that.wrapper.on(SUBMIT + WIZARD, proxy(that._doneHandler, that));\n } else {\n that.wrapper.on(CLICK + WIZARD, '[' + DATA_WIZARD_PREFIX + DONE + ']', proxy(that._doneHandler, that));\n }\n },\n _changeStep: function (step) {\n var steps = this.wrapper.find(DOT + wizardClasses.wizardStep);\n this.currentStep = step;\n steps.addClass(HIDDEN);\n steps.attr(ARIA_HIDDEN, true);\n steps.attr(ARIA_EXPANDED, false);\n step.element.removeClass(HIDDEN);\n step.element.removeAttr(ARIA_HIDDEN);\n step.element.attr(ARIA_EXPANDED, true);\n },\n _createStep: function (options, index, stepsFromMarkup, total) {\n var wrapper = this.wrapper, stepsFromMarkupTitles = this.wrapper.children('ol, ul').children('li');\n if (typeof options === 'string') {\n options = { title: options };\n }\n options.totalSteps = total;\n options.messages = this.options.messages;\n options.index = index;\n options.formTag = this.wrapper.is('form') ? 'div' : 'form';\n if (index === 0) {\n options.selected = true;\n }\n if (this.options.actionBar === false) {\n options.actionBar = false;\n }\n if (stepsFromMarkup.length > 0 && stepsFromMarkup[index]) {\n options.markupContainer = $(stepsFromMarkup[index]);\n if (!options.title) {\n options.title = stepsFromMarkupTitles[index] ? stepsFromMarkupTitles[index].textContent : (index + 1).toString();\n if (!this.options.steps) {\n this.options.steps = [];\n }\n }\n }\n if (wrapper.attr(ID)) {\n options.wizardId = wrapper.attr(ID);\n }\n if (this.options.pager === false && options.pager !== true) {\n options.pager = false;\n }\n this.options.steps[index] = extend(true, {}, options);\n return new Step(options);\n },\n _createSteps: function () {\n var that = this, wrapper = that.wrapper, stepsOptions = that.options.steps, stepsFromMarkup = wrapper.children('div'), stepsContainer, i, stepOptions, step;\n stepsContainer = $('
').addClass(wizardClasses.wizardStepsContainer);\n that._steps = [];\n if (!stepsOptions || stepsOptions.length === 0) {\n stepsOptions = [];\n for (i = 0; i < stepsFromMarkup.length; i += 1) {\n stepsOptions.push({});\n }\n }\n for (i = 0; i < stepsOptions.length; i += 1) {\n stepOptions = stepsOptions[i];\n step = that._createStep(stepOptions, i, stepsFromMarkup, stepsOptions.length);\n if (stepOptions.contentUrl && (i === 0 || !that.options.loadOnDemand)) {\n kendo.ui.progress(that.wrapper, true);\n step._ajaxRequest(that);\n }\n stepsContainer.append(step.element);\n that._steps.push(step);\n }\n wrapper.children('ol, ul').remove();\n wrapper.empty();\n wrapper.append(stepsContainer);\n that._refreshEditorWidgets();\n that.currentStep = that._steps[0];\n },\n _doneHandler: function (e) {\n var steps = this._steps, currentStep = this.currentStep, forms = [], form, i;\n if (this.options.validateForms && !!currentStep.form && !currentStep.form.validator.validate()) {\n e.preventDefault();\n this.trigger(FORM_VALIDATE_FAILED, {\n sender: this,\n step: currentStep,\n form: currentStep.form\n });\n return;\n }\n for (i = 0; i < steps.length; i += 1) {\n form = steps[i].form;\n if (form) {\n forms.push(form);\n }\n }\n this.trigger(DONE, {\n sender: this,\n forms: forms,\n originalEvent: e,\n button: $(e.target).getKendoButton()\n });\n },\n _insertStepElementAtIndex: function (index, stepElement) {\n var stepsContainer = this.wrapper.find(DOT + wizardClasses.wizardStepsContainer);\n if (index === 0) {\n stepsContainer.prepend(stepElement);\n } else {\n stepsContainer.find(DOT + wizardClasses.wizardStep + ':nth-child(' + index + ')').after(stepElement);\n }\n },\n _isEmpty: function (element) {\n return !$.trim(element.html());\n },\n _mapStepForStepper: function (step) {\n var stepperStep = extend(true, {}, step);\n stepperStep.label = stepperStep.title;\n delete stepperStep.title;\n delete stepperStep.buttons;\n delete stepperStep.pager;\n delete stepperStep.content;\n delete stepperStep.contentUrl;\n delete stepperStep.contentId;\n return stepperStep;\n },\n _select: function (index) {\n var targetStep = this._steps[index], options = this.options;\n if (targetStep.options.contentUrl && (options.reloadOnSelect || options.loadOnDemand && this._isEmpty(targetStep.element.find(DOT + wizardClasses.wizardContent)))) {\n this.ajaxLoad = true;\n kendo.ui.progress(this.wrapper, true);\n targetStep._ajaxRequest(this, true);\n } else {\n this._changeStep(targetStep);\n }\n },\n _nextClickHandler: function (e) {\n var that = this, steps = that._steps, numberOfSteps = that._steps.length, currentStep = that.currentStep, currentStepIndex = currentStep.options.index, button = $(e.target).getKendoButton(), targetStep = steps[currentStepIndex + 1];\n if (numberOfSteps === currentStepIndex + 1 || !targetStep.options.enabled) {\n return;\n }\n if (that.options.validateForms && !!currentStep.form && !currentStep.form.validator.validate()) {\n that.trigger(FORM_VALIDATE_FAILED, {\n sender: that,\n step: currentStep,\n form: currentStep.form\n });\n return;\n }\n if (!that.trigger(SELECT, {\n sender: that,\n originalEvent: e.originalEvent,\n step: targetStep,\n button: button\n })) {\n that._select(currentStepIndex + 1);\n that._selectStepper(currentStepIndex + 1);\n if (!that.ajaxLoad) {\n that.trigger(ACTIVATE, {\n sender: that,\n step: targetStep\n });\n }\n that.ajaxLoad = false;\n }\n },\n _previousClickHandler: function (e) {\n var that = this, steps = that._steps, currentStep = that.currentStep, currentStepIndex = currentStep.options.index, button = $(e.target).getKendoButton(), targetStep = steps[currentStepIndex - 1];\n if (currentStepIndex === 0 || !targetStep.options.enabled) {\n return;\n }\n if (that.options.validateForms && !!currentStep.form && !currentStep.form.validator.validate()) {\n that.trigger(FORM_VALIDATE_FAILED, {\n sender: that,\n step: currentStep,\n form: currentStep.form\n });\n return;\n }\n if (!that.trigger(SELECT, {\n sender: that,\n originalEvent: e.originalEvent,\n step: targetStep,\n button: button\n })) {\n that._select(currentStepIndex - 1);\n that._selectStepper(currentStepIndex - 1);\n if (!that.ajaxLoad) {\n that.trigger(ACTIVATE, {\n sender: that,\n step: targetStep\n });\n }\n that.ajaxLoad = false;\n }\n },\n _refreshEditorWidgets: function () {\n var editorElements = this.wrapper.find('[data-role=\\'editor\\']'), i, element;\n for (i = 0; i < editorElements.length; i += 1) {\n element = $(editorElements[i]);\n element.getKendoEditor().refresh();\n }\n },\n _resetClickHandler: function (e) {\n this.trigger(RESET, {\n sender: this,\n originalEvent: e,\n button: $(e.target).getKendoButton()\n });\n },\n _selectStepper: function (index) {\n var stepper = this.stepper, targetStep = stepper.steps()[index], targetLink = targetStep.element.find(DOT + STEPPER_STEP_LINK);\n stepper.select(index);\n stepper.wrapper.find(DOT + STEPPER_STEP_LINK).attr(ARIA_SELECTED, false);\n targetLink.attr(ARIA_SELECTED, true).focus();\n },\n _stepper: function () {\n var wrapper = this.wrapper, stepperElement = $('