Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-6045 in a recent build.
  1. #1
    Ext JS Premium Member smcguire36's Avatar
    Join Date
    Sep 2007
    Location
    Manchester, Connecticut, USA
    Posts
    99
    Vote Rating
    0
    smcguire36 is on a distinguished road

      0  

    Exclamation GroupTabPanel ux bug - Missing lower rounded corner

    GroupTabPanel ux bug - Missing lower rounded corner


    Ext version tested:
    • Ext 4.1.0

    Browser versions tested against:
    • Firefox
    • IE8
    • Chrome
    • Not browser dependent

    Description:
    • If you have a group tab panel with a tab group that has only a single tab in it, the active group only gets the top rounded corner and not the bottom.

    Steps to reproduce the problem:
    • Change the GroupTabPanel example so that the second group only has a single tab in it.
    • Run the example: examples/grouptabs/grouptabs.html

    The result that was expected:
    • Click on the second tab group header.
    • Active group should have rounded corners on the top and bottom.

    The result that occurs instead:
    • The bottom rounded corner is missing.

    Test Case:

    Just remove the second tab from the second group in the examples/grouptabs/grouptabs.js example file.

    HELPFUL INFORMATION


    Debugging already done:
    • I tracked down the problem to the renderer method on the treecolumn item @ line 75 in the examples/ux/GroupTabPanel.js file. The following code starting @ line 78 adds the class names to the tree item when the item is the first tab in the group. The problem is that when there is only a single tab in the group that tab is considered expanded always so the second if block below never evaluates to true when there is only a single tab in the group.

    Code:
    if (node.parentNode && node.parentNode.parentNode === null) {
        cls += ' x-grouptab-first';
        if (node.previousSibling) {
            cls += ' x-grouptab-prev';
        }
        if (!node.get('expanded')) {
            cls += ' x-grouptab-last';
        }
    } else ...
    Possible fix:
    • The following code illustrates a fix for this problem. I added an additional check to see if the firstChild is null which would indicate a group with only a single tab, then it adds the x-grouptab-last class to the div.

    Code:
    if (node.parentNode && node.parentNode.parentNode === null) {
        cls += ' x-grouptab-first';
        if (node.previousSibling) {
            cls += ' x-grouptab-prev';
        }
        if (!node.get('expanded')) {
            cls += ' x-grouptab-last';
        }
        else if (node.firstChild === null) {
            cls += ' x-grouptab-last';
        }
    } else ...
    Additional CSS used:
    • ext-all.css
    • GroupTabPanel.css

    Operating System:
    • Windows 7

    Stewart McGuire
    Ext JS 2.x, 3.x, 4.x - Advanced User / Sencha Architect 3 - User

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,927
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Can you provide a screen to make sure we are looking at the same thing?

    Regards,
    Scott.

  3. #3
    Ext JS Premium Member smcguire36's Avatar
    Join Date
    Sep 2007
    Location
    Manchester, Connecticut, USA
    Posts
    99
    Vote Rating
    0
    smcguire36 is on a distinguished road

      0  

    Default Here is screen shot with bug

    Here is screen shot with bug


    I commented out the "Email Templates" tab from the group tabs example and this is what you get if you click on the "Configuration" tab.

    GroupTabsBeforeFix.jpg

    NOTE: In the example you will need to modify the all-classes.js file starting at line 86953 instead of in GroupTabPanel.js line 78. My inserted code would go right after line 86960. I didn't realize that you had the example setup now to use a custom js file for loading the Ext classes.

    Here is the same page after applying my fix:

    GroupTabsAFterFix.jpg

    Stewart McGuire
    Ext JS 2.x, 3.x, 4.x - Advanced User / Sencha Architect 3 - User

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi