File: /var/www/vhost/disk-apps/magento.bikenow.co/lib/web/jquery/ui-modules/dialog.js
/*!
* jQuery UI Dialog - v1.10.4
* http://jqueryui.com
*
* Copyright 2014 jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*
* http://api.jqueryui.com/dialog/
*/
define([
'jquery',
'jquery-ui-modules/button',
'jquery-ui-modules/draggable',
'jquery-ui-modules/position',
'jquery-ui-modules/resizable'
], function ($, undefined) {
var sizeRelatedOptions = {
buttons: true,
height: true,
maxHeight: true,
maxWidth: true,
minHeight: true,
minWidth: true,
width: true
},
resizableRelatedOptions = {
maxHeight: true,
maxWidth: true,
minHeight: true,
minWidth: true
};
$.widget("ui.dialog", {
version: "1.10.4",
options: {
appendTo: "body",
autoOpen: true,
buttons: [],
closeOnEscape: true,
closeText: "close",
dialogClass: "",
draggable: true,
hide: null,
height: "auto",
maxHeight: null,
maxWidth: null,
minHeight: 150,
minWidth: 150,
modal: false,
position: {
my: "center",
at: "center",
of: window,
collision: "fit",
// Ensure the titlebar is always visible
using: function (pos) {
var topOffset = $(this).css(pos).offset().top;
if (topOffset < 0) {
$(this).css("top", pos.top - topOffset);
}
}
},
resizable: true,
show: null,
title: null,
width: 300,
// callbacks
beforeClose: null,
close: null,
drag: null,
dragStart: null,
dragStop: null,
focus: null,
open: null,
resize: null,
resizeStart: null,
resizeStop: null
},
_create: function () {
this.originalCss = {
display: this.element[0].style.display,
width: this.element[0].style.width,
minHeight: this.element[0].style.minHeight,
maxHeight: this.element[0].style.maxHeight,
height: this.element[0].style.height
};
this.originalPosition = {
parent: this.element.parent(),
index: this.element.parent().children().index(this.element)
};
this.originalTitle = this.element.attr("title");
this.options.title = this.options.title || this.originalTitle;
this._createWrapper();
this.element
.show()
.removeAttr("title")
.addClass("ui-dialog-content ui-widget-content")
.appendTo(this.uiDialog);
this._createTitlebar();
this._createButtonPane();
if (this.options.draggable && $.fn.draggable) {
this._makeDraggable();
}
if (this.options.resizable && $.fn.resizable) {
this._makeResizable();
}
this._isOpen = false;
},
_init: function () {
if (this.options.autoOpen) {
this.open();
}
},
_appendTo: function () {
var element = this.options.appendTo;
if (element && (element.jquery || element.nodeType)) {
return $(element);
}
return this.document.find(element || "body").eq(0);
},
_destroy: function () {
var next,
originalPosition = this.originalPosition;
this._destroyOverlay();
this.element
.removeUniqueId()
.removeClass("ui-dialog-content ui-widget-content")
.css(this.originalCss)
// Without detaching first, the following becomes really slow
.detach();
this.uiDialog.stop(true, true).remove();
if (this.originalTitle) {
this.element.attr("title", this.originalTitle);
}
next = originalPosition.parent.children().eq(originalPosition.index);
// Don't try to place the dialog next to itself (#8613)
if (next.length && next[0] !== this.element[0]) {
next.before(this.element);
} else {
originalPosition.parent.append(this.element);
}
},
widget: function () {
return this.uiDialog;
},
disable: $.noop,
enable: $.noop,
close: function (event) {
var activeElement,
that = this;
if (!this._isOpen || this._trigger("beforeClose", event) === false) {
return;
}
this._isOpen = false;
this._destroyOverlay();
if (!this.opener.filter(":focusable").focus().length) {
// support: IE9
// IE9 throws an "Unspecified error" accessing document.activeElement from an <iframe>
try {
activeElement = this.document[0].activeElement;
// Support: IE9, IE10
// If the <body> is blurred, IE will switch windows, see #4520
if (activeElement && activeElement.nodeName.toLowerCase() !== "body") {
// Hiding a focused element doesn't trigger blur in WebKit
// so in case we have nothing to focus on, explicitly blur the active element
// https://bugs.webkit.org/show_bug.cgi?id=47182
$(activeElement).blur();
}
} catch (error) {
}
}
this._hide(this.uiDialog, this.options.hide, function () {
that._trigger("close", event);
});
},
isOpen: function () {
return this._isOpen;
},
moveToTop: function () {
this._moveToTop();
},
_moveToTop: function (event, silent) {
var moved = !!this.uiDialog.nextAll(":visible").insertBefore(this.uiDialog).length;
if (moved && !silent) {
this._trigger("focus", event);
}
return moved;
},
open: function () {
var that = this;
if (this._isOpen) {
if (this._moveToTop()) {
this._focusTabbable();
}
return;
}
this._isOpen = true;
this.opener = $(this.document[0].activeElement);
this._size();
this._position();
this._createOverlay();
this._moveToTop(null, true);
this._show(this.uiDialog, this.options.show, function () {
that._focusTabbable();
that._trigger("focus");
});
this._trigger("open");
},
_focusTabbable: function () {
// Set focus to the first match:
// 1. First element inside the dialog matching [autofocus]
// 2. Tabbable element inside the content element
// 3. Tabbable element inside the buttonpane
// 4. The close button
// 5. The dialog itself
var hasFocus = this.element.find("[autofocus]");
if (!hasFocus.length) {
hasFocus = this.element.find(":tabbable");
}
if (!hasFocus.length) {
hasFocus = this.uiDialogButtonPane.find(":tabbable");
}
if (!hasFocus.length) {
hasFocus = this.uiDialogTitlebarClose.filter(":tabbable");
}
if (!hasFocus.length) {
hasFocus = this.uiDialog;
}
hasFocus.eq(0).focus();
},
_keepFocus: function (event) {
function checkFocus() {
var activeElement = this.document[0].activeElement,
isActive = this.uiDialog[0] === activeElement ||
$.contains(this.uiDialog[0], activeElement);
if (!isActive) {
this._focusTabbable();
}
}
event.preventDefault();
checkFocus.call(this);
// support: IE
// IE <= 8 doesn't prevent moving focus even with event.preventDefault()
// so we check again later
this._delay(checkFocus);
},
_createWrapper: function () {
this.uiDialog = $("<div>")
.addClass("ui-dialog ui-widget ui-widget-content ui-corner-all ui-front " +
this.options.dialogClass)
.hide()
.attr({
// Setting tabIndex makes the div focusable
tabIndex: -1,
role: "dialog"
})
.appendTo(this._appendTo());
this._on(this.uiDialog, {
keydown: function (event) {
if (this.options.closeOnEscape && !event.isDefaultPrevented() && event.keyCode &&
event.keyCode === $.ui.keyCode.ESCAPE) {
event.preventDefault();
this.close(event);
return;
}
// prevent tabbing out of dialogs
if (event.keyCode !== $.ui.keyCode.TAB) {
return;
}
var tabbables = this.uiDialog.find(":tabbable"),
first = tabbables.filter(":first"),
last = tabbables.filter(":last");
if ((event.target === last[0] || event.target === this.uiDialog[0]) && !event.shiftKey) {
first.focus(1);
event.preventDefault();
} else if ((event.target === first[0] || event.target === this.uiDialog[0]) && event.shiftKey) {
last.focus(1);
event.preventDefault();
}
},
mousedown: function (event) {
if (this._moveToTop(event)) {
this._focusTabbable();
}
}
});
// We assume that any existing aria-describedby attribute means
// that the dialog content is marked up properly
// otherwise we brute force the content as the description
if (!this.element.find("[aria-describedby]").length) {
this.uiDialog.attr({
"aria-describedby": this.element.uniqueId().attr("id")
});
}
},
_createTitlebar: function () {
var uiDialogTitle;
this.uiDialogTitlebar = $("<div>")
.addClass("ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix")
.prependTo(this.uiDialog);
this._on(this.uiDialogTitlebar, {
mousedown: function (event) {
// Don't prevent click on close button (#8838)
// Focusing a dialog that is partially scrolled out of view
// causes the browser to scroll it into view, preventing the click event
if (!$(event.target).closest(".ui-dialog-titlebar-close")) {
// Dialog isn't getting focus when dragging (#8063)
this.uiDialog.focus();
}
}
});
// support: IE
// Use type="button" to prevent enter keypresses in textboxes from closing the
// dialog in IE (#9312)
this.uiDialogTitlebarClose = $("<button type='button'></button>")
.button({
label: this.options.closeText,
icons: {
primary: "ui-icon-closethick"
},
text: false
})
.addClass("ui-dialog-titlebar-close")
.appendTo(this.uiDialogTitlebar);
this._on(this.uiDialogTitlebarClose, {
click: function (event) {
event.preventDefault();
this.close(event);
}
});
uiDialogTitle = $("<span>")
.uniqueId()
.addClass("ui-dialog-title")
.prependTo(this.uiDialogTitlebar);
this._title(uiDialogTitle);
this.uiDialog.attr({
"aria-labelledby": uiDialogTitle.attr("id")
});
},
_title: function (title) {
if (!this.options.title) {
title.html(" ");
}
title.text(this.options.title);
},
_createButtonPane: function () {
this.uiDialogButtonPane = $("<div>")
.addClass("ui-dialog-buttonpane ui-widget-content ui-helper-clearfix");
this.uiButtonSet = $("<div>")
.addClass("ui-dialog-buttonset")
.appendTo(this.uiDialogButtonPane);
this._createButtons();
},
_createButtons: function () {
var that = this,
buttons = this.options.buttons;
// if we already have a button pane, remove it
this.uiDialogButtonPane.remove();
this.uiButtonSet.empty();
if ($.isEmptyObject(buttons) || ($.isArray(buttons) && !buttons.length)) {
this.uiDialog.removeClass("ui-dialog-buttons");
return;
}
$.each(buttons, function (name, props) {
var click, buttonOptions;
props = $.isFunction(props) ?
{click: props, text: name} :
props;
// Default to a non-submitting button
props = $.extend({type: "button"}, props);
// Change the context for the click callback to be the main element
click = props.click;
props.click = function () {
click.apply(that.element[0], arguments);
};
buttonOptions = {
icons: props.icons,
text: props.showText
};
delete props.icons;
delete props.showText;
$("<button></button>", props)
.button(buttonOptions)
.appendTo(that.uiButtonSet);
});
this.uiDialog.addClass("ui-dialog-buttons");
this.uiDialogButtonPane.appendTo(this.uiDialog);
},
_makeDraggable: function () {
var that = this,
options = this.options;
function filteredUi(ui) {
return {
position: ui.position,
offset: ui.offset
};
}
this.uiDialog.draggable({
cancel: ".ui-dialog-content, .ui-dialog-titlebar-close",
handle: ".ui-dialog-titlebar",
containment: "document",
start: function (event, ui) {
$(this).addClass("ui-dialog-dragging");
that._blockFrames();
that._trigger("dragStart", event, filteredUi(ui));
},
drag: function (event, ui) {
that._trigger("drag", event, filteredUi(ui));
},
stop: function (event, ui) {
options.position = [
ui.position.left - that.document.scrollLeft(),
ui.position.top - that.document.scrollTop()
];
$(this).removeClass("ui-dialog-dragging");
that._unblockFrames();
that._trigger("dragStop", event, filteredUi(ui));
}
});
},
_makeResizable: function () {
var that = this,
options = this.options,
handles = options.resizable,
// .ui-resizable has position: relative defined in the stylesheet
// but dialogs have to use absolute or fixed positioning
position = this.uiDialog.css("position"),
resizeHandles = typeof handles === "string" ?
handles :
"n,e,s,w,se,sw,ne,nw";
function filteredUi(ui) {
return {
originalPosition: ui.originalPosition,
originalSize: ui.originalSize,
position: ui.position,
size: ui.size
};
}
this.uiDialog.resizable({
cancel: ".ui-dialog-content",
containment: "document",
alsoResize: this.element,
maxWidth: options.maxWidth,
maxHeight: options.maxHeight,
minWidth: options.minWidth,
minHeight: this._minHeight(),
handles: resizeHandles,
start: function (event, ui) {
$(this).addClass("ui-dialog-resizing");
that._blockFrames();
that._trigger("resizeStart", event, filteredUi(ui));
},
resize: function (event, ui) {
that._trigger("resize", event, filteredUi(ui));
},
stop: function (event, ui) {
options.height = $(this).height();
options.width = $(this).width();
$(this).removeClass("ui-dialog-resizing");
that._unblockFrames();
that._trigger("resizeStop", event, filteredUi(ui));
}
})
.css("position", position);
},
_minHeight: function () {
var options = this.options;
return options.height === "auto" ?
options.minHeight :
Math.min(options.minHeight, options.height);
},
_position: function () {
// Need to show the dialog to get the actual offset in the position plugin
var isVisible = this.uiDialog.is(":visible");
if (!isVisible) {
this.uiDialog.show();
}
this.uiDialog.position(this.options.position);
if (!isVisible) {
this.uiDialog.hide();
}
},
_setOptions: function (options) {
var that = this,
resize = false,
resizableOptions = {};
$.each(options, function (key, value) {
that._setOption(key, value);
if (key in sizeRelatedOptions) {
resize = true;
}
if (key in resizableRelatedOptions) {
resizableOptions[key] = value;
}
});
if (resize) {
this._size();
this._position();
}
if (this.uiDialog.is(":data(ui-resizable)")) {
this.uiDialog.resizable("option", resizableOptions);
}
},
_setOption: function (key, value) {
var isDraggable, isResizable,
uiDialog = this.uiDialog;
if (key === "dialogClass") {
uiDialog
.removeClass(this.options.dialogClass)
.addClass(value);
}
if (key === "disabled") {
return;
}
this._super(key, value);
if (key === "appendTo") {
this.uiDialog.appendTo(this._appendTo());
}
if (key === "buttons") {
this._createButtons();
}
if (key === "closeText") {
this.uiDialogTitlebarClose.button({
// Ensure that we always pass a string
label: "" + value
});
}
if (key === "draggable") {
isDraggable = uiDialog.is(":data(ui-draggable)");
if (isDraggable && !value) {
uiDialog.draggable("destroy");
}
if (!isDraggable && value) {
this._makeDraggable();
}
}
if (key === "position") {
this._position();
}
if (key === "resizable") {
// currently resizable, becoming non-resizable
isResizable = uiDialog.is(":data(ui-resizable)");
if (isResizable && !value) {
uiDialog.resizable("destroy");
}
// currently resizable, changing handles
if (isResizable && typeof value === "string") {
uiDialog.resizable("option", "handles", value);
}
// currently non-resizable, becoming resizable
if (!isResizable && value !== false) {
this._makeResizable();
}
}
if (key === "title") {
this._title(this.uiDialogTitlebar.find(".ui-dialog-title"));
}
},
_size: function () {
// If the user has resized the dialog, the .ui-dialog and .ui-dialog-content
// divs will both have width and height set, so we need to reset them
var nonContentHeight, minContentHeight, maxContentHeight,
options = this.options;
// Reset content sizing
this.element.show().css({
width: "auto",
minHeight: 0,
maxHeight: "none",
height: 0
});
if (options.minWidth > options.width) {
options.width = options.minWidth;
}
// reset wrapper sizing
// determine the height of all the non-content elements
nonContentHeight = this.uiDialog.css({
height: "auto",
width: options.width
})
.outerHeight();
minContentHeight = Math.max(0, options.minHeight - nonContentHeight);
maxContentHeight = typeof options.maxHeight === "number" ?
Math.max(0, options.maxHeight - nonContentHeight) :
"none";
if (options.height === "auto") {
this.element.css({
minHeight: minContentHeight,
maxHeight: maxContentHeight,
height: "auto"
});
} else {
this.element.height(Math.max(0, options.height - nonContentHeight));
}
if (this.uiDialog.is(":data(ui-resizable)")) {
this.uiDialog.resizable("option", "minHeight", this._minHeight());
}
},
_blockFrames: function () {
this.iframeBlocks = this.document.find("iframe").map(function () {
var iframe = $(this);
return $("<div>")
.css({
position: "absolute",
width: iframe.outerWidth(),
height: iframe.outerHeight()
})
.appendTo(iframe.parent())
.offset(iframe.offset())[0];
});
},
_unblockFrames: function () {
if (this.iframeBlocks) {
this.iframeBlocks.remove();
delete this.iframeBlocks;
}
},
_allowInteraction: function (event) {
if ($(event.target).closest(".ui-dialog").length) {
return true;
}
// TODO: Remove hack when datepicker implements
// the .ui-front logic (#8989)
return !!$(event.target).closest(".ui-datepicker").length;
},
_createOverlay: function () {
if (!this.options.modal) {
return;
}
var that = this,
widgetFullName = this.widgetFullName;
if (!$.ui.dialog.overlayInstances) {
// Prevent use of anchors and inputs.
// We use a delay in case the overlay is created from an
// event that we're going to be cancelling. (#2804)
this._delay(function () {
// Handle .dialog().dialog("close") (#4065)
if ($.ui.dialog.overlayInstances) {
this.document.bind("focusin.dialog", function (event) {
if (!that._allowInteraction(event)) {
event.preventDefault();
$(".ui-dialog:visible:last .ui-dialog-content")
.data(widgetFullName)._focusTabbable();
}
});
}
});
}
this.overlay = $("<div>")
.addClass("ui-widget-overlay ui-front")
.appendTo(this._appendTo());
this._on(this.overlay, {
mousedown: "_keepFocus"
});
$.ui.dialog.overlayInstances++;
},
_destroyOverlay: function () {
if (!this.options.modal) {
return;
}
if (this.overlay) {
$.ui.dialog.overlayInstances--;
if (!$.ui.dialog.overlayInstances) {
this.document.unbind("focusin.dialog");
}
this.overlay.remove();
this.overlay = null;
}
}
});
$.ui.dialog.overlayInstances = 0;
// DEPRECATED
if ($.uiBackCompat !== false) {
// position option with array notation
// just override with old implementation
$.widget("ui.dialog", $.ui.dialog, {
_position: function () {
var position = this.options.position,
myAt = [],
offset = [0, 0],
isVisible;
if (position) {
if (typeof position === "string" || (typeof position === "object" && "0" in position)) {
myAt = position.split ? position.split(" ") : [position[0], position[1]];
if (myAt.length === 1) {
myAt[1] = myAt[0];
}
$.each(["left", "top"], function (i, offsetPosition) {
if (+myAt[i] === myAt[i]) {
offset[i] = myAt[i];
myAt[i] = offsetPosition;
}
});
position = {
my: myAt[0] + (offset[0] < 0 ? offset[0] : "+" + offset[0]) + " " +
myAt[1] + (offset[1] < 0 ? offset[1] : "+" + offset[1]),
at: myAt.join(" ")
};
}
position = $.extend({}, $.ui.dialog.prototype.options.position, position);
} else {
position = $.ui.dialog.prototype.options.position;
}
// need to show the dialog to get the actual offset in the position plugin
isVisible = this.uiDialog.is(":visible");
if (!isVisible) {
this.uiDialog.show();
}
this.uiDialog.position(position);
if (!isVisible) {
this.uiDialog.hide();
}
}
});
}
});