1/*! 2 * jQuery Steps v1.1.0 - 09/04/2014 3 * Copyright (c) 2014 Rafael Staib (http://www.jquery-steps.com) 4 * Licensed under MIT http://www.opensource.org/licenses/MIT 5 */ 6(function ($, undefined) { 7 $.fn.extend({ 8 _aria: function (name, value) { 9 return this.attr("aria-" + name, value); 10 }, 11 12 _removeAria: function (name) { 13 return this.removeAttr("aria-" + name); 14 }, 15 16 _enableAria: function (enable) { 17 return enable == null || enable 18 ? this.removeClass("disabled")._aria("disabled", "false") 19 : this.addClass("disabled")._aria("disabled", "true"); 20 }, 21 22 _showAria: function (show) { 23 return show == null || show ? this.show()._aria("hidden", "false") : this.hide()._aria("hidden", "true"); 24 }, 25 26 _selectAria: function (select) { 27 return select == null || select 28 ? this.addClass("current")._aria("selected", "true") 29 : this.removeClass("current")._aria("selected", "false"); 30 }, 31 32 _id: function (id) { 33 return id ? this.attr("id", id) : this.attr("id"); 34 }, 35 }); 36 37 if (!String.prototype.format) { 38 String.prototype.format = function () { 39 var args = arguments.length === 1 && $.isArray(arguments[0]) ? arguments[0] : arguments; 40 var formattedString = this; 41 for (var i = 0; i < args.length; i++) { 42 var pattern = new RegExp("\\{" + i + "\\}", "gm"); 43 formattedString = formattedString.replace(pattern, args[i]); 44 } 45 return formattedString; 46 }; 47 } 48 49 /** 50 * A global unique id count. 51 * 52 * @static 53 * @private 54 * @property _uniqueId 55 * @type Integer 56 **/ 57 var _uniqueId = 0; 58 59 /** 60 * The plugin prefix for cookies. 61 * 62 * @final 63 * @private 64 * @property _cookiePrefix
65 * @type String 66 **/ 67 var _cookiePrefix = "jQu3ry_5teps_St@te_"; 68 69 /** 70 * Suffix for the unique tab id. 71 * 72 * @final 73 * @private 74 * @property _tabSuffix 75 * @type String 76 * @since 0.9.7 77 **/ 78 var _tabSuffix = "-t-"; 79 80 /** 81 * Suffix for the unique tabpanel id. 82 * 83 * @final 84 * @private 85 * @property _tabpanelSuffix 86 * @type String 87 * @since 0.9.7 88 **/ 89 var _tabpanelSuffix = "-p-"; 90 91 /** 92 * Suffix for the unique title id. 93 * 94 * @final 95 * @private 96 * @property _titleSuffix 97 * @type String 98 * @since 0.9.7 99 **/ 100 var _titleSuffix = "-h-"; 101 102 /** 103 * An error message for an "index out of range" error. 104 * 105 * @final 106 * @private 107 * @property _indexOutOfRangeErrorMessage 108 * @type String 109 **/ 110 var _indexOutOfRangeErrorMessage = "Index out of range."; 111 112 /** 113 * An error message for an "missing corresponding element" error. 114 * 115 * @final 116 * @private 117 * @property _missingCorrespondingElementErrorMessage
118 * @type String 119 **/ 120 var _missingCorrespondingElementErrorMessage = "One or more corresponding step {0} are missing."; 121 122 /** 123 * Adds a step to the cache. 124 * 125 * @static 126 * @private 127 * @method addStepToCache 128 * @param wizard {Object} A jQuery wizard object 129 * @param step {Object} The step object to add 130 **/ 131 function addStepToCache(wizard, step) { 132 getSteps(wizard).push(step); 133 } 134 135 function analyzeData(wizard, options, state) { 136 var stepTitles = wizard.children(options.headerTag), 137 stepContents = wizard.children(options.bodyTag); 138 139 // Validate content 140 if (stepTitles.length > stepContents.length) { 141 throwError(_missingCorrespondingElementErrorMessage, "contents"); 142 } else if (stepTitles.length < stepContents.length) { 143 throwError(_missingCorrespondingElementErrorMessage, "titles"); 144 } 145 146 var startIndex = options.startIndex; 147 148 state.stepCount = stepTitles.length; 149 150 // Tries to load the saved state (step position) 151 if (options.saveState && $.cookie) { 152 var savedState = $.cookie(_cookiePrefix + getUniqueId(wizard)); 153 // Sets the saved position to the start index if not undefined or out of range 154 var savedIndex = parseInt(savedState, 0); 155 if (!isNaN(savedIndex) && savedIndex < state.stepCount) { 156 startIndex = savedIndex; 157 } 158 } 159 160 state.currentIndex = startIndex; 161 162 stepTitles.each(function (index) { 163 var item = $(this), // item == header 164 content = stepContents.eq(index), 165 modeData = content.data("mode"), 166 mode = 167 modeData == null 168 ? contentMode.html 169 : getValidEnumValue( 170 contentMode, 171 /^\s*$/.test(modeData) || isNaN(modeData) ? modeData : parseInt(modeData, 0) 172 ), 173 contentUrl = mode === contentMode.html || content.data("url") === undefined ? "" : content.data("url"), 174 contentLoaded = mode !== contentMode.html && content.data("loaded") === "1", 175 step = $.extend({}, stepModel, { 176 title: item.html(), 177 content: mode === contentMode.html ? content.html() : "", 178 contentUrl: contentUrl, 179 contentMode: mode, 180 contentLoaded: contentLoaded, 181 }); 182 183 addStepToCache(wizard, step); 184 }); 185 } 186 187 /** 188 * Triggers the onCanceled event. 189 * 190 * @static 191 * @private 192 * @method cancel 193 * @param wizard {Object} The jQuery wizard object 194 **/ 195 function cancel(wizard) { 196 wizard.triggerHandler("canceled"); 197 } 198 199 function decreaseCurrentIndexBy(state, decreaseBy) { 200 return state.currentIndex - decreaseBy; 201 } 202 203 /** 204 * Removes the control functionality completely and transforms the current state to the initial HTML structure. 205 * 206 * @static 207 * @private 208 * @method destroy 209 * @param wizard {Object} A jQuery wizard object 210 **/ 211 function destroy(wizard, options) { 212 var eventNamespace = getEventNamespace(wizard); 213 214 // Remove virtual data objects from the wizard 215 wizard 216 .unbind(eventNamespace) 217 .removeData("uid") 218 .removeData("options") 219 .removeData("state") 220 .removeData("steps") 221 .removeData("eventNamespace") 222 .find(".actions a") 223 .unbind(eventNamespace); 224 225 // Remove attributes and CSS classes from the wizard 226 wizard.removeClass(options.clearFixCssClass + " vertical"); 227 228 var contents = wizard.find(".content > *"); 229 230 // Remove virtual data objects from panels and their titles 231 contents.removeData("loaded").removeData("mode").removeData("url"); 232 233 // Remove attributes, CSS classes and reset inline styles on all panels and their titles 234 contents 235 .removeAttr("id") 236 .removeAttr("role") 237 .removeAttr("tabindex") 238 .removeAttr("class") 239 .removeAttr("style") 240 ._removeAria("labelledby") 241 ._removeAria("hidden"); 242 243 // Empty panels if the mode is set to 'async' or 'iframe' 244 wizard.find(".content > [data-mode='async'],.content > [data-mode='iframe']").empty(); 245 246 var wizardSubstitute = $('<{0} class="{1}"></{0}>'.format(wizard.get(0).tagName, wizard.attr("class"))); 247 248 var wizardId = wizard._id(); 249 if (wizardId != null && wizardId !== "") { 250 wizardSubstitute._id(wizardId); 251 } 252 253 wizardSubstitute.html(wizard.find(".content").html()); 254 wizard.after(wizardSubstitute); 255 wizard.remove(); 256 257 return wizardSubstitute; 258 } 259 260 /** 261 * Triggers the onFinishing and onFinished event. 262 * 263 * @static 264 * @private 265 * @method finishStep 266 * @param wizard {Object} The jQuery wizard object 267 * @param state {Object} The state container of the current wizard 268 **/ 269 function finishStep(wizard, state) { 270 var currentStep = wizard.find(".steps li").eq(state.currentIndex); 271 272 if (wizard.triggerHandler("finishing", [state.currentIndex])) { 273 currentStep.addClass("done").removeClass("error"); 274 wizard.triggerHandler("finished", [state.currentIndex]); 275 //scheduleAppointment(); 276 } else { 277 currentStep.addClass("error"); 278 } 279 } 280 281 /** 282 * Gets or creates if not exist an unique event namespace for the given wizard instance. 283 * 284 * @static 285 * @private 286 * @method getEventNamespace 287 * @param wizard {Object} A jQuery wizard object 288 * @return {String} Returns the unique event namespace for the given wizard 289 */ 290 function getEventNamespace(wizard) { 291 var eventNamespace = wizard.data("eventNamespace"); 292 293 if (eventNamespace == null) { 294 eventNamespace = "." + getUniqueId(wizard); 295 wizard.data("eventNamespace", eventNamespace); 296 } 297 298 return eventNamespace; 299 } 300 301 function getStepAnchor(wizard, index) { 302 var uniqueId = getUniqueId(wizard); 303 304 return wizard.find("#" + uniqueId + _tabSuffix + index); 305 } 306 307 function getStepPanel(wizard, index) { 308 var uniqueId = getUniqueId(wizard); 309 310 return wizard.find("#" + uniqueId + _tabpanelSuffix + index); 311 } 312 313 function getStepTitle(wizard, index) { 314 var uniqueId = getUniqueId(wizard); 315 316 return wizard.find("#" + uniqueId + _titleSuffix + index); 317 } 318 319 function getOptions(wizard) { 320 return wizard.data("options"); 321 } 322 323 function getState(wizard) { 324 return wizard.data("state"); 325 } 326 327 function getSteps(wizard) { 328 return wizard.data("steps"); 329 } 330 331 /** 332 * Gets a specific step object by index. 333 * 334 * @static 335 * @private 336 * @method getStep 337 * @param index {Integer} An integer that belongs to the position of a step 338 * @return {Object} A specific step object 339 **/ 340 function getStep(wizard, index) { 341 var steps = getSteps(wizard); 342 343 if (index < 0 || index >= steps.length) { 344 throwError(_indexOutOfRangeErrorMessage); 345 } 346 347 return steps[index]; 348 } 349 350 /** 351 * Gets or creates if not exist an unique id from the given wizard instance. 352 * 353 * @static 354 * @private 355 * @method getUniqueId 356 * @param wizard {Object} A jQuery wizard object 357 * @return {String} Returns the unique id for the given wizard 358 */ 359 function getUniqueId(wizard) { 360 var uniqueId = wizard.data("uid"); 361 362 if (uniqueId == null) { 363 uniqueId = wizard._id(); 364 if (uniqueId == null) { 365 uniqueId = "steps-uid-".concat(_uniqueId); 366 wizard._id(uniqueId); 367 } 368 369 _uniqueId++; 370 wizard.data("uid", uniqueId); 371 } 372 373 return uniqueId; 374 } 375 376 /** 377 * Gets a valid enum value by checking a specific enum key or value. 378 * 379 * @static 380 * @private 381 * @method getValidEnumValue 382 * @param enumType {Object} Type of enum 383 * @param keyOrValue {Object} Key as `String` or value as `Integer` to check for 384 */ 385 function getValidEnumValue(enumType, keyOrValue) { 386 validateArgument("enumType", enumType); 387 validateArgument("keyOrValue", keyOrValue); 388 389 // Is key 390 if (typeof keyOrValue === "string") { 391 var value = enumType[keyOrValue]; 392 if (value === undefined) { 393 throwError("The enum key '{0}' does not exist.", keyOrValue); 394 } 395 396 return value; 397 } 398 // Is value 399 else if (typeof keyOrValue === "number") { 400 for (var key in enumType) { 401 if (enumType[key] === keyOrValue) { 402 return keyOrValue; 403 } 404 } 405 406 throwError("Invalid enum value '{0}'.", keyOrValue); 407 } 408 // Type is not supported 409 else { 410 throwError("Invalid key or value type."); 411 } 412 } 413 414 /** 415 * Routes to the next step. 416 * 417 * @static 418 * @private 419 * @method goToNextStep 420 * @param wizard {Object} The jQuery wizard object 421 * @param options {Object} Settings of the current wizard 422 * @param state {Object} The state container of the current wizard 423 * @return {Boolean} Indicates whether the action executed 424 **/ 425 function goToNextStep(wizard, options, state) { 426 return paginationClick(wizard, options, state, increaseCurrentIndexBy(state, 1)); 427 } 428 429 /** 430 * Routes to the previous step. 431 * 432 * @static 433 * @private 434 * @method goToPreviousStep 435 * @param wizard {Object} The jQuery wizard object 436 * @param options {Object} Settings of the current wizard 437 * @param state {Object} The state container of the current wizard 438 * @return {Boolean} Indicates whether the action executed 439 **/ 440 function goToPreviousStep(wizard, options, state) { 441 return paginationClick(wizard, options, state, decreaseCurrentIndexBy(state, 1)); 442 } 443 444 /** 445 * Routes to a specific step by a given index. 446 * 447 * @static 448 * @private 449 * @method goToStep 450 * @param wizard {Object} The jQuery wizard object 451 * @param options {Object} Settings of the current wizard 452 * @param state {Object} The state container of the current wizard 453 * @param index {Integer} The position (zero-based) to route to 454 * @return {Boolean} Indicates whether the action succeeded or failed 455 **/ 456 function goToStep(wizard, options, state, index) { 457 if (index < 0 || index >= state.stepCount) { 458 throwError(_indexOutOfRangeErrorMessage); 459 } 460 461 if (options.forceMoveForward && index < state.currentIndex) { 462 return; 463 } 464 465 var oldIndex = state.currentIndex; 466 if (wizard.triggerHandler("stepChanging", [state.currentIndex, index])) { 467 // Save new state 468 state.currentIndex = index; 469 saveCurrentStateToCookie(wizard, options, state); 470 471 // Change visualisation 472 refreshStepNavigation(wizard, options, state, oldIndex); 473 refreshPagination(wizard, options, state); 474 loadAsyncContent(wizard, options, state); 475 startTransitionEffect(wizard, options, state, index, oldIndex, function () { 476 wizard.triggerHandler("stepChanged", [index, oldIndex]); 477 }); 478 } else { 479 wizard.find(".steps li").eq(oldIndex).addClass("error"); 480 } 481 482 return true; 483 } 484 485 function increaseCurrentIndexBy(state, increaseBy) { 486 return state.currentIndex + increaseBy; 487 } 488 489 /** 490 * Initializes the component. 491 * 492 * @static 493 * @private 494 * @method initialize 495 * @param options {Object} The component settings 496 **/ 497 function initialize(options) { 498 /*jshint -W040 */ 499 var opts = $.extend(true, {}, defaults, options); 500 501 return this.each(function () { 502 var wizard = $(this); 503 var state = { 504 currentIndex: opts.startIndex, 505 currentStep: null, 506 stepCount: 0, 507 transitionElement: null, 508 }; 509 510 // Create data container 511 wizard.data("options", opts); 512 wizard.data("state", state); 513 wizard.data("steps", []); 514 515 analyzeData(wizard, opts, state); 516 render(wizard, opts, state); 517 registerEvents(wizard, opts); 518 519 // Trigger focus 520 if (opts.autoFocus && _uniqueId === 0) { 521 getStepAnchor(wizard, opts.startIndex).focus(); 522 } 523 524 wizard.triggerHandler("init", [opts.startIndex]); 525 }); 526 } 527 528 /** 529 * Inserts a new step to a specific position. 530 * 531 * @static 532 * @private 533 * @method insertStep 534 * @param wizard {Object} The jQuery wizard object 535 * @param options {Object} Settings of the current wizard 536 * @param state {Object} The state container of the current wizard 537 * @param index {Integer} The position (zero-based) to add 538 * @param step {Object} The step object to add 539 * @example 540 * $("#wizard").steps().insert(0, { 541 * title: "Title", 542 * content: "", // optional 543 * contentMode: "async", // optional 544 * contentUrl: "/Content/Step/1" // optional 545 * }); 546 * @chainable 547 **/ 548 function insertStep(wizard, options, state, index, step) { 549 if (index < 0 || index > state.stepCount) { 550 throwError(_indexOutOfRangeErrorMessage); 551 } 552 553 // TODO: Validate step object 554 555 // Change data 556 step = $.extend({}, stepModel, step); 557 insertStepToCache(wizard, index, step); 558 if (state.currentIndex !== state.stepCount && state.currentIndex >= index) { 559 state.currentIndex++; 560 saveCurrentStateToCookie(wizard, options, state); 561 } 562 state.stepCount++; 563 564 var contentContainer = wizard.find(".content"), 565 header = $("<{0}>{1}</{0}>".format(options.headerTag, step.title)), 566 body = $("<{0}></{0}>".format(options.bodyTag)); 567 568 if (step.contentMode == null || step.contentMode === contentMode.html) { 569 body.html(step.content); 570 } 571 572 if (index === 0) { 573 contentContainer.prepend(body).prepend(header); 574 } else { 575 getStepPanel(wizard, index - 1) 576 .after(body) 577 .after(header); 578 } 579 580 renderBody(wizard, state, body, index); 581 renderTitle(wizard, options, state, header, index); 582 refreshSteps(wizard, options, state, index); 583 if (index === state.currentIndex) { 584 refreshStepNavigation(wizard, options, state); 585 } 586 refreshPagination(wizard, options, state); 587 588 return wizard; 589 } 590 591 /** 592 * Inserts a step object to the cache at a specific position. 593 * 594 * @static 595 * @private 596 * @method insertStepToCache 597 * @param wizard {Object} A jQuery wizard object 598 * @param index {Integer} The position (zero-based) to add 599 * @param step {Object} The step object to add 600 **/ 601 function insertStepToCache(wizard, index, step) { 602 getSteps(wizard).splice(index, 0, step); 603 } 604 605 /** 606 * Handles the keyup DOM event for pagination. 607 * 608 * @static 609 * @private 610 * @event keyup 611 * @param event {Object} An event object 612 */ 613 function keyUpHandler(event) { 614 var wizard = $(this), 615 options = getOptions(wizard), 616 state = getState(wizard); 617 618 if (options.suppressPaginationOnFocus && wizard.find(":focus").is(":input")) { 619 event.preventDefault(); 620 return false;
621 } 622 623 var keyCodes = { left: 37, right: 39 }; 624 if (event.keyCode === keyCodes.left) { 625 event.preventDefault(); 626 goToPreviousStep(wizard, options, state); 627 } else if (event.keyCode === keyCodes.right) { 628 event.preventDefault(); 629 goToNextStep(wizard, options, state); 630 } 631 } 632 633 /** 634 * Loads and includes async content. 635 * 636 * @static 637 * @private 638 * @method loadAsyncContent 639 * @param wizard {Object} A jQuery wizard object 640 * @param options {Object} Settings of the current wizard 641 * @param state {Object} The state container of the current wizard 642 */ 643 function loadAsyncContent(wizard, options, state) { 644 if (state.stepCount > 0) { 645 var currentIndex = state.currentIndex, 646 currentStep = getStep(wizard, currentIndex); 647 648 if (!options.enableContentCache || !currentStep.contentLoaded) { 649 switch (getValidEnumValue(contentMode, currentStep.contentMode)) { 650 case contentMode.iframe: 651 wizard 652 .find(".content > .body") 653 .eq(state.currentIndex) 654 .empty() 655 .html('<iframe src="' + currentStep.contentUrl + '" frameborder="0" scrolling="no" />') 656 .data("loaded", "1"); 657 break; 658 659 case contentMode.async: 660 var currentStepContent = getStepPanel(wizard, currentIndex) 661 ._aria("busy", "true") 662 .empty() 663 .append( 664 renderTemplate(options.loadingTemplate, { 665 text: options.labels.loading, 666 }) 667 ); 668 669 $.ajax({ url: currentStep.contentUrl, cache: false }).done(function (data) { 670 currentStepContent.empty().html(data)._aria("busy", "false").data("loaded", "1"); 671 wizard.triggerHandler("contentLoaded", [currentIndex]); 672 }); 673 break; 674 } 675 } 676 } 677 } 678 679 /** 680 * Fires the action next or previous click event. 681 * 682 * @static 683 * @private 684 * @method paginationClick 685 * @param wizard {Object} The jQuery wizard object 686 * @param options {Object} Settings of the current wizard 687 * @param state {Object} The state container of the current wizard 688 * @param index {Integer} The position (zero-based) to route to 689 * @return {Boolean} Indicates whether the event fired successfully or not 690 **/ 691 function paginationClick(wizard, options, state, index) { 692 var oldIndex = state.currentIndex; 693 694 if (index >= 0 && index < state.stepCount && !(options.forceMoveForward && index < state.currentIndex)) { 695 var anchor = getStepAnchor(wizard, index), 696 parent = anchor.parent(), 697 isDisabled = parent.hasClass("disabled"); 698
699 // Enable the step to make the anchor clickable! 700 parent._enableAria(); 701 anchor.click(); 702 703 // An error occured 704 if (oldIndex === state.currentIndex && isDisabled) { 705 // Disable the step again if current index has not changed; prevents click action. 706 parent._enableAria(false); 707 return false; 708 } 709 710 return true; 711 } 712 713 return false; 714 } 715 716 /** 717 * Fires when a pagination click happens. 718 * 719 * @static 720 * @private 721 * @event click 722 * @param event {Object} An event object 723 */ 724 function paginationClickHandler(event) { 725 event.preventDefault(); 726 727 var anchor = $(this), 728 wizard = anchor.parent().parent().parent().parent(), 729 options = getOptions(wizard), 730 state = getState(wizard), 731 href = anchor.attr("href"); 732 733 switch (href.substring(href.lastIndexOf("#") + 1)) { 734 case "cancel": 735 cancel(wizard); 736 break; 737 738 case "finish": 739 finishStep(wizard, state); 740 break; 741 742 case "next": 743 goToNextStep(wizard, options, state); 744 break; 745 746 case "previous": 747 goToPreviousStep(wizard, options, state); 748 break; 749 } 750 } 751 752 /** 753 * Refreshs the visualization state for the entire pagination. 754 * 755 * @static 756 * @private 757 * @method refreshPagination 758 * @param wizard {Object} A jQuery wizard object 759 * @param options {Object} Settings of the current wizard 760 * @param state {Object} The state container of the current wizard 761 */ 762 function refreshPagination(wizard, options, state) { 763 if (options.enablePagination) { 764 var finish = wizard.find(".actions a[href$='#finish']").parent(), 765 next = wizard.find(".actions a[href$='#next']").parent(); 766 767 if (!options.forceMoveForward) { 768 var previous = wizard.find(".actions a[href$='#previous']").parent(); 769 previous._enableAria(state.currentIndex > 0); 770 } 771 772 if (options.enableFinishButton && options.showFinishButtonAlways) { 773 finish._enableAria(state.stepCount > 0); 774 next._enableAria(state.stepCount > 1 && state.stepCount > state.currentIndex + 1); 775 } else { 776 finish._showAria(options.enableFinishButton && state.stepCount === state.currentIndex + 1); 777 next._showAria(state.stepCount === 0 || state.stepCount > state.currentIndex + 1)._enableAria( 778 state.stepCount > state.currentIndex + 1 || !options.enableFinishButton 779 ); 780 next 781 ._showAria( 782 state.stepCount === 0 || state.stepCount > state.currentIndex + 1 783 ) 784 ._enableAria( 785 state.stepCount > state.currentIndex + 1 || 786 !options.enableFinishButton 787 ); 788 } 789 } 790 } 791 792 /** 793 * Refreshs the visualization state for the step navigation (tabs). 794 * 795 * @static 796 * @private 797 * @method refreshStepNavigation 798 * @param wizard {Object} A jQuery wizard object 799 * @param options {Object} Settings of the current wizard 800 * @param state {Object} The state container of the current wizard 801 * @param [oldIndex] {Integer} The index of the prior step 802 */ 803 function refreshStepNavigation(wizard, options, state, oldIndex) { 804 var currentOrNewStepAnchor = getStepAnchor(wizard, state.currentIndex), 805 currentInfo = $('<span class="current-info audible">' + options.labels.current + " </span>"), 806 stepTitles = wizard.find(".content > .title"); 807 808 if (oldIndex != null) { 809 var oldStepAnchor = getStepAnchor(wizard, oldIndex); 810 oldStepAnchor.parent().addClass("done").removeClass("error")._selectAria(false); 811 stepTitles.eq(oldIndex).removeClass("current").next(".body").removeClass("current"); 812 currentInfo = oldStepAnchor.find(".current-info"); 813 currentOrNewStepAnchor.focus(); 814 } 815 816 currentOrNewStepAnchor.prepend(currentInfo).parent()._selectAria().removeClass("done")._enableAria(); 817 stepTitles.eq(state.currentIndex).addClass("current").next(".body").addClass("current"); 818 } 819 820 /** 821 * Refreshes step buttons and their related titles beyond a certain position. 822 * 823 * @static 824 * @private 825 * @method refreshSteps 826 * @param wizard {Object} A jQuery wizard object 827 * @param options {Object} Settings of the current wizard 828 * @param state {Object} The state container of the current wizard 829 * @param index {Integer} The start point for refreshing ids 830 */ 831 function refreshSteps(wizard, options, state, index) { 832 var uniqueId = getUniqueId(wizard); 833 834 for (var i = index; i < state.stepCount; i++) { 835 var uniqueStepId = uniqueId + _tabSuffix + i, 836 uniqueBodyId = uniqueId + _tabpanelSuffix + i, 837 uniqueHeaderId = uniqueId + _titleSuffix + i, 838 title = wizard.find(".title").eq(i)._id(uniqueHeaderId); 839 840 wizard 841 .find(".steps a") 842 .eq(i)
843 ._id(uniqueStepId) 844 ._aria("controls", uniqueBodyId) 845 .attr("href", "#" + uniqueHeaderId) 846 .html( 847 renderTemplate(options.titleTemplate, { 848 index: i + 1, 849 title: title.html(), 850 }) 851 ); 852 wizard.find(".body").eq(i)._id(uniqueBodyId)._aria("labelledby", uniqueHeaderId); 853 } 854 } 855 856 function registerEvents(wizard, options) { 857 var eventNamespace = getEventNamespace(wizard); 858 859 wizard.bind("canceled" + eventNamespace, options.onCanceled); 860 wizard.bind("contentLoaded" + eventNamespace, options.onContentLoaded); 861 wizard.bind("finishing" + eventNamespace, options.onFinishing); 862 wizard.bind("finished" + eventNamespace, options.onFinished); 863 wizard.bind("init" + eventNamespace, options.onInit); 864 wizard.bind("stepChanging" + eventNamespace, options.onStepChanging); 865 wizard.bind("stepChanged" + eventNamespace, options.onStepChanged); 866 867 if (options.enableKeyNavigation) { 868 wizard.bind("keyup" + eventNamespace, keyUpHandler); 869 } 870 871 wizard.find(".actions a").bind("click" + eventNamespace, paginationClickHandler); 872 } 873 874 /** 875 * Removes a specific step by an given index. 876 * 877 * @static 878 * @private 879 * @method removeStep 880 * @param wizard {Object} A jQuery wizard object 881 * @param options {Object} Settings of the current wizard 882 * @param state {Object} The state container of the current wizard 883 * @param index {Integer} The position (zero-based) of the step to remove 884 * @return Indecates whether the item is removed. 885 **/ 886 function removeStep(wizard, options, state, index) { 887 // Index out of range and try deleting current item will return false. 888 if (index < 0 || index >= state.stepCount || state.currentIndex === index) { 889 return false; 890 } 891 892 // Change data 893 removeStepFromCache(wizard, index); 894 if (state.currentIndex > index) { 895 state.currentIndex--; 896 saveCurrentStateToCookie(wizard, options, state); 897 } 898 state.stepCount--; 899 900 getStepTitle(wizard, index).remove(); 901 getStepPanel(wizard, index).remove(); 902 getStepAnchor(wizard, index).parent().remove(); 903 904 // Set the "first" class to the new first step button 905 if (index === 0) { 906 wizard.find(".steps li").first().addClass("first"); 907 } 908 909 // Set the "last" class to the new last step button 910 if (index === state.stepCount) { 911 wizard.find(".steps li").eq(index).addClass("last"); 912 } 913 914 refreshSteps(wizard, options, state, index); 915 refreshPagination(wizard, options, state); 916 917 return true; 918 } 919 920 function removeStepFromCache(wizard, index) { 921 getSteps(wizard).splice(index, 1); 922 } 923 924 /** 925 * Transforms the base html structure to a more sensible html structure. 926 * 927 * @static 928 * @private 929 * @method render 930 * @param wizard {Object} A jQuery wizard object 931 * @param options {Object} Settings of the current wizard 932 * @param state {Object} The state container of the current wizard 933 **/ 934 function render(wizard, options, state) { 935 // Create a content wrapper and copy HTML from the intial wizard structure 936 var wrapperTemplate = '<{0} class="{1}">{2}</{0}>', 937 orientation = getValidEnumValue(stepsOrientation, options.stepsOrientation), 938 verticalCssClass = orientation === stepsOrientation.vertical ? " vertical" : "", 939 contentWrapper = $( 940 wrapperTemplate.format( 941 options.contentContainerTag, 942 "content " + options.clearFixCssClass, 943 wizard.html() 944 ) 945 ), 946 stepsWrapper = $( 947 wrapperTemplate.format( 948 options.stepsContainerTag, 949 "steps " + options.clearFixCssClass, 950 '<ul role="tablist"></ul>' 951 ) 952 ), 953 stepTitles = contentWrapper.children(options.headerTag), 954 stepContents = contentWrapper.children(options.bodyTag); 955 956 // Transform the wizard wrapper and remove the inner HTML 957 wizard 958 .attr("role", "application") 959 .empty() 960 .append(stepsWrapper) 961 .append(contentWrapper) 962 .addClass(options.cssClass + " " + options.clearFixCssClass + verticalCssClass); 963 964 // Add WIA-ARIA support 965 stepContents.each(function (index) { 966 renderBody(wizard, state, $(this), index); 967 }); 968 969 stepTitles.each(function (index) { 970 renderTitle(wizard, options, state, $(this), index); 971 }); 972 973 refreshStepNavigation(wizard, options, state); 974 renderPagination(wizard, options, state); 975 } 976 977 /** 978 * Transforms the body to a proper tabpanel. 979 * 980 * @static 981 * @private 982 * @method renderBody 983 * @param wizard {Object} A jQuery wizard object 984 * @param body {Object} A jQuery body object 985 * @param index {Integer} The position of the body 986 */ 987 function renderBody(wizard, state, body, index) { 988 var uniqueId = getUniqueId(wizard), 989 uniqueBodyId = uniqueId + _tabpanelSuffix + index, 990 uniqueHeaderId = uniqueId + _titleSuffix + index; 991 992 body._id(uniqueBodyId) 993 .attr("role", "tabpanel") 994 ._aria("labelledby", uniqueHeaderId) 995 .addClass("body") 996 ._showAria(state.currentIndex === index); 997 } 998 999 /**
1000 * Renders a pagination if enabled. 1001 * 1002 * @static 1003 * @private 1004 * @method renderPagination 1005 * @param wizard {Object} A jQuery wizard object 1006 * @param options {Object} Settings of the current wizard 1007 * @param state {Object} The state container of the current wizard 1008 */ 1009 function renderPagination(wizard, options, state) { 1010 if (options.enablePagination) { 1011 var pagination = '<{0} class="actions {1}"><ul role="menu" aria-label="{2}">{3}</ul></{0}>', 1012 buttonTemplate = 1013 '<li><a href="#{0}" role="menuitem" id="buttonAction" class="buttonAction">{1}</a></li>', 1014 buttons = ""; 1015 1016 if (!options.forceMoveForward) { 1017 buttons += buttonTemplate.format("previous", options.labels.previous); 1018 } 1019 1020 buttons += buttonTemplate.format("next", options.labels.next); 1021 1022 if (options.enableFinishButton) { 1023 buttons += buttonTemplate.format("finish", options.labels.finish); 1024 } 1025 1026 if (options.enableCancelButton) { 1027 buttons += buttonTemplate.format("cancel", options.labels.cancel); 1028 } 1029 1030 wizard.append( 1031 pagination.format( 1032 options.actionContainerTag, 1033 options.clearFixCssClass, 1034 options.labels.pagination, 1035 buttons 1036 ) 1037 ); 1038 1039 refreshPagination(wizard, options, state); 1040 loadAsyncContent(wizard, options, state); 1041 } 1042 } 1043 1044 /** 1045 * Renders a template and replaces all placeholder. 1046 * 1047 * @static 1048 * @private 1049 * @method renderTemplate 1050 * @param template {String} A template 1051 * @param substitutes {Object} A list of substitute 1052 * @return {String} The rendered template 1053 */ 1054 function renderTemplate(template, substitutes) { 1055 var matches = template.match(/#([a-z]*)#/gi); 1056 1057 for (var i = 0; i < matches.length; i++) { 1058 var match = matches[i], 1059 key = match.substring(1, match.length - 1); 1060 1061 if (substitutes[key] === undefined) { 1062 throwError("The key '{0}' does not exist in the substitute collection!", key); 1063 } 1064 1065 template = template.replace(match, substitutes[key]); 1066 } 1067 1068 return template; 1069 } 1070 1071 /** 1072 * Transforms the title to a step item button. 1073 * 1074 * @static 1075 * @private 1076 * @method renderTitle 1077 * @param wizard {Object} A jQuery wizard object 1078 * @param options {Object} Settings of the current wizard 1079 * @param state {Object} The state container of the current wizard 1080 * @param header {Object} A jQuery header object 1081 * @param index {Integer} The position of the header 1082 */ 1083 function renderTitle(wizard, options, state, header, index) { 1084 var uniqueId = getUniqueId(wizard), 1085 uniqueStepId = uniqueId + _tabSuffix + index, 1086 uniqueBodyId = uniqueId + _tabpanelSuffix + index, 1087 uniqueHeaderId = uniqueId + _titleSuffix + index, 1088 stepCollection = wizard.find(".steps > ul"), 1089 title = renderTemplate(options.titleTemplate, { 1090 index: index + 1, 1091 title: header.html(), 1092 }), 1093 stepItem = $( 1094 '<li role="tab"><a id="' + 1095 uniqueStepId + 1096 '" href="#' + 1097 uniqueHeaderId + 1098 '" aria-controls="' + 1099 uniqueBodyId + 1100 '">' + 1101 title + 1102 "</a></li>" 1103 ); 1104 1105 stepItem._enableAria(options.enableAllSteps || state.currentIndex > index); 1106 1107 if (state.currentIndex > index) { 1108 stepItem.addClass("done"); 1109 } 1110 1111 header._id(uniqueHeaderId).attr("tabindex", "-1").addClass("title"); 1112 1113 if (index === 0) { 1114 stepCollection.prepend(stepItem); 1115 } else { 1116 stepCollection 1117 .find("li") 1118 .eq(index - 1) 1119 .after(stepItem); 1120 } 1121 1122 // Set the "first" class to the new first step button 1123 if (index === 0) { 1124 stepCollection.find("li").removeClass("first").eq(index).addClass("first"); 1125 } 1126 1127 // Set the "last" class to the new last step button 1128 if (index === state.stepCount - 1) { 1129 stepCollection.find("li").removeClass("last").eq(index).addClass("last"); 1130 } 1131 1132 // Register click event 1133 stepItem.children("a").bind("click" + getEventNamespace(wizard), stepClickHandler); 1134 } 1135 1136 /** 1137 * Saves the current state to a cookie. 1138 * 1139 * @static 1140 * @private 1141 * @method saveCurrentStateToCookie 1142 * @param wizard {Object} A jQuery wizard object 1143 * @param options {Object} Settings of the current wizard 1144 * @param state {Object} The state container of the current wizard 1145 */ 1146 function saveCurrentStateToCookie(wizard, options, state) { 1147 if (options.saveState && $.cookie) { 1148 $.cookie(_cookiePrefix + getUniqueId(wizard), state.currentIndex); 1149 } 1150 } 1151 1152 function startTransitionEffect(wizard, options, state, index, oldIndex, doneCallback) { 1153 var stepContents = wizard.find(".content > .body"), 1154 effect = getValidEnumValue(transitionEffect, options.transitionEffect), 1155 effectSpeed = options.transitionEffectSpeed, 1156 newStep = stepContents.eq(index), 1157 currentStep = stepContents.eq(oldIndex); 1158 1159 switch (effect) { 1160 case transitionEffect.fade: 1161 case transitionEffect.slide: 1162 var hide = effect === transitionEffect.fade ? "fadeOut" : "slideUp", 1163 show = effect === transitionEffect.fade ? "fadeIn" : "slideDown"; 1164 1165 state.transitionElement = newStep; 1166 currentStep[hide](effectSpeed, function () { 1167 var wizard = $(this)._showAria(false).parent().parent(), 1168 state = getState(wizard); 1169 1170 if (state.transitionElement) { 1171 state.transitionElement[show](effectSpeed, function () { 1172 $(this)._showAria(); 1173 }) 1174 .promise() 1175 .done(doneCallback); 1176 state.transitionElement = null; 1177 } 1178 }); 1179 break; 1180 1181 case transitionEffect.slideLeft: 1182 var outerWidth = currentStep.outerWidth(true), 1183 posFadeOut = index > oldIndex ? -outerWidth : outerWidth, 1184 posFadeIn = index > oldIndex ? outerWidth : -outerWidth; 1185 1186 $.when( 1187 currentStep.animate({ left: posFadeOut }, effectSpeed, function () { 1188 $(this)._showAria(false); 1189 }), 1190 newStep 1191 .css("left", posFadeIn + "px") 1192 ._showAria() 1193 .animate({ left: 0 }, effectSpeed) 1194 ).done(doneCallback); 1195 break; 1196 1197 default: 1198 $.when(currentStep._showAria(false), newStep._showAria()).done(doneCallback); 1199 break; 1200 } 1201 } 1202 1203 /** 1204 * Fires when a step click happens. 1205 * 1206 * @static 1207 * @private 1208 * @event click 1209 * @param event {Object} An event object 1210 */ 1211 function stepClickHandler(event) { 1212 event.preventDefault(); 1213 1214 var anchor = $(this), 1215 wizard = anchor.parent().parent().parent().parent(), 1216 options = getOptions(wizard), 1217 state = getState(wizard), 1218 oldIndex = state.currentIndex; 1219 1220 if (anchor.parent().is(":not(.disabled):not(.current)")) { 1221 var href = anchor.attr("href"), 1222 position = parseInt(href.substring(href.lastIndexOf("-") + 1), 0); 1223 1224 goToStep(wizard, options, state, position); 1225 } 1226 1227 // If nothing has changed 1228 if (oldIndex === state.currentIndex) { 1229 getStepAnchor(wizard, oldIndex).focus(); 1230 return false;
1231 } 1232 } 1233 1234 function throwError(message) { 1235 if (arguments.length > 1) { 1236 message = message.format(Array.prototype.slice.call(arguments, 1)); 1237 } 1238 1239 throw new Error(message); 1240 } 1241 1242 /** 1243 * Checks an argument for null or undefined and throws an error if one check applies. 1244 * 1245 * @static 1246 * @private 1247 * @method validateArgument 1248 * @param argumentName {String} The name of the given argument 1249 * @param argumentValue {Object} The argument itself 1250 */ 1251 function validateArgument(argumentName, argumentValue) { 1252 if (argumentValue == null) { 1253 throwError("The argument '{0}' is null or undefined.", argumentName); 1254 } 1255 } 1256 1257 /** 1258 * Represents a jQuery wizard plugin. 1259 * 1260 * @class steps 1261 * @constructor 1262 * @param [method={}] The name of the method as `String` or an JSON object for initialization 1263 * @param [params=]* {Array} Additional arguments for a method call 1264 * @chainable 1265 **/ 1266 $.fn.steps = function (method) { 1267 if ($.fn.steps[method]) { 1268 return $.fn.steps[method].apply(this, Array.prototype.slice.call(arguments, 1)); 1269 } else if (typeof method === "object" || !method) { 1270 return initialize.apply(this, arguments); 1271 } else { 1272 $.error("Method " + method + " does not exist on jQuery.steps"); 1273 } 1274 }; 1275 1276 /** 1277 * Adds a new step. 1278 * 1279 * @method add 1280 * @param step {Object} The step object to add 1281 * @chainable 1282 **/ 1283 $.fn.steps.add = function (step) { 1284 var state = getState(this); 1285 return insertStep(this, getOptions(this), state, state.stepCount, step); 1286 }; 1287 1288 /** 1289 * Removes the control functionality completely and transforms the current state to the initial HTML structure. 1290 * 1291 * @method destroy 1292 * @chainable 1293 **/ 1294 $.fn.steps.destroy = function () { 1295 return destroy(this, getOptions(this)); 1296 }; 1297 1298 /** 1299 * Triggers the onFinishing and onFinished event. 1300 * 1301 * @method finish 1302 **/ 1303 $.fn.steps.finish = function () { 1304 finishStep(this, getState(this)); 1305 }; 1306 1307 /** 1308 * Gets the current step index. 1309 * 1310 * @method getCurrentIndex 1311 * @return {Integer} The actual step index (zero-based) 1312 * @for steps 1313 **/ 1314 $.fn.steps.getCurrentIndex = function () { 1315 return getState(this).currentIndex; 1316 }; 1317 1318 /** 1319 * Gets the current step object. 1320 * 1321 * @method getCurrentStep 1322 * @return {Object} The actual step object 1323 **/ 1324 $.fn.steps.getCurrentStep = function () { 1325 return getStep(this, getState(this).currentIndex); 1326 }; 1327 1328 /** 1329 * Gets a specific step object by index. 1330 * 1331 * @method getStep 1332 * @param index {Integer} An integer that belongs to the position of a step 1333 * @return {Object} A specific step object 1334 **/ 1335 $.fn.steps.getStep = function (index) { 1336 return getStep(this, index); 1337 }; 1338 1339 /** 1340 * Inserts a new step to a specific position. 1341 * 1342 * @method insert 1343 * @param index {Integer} The position (zero-based) to add 1344 * @param step {Object} The step object to add 1345 * @example 1346 * $("#wizard").steps().insert(0, { 1347 * title: "Title", 1348 * content: "", // optional 1349 * contentMode: "async", // optional 1350 * contentUrl: "/Content/Step/1" // optional 1351 * }); 1352 * @chainable 1353 **/ 1354 $.fn.steps.insert = function (index, step) { 1355 return insertStep(this, getOptions(this), getState(this), index, step); 1356 }; 1357 1358 /** 1359 * Routes to the next step. 1360 * 1361 * @method next 1362 * @return {Boolean} Indicates whether the action executed 1363 **/ 1364 $.fn.steps.next = function () { 1365 return goToNextStep(this, getOptions(this), getState(this)); 1366 }; 1367 1368 /** 1369 * Routes to the previous step. 1370 * 1371 * @method previous 1372 * @return {Boolean} Indicates whether the action executed 1373 **/ 1374 $.fn.steps.previous = function () { 1375 return goToPreviousStep(this, getOptions(this), getState(this)); 1376 }; 1377 1378 /** 1379 * Removes a specific step by an given index. 1380 * 1381 * @method remove 1382 * @param index {Integer} The position (zero-based) of the step to remove 1383 * @return Indecates whether the item is removed. 1384 **/ 1385 $.fn.steps.remove = function (index) { 1386 return removeStep(this, getOptions(this), getState(this), index); 1387 }; 1388 1389 /** 1390 * Sets a specific step object by index. 1391 * 1392 * @method setStep 1393 * @param index {Integer} An integer that belongs to the position of a step 1394 * @param step {Object} The step object to change 1395 **/ 1396 /* $.fn.steps.setStep = function (step) 1397 { 1398 1399 var options = getOptions(this), 1400 state = getState(this); 1401 1402 return goToStep(this, options, state, step); 1403 1404 }; */ 1405 $.fn.steps.setStep = function (index, step) { 1406 throw new Error("Not yet implemented!"); 1407 }; 1408 1409 /**
1410 * Skips an certain amount of steps. 1411 * 1412 * @method skip 1413 * @param count {Integer} The amount of steps that should be skipped 1414 * @return {Boolean} Indicates whether the action executed 1415 **/ 1416 $.fn.steps.skip = function (count) { 1417 throw new Error("Not yet implemented!"); 1418 }; 1419 1420 /** 1421 * An enum represents the different content types of a step and their loading mechanisms. 1422 * 1423 * @class contentMode 1424 * @for steps 1425 **/ 1426 var contentMode = ($.fn.steps.contentMode = { 1427 /** 1428 * HTML embedded content 1429 * 1430 * @readOnly 1431 * @property html 1432 * @type Integer 1433 * @for contentMode 1434 **/ 1435 html: 0, 1436 1437 /** 1438 * IFrame embedded content 1439 * 1440 * @readOnly 1441 * @property iframe 1442 * @type Integer 1443 * @for contentMode 1444 **/ 1445 iframe: 1, 1446 1447 /** 1448 * Async embedded content 1449 * 1450 * @readOnly 1451 * @property async 1452 * @type Integer 1453 * @for contentMode 1454 **/ 1455 async: 2, 1456 }); 1457 1458 /** 1459 * An enum represents the orientation of the steps navigation. 1460 * 1461 * @class stepsOrientation 1462 * @for steps 1463 **/ 1464 var stepsOrientation = ($.fn.steps.stepsOrientation = { 1465 /** 1466 * Horizontal orientation 1467 * 1468 * @readOnly 1469 * @property horizontal 1470 * @type Integer 1471 * @for stepsOrientation 1472 **/ 1473 horizontal: 0, 1474 1475 /** 1476 * Vertical orientation 1477 * 1478 * @readOnly 1479 * @property vertical 1480 * @type Integer 1481 * @for stepsOrientation 1482 **/ 1483 vertical: 1, 1484 }); 1485 1486 /** 1487 * An enum that represents the various transition animations. 1488 * 1489 * @class transitionEffect 1490 * @for steps 1491 **/ 1492 var transitionEffect = ($.fn.steps.transitionEffect = { 1493 /** 1494 * No transition animation 1495 * 1496 * @readOnly 1497 * @property none 1498 * @type Integer 1499 * @for transitionEffect 1500 **/ 1501 none: 0, 1502 1503 /** 1504 * Fade in transition 1505 * 1506 * @readOnly 1507 * @property fade 1508 * @type Integer 1509 * @for transitionEffect 1510 **/ 1511 fade: 1, 1512 1513 /** 1514 * Slide up transition 1515 * 1516 * @readOnly 1517 * @property slide 1518 * @type Integer 1519 * @for transitionEffect 1520 **/ 1521 slide: 2, 1522 1523 /** 1524 * Slide left transition 1525 * 1526 * @readOnly 1527 * @property slideLeft 1528 * @type Integer 1529 * @for transitionEffect 1530 **/ 1531 slideLeft: 3, 1532 }); 1533 1534 var stepModel = ($.fn.steps.stepModel = { 1535 title: "", 1536 content: "", 1537 contentUrl: "", 1538 contentMode: contentMode.html, 1539 contentLoaded: false, 1540 }); 1541 1542 /** 1543 * An object that represents the default settings. 1544 * There are two possibities to override the sub-properties. 1545 * Either by doing it generally (global) or on initialization. 1546 * 1547 * @static 1548 * @class defaults 1549 * @for steps 1550 * @example 1551 * // Global approach 1552 * $.steps.defaults.headerTag = "h3"; 1553 * @example 1554 * // Initialization approach 1555 * $("#wizard").steps({ headerTag: "h3" }); 1556 **/ 1557 var defaults = ($.fn.steps.defaults = { 1558 /** 1559 * The header tag is used to find the step button text within the declared wizard area. 1560 * 1561 * @property headerTag
1562 * @type String 1563 * @default "h1" 1564 * @for defaults 1565 **/ 1566 headerTag: "h1", 1567 1568 /** 1569 * The body tag is used to find the step content within the declared wizard area. 1570 * 1571 * @property bodyTag 1572 * @type String 1573 * @default "div" 1574 * @for defaults 1575 **/ 1576 bodyTag: "div", 1577 1578 /** 1579 * The content container tag which will be used to wrap all step contents. 1580 * 1581 * @property contentContainerTag 1582 * @type String 1583 * @default "div" 1584 * @for defaults 1585 **/ 1586 contentContainerTag: "div", 1587 1588 /** 1589 * The action container tag which will be used to wrap the pagination navigation. 1590 * 1591 * @property actionContainerTag 1592 * @type String 1593 * @default "div" 1594 * @for defaults 1595 **/ 1596 actionContainerTag: "div", 1597 1598 /** 1599 * The steps container tag which will be used to wrap the steps navigation. 1600 * 1601 * @property stepsContainerTag
1602 * @type String 1603 * @default "div" 1604 * @for defaults 1605 **/ 1606 stepsContainerTag: "div", 1607 1608 /** 1609 * The css class which will be added to the outer component wrapper. 1610 * 1611 * @property cssClass 1612 * @type String 1613 * @default "wizard" 1614 * @for defaults 1615 * @example 1616 * <div class="wizard"> 1617 * ... 1618 * </div> 1619 **/ 1620 cssClass: "wizard", 1621 1622 /** 1623 * The css class which will be used for floating scenarios. 1624 * 1625 * @property clearFixCssClass 1626 * @type String 1627 * @default "clearfix" 1628 * @for defaults 1629 **/ 1630 clearFixCssClass: "clearfix", 1631 1632 /** 1633 * Determines whether the steps are vertically or horizontally oriented. 1634 * 1635 * @property stepsOrientation 1636 * @type stepsOrientation 1637 * @default horizontal 1638 * @for defaults 1639 * @since 1.0.0 1640 **/ 1641 stepsOrientation: stepsOrientation.horizontal, 1642 1643 /* 1644 * Tempplates 1645 */ 1646 1647 /** 1648 * The title template which will be used to create a step button. 1649 * 1650 * @property titleTemplate
1651 * @type String 1652 * @default "<span class=\"number\">#index#.</span> #title#" 1653 * @for defaults 1654 **/ 1655 titleTemplate: '<span class="number">#index#.</span> #title#', 1656 1657 /** 1658 * The loading template which will be used to create the loading animation. 1659 * 1660 * @property loadingTemplate 1661 * @type String 1662 * @default "<span class=\"spinner\"></span> #text#" 1663 * @for defaults 1664 **/ 1665 loadingTemplate: '<span class="spinner"></span> #text#', 1666 1667 /* 1668 * Behaviour 1669 */ 1670 1671 /** 1672 * Sets the focus to the first wizard instance in order to enable the key navigation from the begining if `true`. 1673 * 1674 * @property autoFocus 1675 * @type Boolean 1676 * @default false 1677 * @for defaults 1678 * @since 0.9.4 1679 **/ 1680 autoFocus: false, 1681 1682 /** 1683 * Enables all steps from the begining if `true` (all steps are clickable). 1684 * 1685 * @property enableAllSteps 1686 * @type Boolean 1687 * @default false 1688 * @for defaults 1689 **/ 1690 enableAllSteps: false, 1691 1692 /** 1693 * Enables keyboard navigation if `true` (arrow left and arrow right). 1694 * 1695 * @property enableKeyNavigation 1696 * @type Boolean 1697 * @default true 1698 * @for defaults 1699 **/ 1700 enableKeyNavigation: true, 1701 1702 /** 1703 * Enables pagination if `true`. 1704 * 1705 * @property enablePagination 1706 * @type Boolean 1707 * @default true 1708 * @for defaults 1709 **/ 1710 enablePagination: true, 1711 1712 /** 1713 * Suppresses pagination if a form field is focused. 1714 * 1715 * @property suppressPaginationOnFocus 1716 * @type Boolean 1717 * @default true 1718 * @for defaults 1719 **/ 1720 suppressPaginationOnFocus: true, 1721 1722 /** 1723 * Enables cache for async loaded or iframe embedded content. 1724 * 1725 * @property enableContentCache 1726 * @type Boolean 1727 * @default true 1728 * @for defaults 1729 **/ 1730 enableContentCache: true, 1731 1732 /** 1733 * Shows the cancel button if enabled. 1734 * 1735 * @property enableCancelButton 1736 * @type Boolean 1737 * @default false 1738 * @for defaults 1739 **/
1740 enableCancelButton: false, 1741 1742 /** 1743 * Shows the finish button if enabled. 1744 * 1745 * @property enableFinishButton 1746 * @type Boolean 1747 * @default true 1748 * @for defaults 1749 **/ 1750 enableFinishButton: true, 1751 1752 /** 1753 * Not yet implemented. 1754 * 1755 * @property preloadContent 1756 * @type Boolean 1757 * @default false 1758 * @for defaults 1759 **/ 1760 preloadContent: false, 1761 1762 /** 1763 * Shows the finish button always (on each step; right beside the next button) if `true`. 1764 * Otherwise the next button will be replaced by the finish button if the last step becomes active. 1765 * 1766 * @property showFinishButtonAlways 1767 * @type Boolean 1768 * @default false 1769 * @for defaults 1770 **/ 1771 showFinishButtonAlways: false, 1772 1773 /** 1774 * Prevents jumping to a previous step. 1775 * 1776 * @property forceMoveForward 1777 * @type Boolean 1778 * @default false 1779 * @for defaults 1780 **/ 1781 forceMoveForward: false, 1782 1783 /** 1784 * Saves the current state (step position) to a cookie. 1785 * By coming next time the last active step becomes activated. 1786 * 1787 * @property saveState 1788 * @type Boolean 1789 * @default false 1790 * @for defaults 1791 **/ 1792 saveState: false, 1793 1794 /** 1795 * The position to start on (zero-based). 1796 * 1797 * @property startIndex 1798 * @type Integer 1799 * @default 0 1800 * @for defaults 1801 **/ 1802 startIndex: 0, 1803 1804 /* 1805 * Animation Effect Configuration 1806 */ 1807 1808 /** 1809 * The animation effect which will be used for step transitions. 1810 * 1811 * @property transitionEffect 1812 * @type transitionEffect 1813 * @default none 1814 * @for defaults 1815 **/ 1816 transitionEffect: transitionEffect.none, 1817 1818 /** 1819 * Animation speed for step transitions (in milliseconds). 1820 * 1821 * @property transitionEffectSpeed 1822 * @type Integer 1823 * @default 200 1824 * @for defaults 1825 **/ 1826 transitionEffectSpeed: 200, 1827 1828 /* 1829 * Events 1830 */ 1831 1832 /** 1833 * Fires before the step changes and can be used to prevent step changing by returning `false`. 1834 * Very useful for form validation. 1835 * 1836 * @property onStepChanging 1837 * @type Event 1838 * @default function (event, currentIndex, newIndex) { return true; } 1839 * @for defaults 1840 **/ 1841 onStepChanging: function (event, currentIndex, newIndex) { 1842 return true; 1843 }, 1844 1845 /** 1846 * Fires after the step has change. 1847 * 1848 * @property onStepChanged 1849 * @type Event 1850 * @default function (event, currentIndex, priorIndex) { } 1851 * @for defaults 1852 **/ 1853 onStepChanged: function (event, currentIndex, priorIndex) {}, 1854 1855 /** 1856 * Fires after cancelation. 1857 * 1858 * @property onCanceled 1859 * @type Event 1860 * @default function (event) { } 1861 * @for defaults 1862 **/ 1863 onCanceled: function (event) {}, 1864 1865 /** 1866 * Fires before finishing and can be used to prevent completion by returning `false`. 1867 * Very useful for form validation. 1868 * 1869 * @property onFinishing 1870 * @type Event 1871 * @default function (event, currentIndex, newIndex) { return true; } 1872 * @for defaults 1873 **/ 1874 onFinishing: function (event, currentIndex, newIndex) { 1875 return true; 1876 }, 1877 1878 /** 1879 * Fires after completion. 1880 * 1881 * @property onFinished 1882 * @type Event 1883 * @default function (event, currentIndex) { } 1884 * @for defaults 1885 **/ 1886 onFinished: function (event, currentIndex) {}, 1887 1888 /** 1889 * Fires after async content is loaded. 1890 * 1891 * @property onContentLoaded 1892 * @type Event 1893 * @default function (event, index) { } 1894 * @for defaults 1895 **/ 1896 onContentLoaded: function (event, currentIndex) {}, 1897 1898 /** 1899 * Fires when the wizard is initialized. 1900 * 1901 * @property onInit 1902 * @type Event 1903 * @default function (event) { } 1904 * @for defaults 1905 **/ 1906 onInit: function (event, currentIndex) {}, 1907 1908 /** 1909 * Contains all labels. 1910 * 1911 * @property labels 1912 * @type Object 1913 * @for defaults 1914 **/ 1915 labels: { 1916 /** 1917 * Label for the cancel button. 1918 * 1919 * @property cancel
1920 * @type String 1921 * @default "Cancel" 1922 * @for defaults 1923 **/ 1924 cancel: "Cancel", 1925 1926 /** 1927 * This label is important for accessability reasons. 1928 * Indicates which step is activated. 1929 * 1930 * @property current 1931 * @type String 1932 * @default "current step:" 1933 * @for defaults 1934 **/ 1935 current: "current step:", 1936 1937 /** 1938 * This label is important for accessability reasons and describes the kind of navigation. 1939 * 1940 * @property pagination 1941 * @type String 1942 * @default "Pagination" 1943 * @for defaults 1944 * @since 0.9.7 1945 **/ 1946 pagination: "Pagination", 1947 1948 /** 1949 * Label for the finish button. 1950 * 1951 * @property finish 1952 * @type String 1953 * @default "Finish" 1954 * @for defaults 1955 **/ 1956 finish: "Finish", 1957 1958 /** 1959 * Label for the next button. 1960 * 1961 * @property next
1962 * @type String 1963 * @default "Next" 1964 * @for defaults 1965 **/ 1966 next: "Next", 1967 1968 /** 1969 * Label for the previous button. 1970 * 1971 * @property previous 1972 * @type String 1973 * @default "Previous" 1974 * @for defaults 1975 **/ 1976 previous: "Previous", 1977 1978 /** 1979 * Label for the loading animation. 1980 * 1981 * @property loading 1982 * @type String 1983 * @default "Loading ..." 1984 * @for defaults 1985 **/ 1986 loading: "Loading ...", 1987 }, 1988 }); 1989})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.