diff --git a/build/jquery.steps.js b/build/jquery.steps.js
index 956b05a..6cd1b49 100644
--- a/build/jquery.steps.js
+++ b/build/jquery.steps.js
@@ -1,6 +1,6 @@
/*!
- * jQuery Steps v1.1.0 - 09/04/2014
- * Copyright (c) 2014 Rafael Staib (http://www.jquery-steps.com)
+ * jQuery Steps v1.1.0 - 04/09/2015
+ * Copyright (c) 2015 Rafael Staib (http://www.jquery-steps.com)
* Licensed under MIT http://www.opensource.org/licenses/MIT
*/
;(function ($, undefined)
@@ -233,7 +233,7 @@ function destroy(wizard, options)
// Remove virtual data objects from the wizard
wizard.unbind(eventNamespace).removeData("uid").removeData("options")
.removeData("state").removeData("steps").removeData("eventNamespace")
- .find(".actions a").unbind(eventNamespace);
+ .find("." + options.actionsCssClass + " a").unbind(eventNamespace);
// Remove attributes and CSS classes from the wizard
wizard.removeClass(options.clearFixCssClass + " vertical");
@@ -273,11 +273,12 @@ function destroy(wizard, options)
* @private
* @method finishStep
* @param wizard {Object} The jQuery wizard object
+ * @param options {Object} Settings of the current wizard
* @param state {Object} The state container of the current wizard
**/
-function finishStep(wizard, state)
+function finishStep(wizard, options, state)
{
- var currentStep = wizard.find(".steps li").eq(state.currentIndex);
+ var currentStep = getStepsCollection(wizard, options).children("li").eq(state.currentIndex);
if (wizard.triggerHandler("finishing", [state.currentIndex]))
{
@@ -348,6 +349,26 @@ function getSteps(wizard)
return wizard.data("steps");
}
+function getStepsCollection(wizard, options)
+{
+ return wizard.find('.' + options.stepsCssClass + ' > ul');
+}
+
+function getContentContainer(wizard, options)
+{
+ return wizard.find('.' + options.contentCssClass);
+}
+
+function getHeaderCollection(wizard, options)
+{
+ return wizard.find('.' + options.contentCssClass + ' > ' + '.' + options.headerCssClass);
+}
+
+function getBodyCollection(wizard, options)
+{
+ return wizard.find('.' + options.contentCssClass + ' > ' + '.' + options.bodyCssClass);
+}
+
/**
* Gets a specific step object by index.
*
@@ -517,7 +538,7 @@ function goToStep(wizard, options, state, index)
}
else
{
- wizard.find(".steps li").eq(oldIndex).addClass("error");
+ getStepsCollection(wizard, options).children("li").eq(oldIndex).addClass("error");
}
return true;
@@ -609,7 +630,7 @@ function insertStep(wizard, options, state, index, step)
}
state.stepCount++;
- var contentContainer = wizard.find(".content"),
+ var contentContainer = getContentContainer(wizard, options),
header = $("<{0}>{1}{0}>".format(options.headerTag, step.title)),
body = $("<{0}>{0}>".format(options.bodyTag));
@@ -627,7 +648,7 @@ function insertStep(wizard, options, state, index, step)
getStepPanel(wizard, (index - 1)).after(body).after(header);
}
- renderBody(wizard, state, body, index);
+ renderBody(wizard, options, state, body, index);
renderTitle(wizard, options, state, header, index);
refreshSteps(wizard, options, state, index);
if (index === state.currentIndex)
@@ -709,7 +730,7 @@ function loadAsyncContent(wizard, options, state)
switch (getValidEnumValue(contentMode, currentStep.contentMode))
{
case contentMode.iframe:
- wizard.find(".content > .body").eq(state.currentIndex).empty()
+ getBodyCollection(wizard, options).eq(state.currentIndex).empty()
.html("")
.data("loaded", "1");
break;
@@ -794,7 +815,7 @@ function paginationClickHandler(event)
break;
case "finish":
- finishStep(wizard, state);
+ finishStep(wizard, options, state);
break;
case "next":
@@ -821,12 +842,12 @@ function refreshPagination(wizard, options, state)
{
if (options.enablePagination)
{
- var finish = wizard.find(".actions a[href$='#finish']").parent(),
- next = wizard.find(".actions a[href$='#next']").parent();
+ var finish = wizard.find("." + options.actionsCssClass + " a[href$='#finish']").parent(),
+ next = wizard.find("." + options.actionsCssClass + " a[href$='#next']").parent();
if (!options.forceMoveForward)
{
- var previous = wizard.find(".actions a[href$='#previous']").parent();
+ var previous = wizard.find("." + options.actionsCssClass + " a[href$='#previous']").parent();
previous._enableAria(state.currentIndex > 0);
}
@@ -859,19 +880,19 @@ function refreshStepNavigation(wizard, options, state, oldIndex)
{
var currentOrNewStepAnchor = getStepAnchor(wizard, state.currentIndex),
currentInfo = $("" + options.labels.current + " "),
- stepTitles = wizard.find(".content > .title");
+ stepTitles = getHeaderCollection(wizard, options);
if (oldIndex != null)
{
var oldStepAnchor = getStepAnchor(wizard, oldIndex);
oldStepAnchor.parent().addClass("done").removeClass("error")._selectAria(false);
- stepTitles.eq(oldIndex).removeClass("current").next(".body").removeClass("current");
+ stepTitles.eq(oldIndex).removeClass("current").next("." + options.bodyCssClass).removeClass("current");
currentInfo = oldStepAnchor.find(".current-info");
currentOrNewStepAnchor.focus();
}
currentOrNewStepAnchor.prepend(currentInfo).parent()._selectAria().removeClass("done")._enableAria();
- stepTitles.eq(state.currentIndex).addClass("current").next(".body").addClass("current");
+ stepTitles.eq(state.currentIndex).addClass("current").next("." + options.bodyCssClass).addClass("current");
}
/**
@@ -894,12 +915,12 @@ function refreshSteps(wizard, options, state, index)
var uniqueStepId = uniqueId + _tabSuffix + i,
uniqueBodyId = uniqueId + _tabpanelSuffix + i,
uniqueHeaderId = uniqueId + _titleSuffix + i,
- title = wizard.find(".title").eq(i)._id(uniqueHeaderId);
+ title = wizard.find("." + options.headerCssClass).eq(i)._id(uniqueHeaderId);
- wizard.find(".steps a").eq(i)._id(uniqueStepId)
+ getStepsCollection(wizard, options).find("a").eq(i)._id(uniqueStepId)
._aria("controls", uniqueBodyId).attr("href", "#" + uniqueHeaderId)
.html(renderTemplate(options.titleTemplate, { index: i + 1, title: title.html() }));
- wizard.find(".body").eq(i)._id(uniqueBodyId)
+ wizard.find("." + options.bodyCssClass).eq(i)._id(uniqueBodyId)
._aria("labelledby", uniqueHeaderId);
}
}
@@ -921,7 +942,7 @@ function registerEvents(wizard, options)
wizard.bind("keyup" + eventNamespace, keyUpHandler);
}
- wizard.find(".actions a").bind("click" + eventNamespace, paginationClickHandler);
+ wizard.find("." + options.actionsCssClass + " a").bind("click" + eventNamespace, paginationClickHandler);
}
/**
@@ -960,13 +981,13 @@ function removeStep(wizard, options, state, index)
// Set the "first" class to the new first step button
if (index === 0)
{
- wizard.find(".steps li").first().addClass("first");
+ getStepsCollection(wizard, options).children("li").first().addClass("first");
}
// Set the "last" class to the new last step button
if (index === state.stepCount)
{
- wizard.find(".steps li").eq(index).addClass("last");
+ getStepsCollection(wizard, options).children("li").eq(index).addClass("last");
}
refreshSteps(wizard, options, state, index);
@@ -996,8 +1017,8 @@ function render(wizard, options, state)
var wrapperTemplate = "<{0} class=\"{1}\">{2}{0}>",
orientation = getValidEnumValue(stepsOrientation, options.stepsOrientation),
verticalCssClass = (orientation === stepsOrientation.vertical) ? " vertical" : "",
- contentWrapper = $(wrapperTemplate.format(options.contentContainerTag, "content " + options.clearFixCssClass, wizard.html())),
- stepsWrapper = $(wrapperTemplate.format(options.stepsContainerTag, "steps " + options.clearFixCssClass, "
")),
+ contentWrapper = $(wrapperTemplate.format(options.contentContainerTag, options.contentCssClass + " " + options.clearFixCssClass, wizard.html())),
+ stepsWrapper = $(wrapperTemplate.format(options.stepsContainerTag, options.stepsCssClass + " " + options.clearFixCssClass, "")),
stepTitles = contentWrapper.children(options.headerTag),
stepContents = contentWrapper.children(options.bodyTag);
@@ -1008,7 +1029,7 @@ function render(wizard, options, state)
// Add WIA-ARIA support
stepContents.each(function (index)
{
- renderBody(wizard, state, $(this), index);
+ renderBody(wizard, options, state, $(this), index);
});
stepTitles.each(function (index)
@@ -1020,6 +1041,35 @@ function render(wizard, options, state)
renderPagination(wizard, options, state);
}
+/**
+ * Renders a template and replaces all placeholder.
+ *
+ * @static
+ * @private
+ * @method renderTemplate
+ * @param template {String} A template
+ * @param substitutes {Object} A list of substitute
+ * @return {String} The rendered template
+ */
+function renderTemplate(template, substitutes)
+{
+ var matches = template.match(/#([a-z]+)#/gi);
+ for (var i = 0; i < matches.length; i++)
+ {
+ var match = matches[i],
+ key = match.substring(1, match.length - 1);
+
+ if (substitutes[key] === undefined)
+ {
+ throwError("The key '{0}' does not exist in the substitute collection!", key);
+ }
+
+ template = template.replace(match, substitutes[key]);
+ }
+
+ return template;
+}
+
/**
* Transforms the body to a proper tabpanel.
*
@@ -1027,17 +1077,18 @@ function render(wizard, options, state)
* @private
* @method renderBody
* @param wizard {Object} A jQuery wizard object
+ * @param options {Object} Settings of the current wizard
* @param body {Object} A jQuery body object
* @param index {Integer} The position of the body
*/
-function renderBody(wizard, state, body, index)
+function renderBody(wizard, options, state, body, index)
{
var uniqueId = getUniqueId(wizard),
uniqueBodyId = uniqueId + _tabpanelSuffix + index,
uniqueHeaderId = uniqueId + _titleSuffix + index;
body._id(uniqueBodyId).attr("role", "tabpanel")._aria("labelledby", uniqueHeaderId)
- .addClass("body")._showAria(state.currentIndex === index);
+ .addClass(options.bodyCssClass)._showAria(state.currentIndex === index);
}
/**
@@ -1054,25 +1105,37 @@ function renderPagination(wizard, options, state)
{
if (options.enablePagination)
{
- var pagination = "<{0} class=\"actions {1}\">{0}>",
- buttonTemplate = "{1}",
+ var pagination = "<{0} class=\""+options.actionsCssClass+" {1}\">{0}>",
+ buttonTemplate = options.buttonTemplate,
buttons = "";
if (!options.forceMoveForward)
{
- buttons += buttonTemplate.format("previous", options.labels.previous);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "previous",
+ label: options.labels.previous
+ });
}
- buttons += buttonTemplate.format("next", options.labels.next);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "next",
+ label: options.labels.next
+ });
if (options.enableFinishButton)
{
- buttons += buttonTemplate.format("finish", options.labels.finish);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "finish",
+ label: options.labels.finish
+ });
}
if (options.enableCancelButton)
{
- buttons += buttonTemplate.format("cancel", options.labels.cancel);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "cancel",
+ label: options.labels.cancel
+ });
}
wizard.append(pagination.format(options.actionContainerTag, options.clearFixCssClass,
@@ -1083,36 +1146,6 @@ function renderPagination(wizard, options, state)
}
}
-/**
- * Renders a template and replaces all placeholder.
- *
- * @static
- * @private
- * @method renderTemplate
- * @param template {String} A template
- * @param substitutes {Object} A list of substitute
- * @return {String} The rendered template
- */
-function renderTemplate(template, substitutes)
-{
- var matches = template.match(/#([a-z]*)#/gi);
-
- for (var i = 0; i < matches.length; i++)
- {
- var match = matches[i],
- key = match.substring(1, match.length - 1);
-
- if (substitutes[key] === undefined)
- {
- throwError("The key '{0}' does not exist in the substitute collection!", key);
- }
-
- template = template.replace(match, substitutes[key]);
- }
-
- return template;
-}
-
/**
* Transforms the title to a step item button.
*
@@ -1131,7 +1164,7 @@ function renderTitle(wizard, options, state, header, index)
uniqueStepId = uniqueId + _tabSuffix + index,
uniqueBodyId = uniqueId + _tabpanelSuffix + index,
uniqueHeaderId = uniqueId + _titleSuffix + index,
- stepCollection = wizard.find(".steps > ul"),
+ stepCollection = getStepsCollection(wizard, options),
title = renderTemplate(options.titleTemplate, {
index: index + 1,
title: header.html()
@@ -1146,7 +1179,7 @@ function renderTitle(wizard, options, state, header, index)
stepItem.addClass("done");
}
- header._id(uniqueHeaderId).attr("tabindex", "-1").addClass("title");
+ header._id(uniqueHeaderId).attr("tabindex", "-1").addClass(options.headerCssClass);
if (index === 0)
{
@@ -1193,7 +1226,7 @@ function saveCurrentStateToCookie(wizard, options, state)
function startTransitionEffect(wizard, options, state, index, oldIndex, doneCallback)
{
- var stepContents = wizard.find(".content > .body"),
+ var stepContents = getBodyCollection(wizard, options),
effect = getValidEnumValue(transitionEffect, options.transitionEffect),
effectSpeed = options.transitionEffectSpeed,
newStep = stepContents.eq(index),
@@ -1302,6 +1335,7 @@ function validateArgument(argumentName, argumentValue)
}
}
+
/**
* Represents a jQuery wizard plugin.
*
@@ -1358,7 +1392,7 @@ $.fn.steps.destroy = function ()
**/
$.fn.steps.finish = function ()
{
- finishStep(this, getState(this));
+ finishStep(this, getOptions(this), getState(this));
};
/**
@@ -1676,6 +1710,56 @@ var defaults = $.fn.steps.defaults = {
**/
cssClass: "wizard",
+ /**
+ * The css class which will be added to the step button text.
+ *
+ * @property headerCssClass
+ * @type String
+ * @default "title"
+ * @for defaults
+ **/
+ headerCssClass: "title",
+
+ /**
+ * The css class which will be added to the step content.
+ *
+ * @property bodyCssClass
+ * @type String
+ * @default "body"
+ * @for defaults
+ **/
+ bodyCssClass: "body",
+
+ /**
+ * The css class which will be added to the content component wrapper.
+ *
+ * @property contentCssClass
+ * @type String
+ * @default "content"
+ * @for defaults
+ **/
+ contentCssClass: "content",
+
+ /**
+ * The css class which will be added to the pagination navigation wrapper.
+ *
+ * @property actionsCssClass
+ * @type String
+ * @default "actions"
+ * @for defaults
+ **/
+ actionsCssClass: "actions",
+
+ /**
+ * The css class which will be added to the steps navigation wrapper.
+ *
+ * @property stepsCssClass
+ * @type String
+ * @default "steps"
+ * @for defaults
+ **/
+ stepsCssClass: "steps",
+
/**
* The css class which will be used for floating scenarios.
*
@@ -1721,6 +1805,16 @@ var defaults = $.fn.steps.defaults = {
**/
loadingTemplate: " #text#",
+ /**
+ * The button template which will be used to create a action button.
+ *
+ * @property buttonTemplate
+ * @type String
+ * @default "#label#"
+ * @for defaults
+ **/
+ buttonTemplate: "#label#",
+
/*
* Behaviour
*/
diff --git a/package.json b/package.json
index ffeaa53..a799358 100644
--- a/package.json
+++ b/package.json
@@ -31,17 +31,17 @@
}
],
"devDependencies": {
- "grunt": "~0.4.1",
- "grunt-cli": "~0.1.9",
- "grunt-contrib-qunit": "~0.2.1",
- "grunt-contrib-jshint": "~0.4.3",
- "grunt-contrib-uglify": "~0.2.0",
- "grunt-contrib-concat": "~0.3.0",
- "grunt-contrib-yuidoc": "~0.4.0",
- "grunt-contrib-clean": "~0.4.1",
- "grunt-contrib-compress": "~0.5.2",
- "grunt-regex-replace": "~0.2.5",
- "grunt-exec": "~0.4.2"
+ "grunt": "~0.4.5",
+ "grunt-cli": "~0.1.13",
+ "grunt-contrib-clean": "~0.6.0",
+ "grunt-contrib-compress": "~0.13.0",
+ "grunt-contrib-concat": "~0.5.1",
+ "grunt-contrib-jshint": "~0.11.1",
+ "grunt-contrib-qunit": "~0.6.0",
+ "grunt-contrib-uglify": "~0.8.1",
+ "grunt-contrib-yuidoc": "~0.7.0",
+ "grunt-regex-replace": "~0.2.6",
+ "grunt-exec": "~0.4.6"
},
"readmeFilename": "README.md",
"gitHead": "0d9f4f8b6a0c3d3b8a73eabf6a4b8cececd52f7a",
diff --git a/src/defaults.js b/src/defaults.js
index 01dd7c6..29d0078 100644
--- a/src/defaults.js
+++ b/src/defaults.js
@@ -78,6 +78,56 @@ var defaults = $.fn.steps.defaults = {
**/
cssClass: "wizard",
+ /**
+ * The css class which will be added to the step button text.
+ *
+ * @property headerCssClass
+ * @type String
+ * @default "title"
+ * @for defaults
+ **/
+ headerCssClass: "title",
+
+ /**
+ * The css class which will be added to the step content.
+ *
+ * @property bodyCssClass
+ * @type String
+ * @default "body"
+ * @for defaults
+ **/
+ bodyCssClass: "body",
+
+ /**
+ * The css class which will be added to the content component wrapper.
+ *
+ * @property contentCssClass
+ * @type String
+ * @default "content"
+ * @for defaults
+ **/
+ contentCssClass: "content",
+
+ /**
+ * The css class which will be added to the pagination navigation wrapper.
+ *
+ * @property actionsCssClass
+ * @type String
+ * @default "actions"
+ * @for defaults
+ **/
+ actionsCssClass: "actions",
+
+ /**
+ * The css class which will be added to the steps navigation wrapper.
+ *
+ * @property stepsCssClass
+ * @type String
+ * @default "steps"
+ * @for defaults
+ **/
+ stepsCssClass: "steps",
+
/**
* The css class which will be used for floating scenarios.
*
@@ -123,6 +173,16 @@ var defaults = $.fn.steps.defaults = {
**/
loadingTemplate: " #text#",
+ /**
+ * The button template which will be used to create a action button.
+ *
+ * @property buttonTemplate
+ * @type String
+ * @default "#label#"
+ * @for defaults
+ **/
+ buttonTemplate: "#label#",
+
/*
* Behaviour
*/
diff --git a/src/privates.js b/src/privates.js
index 95362ce..53a311a 100644
--- a/src/privates.js
+++ b/src/privates.js
@@ -173,7 +173,7 @@ function destroy(wizard, options)
// Remove virtual data objects from the wizard
wizard.unbind(eventNamespace).removeData("uid").removeData("options")
.removeData("state").removeData("steps").removeData("eventNamespace")
- .find(".actions a").unbind(eventNamespace);
+ .find("." + options.actionsCssClass + " a").unbind(eventNamespace);
// Remove attributes and CSS classes from the wizard
wizard.removeClass(options.clearFixCssClass + " vertical");
@@ -213,11 +213,12 @@ function destroy(wizard, options)
* @private
* @method finishStep
* @param wizard {Object} The jQuery wizard object
+ * @param options {Object} Settings of the current wizard
* @param state {Object} The state container of the current wizard
**/
-function finishStep(wizard, state)
+function finishStep(wizard, options, state)
{
- var currentStep = wizard.find(".steps li").eq(state.currentIndex);
+ var currentStep = getStepsCollection(wizard, options).children("li").eq(state.currentIndex);
if (wizard.triggerHandler("finishing", [state.currentIndex]))
{
@@ -288,6 +289,26 @@ function getSteps(wizard)
return wizard.data("steps");
}
+function getStepsCollection(wizard, options)
+{
+ return wizard.find('.' + options.stepsCssClass + ' > ul');
+}
+
+function getContentContainer(wizard, options)
+{
+ return wizard.find('.' + options.contentCssClass);
+}
+
+function getHeaderCollection(wizard, options)
+{
+ return wizard.find('.' + options.contentCssClass + ' > ' + '.' + options.headerCssClass);
+}
+
+function getBodyCollection(wizard, options)
+{
+ return wizard.find('.' + options.contentCssClass + ' > ' + '.' + options.bodyCssClass);
+}
+
/**
* Gets a specific step object by index.
*
@@ -457,7 +478,7 @@ function goToStep(wizard, options, state, index)
}
else
{
- wizard.find(".steps li").eq(oldIndex).addClass("error");
+ getStepsCollection(wizard, options).children("li").eq(oldIndex).addClass("error");
}
return true;
@@ -549,7 +570,7 @@ function insertStep(wizard, options, state, index, step)
}
state.stepCount++;
- var contentContainer = wizard.find(".content"),
+ var contentContainer = getContentContainer(wizard, options),
header = $("<{0}>{1}{0}>".format(options.headerTag, step.title)),
body = $("<{0}>{0}>".format(options.bodyTag));
@@ -567,7 +588,7 @@ function insertStep(wizard, options, state, index, step)
getStepPanel(wizard, (index - 1)).after(body).after(header);
}
- renderBody(wizard, state, body, index);
+ renderBody(wizard, options, state, body, index);
renderTitle(wizard, options, state, header, index);
refreshSteps(wizard, options, state, index);
if (index === state.currentIndex)
@@ -649,7 +670,7 @@ function loadAsyncContent(wizard, options, state)
switch (getValidEnumValue(contentMode, currentStep.contentMode))
{
case contentMode.iframe:
- wizard.find(".content > .body").eq(state.currentIndex).empty()
+ getBodyCollection(wizard, options).eq(state.currentIndex).empty()
.html("")
.data("loaded", "1");
break;
@@ -734,7 +755,7 @@ function paginationClickHandler(event)
break;
case "finish":
- finishStep(wizard, state);
+ finishStep(wizard, options, state);
break;
case "next":
@@ -761,12 +782,12 @@ function refreshPagination(wizard, options, state)
{
if (options.enablePagination)
{
- var finish = wizard.find(".actions a[href$='#finish']").parent(),
- next = wizard.find(".actions a[href$='#next']").parent();
+ var finish = wizard.find("." + options.actionsCssClass + " a[href$='#finish']").parent(),
+ next = wizard.find("." + options.actionsCssClass + " a[href$='#next']").parent();
if (!options.forceMoveForward)
{
- var previous = wizard.find(".actions a[href$='#previous']").parent();
+ var previous = wizard.find("." + options.actionsCssClass + " a[href$='#previous']").parent();
previous._enableAria(state.currentIndex > 0);
}
@@ -799,19 +820,19 @@ function refreshStepNavigation(wizard, options, state, oldIndex)
{
var currentOrNewStepAnchor = getStepAnchor(wizard, state.currentIndex),
currentInfo = $("" + options.labels.current + " "),
- stepTitles = wizard.find(".content > .title");
+ stepTitles = getHeaderCollection(wizard, options);
if (oldIndex != null)
{
var oldStepAnchor = getStepAnchor(wizard, oldIndex);
oldStepAnchor.parent().addClass("done").removeClass("error")._selectAria(false);
- stepTitles.eq(oldIndex).removeClass("current").next(".body").removeClass("current");
+ stepTitles.eq(oldIndex).removeClass("current").next("." + options.bodyCssClass).removeClass("current");
currentInfo = oldStepAnchor.find(".current-info");
currentOrNewStepAnchor.focus();
}
currentOrNewStepAnchor.prepend(currentInfo).parent()._selectAria().removeClass("done")._enableAria();
- stepTitles.eq(state.currentIndex).addClass("current").next(".body").addClass("current");
+ stepTitles.eq(state.currentIndex).addClass("current").next("." + options.bodyCssClass).addClass("current");
}
/**
@@ -834,12 +855,12 @@ function refreshSteps(wizard, options, state, index)
var uniqueStepId = uniqueId + _tabSuffix + i,
uniqueBodyId = uniqueId + _tabpanelSuffix + i,
uniqueHeaderId = uniqueId + _titleSuffix + i,
- title = wizard.find(".title").eq(i)._id(uniqueHeaderId);
+ title = wizard.find("." + options.headerCssClass).eq(i)._id(uniqueHeaderId);
- wizard.find(".steps a").eq(i)._id(uniqueStepId)
+ getStepsCollection(wizard, options).find("a").eq(i)._id(uniqueStepId)
._aria("controls", uniqueBodyId).attr("href", "#" + uniqueHeaderId)
.html(renderTemplate(options.titleTemplate, { index: i + 1, title: title.html() }));
- wizard.find(".body").eq(i)._id(uniqueBodyId)
+ wizard.find("." + options.bodyCssClass).eq(i)._id(uniqueBodyId)
._aria("labelledby", uniqueHeaderId);
}
}
@@ -861,7 +882,7 @@ function registerEvents(wizard, options)
wizard.bind("keyup" + eventNamespace, keyUpHandler);
}
- wizard.find(".actions a").bind("click" + eventNamespace, paginationClickHandler);
+ wizard.find("." + options.actionsCssClass + " a").bind("click" + eventNamespace, paginationClickHandler);
}
/**
@@ -900,13 +921,13 @@ function removeStep(wizard, options, state, index)
// Set the "first" class to the new first step button
if (index === 0)
{
- wizard.find(".steps li").first().addClass("first");
+ getStepsCollection(wizard, options).children("li").first().addClass("first");
}
// Set the "last" class to the new last step button
if (index === state.stepCount)
{
- wizard.find(".steps li").eq(index).addClass("last");
+ getStepsCollection(wizard, options).children("li").eq(index).addClass("last");
}
refreshSteps(wizard, options, state, index);
@@ -936,8 +957,8 @@ function render(wizard, options, state)
var wrapperTemplate = "<{0} class=\"{1}\">{2}{0}>",
orientation = getValidEnumValue(stepsOrientation, options.stepsOrientation),
verticalCssClass = (orientation === stepsOrientation.vertical) ? " vertical" : "",
- contentWrapper = $(wrapperTemplate.format(options.contentContainerTag, "content " + options.clearFixCssClass, wizard.html())),
- stepsWrapper = $(wrapperTemplate.format(options.stepsContainerTag, "steps " + options.clearFixCssClass, "")),
+ contentWrapper = $(wrapperTemplate.format(options.contentContainerTag, options.contentCssClass + " " + options.clearFixCssClass, wizard.html())),
+ stepsWrapper = $(wrapperTemplate.format(options.stepsContainerTag, options.stepsCssClass + " " + options.clearFixCssClass, "")),
stepTitles = contentWrapper.children(options.headerTag),
stepContents = contentWrapper.children(options.bodyTag);
@@ -948,7 +969,7 @@ function render(wizard, options, state)
// Add WIA-ARIA support
stepContents.each(function (index)
{
- renderBody(wizard, state, $(this), index);
+ renderBody(wizard, options, state, $(this), index);
});
stepTitles.each(function (index)
@@ -960,6 +981,35 @@ function render(wizard, options, state)
renderPagination(wizard, options, state);
}
+/**
+ * Renders a template and replaces all placeholder.
+ *
+ * @static
+ * @private
+ * @method renderTemplate
+ * @param template {String} A template
+ * @param substitutes {Object} A list of substitute
+ * @return {String} The rendered template
+ */
+function renderTemplate(template, substitutes)
+{
+ var matches = template.match(/#([a-z]+)#/gi);
+ for (var i = 0; i < matches.length; i++)
+ {
+ var match = matches[i],
+ key = match.substring(1, match.length - 1);
+
+ if (substitutes[key] === undefined)
+ {
+ throwError("The key '{0}' does not exist in the substitute collection!", key);
+ }
+
+ template = template.replace(match, substitutes[key]);
+ }
+
+ return template;
+}
+
/**
* Transforms the body to a proper tabpanel.
*
@@ -967,17 +1017,18 @@ function render(wizard, options, state)
* @private
* @method renderBody
* @param wizard {Object} A jQuery wizard object
+ * @param options {Object} Settings of the current wizard
* @param body {Object} A jQuery body object
* @param index {Integer} The position of the body
*/
-function renderBody(wizard, state, body, index)
+function renderBody(wizard, options, state, body, index)
{
var uniqueId = getUniqueId(wizard),
uniqueBodyId = uniqueId + _tabpanelSuffix + index,
uniqueHeaderId = uniqueId + _titleSuffix + index;
body._id(uniqueBodyId).attr("role", "tabpanel")._aria("labelledby", uniqueHeaderId)
- .addClass("body")._showAria(state.currentIndex === index);
+ .addClass(options.bodyCssClass)._showAria(state.currentIndex === index);
}
/**
@@ -994,25 +1045,37 @@ function renderPagination(wizard, options, state)
{
if (options.enablePagination)
{
- var pagination = "<{0} class=\"actions {1}\">{0}>",
- buttonTemplate = "{1}",
+ var pagination = "<{0} class=\""+options.actionsCssClass+" {1}\">{0}>",
+ buttonTemplate = options.buttonTemplate,
buttons = "";
if (!options.forceMoveForward)
{
- buttons += buttonTemplate.format("previous", options.labels.previous);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "previous",
+ label: options.labels.previous
+ });
}
- buttons += buttonTemplate.format("next", options.labels.next);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "next",
+ label: options.labels.next
+ });
if (options.enableFinishButton)
{
- buttons += buttonTemplate.format("finish", options.labels.finish);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "finish",
+ label: options.labels.finish
+ });
}
if (options.enableCancelButton)
{
- buttons += buttonTemplate.format("cancel", options.labels.cancel);
+ buttons += renderTemplate(buttonTemplate, {
+ action: "cancel",
+ label: options.labels.cancel
+ });
}
wizard.append(pagination.format(options.actionContainerTag, options.clearFixCssClass,
@@ -1023,36 +1086,6 @@ function renderPagination(wizard, options, state)
}
}
-/**
- * Renders a template and replaces all placeholder.
- *
- * @static
- * @private
- * @method renderTemplate
- * @param template {String} A template
- * @param substitutes {Object} A list of substitute
- * @return {String} The rendered template
- */
-function renderTemplate(template, substitutes)
-{
- var matches = template.match(/#([a-z]*)#/gi);
-
- for (var i = 0; i < matches.length; i++)
- {
- var match = matches[i],
- key = match.substring(1, match.length - 1);
-
- if (substitutes[key] === undefined)
- {
- throwError("The key '{0}' does not exist in the substitute collection!", key);
- }
-
- template = template.replace(match, substitutes[key]);
- }
-
- return template;
-}
-
/**
* Transforms the title to a step item button.
*
@@ -1071,7 +1104,7 @@ function renderTitle(wizard, options, state, header, index)
uniqueStepId = uniqueId + _tabSuffix + index,
uniqueBodyId = uniqueId + _tabpanelSuffix + index,
uniqueHeaderId = uniqueId + _titleSuffix + index,
- stepCollection = wizard.find(".steps > ul"),
+ stepCollection = getStepsCollection(wizard, options),
title = renderTemplate(options.titleTemplate, {
index: index + 1,
title: header.html()
@@ -1086,7 +1119,7 @@ function renderTitle(wizard, options, state, header, index)
stepItem.addClass("done");
}
- header._id(uniqueHeaderId).attr("tabindex", "-1").addClass("title");
+ header._id(uniqueHeaderId).attr("tabindex", "-1").addClass(options.headerCssClass);
if (index === 0)
{
@@ -1133,7 +1166,7 @@ function saveCurrentStateToCookie(wizard, options, state)
function startTransitionEffect(wizard, options, state, index, oldIndex, doneCallback)
{
- var stepContents = wizard.find(".content > .body"),
+ var stepContents = getBodyCollection(wizard, options),
effect = getValidEnumValue(transitionEffect, options.transitionEffect),
effectSpeed = options.transitionEffectSpeed,
newStep = stepContents.eq(index),
@@ -1240,4 +1273,4 @@ function validateArgument(argumentName, argumentValue)
{
throwError("The argument '{0}' is null or undefined.", argumentName);
}
-}
\ No newline at end of file
+}
diff --git a/src/publics.js b/src/publics.js
index 9a80050..59796d4 100644
--- a/src/publics.js
+++ b/src/publics.js
@@ -54,7 +54,7 @@ $.fn.steps.destroy = function ()
**/
$.fn.steps.finish = function ()
{
- finishStep(this, getState(this));
+ finishStep(this, getOptions(this), getState(this));
};
/**