PDA

View Full Version : Ext.ux.MinWindow(Minimizable Ext Windows without a taskbar)



omerio
17 Nov 2008, 9:56 AM
I have been working on an extension to provide minimizable Ext windows, the behaviour when minimizing a window is to display a 48X48 icon on the window container (desktop, page, etc... rather than a taskbar) with the window title as text below the icon (see the screenshots) the icons are draggable so that the user can organize them. Double clicking on the icon shows the window and hides the icon. Right clicking on the icon displays a contaxt menu with options to close or show the window. If the window is closed no icon is shown

Still a beta with a few issues

Demo here (http://dawelbeit.info/2008/11/18/minimizable-extjs-windows/)

Sorry about the late update. I've attached the styles required for this to work with ExtJS 3.4. I'm going to do an update for ExtJS 4.0 shortly

omerio
18 Nov 2008, 1:45 PM
Added Demo URL

fangzhouxing
18 Nov 2008, 6:40 PM
very nice!

galdaka
19 Nov 2008, 1:12 AM
I have been working on an extension to provide minimizable Ext windows, the behaviour when minimizing a window is to display a 48X48 icon on the window container (desktop, page, etc... rather than a taskbar) with the window title as text below the icon (see the screenshots) the icons are draggable so that the user can organize them. Double clicking on the icon shows the window and hides the icon. Right clicking on the icon displays a contaxt menu with options to close or show the window. If the window is closed no icon is shown

Still a beta with a few issues

Demo here (http://dawelbeit.info/2008/11/18/minimizable-extjs-windows/)

Awesome ;),

Thanks in advance,

rumana
12 Feb 2009, 3:21 AM
I want to make work icon in one click. How can I do that?

Scorpie
12 Feb 2009, 4:33 AM
Very nice!

wemerson.januario
12 Feb 2009, 9:28 AM
very nice

chalu
12 Feb 2009, 5:33 PM
This is indeed very good. However, can this be made to work with a Ext.StatusBar, maybe when minimized they become menuItems on the statusbar or within a menuItem on the statusbar. I would love to have this similar to those web desktop examples, but without the taskbar.

Cheers.

wemerson.januario
12 Feb 2009, 5:57 PM
nice work

jay@moduscreate.com
13 Feb 2009, 7:10 AM
Awesome.

to add some nice effects, you should create the icon, then animate the window to it.

here is an example of what i mean: http://tdg-i.com/img/screencasts/2009-01-19_2201.swf

cgountanis
21 Sep 2009, 8:18 AM
This is example is very cool but a little over our end users heads at the moment.

Can the minimize just auto-collapse window in lower left area? If so can you lead me to the right window params or example please? I have minimizable:true but the button does nothing.

auntieyi
6 Nov 2009, 3:31 AM
it's cool.
How can make it show the window with onclick event?

cgountanis
6 Nov 2009, 7:51 AM
Panel that calls the open window command.


//menu item - smartMenu
var smartMenu = new Ext.Panel({
title :'Reporting',
html :'<a href="#" onClick="toggleReporting()">toggleReporting()</a>',
border :false
});


Function that the panel above calls.


//function used to open reporting window
function toggleReporting() {
w = Ext.getCmp('reportingPanel');
w.hidden ? w.show() : w.hide();
console.log('toggleReporting()');
}


Reporting window created but hidden at runtime. This is the window that opens and closes when a user clicks the link in the panel above.


new Ext.Window({
id : 'reportingPanel',
collapsible : true,
closeAction : 'hide',
closable : true,
plain : false,
height : 400,
width : 800,
layout : 'fit',
title : 'Reports'
}).hide();



Another example of this concept is found in the complex border layout example (http://www.extjs.com/deploy/dev/examples/layout/complex.html). It creates a link in the second tab in center that controls the west menu.

thangamalar
14 Jun 2010, 3:01 AM
It's very nice work. I was looking for one like this and it made it very easy for me.

yeeen
26 Dec 2011, 4:00 AM
The 3 problems I encounter are -
1) This file is no longer supported in version 4.0:
<script type="text/javascript" src="./ext-2.2/adapter/ext/ext-base.js"></script>
I searched online and someone says use bootstrap.js instead, not sure whether it is correct.
2) Ext.reg('uxwindow', Ext.ux.Window); is no longer supported in version 4.0
I hv changed to

Ext.ux.Window = Ext.extend(Ext.Window, {

alias: 'widget.uxwindow',
...
3) Firefox says "me.model is undefined", Chrome says "Uncaught TypeError: Cannot call method 'getProxy' of undefined", the error occurs in "ext-all-debug.js" line 44348. I still don't know how to resolve it, anyone has any idea?

Thus until now I still can't run this project... it would be a pity if this project cannot be use with 4.0.