// Type definitions for jQuery Steps v1.1.1 // Project: http://www.jquery-steps.com/ // Definitions by: Joseph Blank , Nicholas Wong // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 /// interface JQuery { steps(param?: JQuerySteps.Settings): JQuerySteps.JQuerySteps; } declare module JQuerySteps { //#region "JQuerySteps" export interface JQuerySteps { /** * Adds a new step. (chainable) */ add(step: Step): JQuerySteps; /** * Inserts a new step to a specific position. (chainable) */ insert(index: number, step: Step): JQuerySteps; /** * Removes a specific step by an given index. */ remove(index: number): boolean; /** * Gets the current step object. */ getCurrentStep(): Step; /** * Gets the current step index. */ getCurrentIndex(): number; /** * Gets a specific step object by index. */ getStep(index: number): Step; /** * Routes to the previous step. */ next(): boolean; /** * Routes to the next step. */ previous(): boolean; /** * Triggers the onFinishing and onFinished event. */ finish(): void; /** * Removes the control functionality completely and transforms the current state to the initial HTML structure. */ destroy(): void; /** * Skips a certain amount of steps. Not yet implemented! */ skip(count: number): boolean; } //#endregion "JQuerySteps" //#region "Settings" export interface Settings { //#region "Appearance" /** * The header tag is used to find the step button text within the declared wizard area. Default value is h1. */ headerTag?: string; /** * The body tag is used to find the step content within the declared wizard area. Default value is div. */ bodyTag?: string; /** * The content container tag which will be used to wrap all step contents. Default value is div. */ contentContainerTag?: string; /** * The action container tag which will be used to wrap the pagination navigation. Default value is div. */ actionContainerTag?: string; /** * The steps container tag which will be used to wrap the steps navigation. Default value is div. */ stepsContainerTag?: string; /** * The css class which will be added to the outer component wrapper. Default value is wizard. */ cssClass?: string; /** * Determines whether the steps are vertically or horizontally oriented. Default value is horizontal or 0. * This can be horizontal (0) or vertical (1). */ stepsOrientation?: string|number; //#endregion "Appearance" //#region "Templates" /** * The title template which will be used to create a step button. Default value is span class="number">#index#. #title#. */ titleTemplate?: string; /** * The loading template which will be used to create the loading animation. Default value is #text#. */ loadingTemplate?: string; //#endregion "Templates" //#region "Behavior" /** * Sets the focus to the first wizard instance in order to enable the key navigation from the begining if true. Default value is false. */ autoFocus?: boolean; /** * Enables all steps from the begining if true (all steps are clickable). Default value is false. */ enableAllSteps?: boolean; /** * Enables keyboard navigation if true (arrow left and arrow right). Default value is true. */ enableKeyNavigation?: boolean; /** * Enables pagination (next, previous and finish button) if true. Default value is true. */ enablePagination?: boolean; /** * Suppresses pagination if a form field is focused. Default value is true. */ suppressPaginationOnFocus?: boolean; /** * Enables cache for async loaded or iframe embedded content. Default value is true. */ enableContentCache?: boolean; /** * Shows the cancel button if enabled. Default value is false. */ enableCancelButton?: boolean; /** * Shows the finish button if enabled. Default value is true. */ enableFinishButton?: boolean; /** * Shows the finish button always (on each step; right beside the next button) if true. Otherwise the next button will be replaced by the finish button if the last step becomes active. Default value is false. */ showFinishButtonAlways?: boolean; /** * Prevents jumping to a previous step. Default value is false. */ forceMoveForward?: boolean; /** * Saves the current state (step position) to a cookie. By coming next time the last active step becomes activated. Default value is false. */ saveState?: boolean; /** * The position to start on (zero-based). Default value is 0. */ startIndex?: number; //#endregion "Behavior" //#region "Transition Effects" /** * The animation effect which will be used for step transitions. Default value is none or 0. * This can be none (0), fade (1), slide (2) or slideLeft (3). */ transitionEffect?: string|number; /** * Animation speed for step transitions (in milliseconds). Default value is 200. */ transitionEffectSpeed?: number; //#endregion "Transition Effects" //#region "Events" /** * Fires before the step changes and can be used to prevent step changing by returning false. */ onStepChanging?: FunctionOnStepChanging; /** * Fires after the step has changed. */ onStepChanged?: FunctionOnStepChanged; /** * Fires after cancellation. */ onCanceled?: FunctionOnCancelled; /** * Fires before finishing and can be used to prevent completion by returning false. Very useful for form validation. */ onFinishing?: FunctionOnFinishing; /** * Fires after completion. */ onFinished?: FunctionOnFinished; /** * Fires when the wizard is initialized. */ onInit?: FunctionOnInit; /** * Fires after async content is loaded. */ onContentLoaded?: FunctionOnContentLoaded; //#endregion "Events" //#region "Labels" labels?: LabelSettings; //#endregion "Labels" } //#endregion "Settings" //#region "Label Settings" interface LabelSettings { /** * Label for the cancel button. Default value is Cancel. */ cancel?: string; /** * This label is important for accessability reasons. Indicates which step is activated. Default value is current step:. */ current?: string; /** * This label is important for accessability reasons and describes the kind of navigation. Default value is Pagination. */ pagination?: string; /** * Label for the finish button. Default value is Finish. */ finish?: string; /** * Label for the next button. Default value is Next. */ next?: string; /** * Label for the previous button. Default value is Previous. */ previous?: string; /** * Label for the loading animation. Default value is Loading ... . */ loading?: string; } //#endregion "Label Settings" //#region "Callback Functions" interface FunctionOnStepChanging { (event: string, currentIndex: number, newIndex: number): boolean; } interface FunctionOnStepChanged { (event: string, currentIndex: number, priorIndex: number): void; } interface FunctionOnCancelled { (event: string): void; } interface FunctionOnFinishing { (event: string, currentIndex: number): boolean; } interface FunctionOnFinished { (event: string, currentIndex: number): void; } interface FunctionOnInit { (event: string, currentIndex: number): void; } interface FunctionOnContentLoaded { (event: string, currentIndex: number): void; } //#endregion "Callback Functions" //#region "Step Object" interface Step { /** * The step title (HTML). */ title?: string; /** * The step content (HTML). */ content?: string; /** * Indicates how the content will be loaded. * This can be html (0), iframe (1), or async (2). */ contentMode?: string|number; /** * The URI that refers to the content. */ contentUrl?: string; } //#endregion "Step Object" }