Upgrade to ExtJS 3.2.0 - Released 03/30/2010
[extjs.git] / examples / desktop / js / Desktop.js
index 43a855e..49aae92 100644 (file)
 /*!
- * Ext JS Library 3.1.1
- * Copyright(c) 2006-2010 Ext JS, LLC
+ * Ext JS Library 3.2.0
+ * Copyright(c) 2006-2010 Ext JS, Inc.
  * licensing@extjs.com
  * http://www.extjs.com/license
  */
-Ext.Desktop = function(app){\r
-       this.taskbar = new Ext.ux.TaskBar(app);\r
-       var taskbar = this.taskbar;\r
-       \r
-       var desktopEl = Ext.get('x-desktop');\r
-    var taskbarEl = Ext.get('ux-taskbar');\r
-    var shortcuts = Ext.get('x-shortcuts');\r
-\r
-    var windows = new Ext.WindowGroup();\r
-    var activeWindow;\r
-               \r
-    function minimizeWin(win){\r
-        win.minimized = true;\r
-        win.hide();\r
-    }\r
-\r
-    function markActive(win){\r
-        if(activeWindow && activeWindow != win){\r
-            markInactive(activeWindow);\r
-        }\r
-        taskbar.setActiveButton(win.taskButton);\r
-        activeWindow = win;\r
-        Ext.fly(win.taskButton.el).addClass('active-win');\r
-        win.minimized = false;\r
-    }\r
-\r
-    function markInactive(win){\r
-        if(win == activeWindow){\r
-            activeWindow = null;\r
-            Ext.fly(win.taskButton.el).removeClass('active-win');\r
-        }\r
-    }\r
-\r
-    function removeWin(win){\r
-       taskbar.removeTaskButton(win.taskButton);\r
-        layout();\r
-    }\r
-\r
-    function layout(){\r
-        desktopEl.setHeight(Ext.lib.Dom.getViewHeight()-taskbarEl.getHeight());\r
-    }\r
-    Ext.EventManager.onWindowResize(layout);\r
-\r
-    this.layout = layout;\r
-\r
-    this.createWindow = function(config, cls){\r
-       var win = new (cls||Ext.Window)(\r
-            Ext.applyIf(config||{}, {\r
-                manager: windows,\r
-                minimizable: true,\r
-                maximizable: true\r
-            })\r
-        );\r
-        win.render(desktopEl);\r
-        win.taskButton = taskbar.addTaskButton(win);\r
-\r
-        win.cmenu = new Ext.menu.Menu({\r
-            items: [\r
-\r
-            ]\r
-        });\r
-\r
-        win.animateTarget = win.taskButton.el;\r
-        \r
-        win.on({\r
-               'activate': {\r
-                       fn: markActive\r
-               },\r
-               'beforeshow': {\r
-                       fn: markActive\r
-               },\r
-               'deactivate': {\r
-                       fn: markInactive\r
-               },\r
-               'minimize': {\r
-                       fn: minimizeWin\r
-               },\r
-               'close': {\r
-                       fn: removeWin\r
-               }\r
-        });\r
-        \r
-        layout();\r
-        return win;\r
-    };\r
-\r
-    this.getManager = function(){\r
-        return windows;\r
-    };\r
-\r
-    this.getWindow = function(id){\r
-        return windows.get(id);\r
-    }\r
-    \r
-    this.getWinWidth = function(){\r
-               var width = Ext.lib.Dom.getViewWidth();\r
-               return width < 200 ? 200 : width;\r
-       }\r
-               \r
-       this.getWinHeight = function(){\r
-               var height = (Ext.lib.Dom.getViewHeight()-taskbarEl.getHeight());\r
-               return height < 100 ? 100 : height;\r
-       }\r
-               \r
-       this.getWinX = function(width){\r
-               return (Ext.lib.Dom.getViewWidth() - width) / 2\r
-       }\r
-               \r
-       this.getWinY = function(height){\r
-               return (Ext.lib.Dom.getViewHeight()-taskbarEl.getHeight() - height) / 2;\r
-       }\r
-\r
-    layout();\r
-\r
-    if(shortcuts){\r
-        shortcuts.on('click', function(e, t){\r
-            if(t = e.getTarget('dt', shortcuts)){\r
-                e.stopEvent();\r
-                var module = app.getModule(t.id.replace('-shortcut', ''));\r
-                if(module){\r
-                    module.createWindow();\r
-                }\r
-            }\r
-        });\r
-    }\r
-};\r
+Ext.Desktop = function(app){
+    this.taskbar = new Ext.ux.TaskBar(app);
+    this.xTickSize = this.yTickSize = 1;
+    var taskbar = this.taskbar;
+
+    var desktopEl = Ext.get('x-desktop');
+    var taskbarEl = Ext.get('ux-taskbar');
+    var shortcuts = Ext.get('x-shortcuts');
+
+    var windows = new Ext.WindowGroup();
+    var activeWindow;
+
+    function minimizeWin(win){
+        win.minimized = true;
+        win.hide();
+    }
+
+    function markActive(win){
+        if(activeWindow && activeWindow != win){
+            markInactive(activeWindow);
+        }
+        taskbar.setActiveButton(win.taskButton);
+        activeWindow = win;
+        Ext.fly(win.taskButton.el).addClass('active-win');
+        win.minimized = false;
+    }
+
+    function markInactive(win){
+        if(win == activeWindow){
+            activeWindow = null;
+            Ext.fly(win.taskButton.el).removeClass('active-win');
+        }
+    }
+
+    function removeWin(win){
+        taskbar.removeTaskButton(win.taskButton);
+        layout();
+    }
+
+    function layout(){
+        desktopEl.setHeight(Ext.lib.Dom.getViewHeight()-taskbarEl.getHeight());
+    }
+    Ext.EventManager.onWindowResize(layout);
+
+    this.layout = layout;
+
+    this.createWindow = function(config, cls){
+        var win = new (cls||Ext.Window)(
+            Ext.applyIf(config||{}, {
+                renderTo: desktopEl,
+                manager: windows,
+                minimizable: true,
+                maximizable: true
+            })
+        );
+        win.dd.xTickSize = this.xTickSize;
+        win.dd.yTickSize = this.yTickSize;
+        win.resizer.widthIncrement = this.xTickSize;
+        win.resizer.heightIncrement = this.yTickSize;
+        win.render(desktopEl);
+        win.taskButton = taskbar.addTaskButton(win);
+
+        win.cmenu = new Ext.menu.Menu({
+            items: [
+
+            ]
+        });
+
+        win.animateTarget = win.taskButton.el;
+
+        win.on({
+            'activate': {
+                fn: markActive
+            },
+            'beforeshow': {
+                fn: markActive
+            },
+            'deactivate': {
+                fn: markInactive
+            },
+            'minimize': {
+                fn: minimizeWin
+            },
+            'close': {
+                fn: removeWin
+            }
+        });
+
+        layout();
+        return win;
+    };
+
+    this.getManager = function(){
+        return windows;
+    };
+
+    this.getWindow = function(id){
+        return windows.get(id);
+    }
+
+    this.getWinWidth = function(){
+        var width = Ext.lib.Dom.getViewWidth();
+        return width < 200 ? 200 : width;
+    }
+
+    this.getWinHeight = function(){
+        var height = (Ext.lib.Dom.getViewHeight()-taskbarEl.getHeight());
+        return height < 100 ? 100 : height;
+    }
+
+    this.getWinX = function(width){
+        return (Ext.lib.Dom.getViewWidth() - width) / 2
+    }
+
+    this.getWinY = function(height){
+        return (Ext.lib.Dom.getViewHeight()-taskbarEl.getHeight() - height) / 2;
+    }
+
+    this.setTickSize = function(xTickSize, yTickSize) {
+        this.xTickSize = xTickSize;
+        if (arguments.length == 1) {
+            this.yTickSize = xTickSize;
+        } else {
+            this.yTickSize = yTickSize;
+        }
+        windows.each(function(win) {
+            win.dd.xTickSize = this.xTickSize;
+            win.dd.yTickSize = this.yTickSize;
+            win.resizer.widthIncrement = this.xTickSize;
+            win.resizer.heightIncrement = this.yTickSize;
+        }, this);
+    };
+
+    this.cascade = function() {
+        var x = 0, y = 0;
+        windows.each(function(win) {
+            if (win.isVisible() && !win.maximized) {
+                win.setPosition(x, y);
+                x += 20;
+                y += 20;
+            }
+        }, this);
+    };
+
+    this.tile = function() {
+        var availWidth = desktopEl.getWidth(true);
+        var x = this.xTickSize;
+        var y = this.yTickSize;
+        var nextY = y;
+        windows.each(function(win) {
+            if (win.isVisible() && !win.maximized) {
+                var w = win.el.getWidth();
+
+//              Wrap to next row if we are not at the line start and this Window will go off the end
+                if ((x > this.xTickSize) && (x + w > availWidth)) {
+                    x = this.xTickSize;
+                    y = nextY;
+                }
+
+                win.setPosition(x, y);
+                x += w + this.xTickSize;
+                nextY = Math.max(nextY, y + win.el.getHeight() + this.yTickSize);
+            }
+        }, this);
+    };
+
+    this.contextMenu = new Ext.menu.Menu({
+        items: [{
+            text: 'Tile',
+            handler: this.tile,
+            scope: this
+        }, {
+            text: 'Cascade',
+            handler: this.cascade,
+            scope: this
+        }]
+    });
+    desktopEl.on('contextmenu', function(e) {
+        e.stopEvent();
+        this.contextMenu.showAt(e.getXY());
+    }, this);
+
+    layout();
+
+    if(shortcuts){
+        shortcuts.on('click', function(e, t){
+            if(t = e.getTarget('dt', shortcuts)){
+                e.stopEvent();
+                var module = app.getModule(t.id.replace('-shortcut', ''));
+                if(module){
+                    module.createWindow();
+                }
+            }
+        });
+    }
+};