r1814 - in trunk: demos/dialog ui

r1814 - in trunk: demos/dialog ui


Author: paul.bakaus
Date: Tue Jan 27 08:53:46 2009
New Revision: 1814
Modified:
trunk/demos/dialog/modal-form.html
trunk/demos/dialog/modal-message.html
trunk/demos/dialog/modal.html
trunk/ui/ui.dialog.js
Log:
dialog:
- implemented themeroller overlay, removes option overlay (now handled
through CSS) (implements #3681)
- implemented shadow option (boolean), if set to true, adds shadow from css
framework (implements #3681)
Modified: trunk/demos/dialog/modal-form.html
==============================================================================
--- trunk/demos/dialog/modal-form.html    (original)
+++ trunk/demos/dialog/modal-form.html    Tue Jan 27 08:53:46 2009
@@ -21,10 +21,6 @@
            bgiframe: true,
            height: 300,
            modal: true,
-            overlay: {
-                backgroundColor: '#000',
-                opacity: 0.5
-            },
            buttons: {
                'Create user account': function() {
                    $(this).dialog('close');
Modified: trunk/demos/dialog/modal-message.html
==============================================================================
--- trunk/demos/dialog/modal-message.html    (original)
+++ trunk/demos/dialog/modal-message.html    Tue Jan 27 08:53:46 2009
@@ -15,10 +15,6 @@
        $("#dialog").dialog({
            bgiframe: true,
            modal: true,
-            overlay: {
-                backgroundColor: '#000',
-                opacity: 0.5
-            },
            buttons: {
                Ok: function() {
                    $(this).dialog('close');
Modified: trunk/demos/dialog/modal.html
==============================================================================
--- trunk/demos/dialog/modal.html    (original)
+++ trunk/demos/dialog/modal.html    Tue Jan 27 08:53:46 2009
@@ -15,11 +15,7 @@
        $("#dialog").dialog({
            bgiframe: true,
            height: 140,
-            modal: true,
-            overlay: {
-                backgroundColor: '#000',
-                opacity: 0.5
-            }
+            modal: true
        });
    });
    </script>
Modified: trunk/ui/ui.dialog.js
==============================================================================
--- trunk/ui/ui.dialog.js    (original)
+++ trunk/ui/ui.dialog.js    Tue Jan 27 08:53:46 2009
@@ -137,10 +137,12 @@
        (options.bgiframe && $.fn.bgiframe && uiDialog.bgiframe());
        (options.autoOpen && this.open());
+        
    },
    destroy: function() {
        (this.overlay && this.overlay.destroy());
+        (this.shadow && this._destroyShadow());
        this.uiDialog.hide();
        this.element
            .unbind('.dialog')
@@ -158,6 +160,7 @@
        }
        (this.overlay && this.overlay.destroy());
+        (this.shadow && this._destroyShadow());
        this.uiDialog
            .hide(this.options.hide)
            .unbind('keypress.ui-dialog');
@@ -186,6 +189,7 @@
            maxZ = Math.max(maxZ, parseInt($(this).css('z-index'), 10) ||
options.zIndex);
        });
        (this.overlay && this.overlay.$el.css('z-index', ++maxZ));
+        (this.shadow && this.shadow.css('z-index', ++maxZ));
        //Save and then restore scroll since Opera 9.5+ resets when parent
z-Index is changed.
        // http://ui.jquery.com/bugs/ticket/3193
@@ -240,6 +244,9 @@
            .filter(':first')
            .focus();
+        if(options.shadow)
+            this._createShadow();
+
        this._trigger('open');
        this._isOpen = true;
    },
@@ -302,10 +309,12 @@
            },
            drag: function() {
                (options.drag && options.drag.apply(self.element[0], arguments));
+                self._refreshShadow();
            },
            stop: function() {
                (options.dragStop && options.dragStop.apply(self.element[0],
arguments));
                $.ui.dialog.overlay.resize();
+                self._refreshShadow();
            }
        });
    },
@@ -331,11 +340,13 @@
            },
            resize: function() {
                (options.resize && options.resize.apply(self.element[0], arguments));
+                self._refreshShadow();
            },
            handles: resizeHandles,
            stop: function() {
                (options.resizeStop && options.resizeStop.apply(self.element[0],
arguments));
                $.ui.dialog.overlay.resize();
+                self._refreshShadow();
            }
        })
        .find('.ui-resizable-se').addClass('ui-icon ui-icon-grip-diagonal-se');
@@ -466,7 +477,29 @@
                    ? 'auto'
                    : options.height - nonContentHeight
            });
+    },
+    
+    _createShadow: function() {
+        this.shadow = $('<div
class="ui-widget-shadow"></div>').css('position', 'absolute').appendTo(document.body);
+        this._refreshShadow();
+        return this.shadow;
+    },
+    
+    _refreshShadow: function() {
+        var offset = this.uiDialog.offset();
+        this.shadow.css({
+            left: offset.left,
+            top: offset.top,
+            width: this.uiDialog.outerWidth(),
+            height: this.uiDialog.outerHeight()
+        });
+    },
+    
+    _destroyShadow: function() {
+        this.shadow.remove();
+        this.shadow = null;
    }
+    
});
$.extend($.ui.dialog, {
@@ -482,9 +515,9 @@
        minHeight: 150,
        minWidth: 150,
        modal: false,
-        overlay: {},
        position: 'center',
        resizable: true,
+        shadow: true,
        stack: true,
        title: '',
        width: 300,
@@ -547,12 +580,10 @@
        }
        var $el = $('<div></div>').appendTo(document.body)
-            .addClass('ui-dialog-overlay').css($.extend({
-                borderWidth: 0, margin: 0, padding: 0,
-                position: 'absolute', top: 0, left: 0,
+            .addClass('ui-widget-overlay').css({
                width: this.width(),
                height: this.height()
-            }, dialog.options.overlay));
+            });
        (dialog.options.bgiframe && $.fn.bgiframe && $el.bgiframe());