Infragistics Challange

8 posts, 1 answers
  1. Michael Josiah
    Michael Josiah avatar
    92 posts
    Member since:
    Nov 2007

    Posted 03 May 2008 Link to this post

    Hi guys, I have challanged an Infragistics customer to attempt to replicate very closely the Outlook 2007 application. Being an ex IG customer I thought this was impossible with their controls as their implentation of the webcombo and lack of splitter (back then) meant that it could just not be done. The guy has accepted the challange and in less than 5 hours achieved this

    http://outlook.visualstudiotutorials.com/

    Now there has been a counter challange and I have been asked to prove the Telerik controls can do the same thing. I have accepted the challange and will start immediately. However I have hit a little stumbling block. Using this example

    http://www.telerik.com/DEMOS/ASPNET/Prometheus/Panelbar/Examples/ApplicationScenarios/OutlookNavigation/DefaultCS.aspx

    i have begun my own implementation. In my implementation the panelbar exists on the left side of a splitter whilst the grid is on the right. However I am not quite sure how to make the panel bar extend to the full height of the splitter. What height settings do I need to apply to the multipage and the panelbar so that they fill the entire height and width of the left pane.
  3. Cedric
    Cedric avatar
    15 posts
    Member since:
    Apr 2008

    Posted 05 May 2008 Link to this post

    haha
    I'll not say to Cris that you're asking for help :P

    Hope you'll kick his a s s!

    Cedric
  5. Michael Josiah
    Michael Josiah avatar
    92 posts
    Member since:
    Nov 2007

    Posted 05 May 2008 Link to this post

    hahahaha yeah lets keep that to ourselves lol lol. Telerik guys come on and help out, just been praising you guys on the IG board.
  7. Rosi
    Admin
    Rosi avatar
    2529 posts

    Posted 06 May 2008 Link to this post

    Hello all,

    Please find a sample project illustrating the approach.

    Do not hesitate to ask us if you have any other questions related to the controls.

    Regards,
    Rosi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  8.
  9. Michael Josiah
    Michael Josiah avatar
    92 posts
    Member since:
    Nov 2007

    Posted 07 May 2008 Link to this post

    Thanks for this, but the problem I am facing exists for this one too. Try and resize your browser with this example and you will see that the items are either hidden away or it leaves a big white gap at the bottom. You have basically replicated my issue. Any ideas how to keep the look consistent when resizing the browser. Basically all items needs to be visible when resizing and the panelbar needs to fixed to the bottom of the page so that resizing does not cause an empty space below the panelbar.
  11. Answer
    Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 08 May 2008 Link to this post

    Hi Michael Josiah,
    You can use the following approach - when the RadSplitter is initialized, just calculate the Height of the RadPanelbar and set it as Height for its parent RadPane; then lock that RadPane:
    function OnClientLoaded(sender, args)  
    {  
        var splitter = $find("<%= SplitterTreeView.ClientID %>");  
        var topPane = splitter.getPaneById("<%= RadPaneTV.ClientID %>");  
        var bottomPane = splitter.getPaneById("<%= RadPane1.ClientID %>");  
        var panelbarElementHeight = $get("<%= RadPanelbar1.ClientID %>").offsetHeight;  
          
        var delta = panelbarElementHeight - bottomPane.get_height();  
        bottomPane.set_height(panelbarElementHeight);  
        topPane.set_height(topPane.get_height() - delta);  
        bottomPane.lock();  
    } 

     <telerik:RadSplitter ID="SplitterTreeView" runat="server" Orientation="Horizontal" Skin="Outlook"   
          OnClientLoaded="OnClientLoaded"> 

    <telerik:RadPanelBar ID="RadPanelbar1" runat="server" ExpandMode="SingleExpandedItem" 
        OnClientItemClicking="OnClientItemClicking" OnClientMouseOver="panelMouseOver" 
        Skin="Office2007" Width="195px"> 

    I have attached a modified version of the page for your reference. I have additionally added VisibleDuringInit="false" for the RadSplitters in order to hide all initial resize operations.

    Regards,
    Tsvetie
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  13. Michael Josiah
    Michael Josiah avatar
    92 posts
    Member since:
    Nov 2007

    Posted 08 May 2008 Link to this post

    Perfect, now this is why I joined Telerik. Ill let you know how the Challenge goes. Should be easy from here on in. Great tools guys.
  15. DarkProfit
    DarkProfit avatar
    2 posts
    Member since:
    Feb 2007

    Posted 10 May 2008 Link to this post

    @Michael,
    Ok so since you are trying to go up against me I really shouldn't tell you this "however" in the spirit of challenge etc. let me say this.

    The RadSplitter has a OffSet property which will allow you to pull off what I am doing (i actually had to build that using css for the IG demo) but with the RadSplitter you don't need to do that you can just say offset="20px" etc.

    And the number 1 thing to remember is the alot of the stuff I am doing requires you to throw the browser into quirks mode so change your doctype to 

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

    Which will also allow you to do tr style="height:100%;" which is the trick for alot of the effects you are seeing...

    Hope this helps can't wait to see your demo... Once you are done let me know and I will post it on my website for you...

    Christopher
Back to Top