The constructor of StyleSheetExtension is:

    public StyleSheetExtension(String[] args, StyledViewFactory viewFactory) {
        viewFactory.addDependency(EMAIL_NAMESPACE, "message", 
                                  Namespace.XML, "lang");
            .
            .
            .
    }

p[align=left] {
    text-align: left;
}

The localize method is implemented as follows:

    public StyleValue localize(StyleValue[] args, Node contextNode,
                               StyledViewFactory viewFactory) {
        String text;
        if (args.length != 1 || (text = args[0].stringValue()) == null) {
            System.err.println("usage: content: invoke('localize', text);");
            return null;
        }

        Element root = contextNode.getDocument().getRootElement();
        String lang = root.getTokenAttribute(Name.XML_LANG, "en");

        ResourceBundle messages = getMessages(lang);
        if (messages == null && !"en".equals(lang)) 
            messages = getMessages("en");

        String localizedText = null;
        if (messages != null) {
            try {
                localizedText = messages.getString(text);
            } catch (Exception ignored) {}
        }

        if (localizedText == null)
            return args[0];
        else
            return StyleValue.createString(localizedText);
    }

    private static HashMap<String, ResourceBundle> langToMessages = 
        new HashMap<String, ResourceBundle>(5);

    private static ResourceBundle getMessages(String lang) {
        ResourceBundle messages = langToMessages.get(lang);
        if (messages == null) {
            try {
                messages = ResourceBundle.getBundle("messages/Messages", 
                                                    new Locale(lang));
            } catch (MissingResourceException ignored) {}

            if (messages != null)
                langToMessages.put(lang, messages);
        }
        return messages;
    }

The implementation of the localize method is straightforward:

About the implementation:

public Type type;
public Keyword keyword;
public double number;
public String string; 
public Name name;
public StyleValue[] list;
public Color color;
public StringExpr xpath;

Interface StyleSpecs specifies the services expected by XXE style engine from a style sheet.

An actual StyleSheet of course implements StyleSpecs. Custom code could also implement this interface to style a few, otherwise hard to style, elements. For example, such custom code is used to style XHTML (HTML 4) tables^[7] and another custom code is used to style DocBook (CALS) tables.

If an implementation of StyleSpecs has been registered, the style engine first uses it to find styles for the target of current CSS rule, then it uses the regular StyleSheet to find more styles. Therefore the styles returned by the StyleSheet may override those returned by the StyleSpecs.

An implementation of StyleSpecs generally just defines the following method:

int findStyleSpec(Element element, StyleSpec[] specs);

The style engine passes to the StyleSpecs the element which is the target of current CSS rule and an array of 3 pre-created StyleSpec data structures.

