lib-jquery-style-custom-development-bundle-ui-ui.dialog.js / js
/* * jQuery UI Dialog 1.7.1 * * Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT (MIT-LICENSE.txt) * and GPL (GPL-LICENSE.txt) licenses. * * http://docs.jquery.com/UI/Dialog * * Depends: * ui.core.js * ui.draggable.js * ui.resizable.js */ (function(.widget("ui.dialog", { _init: function() { this.originalTitle = this.element.attr('title'); var self = this, options = this.options, title = options.title || this.originalTitle || ' ', titleId = <div/>')) .appendTo(document.body) .hide() .addClass(uiDialogClasses + options.dialogClass) .css({ position: 'absolute', overflow: 'hidden', zIndex: options.zIndex }) // setting tabIndex makes the div focusable // setting outline to 0 prevents a border on focus in Mozilla .attr('tabIndex', -1).css('outline', 0).keydown(function(event) { (options.closeOnEscape && event.keyCode && event.keyCode == .ui.keyCode.ESCAPE && self.close(event)); }) .attr({ role: 'dialog', 'aria-labelledby': titleId }) .mousedown(function(event) { self.moveToTop(false, event); }), uiDialogContent = this.element .show() .removeAttr('title') .addClass( 'ui-dialog-content ' + 'ui-widget-content') .appendTo(uiDialog), uiDialogTitlebar = (this.uiDialogTitlebar = $('<div></div>')) .addClass( 'ui-dialog-titlebar ' + 'ui-widget-header ' + 'ui-corner-all ' + 'ui-helper-clearfix' ) .prependTo(uiDialog), uiDialogTitlebarClose = $('<a href="#"/>') .addClass( 'ui-dialog-titlebar-close ' + 'ui-corner-all' ) .attr('role', 'button') .hover( function() { uiDialogTitlebarClose.addClass('ui-state-hover'); }, function() { uiDialogTitlebarClose.removeClass('ui-state-hover'); } ) .focus(function() { uiDialogTitlebarClose.addClass('ui-state-focus'); }) .blur(function() { uiDialogTitlebarClose.removeClass('ui-state-focus'); }) .mousedown(function(ev) { ev.stopPropagation(); }) .click(function(event) { self.close(event); return false; }) .appendTo(uiDialogTitlebar), uiDialogTitlebarCloseText = (this.uiDialogTitlebarCloseText = $('<span/>')) .addClass( 'ui-icon ' + 'ui-icon-closethick' ) .text(options.closeText) .appendTo(uiDialogTitlebarClose), uiDialogTitle = $('<span/>') .addClass('ui-dialog-title') .attr('id', titleId) .html(title) .prependTo(uiDialogTitlebar); uiDialogTitlebar.find("*").add(uiDialogTitlebar).disableSelection(); (options.draggable && .fn.resizable && this._makeResizable()); this._createButtons(options.buttons); this._isOpen = false; (options.bgiframe && .ui.dialog.overlay.resize(); self._isOpen = false; }, isOpen: function() { return this._isOpen; }, // the force parameter allows us to move modal dialogs to their correct // position on open moveToTop: function(force, event) { if ((this.options.modal && !force) || (!this.options.stack && !this.options.modal)) { return this._trigger('focus', event); } if (this.options.zIndex > .ui.dialog.maxZ = this.options.zIndex; } (this.overlay && this.overlay..ui.dialog.overlay.maxZ = ++}; this.uiDialog.css('z-index', ++.ui.dialog.maxZ); this.element.attr(saveScroll); this._trigger('focus', event); }, open: function() { if (this._isOpen) { return; } var options = this.options, uiDialog = this.uiDialog; this.overlay = options.modal ? new .ui.keyCode.TAB) { return; } var tabbables = $(':tabbable', this), first = tabbables.filter(':first')[0], last = tabbables.filter(':last')[0]; if (event.target == last && !event.shiftKey) { setTimeout(function() { first.focus(); }, 1); } else if (event.target == first && event.shiftKey) { setTimeout(function() { last.focus(); }, 1); } })); // set focus to the first tabbable element in the content area or the first button // if there are no tabbable elements, set focus on the dialog itself $([]) .add(uiDialog.find('.ui-dialog-content :tabbable:first')) .add(uiDialog.find('.ui-dialog-buttonpane :tabbable:first')) .add(uiDialog) .filter(':first') .focus(); this._trigger('open'); this._isOpen = true; }, _createButtons: function(buttons) { var self = this, hasButtons = false, uiDialogButtonPane = $('<div></div>') .addClass( 'ui-dialog-buttonpane ' + 'ui-widget-content ' + 'ui-helper-clearfix' ); // if we already have a button pane, remove it this.uiDialog.find('.ui-dialog-buttonpane').remove(); (typeof buttons == 'object' && buttons !== null && .each(buttons, function(name, fn) { $('<button type="button"></button>') .addClass( 'ui-state-default ' + 'ui-corner-all' ) .text(name) .click(function() { fn.apply(self.element[0], arguments); }) .hover( function() { this.addClass('ui-state-hover'); }, function() { this.removeClass('ui-state-hover'); } ) .focus(function() { this.addClass('ui-state-focus'); }) .blur(function() { this.removeClass('ui-state-focus'); }) .appendTo(uiDialogButtonPane); }); uiDialogButtonPane.appendTo(this.uiDialog); } }, _makeDraggable: function() { var self = this, options = this.options, heightBeforeDrag; this.uiDialog.draggable({ cancel: '.ui-dialog-content', handle: '.ui-dialog-titlebar', containment: 'document', start: function() { heightBeforeDrag = options.height; this.height(this.height()).addClass("ui-dialog-dragging"); (options.dragStart && options.dragStart.apply(self.element[0], arguments)); }, drag: function() { (options.drag && options.drag.apply(self.element[0], arguments)); }, stop: function() { this.removeClass("ui-dialog-dragging").height(heightBeforeDrag); (options.dragStop && options.dragStop.apply(self.element[0], arguments)); .ui.dialog.overlay.resize(); } }) .find('.ui-resizable-se').addClass('ui-icon ui-icon-grip-diagonal-se'); }, _position: function(pos) { var wnd = window, doc = document, pTop = doc.scrollTop(), pLeft = doc.scrollLeft(), minTop = pTop; if (.widget.prototype._setData.apply(this, arguments); }, _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 options = this.options; // reset content sizing this.element.css({ height: 0, minHeight: 0, width: 'auto' }); // reset wrapper sizing // determine the height of all the non-content elements var nonContentHeight = this.uiDialog.css({ height: 'auto', width: options.width }) .height(); this.element .css({ minHeight: Math.max(options.minHeight - nonContentHeight, 0), height: options.height == 'auto' ? 'auto' : Math.max(options.height - nonContentHeight, 0) }); } }); .ui.dialog, { version: "1.7.1", defaults: { autoOpen: true, bgiframe: false, buttons: {}, closeOnEscape: true, closeText: 'close', dialogClass: '', draggable: true, hide: null, height: 'auto', maxHeight: false, maxWidth: false, minHeight: 150, minWidth: 150, modal: false, position: 'center', resizable: true, show: null, stack: true, title: '', width: 300, zIndex: 1000 }, getter: 'isOpen', uuid: 0, maxZ: 0, getTitleId: function(el.attr('id') || ++this.uuid); }, overlay: function(dialog) { this..ui.dialog.overlay.create(dialog); } }); .ui.dialog.overlay, { instances: [], maxZ: 0, events: .ui.dialog.overlay.events, function(event) { var dialogZ = $(event.target).parents('.ui-dialog').css('zIndex') || 0; return (dialogZ > .ui.keyCode.ESCAPE && dialog.close(event)); }); // handle window resize window.bind('resize.dialog-overlay', el = $('<div></div>').appendTo(document.body) .addClass('ui-widget-overlay').css({ width: this.width(), height: this.height() }); (dialog.options.bgiframe && el.bgiframe()); this.instances.push(el; }, destroy: function(.inArray(this.instances, el.remove(); }, height: function() { // handle IE 6 if (.browser.version < 7) { var scrollHeight = Math.max( document.documentElement.scrollHeight, document.body.scrollHeight ); var offsetHeight = Math.max( document.documentElement.offsetHeight, document.body.offsetHeight ); if (scrollHeight < offsetHeight) { return window.height() + 'px'; } else { return scrollHeight + 'px'; } // handle "good" browsers } else { return document.height() + 'px'; } }, width: function() { // handle IE 6 if (.browser.version < 7) { var scrollWidth = Math.max( document.documentElement.scrollWidth, document.body.scrollWidth ); var offsetWidth = Math.max( document.documentElement.offsetWidth, document.body.offsetWidth ); if (scrollWidth < offsetWidth) { return window.width() + 'px'; } else { return scrollWidth + 'px'; } // handle "good" browsers } else { return document.width() + 'px'; } }, resize: function() { /* If the dialog is draggable and the user drags it past the * right edge of the window, the document becomes wider so we * need to stretch the overlay. If the user then drags the * dialog back to the left, the document will become narrower, * so we need to shrink the overlay to the appropriate size. * This is handled by shrinking the overlay before setting it * to the full document size. */ var .each(overlays = overlays.css({ width: 0, height: 0 }).css({ width: .ui.dialog.overlay.height() }); } }); .ui.dialog.overlay.prototype, { destroy: function() { el); } }); })(jQuery);
(C) Æliens 20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.