[FIXED] Window maximize behaviour

  1. #1

    [FIXED] Window maximize behaviour

    Hi,

    I have found interesting behaviour behaviour of "cool:window" whne "Maximizable" propertiy is set to true.
    Here is the code example:

    
    
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CooliteTest._Default" %><%@ Register Assembly="Coolite.Web.UI" Namespace="Coolite.Web.UI" TagPrefix="cool" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
    </head>
    
    <body scroll="no">
        <form id="form1" runat="server">
            <cool:ScriptManager runat="server" ID="CoolSC" Theme="Gray"/>
            <table style="width:100%; height:100%;" cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td>
                    <cool:Window ID="Window1" runat="server" 
                        AutoShow="true" 
                        Collapsible="true"
                        Title="My Window"
                        TitleCollapse="false"
                        Shim="true"
                        AutoLoad=http://www.google.com
                        Maximizable="true"
                        Minimizable="true"
                        AutoScroll="true"
                        CloseAction="Hide" 
                        Center="False"> 
                    </cool:Window> 
                    </td>
                </tr>
                <tr style="height:30px; background-color: Black;">
                    <td>
                    <asp:Menu runat="server" 
                        ID="GlobalMenu" 
                        BackColor="Black"
                        Orientation="Horizontal" >
                    <Items>
                        <asp:MenuItem Text="Menu1" />
                        <asp:MenuItem Text="Menu2" />
                        <asp:MenuItem Text="Menu3" />
                        <asp:MenuItem Text="Menu4" />
                    </Items>
                    </asp:Menu>
                    </td>
                </tr>
            </table>
        </form>
    </body>
    </html>
    Once maximize button is clicked the result is not quite wait is was expected. Instead window resize to container boundaries it just "minimizes" to top left corner of &#100;ocument. Any suggestion on this one. And of course keep up the good work.

    Regards,
    Jure
  2. #2

    RE: [FIXED] Window maximize behaviour

    Hi Jure,

    This issue has been on my list of things to investigate for a while, some I'm glad you pointed out the problem.

    I dug into the JavaScript and by default the Maximize event will maximize the Window to the size of it's container.

    The default container for the Window is the <form> and by default the <form> renders basically no width/height, unless styled to fill it's container (<body>) with the height/width set to 100%.

    I can't change the default functionality, although there is a fairly easy work-around, which also enables much more flexibility. By listening for the Maximize event we can get the size of the body and then resize the Window according to these new dimensions.

    Example

    <cool:Window 
        ID="Window1" 
        runat="server" 
        Title="Window"
        Maximizable="true"
        AutoShow="true"
        Html="Maximize Me!">
        <ClientEvents>
            <Maximize Handler="function (el){ var view = Ext.getBody().getViewSize(); el.setSize(view.width, view.height); }" />
        </ClientEvents>
    </cool:Window>
    For the upcoming 0.5 release, the above syntax will change slightly.

    Example

    <ext:Window 
        ID="Window1" 
        runat="server" 
        Title="Window"
        Maximizable="true"
        AutoShow="true"
        Html="Maximize Me!">
        <Listeners>
            <Maximize Handler="function (el){ var view = Ext.getBody().getViewSize(); el.setSize(view.width, view.height); }" />
        </Listeners>
    </ext:Window>
    I added the above Maximize handler to the Window control source code. This maximize/resize functionality is now the default behaviour, if the Maximizable property is set to "true".

    This new functionality can be easily overridden by setting your own custom <Maximize> event handler.

    If you wish to maximize the Window to size of a different container, just replace Ext.getBody() with another DOM object.

    Example

    var view = Ext.get("myDiv").getViewSize();
    Hope this helps.

    Geoffrey McGill
    Founder
  3. #3

    RE: [FIXED] Window maximize behaviour

    Thanx. That acctualy worked. I complettly forget about elements flow :S. BTW why don't allow "RenderTo" property to be settable. Acctualy it has setter but rendered script has always "new Ext.Window({renderTo:"form1" ...). Could be ever nicer solution.
  4. #4

    RE: [FIXED] Window maximize behaviour

    Hi jurel,

    We force the Window to render to the <form> otherwise the contents of the Window are not sent in a postback.

    Since the control must be placed inside the <form> and considering it does not participate in the normal 'flow' of the Page (i.e. it floats above everything), I feel rendering to the <form> is perfectly acceptable. Obviously that caused a bug, but I feel the code posted above, and now added to the source as default behaviour, should help solve any future issues.

    Again, the positioning of the Window is completely customizable by tapping into the Render Listener or from any other event fired on the Page.

    The option to override the RenderTo property is another item on my list to revisit and I'll make a point of giving it some attention before the final 0.5 release.

    Hope this helps.
    Geoffrey McGill
    Founder

Similar Threads

  1. [CLOSED] V2.1 Desktop Window Maximize
    By Aurelio in forum 2.x Legacy Premium Help
    Replies: 7
    Last Post: Jul 30, 2012, 8:41 AM
  2. [FIXED] [1.0] FileUploadField button behaviour
    By Neil_Walters in forum Bugs
    Replies: 1
    Last Post: Feb 01, 2010, 10:00 AM
  3. Maximize Desktop window
    By mono in forum 1.x Help
    Replies: 0
    Last Post: Jul 14, 2009, 10:26 AM
  4. [FIXED] [V0.8.0] window maximize
    By [WP]joju in forum Bugs
    Replies: 17
    Last Post: Mar 11, 2009, 6:17 AM
  5. Replies: 3
    Last Post: Feb 03, 2009, 5:57 PM

Posting Permissions