The returned value is a mask specifying which one, of the 3 StyleSpec data structures, has been filled with styles.

    public int findStyleSpec(Element element, StyleSpec[] specs) {
        if (element.getName() == EMPHASIS) {
            styleEmphasis(element, specs[StyleSpecsBase.ELEMENT]);
            return StyleSpecsBase.ELEMENT_MASK;
        }

        return 0x0;
    }

    private void styleEmphasis(Element element, StyleSpec styleSpec) {
        int role = getRole(element);

        int nesting = 0;
        Element ancestor = element.getParentElement();
        while (ancestor != null) {
            if (ancestor.getName() != EMPHASIS ||
                getRole(ancestor) != role)
                break;

            ++nesting;
            ancestor = ancestor.getParentElement();
        }

        switch (role) {
        case BOLD:
            if ((nesting % 2) == 0) {
                setFontWeight(styleSpec, StyleValue.Keyword.BOLD);
            } else {
                setFontWeight(styleSpec, StyleValue.Keyword.NORMAL);
            }
            break;
        case HIGHLIGHT:
            if ((nesting % 2) == 0) {
                setBackgroundColor(styleSpec, highlightBackground);
                setColor(styleSpec, highlightForeground);
            } else {
                setBackgroundColor(styleSpec, Color.white);
                setColor(styleSpec, Color.black);
            }
            break;
        default:
            if ((nesting % 2) == 0) {
                setFontStyle(styleSpec, StyleValue.Keyword.ITALIC);
            } else {
                setFontStyle(styleSpec, StyleValue.Keyword.NORMAL);
            }
        }
    }

    private static final int ITALIC = 0;
    private static final int BOLD = 1;
    private static final int HIGHLIGHT = 2;

    private static int getRole(Element element) {
        String role = element.getTokenAttribute(ROLE, null);
        if ("bold".equals(role))
            return BOLD;
        else if ("highlight".equals(role))
            return HIGHLIGHT;
        else
            return ITALIC;
    }

    private StyleValue fontStyleValue = 
        StyleValue.createIdentifier(StyleValue.Keyword.NORMAL);
    private StyleValue fontWeightValue = 
        StyleValue.createIdentifier(StyleValue.Keyword.NORMAL);
    private StyleValue backgroundColorValue = 
        StyleValue.createColor(Color.white);
    private StyleValue colorValue = 
        StyleValue.createColor(Color.black);

    private void setFontStyle(StyleSpec styleSpec, 
                              StyleValue.Keyword fontStyle) {
        fontStyleValue.initIdentifier(fontStyle);
        styleSpec.fontStyle = fontStyleValue;
    }

    private void setFontWeight(StyleSpec styleSpec, 
                               StyleValue.Keyword fontWeight) {
        fontWeightValue.initIdentifier(fontWeight);
        styleSpec.fontWeight = fontWeightValue;
    }

    private void setBackgroundColor(StyleSpec styleSpec, Color color) {
        backgroundColorValue.color = color;
        styleSpec.backgroundColor = backgroundColorValue;
    }

    private void setColor(StyleSpec styleSpec, Color color) {
        colorValue.color = color;
        styleSpec.color = colorValue;
    }

    public StyleValue marginTop = null;
    public StyleValue marginRight = null;
    public StyleValue marginBottom = null;
    public StyleValue marginLeft = null;
    public StyleValue paddingTop = null;
    public StyleValue paddingRight = null;
    public StyleValue paddingBottom = null;
    public StyleValue paddingLeft = null;
    public StyleValue borderStyle = null;
    public StyleValue borderWidth = null;
    public StyleValue borderTopColor = null;
        .
        .
        .

In the solution of problem #1, we have already explained all the concepts behind a custom method such as StyleSheetExtension.listItemCounter. So what is new in problem #3?

With the above code, listitems contained in orderedlists with continuation=continues are properly styled. But if you insert or delete orderedlists in an email message, other orderedlists with continuation=continues are not properly updated.

Just invoking

viewFactory.addDependency(EMAIL_NAMESPACE, "orderedlist", 
                          Namespace.NONE, "continuation");

in the constructor of StyleSheetExtension to declare a dependency between orderedlist and its continuation attribute is obviously not sufficient.

Here the idea is to write some custom code which observes modifications made to the email message and which rebuilds the views of orderedlists with continuation=continues when needed to.

This custom code is an implementation of interface BasicElementObserver. A BasicElementObserver must implement:

void elementChanged(DocumentEvent[] events);

This method is invoked by the CustomViewManager of the StyledViewFactory each time the structure or the attributes (but not the text contained in mixed elements) of elements of interest have been modified. (More about CustomViewManagers in next section.)

The implementation of BasicElementObserver is created and registered with XXE style engine in the constructor of StyleSheetExtension:

        CustomViewManager.NamePattern[] observed = {
            new CustomViewManager.NamePattern(EMAIL_NAMESPACE, "body"),
            new CustomViewManager.NamePattern(EMAIL_NAMESPACE, "listitem"),
            new CustomViewManager.NamePattern(EMAIL_NAMESPACE, "orderedlist")
        };
        viewFactory.getCustomViewManager().add(
            new OrderedListObserver(viewFactory), observed);

