X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/examples/sandbox/js/Desktop.js diff --git a/examples/sandbox/js/Desktop.js b/examples/sandbox/js/Desktop.js new file mode 100644 index 00000000..7b6e6ae2 --- /dev/null +++ b/examples/sandbox/js/Desktop.js @@ -0,0 +1,214 @@ +/*! + * Ext JS Library 3.3.1 + * Copyright(c) 2006-2010 Sencha Inc. + * licensing@sencha.com + * http://www.sencha.com/license + */ +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; + if (win.resizer) { + 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) { + t = e.getTarget('dt', shortcuts); + if (t) { + e.stopEvent(); + var module = app.getModule(t.id.replace('-shortcut', '')); + if (module) { + module.createWindow(); + } + } + }); + } +};