Group CSS together to avoid IE's restriction of 31 external css files
---------------------------------------------------------------------

                 Key: TAP5-1470
                 URL: https://issues.apache.org/jira/browse/TAP5-1470
             Project: Tapestry 5
          Issue Type: Improvement
          Components: tapestry-core
    Affects Versions: 5.2, 5.1
            Reporter: Michael Wyraz


IE is restricted to load 31 external CSS per page. All other are ignored.
Also the number of @import declarations are restricted to 30 per css 
declaration.

The following change to DocumentLinkerImpl beraks the imported css into blocks. 
A new block starts when more than 30 @import occured of when the "media" 
attribute changes.


    protected void addStylesheetsToHead(Element root, List<IncludedStylesheet> 
stylesheets)
    {
        int count = stylesheets.size();

        if (count == 0) return;

        // This only applies when the document is an HTML document. This may 
need to change in the
        // future, perhaps configurable, to allow for html and xhtml and 
perhaps others. Does SVG
        // use stylesheets?

        String rootElementName = root.getName();

        // Not an html document, don't add anything. 
        if (!rootElementName.equals("html")) return;

        Element head = findOrCreateElement(root, "head", true);

        Element existing = findExistingElement(head, "link");

        // Create a temporary container element.
        Element tempContainer = head.element("temp-container");
        for (int i = 0; i < count; i++)
            stylesheets.get(i).add(tempContainer);
        tempContainer.remove();
        
        Element container = head.element("css-container");

        // Fix für IE: Immer wenn der "media" Typ wechselt oder 30 CSS erreicht 
sind, wird ein neues CSS-Tag aufgemacht

        Element style=null;
        int cssCount=Integer.MAX_VALUE;
        String lastMedia="all";
        
        for (Node _css: tempContainer.getChildren())
        {
            if (!(_css instanceof Element)) continue;
            Element css=(Element) _css;
            String href=css.getAttribute("href");
            String media=css.getAttribute("media");
            if (media==null) media="all";
            
            if (cssCount>30 || !media.equalsIgnoreCase(lastMedia))
            {
                style=container.element("style", "type","text/css", 
"media",media);
                lastMedia=media;
                cssCount=0;
            }
            style.text("@import url("+href+");");
            cssCount++;
        }

        if (existing != null)
            container.moveBefore(existing);

        container.pop();
    }


--
This message is automatically generated by JIRA.
For more information on JIRA, see: http://www.atlassian.com/software/jira

Reply via email to