Class OrderedListObserver is implemented as follows:

    private static class OrderedListObserver 
                   implements CustomViewManager.BasicElementObserver {
        private DocumentView docView;
        private ArrayList<Element> orderedLists = new ArrayList<Element>();

        public OrderedListObserver(StyledViewFactory viewFactory) {
            docView = viewFactory.getDocumentView();
        }

        public void customViewAdded() {}
        public void customViewRemoved() {}

        public void elementChanged(DocumentEvent[] events) {
            orderedLists.clear();

            for (int i = 0; i < events.length; ++i) {
                DocumentEvent event = events[i];

                switch (event.getType()) {
                case CHILD_ADDED:
                case CHILD_REPLACED:
                case CHILD_REMOVED:
                    {
                        TreeEvent e = (TreeEvent) event;

                        Element element = e.getElementSource();
                        if (element == null)
                            break;

                        if (element.getName() == ORDEREDLIST) {
                            add(orderedLists, element);
                        } else {
                            if (isOrderedList(e.getOldChild()) ||
                                isOrderedList(e.getNewChild())) {
                                // Add first child orderedlist (if any).

                                Node node = element.getFirstChild();
                                while (node != null) {
                                    if ((node instanceof Element) &&
                                        ((Element) node).getName() == 
                                        ORDEREDLIST) {
                                        add(orderedLists, (Element) node);
                                        break;
                                    }

                                    node = node.getNextSibling();
                                }
                            }
                        }
                    }
                    break;

                // ------------------------------------------------------
                // Left as an exercise, treat INCLUSION_UPDATED similarly 
                // to CHILD_REPLACED
                // ------------------------------------------------------

                case ATTRIBUTE_ADDED:
                case ATTRIBUTE_CHANGED:
                case ATTRIBUTE_REMOVED:
                    {
                        Element element = 
                            ((AttributeEvent) event).getElementSource();
                        if (element.getName() == ORDEREDLIST) {
                            add(orderedLists, element);
                        }
                    }
                    break;
                }
            }

            int count = orderedLists.size();
            if (count > 0) {
                for (int i = 0; i < count; ++i) {
                    Element orderedList = (Element) orderedLists.get(i);

                    if (orderedList.getParentElement() != null) {
                        // Add all following orderedlist siblings (if any).

                        Node node = orderedList.getNextSibling();
                        while (node != null) {
                            if ((node instanceof Element) &&
                                ((Element)node).getName() == ORDEREDLIST) {
                                add(orderedLists, (Element) node);
                            }

                            node = node.getNextSibling();
                        }
                    } // Otherwise, orderedList is the root element.
                }

                count = orderedLists.size();
                for (int i = 0; i < count; ++i) {
                    docView.rebuildView((Element) orderedLists.get(i));
                }

                orderedLists.clear();
            }
        }

        private static final void add(ArrayList<Element> orderedLists,
                                      Element orderedList) {
            if (!orderedLists.contains(orderedList))
                orderedLists.add(orderedList);
        }

        private static final boolean isOrderedList(Node node) {
            if (node == null || !(node instanceof Element))
                return false;
            else
                return (((Element) node).getName() == ORDEREDLIST);
        }
    }

The above implementation is simple but not very efficient:

Before really solving problem #4, we will explain here how to write the simplest custom views.

Alternate style sheet email_passive_smiley.css contains:

@import url(email.css);

smiley {
    content: component("PassiveSmiley");
}

Class PassiveSmiley is a very simplified version of Smiley:

public class PassiveSmiley implements ComponentFactory {
    private static final Name EMOTION = Name.get("emotion");

    public Component createComponent(Element element, 
                                     Style style, StyleValue[] parameters, 
                                     StyledViewFactory viewFactory,
                                     boolean[] stretch) {
        SmileyLabel smileyLabel = new SmileyLabel(element);
        smileyLabel.setFont(style.font);

        return smileyLabel;
    }

    private static class SmileyLabel extends JLabel implements TextLines {
        private Element element;

        public SmileyLabel(Element element) {
            String emotion = element.getNmtokenAttribute(EMOTION, "happy");

            SmileyInfo smiley = null;

            SmileyInfo[] smileys = SmileyInfo.getKnownSmileys();
            for (int i = 0; i < smileys.length; ++i) {
                if (smileys[i].getEmotion().equals(emotion)) {
                    smiley = smileys[i];
                    break;
                }
            }

            if (smiley == null)
                // Invalid emotion. Show it anyway.
                smiley = new SmileyInfo(emotion, null, "???");

            if (smiley.getIcon() != null)
                setIcon(smiley.getIcon());
            setText(smiley.toString());
        }

