Merge lp:~openerp-dev/openerp-web/trunk-bug-908216-vda into lp:openerp-web

[Vaibhav Darji]

[Fabien Meghazi (OpenERP) (fme)]

Not sure we will merge this. We prefer to keep vanilla jQueryUI#dialog

Unmerged revisions

1838. By Vaibhav Darji on 2011-12-27

[ADD] forgot to add files.

1837. By Vaibhav Darji on 2011-12-27

[IMP] Maximize and restore dialog.

=== modified file 'addons/web/__openerp__.py'
--- addons/web/__openerp__.py	2011-12-19 16:32:22 +0000
+++ addons/web/__openerp__.py	2011-12-27 08:18:24 +0000
@@ -26,6 +26,7 @@
         "static/lib/jquery.superfish/js/superfish.js",
         "static/lib/jquery.ui/js/jquery-ui-1.8.9.custom.min.js",
         "static/lib/jquery.ui/js/jquery-ui-timepicker-addon.js",
+        "static/lib/jquery.ui/js/jquery.dialog.js",
         "static/lib/jquery.ui.notify/js/jquery.notify.js",
         "static/lib/jquery.deferred-queue/jquery.deferred-queue.js",
         "static/lib/jquery.scrollTo/jquery.scrollTo-min.js",
@@ -56,6 +57,7 @@
     'css' : [
         "static/lib/jquery.superfish/css/superfish.css",
         "static/lib/jquery.ui/css/smoothness/jquery-ui-1.8.9.custom.css",
+        "static/lib/jquery.ui/css/smoothness/jquery.dialog.css",
         "static/lib/jquery.ui.notify/css/ui.notify.css",
         "static/lib/jquery.tipTip/tipTip.css",
         "static/src/css/base.css",

=== added file 'addons/web/static/lib/jquery.ui/css/smoothness/jquery.dialog.css'
--- addons/web/static/lib/jquery.ui/css/smoothness/jquery.dialog.css	1970-01-01 00:00:00 +0000
+++ addons/web/static/lib/jquery.ui/css/smoothness/jquery.dialog.css	2011-12-27 08:18:24 +0000
@@ -0,0 +1,9 @@
+.ui-dialog .ui-dialog-titlebar-maximize { position: absolute; right: 1.5em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
+.ui-dialog .ui-dialog-titlebar-maximize span { display: block; margin: 1px; }
+
+.ui-icon-maximizethick { background-position: -32px -82px; }
+
+.ui-dialog .ui-dialog-titlebar-restore { position: absolute; right: 1.5em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
+.ui-dialog .ui-dialog-titlebar-restore span { display: block; margin: 1px; }
+
+.ui-icon-restorethick { background-position: -49px -82px; }
\ No newline at end of file

=== added file 'addons/web/static/lib/jquery.ui/js/jquery.dialog.js'
--- addons/web/static/lib/jquery.ui/js/jquery.dialog.js	1970-01-01 00:00:00 +0000
+++ addons/web/static/lib/jquery.ui/js/jquery.dialog.js	2011-12-27 08:18:24 +0000
@@ -0,0 +1,173 @@
+(function($) {
+    var _init = $.ui.dialog.prototype._init;
+    $.ui.dialog.prototype._init = function() {
+        var self = this;
+        _init.apply(this, arguments);
+        uiDialogTitlebar = this.uiDialogTitlebar;
+//        this.originalSize();
+        $(uiDialogTitlebar).append(
+            $('<a>',
+                {'href': '#',
+                'class': 'ui-dialog-titlebar-maximize ui-corner-all',
+                'role':'button'
+            })
+            .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")
+            })
+            .click(function() {
+                self.maximize();
+                return false;
+            })
+            .append(
+                $('<span>',
+                    {'class': 'ui-icon ui-icon-maximizethick'
+                }).html('Max')
+        ));
+        
+        /* Adding restore button */
+            uiDialogTitlebar.append(
+                $('<a>', 
+                    {'href': '#',
+                    'class': 'ui-dialog-titlebar-restore ui-corner-all',
+                    'role':'button'
+                    }
+                )
+                .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")
+                }).hide()
+                .click(function() {
+                    self.restore();
+                    return false;
+                })
+                .append(
+                    $('<span>',
+                    {
+                    'class': 'ui-icon ui-icon-restorethick'
+                    }).html('Restore'))
+                );
+    }
+    
+    $.extend($.ui.dialog.prototype, {
+        /* Allow restore the dialog */
+        restore: function() {
+            this.maximized=false; /* reset both states (restored) */
+            $('.ui-dialog-content').show();
+            this.uiDialog.css({width: this.options.width, height:this.options.height});
+            this.size();
+            $('.ui-dialog-titlebar-restore').css('right','1.5em');
+            this.adjustScrollContent();
+            this.position(this.options.position);
+            
+            $('.ui-dialog-titlebar-maximize').show();
+            $('.ui-dialog-titlebar-restore').hide();
+            this.uiDialog.css('position','absolute');
+        },
+        
+        /* Maximize to the whole visible size of the window */
+        maximize: function() {
+            this.maximized=true; /* save the current state: maximized */
+            $('.ui-dialog-content').show();
+            $('.ui-dialog-titlebar-restore').css('right','1.5em');
+            this.uiDialog.animate(
+                {left:0, top:0, width: $('body').width()-15, height:$('body').height()-15
+                },'slow', function() {
+                $('.ui-dialog-content').css('width',$(this).width()-15)
+            });
+            this.size();
+            this.adjustScrollContent();
+            $('.ui-dialog-titlebar-restore').show();
+            $('.ui-dialog-titlebar-maximize').hide();
+            this.uiDialog.css('position','absolute'); 
+            this.uiDialog.data({"resizable": true, "draggable": true});
+        },
+        
+        size: function() {
+            var container = this.uiDialogTitlebar.parent(),
+                titlebar = this.uiDialogTitlebar,
+                content = this.element,
+                tbMargin = parseInt(content.css('margin-top'),10) + parseInt(content.css('margin-bottom'),10),
+                lrMargin = parseInt(content.css('margin-left'),10) + parseInt(content.css('margin-right'),10);
+
+            content.height(container.height() - titlebar.outerHeight() - tbMargin /* More precision on scroll content */ - 8);
+            content.width(container.width() - lrMargin);
+        },
+        
+        /* Adjuste the content inside the dialog on maximize/restore */
+        adjustScrollContent: function () {
+            $('.ui-dialog-content').css('width', this.uiDialog.width()-16, 'height', this.uiDialog.height()-16);
+        },
+        
+        /* Store the size of dialog, before it gets minimized or maximized */
+        originalSize: function() {
+            this.options.height = this.uiDialog.height();
+            this.options.width = this.uiDialog.width();
+        },
+        
+        /* Saves all css related to the dialog position before maximize or minimize */
+        position: function(pos) {
+            var wnd = $(window), doc = $(document),
+                pTop = doc.scrollTop(), pLeft = doc.scrollLeft(),
+                minTop = pTop;
+            
+            if ($.inArray(pos, ['center','top','right','bottom','left']) >= 0) {
+                pos = [
+                        pos == 'right' || pos == 'left' ? pos : 'center',
+                        pos == 'top' || pos == 'bottom' ? pos : 'middle'
+                ];
+            }
+            if (pos.constructor != Array) {
+                pos = ['center', 'middle'];
+            }
+            if (pos[0].constructor == Number) {
+                pLeft += pos[0];
+            } else {
+                switch (pos[0]) {
+                    case 'left':
+                        pLeft += 0;
+                        break;
+                    case 'right':
+                        pLeft += wnd.width() - this.uiDialog.width();
+                        break;
+                    default:
+                        case 'center':
+                        pLeft += (wnd.width() - this.uiDialog.width()) / 2;
+                }
+            }
+            if (pos[1].constructor == Number) {
+                pTop += pos[1];
+            } else {
+                switch (pos[1]) {
+                    case 'top':
+                        pTop += 0;
+                        break;
+                    case 'bottom':
+                        pTop += wnd.height() - this.uiDialog.height();
+                        break;
+                    default:
+                    case 'middle':
+                        pTop += (wnd.height() - this.uiDialog.height()) / 2;
+                }
+            }
+    
+            // prevent the dialog from being too high (make sure the titlebar is accessible)
+            pTop = Math.max(pTop, minTop);
+            this.uiDialog.css({top: pTop, left: pLeft});
+        },
+    });
+})(jQuery); 
\ No newline at end of file