Tapestry MenuBar component based on http://www.cssplay.co.uk/menus/dropdown.html
The packaging is a bit rough and I don't have the container correct but the included one will work (Note the if IE). I'll make a better library out of if soon and put it somewhere. Make sure your doctype is correct or it will not work. The pull aside menu on IE has a format problem. I'm also hoping it can do this http://www.cssplay.co.uk/menus/flyoutt.html with the same input. -- My Border -- <html xmlns="http://www.w3.org/1999/xhtml"; jwcid="@Shell" title="Acumera" doctype='html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";' > <link rel="stylesheet" media="all" type="text/css" href="/Acumera/css/layout/fullWidth.css" /> <link rel="stylesheet" media="all" type="text/css" href="/Acumera/css/layout/menu.css" /> <!--[if lte IE 6]> <style type="text/css">@import "/Acumera/css/layout/menuie.css";</style> <![endif]--> --- MenuBar.html --- <div id="menubar"> </div> --- MenuBar.jwc --- <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE component-specification PUBLIC "-//Apache Software Foundation//Tapestry Specification 4.0//EN" " http://jakarta.apache.org/tapestry/dtd/Tapestry_4_0.dtd";> <component-specification class="menu.MenuBar"> </component-specification> --- Menu.java --- package menu; import java.io.BufferedOutputStream; import java.io.ByteArrayOutputStream; import java.io.CharArrayWriter; import java.io.IOException; import java.io.PrintWriter; import java.io.Reader; import java.io.StringReader; import javax.xml.transform.Transformer; import javax.xml.transform.TransformerConfigurationException; import javax.xml.transform.TransformerFactory; import org.apache.tapestry.AbstractComponent; import org.apache.tapestry.BaseComponent; import org.apache.tapestry.IMarkupWriter; import org.apache.tapestry.IRequestCycle; import org.apache.tapestry.markup.AsciiMarkupFilter; import org.apache.tapestry.markup.MarkupFilter; import org.apache.tapestry.markup.MarkupWriterImpl; /* * based on http://www.cssplay.co.uk/menus/dropdownfun.html * * Put the non ie menu inside this component and it will output both * the ie version and non ie version * This combined with the ie and nonie stylesheets will create a * dropdown menu system for ie and non ie browsers * * The code does not validate the non ie menu was resonable so no * telling what happens if it's not. * * requires jaxp */ public class MenuBar extends AbstractComponent { protected CharArrayWriter _charArrayWriter; protected static String noniemenu = "" + "<div id='noniemenu'>"+ "<div class=\"holder\">"+ "<ul>"+ "<li><a class='outer' href='#'>Title</a></li>"+ "<li><a class='inner second' href='#'>Programs ></a>"+ "<ul id='a3'>"+ "<li><a class='inner' jwcid='@PageLink' page='Home'>Home</a></li>"+ "<li><a class='inner' jwcid='@PageLink' page='AcuVigil/Overview'>AcuVigil</a></li>"+ "<li><a class='inner' jwcid='@PageLink' page='Installer/TODO'>Installer</a></li>"+ "<li><a class='inner' jwcid='@PageLink' page='Admin/Admin'>Adminstration</a></li>"+ "</ul>"+ "</li>"+ "<li><a class='inner' href='#'>Preferences</a></li>"+ "<li><a class='inner' jwcid='@DirectLink' listener='listener:doLogout'>Logout</a></li>"+ "</ul>"+ "</div>"+ "</div>"; protected static String iemenu = ""+ "<div class='menuie'>"+ "<a class='outer' href='#'>Title<table class='first'>"+ "<tr>"+ "<td><a class='inner second' href='#'>Programs >"+ "<table><tr><td>"+ "<a class='inner' jwcid='@PageLink' page='Home'>Home</a>"+ "<a class='inner' jwcid='@PageLink' page='AcuVigil/Overview'>AcuVigil</a>"+ "<a class='inner' jwcid='@PageLink' page='Installer/TODO'>Installer</a>"+ "<a class='inner' jwcid='@PageLink' page='Admin/Admin'>Adminstration</a>"+ "</td></tr></table>"+ "</a>"+ "<a class='inner' href='#'>Preferences</a>"+ "<a class='inner' jwcid='@DirectLink' listener='listener:doLogout'>Logout</a>"+ "</td></tr></table>" + "</a>"+ "</div>"; protected static String xslt = "<?xml version='1.0' encoding='UTF-8'?>\n"+ "<xsl:stylesheet version='1.0' xmlns:xsl=' http://www.w3.org/1999/XSL/Transform'>\n"+ "<xsl:output method='html'/>" + "<xsl:template match=\"/[EMAIL PROTECTED] = 'noniemenu']\">" + "<div class='menuie'>" + "<xsl:apply-templates/>" + "</div>" + "</xsl:template>" + "<xsl:template match=\"[EMAIL PROTECTED] = 'holder']\">" + "<a class='outer' href='index.html'>" + "<xsl:value-of select='ul/li'/>"+ "<xsl:apply-templates/>" + "</a>" + "</xsl:template>" + "<xsl:template match='ul'>" + "<table class='first'><tr><td>" + "<xsl:apply-templates/>" + "</td></tr></table>" + "</xsl:template>" + "<xsl:template match='li'>" + "<xsl:apply-templates/>" + "</xsl:template>"+ "<xsl:template match=\"[EMAIL PROTECTED] = 'inner']\">" + "<xsl:element name='a'>" + "<xsl:copy-of select='@*'/>" + "<xsl:value-of select='.'/>" + "</xsl:element>" + "</xsl:template>"+ "<xsl:template match=\"[EMAIL PROTECTED] = 'outer']\">" + "</xsl:template>"+ "<xsl:template match=\"[EMAIL PROTECTED] = 'a3']\">" + "<a class='inner second' href='#'>" + "<table class='second'><tr><td>" + "<xsl:apply-templates/>"+ "</td></tr></table>" + "</a>" + "</xsl:template>"+ "</xsl:stylesheet>"; public void renderComponent(IMarkupWriter writer, IRequestCycle cycle) { IMarkupWriter w = newBufferWriter(); renderBody(w, cycle); writer.printRaw (_charArrayWriter.toCharArray(),0,_charArrayWriter.size()-1); try { writer.printRaw(getIeMenu(_charArrayWriter.toString())); } catch (Exception e) { writer.print(e.toString()); } } protected String getIeMenu(String noniemenu) throws Exception { CharArrayWriter ie = new CharArrayWriter(); javax.xml.transform.Result result = new javax.xml.transform.stream.StreamResult(ie); TransformerFactory transFact = TransformerFactory.newInstance( ); Transformer trans = transFact.newTransformer(new javax.xml.transform.stream.StreamSource(new StringReader(xslt))); trans.transform(new javax.xml.transform.stream.StreamSource(new StringReader(noniemenu)), result); return ie.toString(); } protected IMarkupWriter newBufferWriter() { _charArrayWriter = new CharArrayWriter(); PrintWriter pw = new PrintWriter(_charArrayWriter); return new MarkupWriterImpl("text/html", pw, new AsciiMarkupFilter()); } public static void main(String[] args) { MenuBar b = new MenuBar(); try { System.out.println(b.getIeMenu(noniemenu)); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } } } --- menu.css --- .menuie {display:none;} #Anoniemenu {position:absolute; top: 110px;} #noniemenu .holder ul {padding:0; margin:0;} #noniemenu .holder ul li {list-style-type: none;} #noniemenu .holder li {} #noniemenu .holder li ul {display: none;} #noniemenu .holder li:hover > ul#a3 { display:block; position:absolute; left:105px; margin-top:-20px; border:1px solid #000; } #noniemenu .holder .bold {font-weight:bold;} #noniemenu .holder:hover { height:auto; color:black; } #noniemenu .holder { color:#fff; width:104px; height:18px; display:block; overflow:hidden; float:left; border:1px solid #000; margin-right:1px; font-size:10px; } #noniemenu a.outer, #noniemenu a.outer:visited { color:#fff; width:104px; line-height:18px; display:block; background:blue; text-align:center; text-decoration:none; font-family: verdana, arial, sans-serif; background-image: url(../../images/MenuBlueGrad.gif); } #noniemenu a.outer:hover { background:#blue; overflow:visible; } #noniemenu div.open {display:none;} #noniemenu a.inner, #noniemenu a.inner:visited { display:block; width:104px; height:18px; line-height:18px; border-bottom:1px solid #000; text-decoration:none; color:#000; background:#eee; text-align:center; } #noniemenu a.second {font-weight:bold;} #noniemenu a.inner:hover { background:#add; } --- iemenu.css --- #noniemenu {display:none; } .menuie {display:block; } .menuie a.outer, .menu a.outer:visited { color:#fff; width:104px; height:18px; display:block; background:#e09222; border:1px solid #000; margin-right:1px; text-align:center; float:left; text-decoration:none; font-family: verdana, arial, sans-serif; font-size:10px; line-height:18px; overflow:hidden; background-image: url(../../images/MenuBlueGrad.gif); } .menuie a.outer:hover { background:blue; overflow:visible; } .menuie a.outer:hover table.first { display:block; background:#eee; border-collapse:collapse; } .menuie a.inner, .menu a.inner:visited { display:block; width:102px; height:18px; border-bottom:1px solid #000; text-decoration:none; color:#000; font-family: verdana, arial, sans-serif; font-size:10px; text-align:center; } .menuie a.inner:hover { background:#add; } .menuie a.outer table.first a.second { height:18px; line-height:18px; overflow:hidden; font-weight:bold; } .menuie a.outer table.first a.second:hover { position:relative; overflow:visible; } .menuie a.outer table.first a.second:hover table { position:absolute; top:-2px; left:102px; border-collapse:collapse; background:#eee; border:1px solid #000; font-weight:normal }