        public int getFirstBaseLine() {
            return ComponentUtil.getFirstBaseLine(this);
        }

        public int getLastBaseLine() {
            return getFirstBaseLine();
        }
    }
}

public class SmileyInfo {
    private String emotion;
    private ImageIcon icon;
    private String asciiArt;

    public SmileyInfo(String emotion, ImageIcon icon, String asciiArt) {
        this.emotion = emotion;
        this.icon = icon;
        this.asciiArt = asciiArt;
    }
        .
        .
        .
    public static SmileyInfo[] getKnownSmileys() {
        .
        .
        .
    }
}

PassiveSmiley would not work very well without explicitly declaring a dependency between the smiley element and its emotion attribute in the constructor of StyleSheetExtension:

viewFactory.addDependency(EMAIL_NAMESPACE, "smiley", 
                          Namespace.NONE, "emotion");

Like class PassiveSmiley, class Smiley also implements interface ComponentFactory.

public class Smiley implements ComponentFactory {
    private static final Name EMOTION = Name.get("emotion");

    public Component createComponent(Element element, 
                                     Style style, StyleValue[] parameters, 
                                     StyledViewFactory viewFactory,
                                     boolean[] stretch) {
        SmileyComboBox smileyCombo = new SmileyComboBox(element);
        smileyCombo.setFont(style.font);

        viewFactory.getCustomViewManager().add(smileyCombo, element, EMOTION);

        ComponentUtil.addFocusGainedListener(smileyCombo, element,
                                             viewFactory);

        return smileyCombo;
    }        
        .
        .
        .
}

void attributeValueChanged(DocumentEvent[] events);

smiley {
    content: component("Smiley");
    font: normal normal small sans-serif;
    /* Needed to display the red border of the selection */
    display: inline-block;
    padding: 1px;
}

    private static class SmileyComboBox extends JComboBox 
                   implements CustomViewManager.AttributeValueEditor, 
                              TextLines {
        private Element element;
        private boolean performingAction = false;
        private boolean selectingItem = false;

        public SmileyComboBox(Element element) {
            super(SmileyInfo.getKnownSmileys());

            setEditable(false);
            setRenderer(new SmileyRenderer());

            this.element = element;
            updateSelectedItem();

            addActionListener(new ActionListener() {
                public void actionPerformed(ActionEvent event) {
                    if (selectingItem)
                        return;

                    SmileyInfo smiley = (SmileyInfo) getSelectedItem();
                    if (smiley != null) {
                        performingAction = true;
                        putAttribute(SmileyComboBox.this.element,
                                     EMOTION, smiley.getEmotion());
                        performingAction = false;
                    }
                }
            }); 
        }

        public void customViewAdded() {}
        public void customViewRemoved() {}
        public void commitChanges() {}

        public void attributeValueChanged(DocumentEvent[] events) {
            if (performingAction)
                return;

            updateSelectedItem();
        }

        private void updateSelectedItem() {
            String emotion = element.getNmtokenAttribute(EMOTION, "happy");

            SmileyInfo smiley = null;

            SmileyInfo[] smileys = SmileyInfo.getKnownSmileys();
            for (int i = 0; i < smileys.length; ++i) {
                if (smileys[i].getEmotion().equals(emotion)) {
                    smiley = smileys[i];
                    break;
                }
            }

            if (smiley == null)
                // Invalid emotion. Show it anyway.
                smiley = new SmileyInfo(emotion, null, "???");

            selectingItem = true;
            // setSelectedItem triggers actionPerformed.
            setSelectedItem(smiley);
            selectingItem = false;
        }

        public int getFirstBaseLine() {
            return ComponentUtil.getFirstBaseLine(this);
        }

        public int getLastBaseLine() {
            return getFirstBaseLine();
        }
    }

    private static final String putAttribute(Element element, 
                                             Name name, String value) {
        if (element.isEditable())
            return element.putAttribute(name, value);
        else
            return null;
    }