[CLOSED] Portal Resize Ajax Event fires on page load... not just on the resize

  1. #1

    [CLOSED] Portal Resize Ajax Event fires on page load... not just on the resize

    I am trying to capture the resize event on a portal, but it seems to be firing on the page load and also when the tab is clicked on (activated), this is causing my to record some incorrect values for the width of the portal in my database. Is there a way to keep my resize function from firing unless the portal was resized by dragging the mouse?

    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Page3.aspx.vb" Inherits="HomePage.Page3" %>
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    <%@ Import Namespace="System.Data" %>
    <%@ Import Namespace="Microsoft.ApplicationBlocks.Data" %>
    <%@ Import Namespace="Helpers" %>
    <%@ Import Namespace="Helpers.FormatHelpers" %>
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head2" runat="server">
        <title>The Magazine Manager</title>
        
        <script runat="server">   
            Dim Portal2Width As Integer
            Private PortalID As Integer = 0
    
    
            Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
                'add the logged in user as a javascript variable so we can use it
                Dim cs As String = Connection.ConnectionString(Request.ServerVariables("SERVER_NAME"))
                'load the navigation menu
                If Not Page.IsPostBack Then
                    'set up portlets
                    CreateAllPortals()
                End If
            End Sub
            
            Public Sub CreateAllPortals()
                'create each portal defined for this user
                Dim PortalIndex As Integer = 1
                
                'set up this portal
                Dim tabPortal As Tab = FindControl("TabPortal" &amp; PortalIndex)
                tabPortal.Title = "Portal " &amp; PortalIndex
    
    
                'set the width of the second portal and store in in the array
                Dim PortalTemp As Portal = FindControl(String.Format("Portal{0}_1", PortalIndex))
                PortalTemp.Width = Null2Integer(500)
    
    
                'set up column1
                CreatePortletColumn(PortalIndex, 1)
    
    
                'set up column2
                CreatePortletColumn(PortalIndex, 2)
    
    
                'create the portal
                PortalTemp.DoLayout()
                tabPortal.Show()
    
    
                'move to the next portal page/tab
                PortalIndex += 1
                
                'set up this portal
                tabPortal = FindControl("TabPortal" &amp; PortalIndex)
                tabPortal.Title = "Portal " &amp; PortalIndex
    
    
                'set the width of the second portal and store in in the array
                PortalTemp = FindControl(String.Format("Portal{0}_1", PortalIndex))
                PortalTemp.Width = 500
    
    
                'set up column1
                CreatePortletColumn(PortalIndex, 1)
    
    
                'set up column2
                CreatePortletColumn(PortalIndex, 2)
    
    
                'create the portal
                PortalTemp.DoLayout()
                tabPortal.Show()
            End Sub      
    
    
            Private Sub CreatePortletColumn(ByVal PortalIndex As Integer, ByVal ColumnIndex As Integer)
                Dim n As Integer
                For n = 0 To 1
                    Dim ID As String = n
                    Dim Title As String = "Portlet" &amp; n
                    Dim PageURL As String = "http://www.ext.net"
                    Dim Collapsible As Boolean = True
                    Dim Closeable As Boolean = True
                    Dim Draggable As Boolean = True
                    Dim Collapsed As Boolean = True
                    Dim Height As Integer = 250
    
    
                    Dim PortletTemp As New Portlet
                    PortletTemp.ID = String.Format("Component{0}_{1}_{2}", PortalIndex, ColumnIndex, ID)
                    PortletTemp.Title = Title
                    If Height > 0 Then
                        PortletTemp.Height = Height
                    End If
                    PortletTemp.Collapsed = Collapsed
                    PortletTemp.StyleSpec = "padding:10px;"
                                                
                    If Not Collapsed Then
                        'load the URL in the portlet
                        Dim al As New LoadConfig
                        al.Url = PageURL
                        al.ShowMask = True
                        al.Mode = LoadMode.IFrame
                        PortletTemp.Load(al)
                    Else
                        PortletTemp.Listeners.Expand.Handler = "this.load({url:'http://www.ext.net',mode:'iframe', showMask:true});"
                        PortletTemp.Listeners.Expand.Single = True
                        
                    End If
    
    
                        
                    'add listeners to call AJAX to save the collapse and expand states
                    PortletTemp.Collapsible = Collapsible.ToString
    
    
                    'can we drag this portlet to a new position?
                    PortletTemp.Draggable = Draggable
    
    
                    Dim AnchorTemp As New Anchor
                    AnchorTemp.Horizontal = "100%"
                    AnchorTemp.Items.Add(PortletTemp)
    
    
                    Dim AnchorLayoutTemp As AnchorLayout = FindControl(String.Format("AnchorLayoutPortal{0}_{1}", PortalIndex, ColumnIndex))
                    AnchorLayoutTemp.Anchors.Add(AnchorTemp)
                Next
            End Sub
    
    
            Public Sub Resize_Portal(ByVal sender As Object, ByVal e As AjaxEventArgs)
                Dim PortalIndex As Integer = e.ExtraParams("PortalIndex")
                Dim Width As String = e.ExtraParams("Width")
                
                CType(FindControl(String.Format("TabPortal{0}", PortalIndex)), Tab).Title = "resize-" &amp; Width &amp; ":" &amp; Now()
            End Sub
    
    
        </script>
        
        <script type="text/javascript"></script>    
        <style type="text/css"></style>
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" ScriptMode="Debug" />              
        
        <ext:ViewPort ID="ViewPort1" runat="server">
            <Body>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <Center>
                        <ext:Panel ID="Panel7" runat="server" AutoScroll="true">
                            <Body>
                                <ext:FitLayout ID="FitLayout2" runat="server">
                                    <ext:TabPanel ID="TabPanel1" runat="server" ActiveTabIndex="0" Plain="true" LayoutOnTabChange="true" EnableTabScroll="true">
                                        <Tabs>                                                                                   
                                            <ext:Tab ID="TabPortal1" runat="server" Title="" ShowIFrameMask="true" AutoScroll="true">
                                                <Body>
                                                <ext:BorderLayout ID="BorderLayoutPortal1" runat="server">  
                                                    <West Split="true" Collapsible="false" Margins-Top=0>
                                                        <ext:Portal ID="Portal1_1" runat="server" Border="false" AutoHeight="true">                                                        
                                                            <Body>
                                                                <ext:ColumnLayout ID="ColumnLayoutPortal1_1" runat="server">
                                                                    <ext:LayoutColumn ColumnWidth=".99">
                                                                        <ext:PortalColumn ID="PortalColumnPortal1_1" runat="server" StyleSpec="padding:5px 5px 5px 5px">
                                                                            <Body>
                                                                                <ext:AnchorLayout ID="AnchorLayoutPortal1_1" runat="server">
                                                                                </ext:AnchorLayout>
                                                                            </Body>
                                                                        </ext:PortalColumn>
                                                                    </ext:LayoutColumn>
                                                                </ext:ColumnLayout>
                                                            </Body>  
                                                            <AjaxEvents>
                                                                <Resize OnEvent="Resize_Portal">
                                                                    <ExtraParams>
                                                                        <ext:Parameter Name="PortalIndex" Value="1" Mode="Raw" />
                                                                        <ext:Parameter Name="Width" Value="adjWidth" Mode="Raw" />
                                                                    </ExtraParams>
                                                                </Resize>
                                                            </AjaxEvents>                                                      
                                                        </ext:Portal>                                                    
                                                    </West>
                                                    <Center>
                                                         <ext:Portal ID="Portal1_2" runat="server" Border="false" AutoHeight="true">
                                                            <Body>
                                                                <ext:ColumnLayout ID="ColumnLayoutPortal1_2" runat="server">
                                                                    <ext:LayoutColumn ColumnWidth=".99">
                                                                        <ext:PortalColumn ID="PortalColumnPortal1_2" runat="server" StyleSpec="padding:10px 10px 10px 10px">
                                                                            <Body>
                                                                                <ext:AnchorLayout ID="AnchorLayoutPortal1_2" runat="server">                                                                                
                                                                                </ext:AnchorLayout>
                                                                            </Body>
                                                                        </ext:PortalColumn>
                                                                    </ext:LayoutColumn>
                                                                </ext:ColumnLayout>
                                                            </Body>                                                                                                                                                                      
                                                        </ext:Portal>
                                                    </Center>
                                                </ext:BorderLayout>
                                                </Body>
                                            </ext:Tab>
                                            <ext:Tab ID="TabPortal2" runat="server" Title="Portal 2" ShowIFrameMask="true" AutoScroll="true">
                                                <Body>
                                                <ext:BorderLayout ID="BorderLayoutPortal2" runat="server">  
                                                    <West Split="true" Collapsible="false" Margins-Top=0>
                                                        <ext:Portal ID="Portal2_1" runat="server" Border="false" AutoHeight="true">                                                        
                                                            <Body>
                                                                <ext:ColumnLayout ID="ColumnLayoutPortal2_1" runat="server">
                                                                    <ext:LayoutColumn ColumnWidth=".99">
                                                                        <ext:PortalColumn ID="PortalColumnPortal2_1" runat="server" StyleSpec="padding:5px 5px 5px 5px">
                                                                            <Body>
                                                                                <ext:AnchorLayout ID="AnchorLayoutPortal2_1" runat="server">
                                                                                </ext:AnchorLayout>
                                                                            </Body>
                                                                        </ext:PortalColumn>
                                                                    </ext:LayoutColumn>
                                                                </ext:ColumnLayout>
                                                            </Body>  
                                                            <AjaxEvents>
                                                                <Resize OnEvent="Resize_Portal">
                                                                    <ExtraParams>
                                                                        <ext:Parameter Name="PortalIndex" Value="2" Mode="Raw" />
                                                                        <ext:Parameter Name="Width" Value="adjWidth" Mode="Raw" />
                                                                    </ExtraParams>
                                                                </Resize>
                                                            </AjaxEvents>                                                      
                                                        </ext:Portal>                                                    
                                                    </West>
                                                    <Center>
                                                         <ext:Portal ID="Portal2_2" runat="server" Border="false" AutoHeight="true">                                                        
                                                            <Body>
                                                                <ext:ColumnLayout ID="ColumnLayoutPortal2_2" runat="server">
                                                                    <ext:LayoutColumn ColumnWidth=".99">
                                                                        <ext:PortalColumn ID="PortalColumnPortal2_2" runat="server" StyleSpec="padding:10px 10px 10px 10px">
                                                                            <Body>
                                                                                <ext:AnchorLayout ID="AnchorLayoutPortal2_2" runat="server">                                                                                
                                                                                </ext:AnchorLayout>
                                                                            </Body>
                                                                        </ext:PortalColumn>
                                                                    </ext:LayoutColumn>
                                                                </ext:ColumnLayout>
                                                            </Body>                                                                                                                                                                      
                                                        </ext:Portal>
                                                    </Center>
                                                </ext:BorderLayout>
                                                </Body>
                                            </ext:Tab>
                                        </Tabs>
                                    </ext:TabPanel>   
                                </ext:FitLayout>
                            </Body>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Body>
       </ext:ViewPort>    
    </form>
    </body>
    </html>
    Last edited by geoffrey.mcgill; Feb 22, 2011 at 4:12 AM.
  2. #2

    RE: [CLOSED] Portal Resize Ajax Event fires on page load... not just on the resize

    Hi,

    The resize event fires on any size changes (user changed size by dragging or programatically changes). It is no way determine how is initiator.*


    What you mean incorrect values? The portal should give correct values in resize event. Also I notoced that portal in west region have no width. It is recomended to set width for west/east regions items and height for north/south regions items


  3. #3

    RE: [CLOSED] Portal Resize Ajax Event fires on page load... not just on the resize



    I set the width programmatically based on the last size the user selected. This allows them to customize their home page portal based on their screen size and the selected widgets they have on the portal. When the page loads or when one or the other is clicked on (activated), the west portal resizes to 0 (which gets set in the database with an Ajax function as the size the user selected). Is there a way to limit the resize to only when the user changes the size of that panel in the west section of the border layout?

    There may be a better way to resize portal columns... any suggesstions?

    I'd rather just have it be a single portal that the user can drag the center line between the portal columns and capture the new width of the portals. Is there a way to do that?
  4. #4

    RE: [CLOSED] Portal Resize Ajax Event fires on page load... not just on the resize

    Hi,

    May be listen resize of each portlet or ignore zero width?
    *

Similar Threads

  1. [CLOSED] Portal Layout Resize Issues
    By Patrick_G in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Jan 18, 2013, 3:50 AM
  2. Windows resize when load ResourceManager
    By slonati_adv in forum 2.x Help
    Replies: 0
    Last Post: Jun 21, 2012, 7:23 AM
  3. [CLOSED] How to detect SpliterBar Move event from Resize event
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 9
    Last Post: Dec 27, 2010, 5:08 PM
  4. Replies: 2
    Last Post: Jan 01, 2010, 5:51 AM
  5. [CLOSED] [1.0] Portal resize and scrollbar problems
    By danielg in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Nov 02, 2009, 9:12 AM

Posting Permissions